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

View File

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

View File

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