TransferTableModal.config.ts
2.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
import { h, unref } from 'vue';
import { findDictItemByCode } from '/@/api/system/dict';
import { FETCH_SETTING } from '/@/components/Table/src/const';
import { DeviceStatusEnum, DeviceStatusNameEnum, DeviceTypeNameEnum } from './enum';
import { Tag } from 'ant-design-vue';
import { BasicColumn, BasicTableProps, FormSchema } from '/@/components/Table';
import { useClipboard } from '@vueuse/core';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
const { t } = useI18n(); // 加载国际化
export const deviceTableFormSchema: FormSchema[] = [
{
field: 'name',
label: t('common.deviceName'),
component: 'Input',
colProps: { span: 9 },
componentProps: {},
},
{
field: 'deviceType',
label: t('common.deviceTypeText'),
component: 'ApiSelect',
colProps: { span: 9 },
componentProps: {
api: findDictItemByCode,
params: {
dictCode: 'device_type',
},
labelField: 'itemText',
valueField: 'itemValue',
},
},
];
const { copied, copy } = useClipboard({ legacy: true });
const { createMessage } = useMessage();
export const deviceTableColumn: BasicColumn[] = [
{
title: t('deviceManagement.device.statusText'),
dataIndex: 'deviceState',
customRender: ({ text }) => {
return h(
Tag,
{
color:
text === DeviceStatusEnum.INACTIVE
? 'warning'
: text === DeviceStatusEnum.OFFLINE
? 'error'
: 'success',
},
() => DeviceStatusNameEnum[text]
);
},
},
{
title: t('deviceManagement.device.aliasNameText'),
dataIndex: 'name',
customRender: ({ record }) => {
return h('div', [
h(
'div',
{
class: 'cursor-pointer',
onClick: async () => {
await copy(record.name);
if (unref(copied)) createMessage.success(t('common.copyOk'));
},
},
[
record.alias && h('div', { class: 'truncate' }, record.alias),
h('div', { class: 'text-blue-400 truncate' }, record.name),
]
),
]);
},
},
{
title: t('deviceManagement.device.deviceType'),
dataIndex: 'deviceType',
customRender: ({ text }) => {
return h(Tag, { color: 'success' }, () => DeviceTypeNameEnum[text]);
},
},
{
title: t('common.belongingProducts'),
dataIndex: 'deviceProfile.name',
},
{
title: t('common.belongingOrganization'),
dataIndex: 'organizationDTO.name',
},
];
export const TransferTableProps: BasicTableProps = {
formConfig: {
layout: 'inline',
labelWidth: 80,
schemas: deviceTableFormSchema,
actionColOptions: { span: 6 },
},
size: 'small',
maxHeight: 240,
useSearchForm: true,
columns: deviceTableColumn,
showIndexColumn: false,
fetchSetting: FETCH_SETTING,
} as BasicTableProps;