Showing
1 changed file
with
38 additions
and
30 deletions
... | ... | @@ -19,14 +19,14 @@ |
19 | 19 | </a-button> |
20 | 20 | </template> |
21 | 21 | <template #toolbar> |
22 | - <Button @click="handleBatchAck" type="primary">批量处理</Button> | |
22 | + <Button @click="handleBatchAck" type="primary" :disabled="getCanBatchAck">批量处理</Button> | |
23 | 23 | </template> |
24 | 24 | </BasicTable> |
25 | 25 | <AlarmDetailDrawer @register="registerDetailDrawer" @success="handleSuccess" /> |
26 | 26 | </div> |
27 | 27 | </template> |
28 | 28 | <script lang="ts"> |
29 | - import { defineComponent, nextTick, h } from 'vue'; | |
29 | + import { defineComponent, nextTick, h, computed } from 'vue'; | |
30 | 30 | import { BasicTable, useTable, TableAction } from '/@/components/Table'; |
31 | 31 | import { alarmColumns, alarmSearchSchemas } from './config/detail.config'; |
32 | 32 | import { doBatchAckAlarm, getDeviceAlarm } from '/@/api/device/deviceManager'; |
... | ... | @@ -55,34 +55,36 @@ |
55 | 55 | }, |
56 | 56 | |
57 | 57 | setup() { |
58 | - const [registerTable, { reload, getSelectRows, clearSelectedRowKeys }] = useTable({ | |
59 | - title: '告警记录列表', | |
60 | - api: getDeviceAlarm, | |
61 | - columns: alarmColumns, | |
62 | - useSearchForm: true, | |
63 | - formConfig: { | |
64 | - labelWidth: 120, | |
65 | - schemas: alarmSearchSchemas, | |
66 | - fieldMapToTime: [['alarmTime', ['startTime', 'endTime'], 'x']], | |
67 | - }, | |
68 | - bordered: true, | |
69 | - showIndexColumn: false, | |
70 | - showTableSetting: true, | |
71 | - rowSelection: { | |
72 | - type: 'checkbox', | |
73 | - getCheckboxProps: (record: AlarmLogItem) => { | |
74 | - return { | |
75 | - disabled: record.status === AlarmStatus.CLEARED_ACK, | |
76 | - }; | |
58 | + const [registerTable, { reload, getSelectRows, clearSelectedRowKeys, getRowSelection }] = | |
59 | + useTable({ | |
60 | + title: '告警记录列表', | |
61 | + api: getDeviceAlarm, | |
62 | + columns: alarmColumns, | |
63 | + useSearchForm: true, | |
64 | + formConfig: { | |
65 | + labelWidth: 120, | |
66 | + schemas: alarmSearchSchemas, | |
67 | + fieldMapToTime: [['alarmTime', ['startTime', 'endTime'], 'x']], | |
77 | 68 | }, |
78 | - }, | |
79 | - actionColumn: { | |
80 | - width: 200, | |
81 | - title: '操作', | |
82 | - slots: { customRender: 'action' }, | |
83 | - fixed: 'right', | |
84 | - }, | |
85 | - }); | |
69 | + bordered: true, | |
70 | + showIndexColumn: false, | |
71 | + showTableSetting: true, | |
72 | + clickToRowSelect: false, | |
73 | + rowSelection: { | |
74 | + type: 'checkbox', | |
75 | + getCheckboxProps: (record: AlarmLogItem) => { | |
76 | + return { | |
77 | + disabled: record.status === AlarmStatus.CLEARED_ACK, | |
78 | + }; | |
79 | + }, | |
80 | + }, | |
81 | + actionColumn: { | |
82 | + width: 200, | |
83 | + title: '操作', | |
84 | + slots: { customRender: 'action' }, | |
85 | + fixed: 'right', | |
86 | + }, | |
87 | + }); | |
86 | 88 | const [registerDetailDrawer, { openDrawer }] = useDrawer(); |
87 | 89 | const handleDetail = (record: Recordable) => { |
88 | 90 | openDrawer(true, record); |
... | ... | @@ -164,10 +166,15 @@ |
164 | 166 | }; |
165 | 167 | }; |
166 | 168 | |
169 | + const getCanBatchAck = computed(() => { | |
170 | + const rowSelection = getRowSelection(); | |
171 | + return !rowSelection.selectedRowKeys?.length; | |
172 | + }); | |
173 | + | |
167 | 174 | const { createMessage } = useMessage(); |
168 | 175 | const handleBatchAck = async () => { |
169 | 176 | const ids = getSelectRows<AlarmLogItem>().map((item) => item.id); |
170 | - | |
177 | + if (!ids.length) return; | |
171 | 178 | await doBatchAckAlarm(ids); |
172 | 179 | createMessage.success('操作成功'); |
173 | 180 | clearSelectedRowKeys(); |
... | ... | @@ -181,6 +188,7 @@ |
181 | 188 | handleSuccess, |
182 | 189 | handleViewAlarmDetails, |
183 | 190 | handleBatchAck, |
191 | + getCanBatchAck, | |
184 | 192 | }; |
185 | 193 | }, |
186 | 194 | }); | ... | ... |