|
...
|
...
|
@@ -13,16 +13,23 @@ |
|
13
|
13
|
} from '/@/api/device/deviceConfigApi';
|
|
14
|
14
|
import { ProfileRecord } from '/@/api/device/model/deviceConfigModel';
|
|
15
|
15
|
import { Dropdown } from '/@/components/Dropdown';
|
|
16
|
|
- import { defaultObj, searchFormSchema, DeviceTypeName } from './device.profile.data';
|
|
|
16
|
+ import {
|
|
|
17
|
+ defaultObj,
|
|
|
18
|
+ searchFormSchema,
|
|
|
19
|
+ DeviceTypeName,
|
|
|
20
|
+ ProductPermission,
|
|
|
21
|
+ } from './device.profile.data';
|
|
17
|
22
|
import { useMessage } from '/@/hooks/web/useMessage';
|
|
18
|
23
|
import { useSyncConfirm } from '/@/hooks/component/useSyncConfirm';
|
|
19
|
24
|
import DeviceProfileModal from './DeviceProfileModal.vue';
|
|
20
|
25
|
import DeviceProfileDrawer from './DeviceProfileDrawer.vue';
|
|
21
|
26
|
import { useModal } from '/@/components/Modal';
|
|
22
|
27
|
import { useDrawer } from '/@/components/Drawer';
|
|
|
28
|
+ import productDefault from '/@/assets/icons/product-default.svg';
|
|
|
29
|
+ import { usePermission } from '/@/hooks/web/usePermission';
|
|
23
|
30
|
|
|
24
|
31
|
defineProps<{
|
|
25
|
|
- mode: Mode;
|
|
|
32
|
+ mode: EnumTableCardMode;
|
|
26
|
33
|
}>();
|
|
27
|
34
|
|
|
28
|
35
|
const emit = defineEmits(['changeMode']);
|
|
...
|
...
|
@@ -31,8 +38,7 @@ |
|
31
|
38
|
SET_DEFAULT = 'setDefault',
|
|
32
|
39
|
DELETE = 'delete',
|
|
33
|
40
|
}
|
|
34
|
|
- const IMAGE_FALLBACK =
|
|
35
|
|
- 'data:image/png;base64,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';
|
|
|
41
|
+ const IMAGE_FALLBACK = productDefault;
|
|
36
|
42
|
|
|
37
|
43
|
const { createMessage } = useMessage();
|
|
38
|
44
|
const { createSyncConfirm } = useSyncConfirm();
|
|
...
|
...
|
@@ -94,6 +100,40 @@ |
|
94
|
100
|
}
|
|
95
|
101
|
};
|
|
96
|
102
|
|
|
|
103
|
+ const { hasPermission } = usePermission();
|
|
|
104
|
+
|
|
|
105
|
+ const getHasDeleteFlag = computed(() => {
|
|
|
106
|
+ return hasPermission(ProductPermission.DELETE);
|
|
|
107
|
+ });
|
|
|
108
|
+
|
|
|
109
|
+ const getHasDetailFlag = computed(() => {
|
|
|
110
|
+ return hasPermission(ProductPermission.DETAIL);
|
|
|
111
|
+ });
|
|
|
112
|
+
|
|
|
113
|
+ const getHasUpdateFlag = computed(() => {
|
|
|
114
|
+ return hasPermission(ProductPermission.UPDATE);
|
|
|
115
|
+ });
|
|
|
116
|
+
|
|
|
117
|
+ const getDropDownList = (record: ProfileRecord) => {
|
|
|
118
|
+ const list = [
|
|
|
119
|
+ {
|
|
|
120
|
+ text: '默认',
|
|
|
121
|
+ event: DropMenuEvent.SET_DEFAULT,
|
|
|
122
|
+ icon: 'ant-design:unordered-list-outlined',
|
|
|
123
|
+ onClick: handleSetDefault.bind(null, record),
|
|
|
124
|
+ },
|
|
|
125
|
+ ];
|
|
|
126
|
+ if (unref(getHasDeleteFlag)) {
|
|
|
127
|
+ list.push({
|
|
|
128
|
+ text: '删除',
|
|
|
129
|
+ event: DropMenuEvent.DELETE,
|
|
|
130
|
+ icon: 'ant-design:delete-outlined',
|
|
|
131
|
+ onClick: handleDelete.bind(null, [record.id]),
|
|
|
132
|
+ });
|
|
|
133
|
+ }
|
|
|
134
|
+ return list;
|
|
|
135
|
+ };
|
|
|
136
|
+
|
|
97
|
137
|
const handleModeChange = (mode: EnumTableCardMode) => {
|
|
98
|
138
|
emit('changeMode', mode);
|
|
99
|
139
|
};
|
|
...
|
...
|
@@ -118,10 +158,12 @@ |
|
118
|
158
|
};
|
|
119
|
159
|
|
|
120
|
160
|
const handleShowDetail = (record: ProfileRecord) => {
|
|
|
161
|
+ if (!unref(getHasDetailFlag)) return;
|
|
121
|
162
|
openDrawer(true, { record });
|
|
122
|
163
|
};
|
|
123
|
164
|
|
|
124
|
165
|
const handleUpdate = (record: ProfileRecord) => {
|
|
|
166
|
+ if (!unref(getHasUpdateFlag)) return;
|
|
125
|
167
|
openModal(true, {
|
|
126
|
168
|
record,
|
|
127
|
169
|
isUpdate: true,
|
|
...
|
...
|
@@ -173,20 +215,27 @@ |
|
173
|
215
|
>
|
|
174
|
216
|
<template #header>
|
|
175
|
217
|
<div class="flex gap-3 justify-end">
|
|
176
|
|
- <Button type="primary" @click="handleCreate">新增产品</Button>
|
|
|
218
|
+ <Authority :value="ProductPermission.CREATE">
|
|
|
219
|
+ <Button type="primary" @click="handleCreate">新增产品</Button>
|
|
|
220
|
+ </Authority>
|
|
|
221
|
+
|
|
177
|
222
|
<Button type="primary" @click="handleSelectAll">
|
|
178
|
223
|
{{ getSelectAllFlag ? '反选' : '全选' }}
|
|
179
|
224
|
</Button>
|
|
180
|
|
- <Button
|
|
181
|
|
- type="primary"
|
|
182
|
|
- danger
|
|
183
|
|
- :disabled="!getCheckedRecord.length"
|
|
184
|
|
- @click="handleDelete(getCheckedRecord)"
|
|
185
|
|
- >
|
|
186
|
|
- 批量删除
|
|
187
|
|
- </Button>
|
|
|
225
|
+ <Authority :value="ProductPermission.DELETE">
|
|
|
226
|
+ <Button
|
|
|
227
|
+ type="primary"
|
|
|
228
|
+ danger
|
|
|
229
|
+ :disabled="!getCheckedRecord.length"
|
|
|
230
|
+ @click="handleDelete(getCheckedRecord)"
|
|
|
231
|
+ >
|
|
|
232
|
+ 批量删除
|
|
|
233
|
+ </Button>
|
|
|
234
|
+ </Authority>
|
|
|
235
|
+
|
|
188
|
236
|
<ModeSwitchButton :value="$props.mode" @change="handleModeChange" />
|
|
189
|
237
|
<CardLayoutButton v-model:value="colNumber" @change="getDataSource" />
|
|
|
238
|
+
|
|
190
|
239
|
<Tooltip title="刷新">
|
|
191
|
240
|
<Button type="primary" @click="getDataSource">
|
|
192
|
241
|
<ReloadOutlined :spin="loading" />
|
|
...
|
...
|
@@ -213,33 +262,21 @@ |
|
213
|
262
|
</div>
|
|
214
|
263
|
</template>
|
|
215
|
264
|
<template class="ant-card-actions" #actions>
|
|
216
|
|
- <Authority>
|
|
217
|
|
- <Tooltip title="详情">
|
|
218
|
|
- <EyeOutlined key="setting" @click.stop="handleShowDetail(item)" />
|
|
219
|
|
- </Tooltip>
|
|
220
|
|
- </Authority>
|
|
221
|
|
- <Authority>
|
|
222
|
|
- <Tooltip title="编辑">
|
|
223
|
|
- <FormOutlined key="edit" @click.stop="handleUpdate(item)" />
|
|
224
|
|
- </Tooltip>
|
|
225
|
|
- </Authority>
|
|
226
|
|
- <Dropdown
|
|
227
|
|
- :trigger="['hover']"
|
|
228
|
|
- :drop-menu-list="[
|
|
229
|
|
- {
|
|
230
|
|
- text: '默认',
|
|
231
|
|
- event: DropMenuEvent.SET_DEFAULT,
|
|
232
|
|
- icon: 'ant-design:unordered-list-outlined',
|
|
233
|
|
- onClick: handleSetDefault.bind(null, item),
|
|
234
|
|
- },
|
|
235
|
|
- {
|
|
236
|
|
- text: '删除',
|
|
237
|
|
- event: DropMenuEvent.DELETE,
|
|
238
|
|
- icon: 'ant-design:delete-outlined',
|
|
239
|
|
- onClick: handleDelete.bind(null, [item.id]),
|
|
240
|
|
- },
|
|
241
|
|
- ]"
|
|
242
|
|
- >
|
|
|
265
|
+ <Tooltip title="详情">
|
|
|
266
|
+ <EyeOutlined
|
|
|
267
|
+ :class="getHasDetailFlag ? '' : '!cursor-not-allowed !text-gray-200'"
|
|
|
268
|
+ key="setting"
|
|
|
269
|
+ @click.stop="handleShowDetail(item)"
|
|
|
270
|
+ />
|
|
|
271
|
+ </Tooltip>
|
|
|
272
|
+ <Tooltip title="编辑">
|
|
|
273
|
+ <FormOutlined
|
|
|
274
|
+ :class="getHasUpdateFlag ? '' : '!cursor-not-allowed !text-gray-200'"
|
|
|
275
|
+ key="edit"
|
|
|
276
|
+ @click.stop="handleUpdate(item)"
|
|
|
277
|
+ />
|
|
|
278
|
+ </Tooltip>
|
|
|
279
|
+ <Dropdown :trigger="['hover']" :drop-menu-list="getDropDownList(item)">
|
|
243
|
280
|
<MoreOutlined @click.stop class="transform rotate-90" />
|
|
244
|
281
|
</Dropdown>
|
|
245
|
282
|
</template>
|
...
|
...
|
|
