支持工单功能(6/10)

*用户侧前端优化
*适配夜间模式
This commit is contained in:
Chenx221 2024-04-18 17:13:20 +08:00
parent 0f71791473
commit 6e4f2ee254
Signed by: chenx221
GPG Key ID: D7A9EC07024C3021
3 changed files with 35 additions and 36 deletions

View File

@ -28,6 +28,7 @@ FontAwesomeAsset::register($this);
<?= GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => [
[
'attribute' => 'id',
@ -44,32 +45,35 @@ FontAwesomeAsset::register($this);
[
'attribute' => 'created_at',
'label' => '创建时间',
'filter' => false
],
[
'attribute' => 'updated_at',
'label' => '最近更新时间',
'value' => function (Tickets $model) {
return Yii::$app->formatter->asRelativeTime(new DateTime($model->updated_at, new DateTimeZone('GMT+8')));
}
},
'filter' => false
],
[
'attribute' => 'status',
'label' => '状态',
'format' => 'raw', // 使用 raw 格式,这样 Yii2 不会对 value 的返回值进行 HTML 编码
'value' => function (Tickets $model) {
switch ($model->status) {
case Tickets::STATUS_OPEN:
return '<span class="badge rounded-pill bg-primary">工单已开启</span>';
case Tickets::STATUS_ADMIN_REPLY:
return '<span class="badge rounded-pill bg-info">管理员已回复</span>';
case Tickets::STATUS_USER_REPLY:
return '<span class="badge rounded-pill bg-secondary">用户已回复</span>';
case Tickets::STATUS_CLOSED:
return '<span class="badge rounded-pill bg-success">工单已关闭</span>';
default:
return '<span class="badge rounded-pill bg-danger">未知状态</span>';
}
}
return match ($model->status) {
Tickets::STATUS_OPEN => '<span class="badge rounded-pill bg-primary">工单已开启</span>',
Tickets::STATUS_ADMIN_REPLY => '<span class="badge rounded-pill bg-info">管理员已回复</span>',
Tickets::STATUS_USER_REPLY => '<span class="badge rounded-pill bg-secondary">用户已回复</span>',
Tickets::STATUS_CLOSED => '<span class="badge rounded-pill bg-success">工单已关闭</span>',
default => '<span class="badge rounded-pill bg-danger">未知状态</span>',
};
},
'filter' => [
Tickets::STATUS_OPEN => '工单已开启',
Tickets::STATUS_ADMIN_REPLY => '管理员已回复',
Tickets::STATUS_USER_REPLY => '用户已回复',
Tickets::STATUS_CLOSED => '工单已关闭',
]
],
[
'class' => ActionColumn::class,

View File

@ -37,18 +37,13 @@ $this->registerCssFile('@web/css/tickets.css');
'label' => '状态',
'format' => 'raw', // 使用 raw 格式,这样 Yii2 不会对 value 的返回值进行 HTML 编码
'value' => function (Tickets $model) {
switch ($model->status) {
case Tickets::STATUS_OPEN:
return '<span class="badge rounded-pill bg-primary">工单已开启</span>';
case Tickets::STATUS_ADMIN_REPLY:
return '<span class="badge rounded-pill bg-info">管理员已回复</span>';
case Tickets::STATUS_USER_REPLY:
return '<span class="badge rounded-pill bg-secondary">用户已回复</span>';
case Tickets::STATUS_CLOSED:
return '<span class="badge rounded-pill bg-success">工单已关闭</span>';
default:
return '<span class="badge rounded-pill bg-danger">未知状态</span>';
}
return match ($model->status) {
Tickets::STATUS_OPEN => '<span class="badge rounded-pill bg-primary">工单已开启</span>',
Tickets::STATUS_ADMIN_REPLY => '<span class="badge rounded-pill bg-info">管理员已回复</span>',
Tickets::STATUS_USER_REPLY => '<span class="badge rounded-pill bg-secondary">用户已回复</span>',
Tickets::STATUS_CLOSED => '<span class="badge rounded-pill bg-success">工单已关闭</span>',
default => '<span class="badge rounded-pill bg-danger">未知状态</span>',
};
}
],
[

View File

@ -3,17 +3,17 @@
}
.ticket-reply {
margin-bottom: 24px;
border: 1px solid #e6e8ec;
background: #fff;
border: 1px solid var(--bs-border-color);
background: var(--bs-body-bg);
border-radius: 4px;
}
.ticket-reply-top {
border-bottom: 1px solid #e6e8ec;
background: #f6f7f8;
border-bottom: 1px solid var(--bs-border-color);
background: var(--bs-secondary-bg);
padding: 10px 15px;
}
.ticket-reply .user i {
color: #b9bdc5;
color: var(--bs-secondary-color);
margin-right: 6px;
}
.ticket-reply .info {
@ -21,18 +21,18 @@
justify-content: space-between;
font-size: 12px;
line-height: 18px;
color: #7c8088;
color: var(--bs-tertiary-color);
}
.ticket-reply .ticket-message {
padding: 25px 15px;
}
.ticket-reply.admin {
border-color: #d5e7fb;
border-color: var(--bs-primary-border-subtle);
}
.ticket-reply.admin .ticket-reply-top {
background-color: #e3effc;
border-color: #d5e7fb;
background-color: var(--bs-primary-bg-subtle);
border-color: var(--bs-primary-border-subtle);
}
.ticket-reply.admin .user i {
color: #1062fe;
color: var(--bs-primary);
}