renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: 修改状态标签样式

Browse Source
This commit is contained in:
rd
2025-07-21 09:44:23 +08:00
parent 45e3151344
commit c02f3b0479
5 changed files with 99 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/_base/navbar/components/task-center-modal/components/export-task/index.vue
View File

@ -5,7 +5,7 @@ import { IconSearch, IconClose, IconQuestionCircle } from '@arco-design/web-vue/
import NoData from '@/components/no-data';
import { getTask, postRedoTask } from '@/api/all/common';
import { INITIAL_FORM, TABLE_COLUMNS } from './constants';
import { TASK_STATUS, enumTaskStatus } from '../../constants';
import { EXPORT_TASK_STATUS, enumTaskStatus } from '../../constants';
import { formatTableField, exactFormatTime } from '@/utils/tools';
import { useTableSelectionWithPagination } from '@/hooks/useTableSelectionWithPagination';
import { downloadByUrl } from '@/utils/tools';
@ -234,7 +234,11 @@ export default {
),
cell: ({ record }) => {
if (column.dataIndex === 'status') {
return <span>{TASK_STATUS.find((v) => v.value === record.status)?.label}</span>;
return (
<div class={['status-box', `status-box-${record.status}`]}>
<span>{EXPORT_TASK_STATUS.find((v) => v.value === record.status)?.label}</span>
</div>
);
} else if (column.dataIndex === 'operator.name') {
return record.operator?.name || record.operator?.mobile;
} else if (column.dataIndex === 'created_at') {

37
src/components/_base/navbar/components/task-center-modal/components/export-task/style.scss
View File

@ -31,7 +31,7 @@
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 20px;
line-height: 20px;
}
.operation-btn {
padding: 0;
@ -41,7 +41,7 @@
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 22px;
line-height: 22px;
&:not(:last-child) {
margin-right: 16px;
}
@ -50,4 +50,37 @@
}
}
}
.status-box {
border-radius: 2px;
display: flex;
height: 24px;
padding: 0px 8px;
align-items: center;
width: fit-content;
span {
font-family: $font-family-medium;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 22px;
}
&-0 {
background: var(--Functional-yellow-1, #fff7e5);
span {
color: var(--Functional-yellow-6, #ffae00);
}
}
&-1 {
background: var(--Functional-Green-1, #ebf7f2);
span {
color: var(--Functional-Green-6, #25c883);
}
}
&-2 {
background: var(--Functional-Red-1, #ffe9e7);
span {
color: var(--Functional-Red-6, #f64b31);
}
}
}
}

10
src/components/_base/navbar/components/task-center-modal/components/import-task/index.vue
View File

@ -5,7 +5,7 @@ import { IconSearch, IconClose, IconQuestionCircle } from '@arco-design/web-vue/
import NoData from '@/components/no-data';
import { getTask } from '@/api/all/common';
import { INITIAL_FORM, TABLE_COLUMNS } from './constants';
import { TASK_STATUS, enumTaskStatus } from '../../constants';
import { IMPORT_TASK_STATUS, enumTaskStatus } from '../../constants';
import { formatTableField, exactFormatTime } from '@/utils/tools';
import { useTableSelectionWithPagination } from '@/hooks/useTableSelectionWithPagination';
import { downloadByUrl } from '@/utils/tools';
@ -225,9 +225,13 @@ export default {
),
cell: ({ record }) => {
if (column.dataIndex === 'status') {
return <span>{TASK_STATUS.find((v) => v.value === record.status)?.label}</span>;
return (
<div class={['status-box', `status-box-${record.status}`]}>
<span>{IMPORT_TASK_STATUS.find((v) => v.value === record.status)?.label}</span>
</div>
);
} else if (column.dataIndex === 'operator.name') {
return <span>{record.operator?.name || record.operator?.mobile}</span>
return <span>{record.operator?.name || record.operator?.mobile}</span>;
} else if (column.dataIndex === 'created_at') {
return exactFormatTime(record.created_at, 'YYYY-MM-DD HH:mm:ss', 'YYYY-MM-DD HH:mm:ss');
} else {

33
src/components/_base/navbar/components/task-center-modal/components/import-task/style.scss
View File

@ -50,4 +50,37 @@
}
}
}
.status-box {
border-radius: 2px;
display: flex;
height: 24px;
padding: 0px 8px;
align-items: center;
width: fit-content;
span {
font-family: $font-family-medium;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 22px;
}
&-0 {
background: var(--Functional-yellow-1, #fff7e5);
span {
color: var(--Functional-yellow-6, #ffae00);
}
}
&-1 {
background: var(--Functional-Green-1, #ebf7f2);
span {
color: var(--Functional-Green-6, #25c883);
}
}
&-2 {
background: var(--Functional-Red-1, #ffe9e7);
span {
color: var(--Functional-Red-6, #f64b31);
}
}
}
}

22
src/components/_base/navbar/components/task-center-modal/constants.ts
View File

@ -1,10 +1,10 @@
export enum enumTaskStatus {
Exporting = 0, // 导出中
Finished = 1, // 已完成
Failed = 2 // 导出失败
Exporting = 0, // 导出中
Finished = 1, // 已完成
Failed = 2, // 导出失败
}
export const TASK_STATUS = [
export const EXPORT_TASK_STATUS = [
{
label: '导出中',
value: enumTaskStatus.Exporting,
@ -18,3 +18,17 @@ export const TASK_STATUS = [
value: enumTaskStatus.Failed,
},
];
export const IMPORT_TASK_STATUS = [
{
label: '导入中',
value: enumTaskStatus.Exporting,
},
{
label: '已完成',
value: enumTaskStatus.Finished,
},
{
label: '导入失败',
value: enumTaskStatus.Failed,
},
];