diff --git a/apps/web-antd/src/views/aiot/alarm/list/index.vue b/apps/web-antd/src/views/aiot/alarm/list/index.vue index bf79f54fc..1eae1e30c 100644 --- a/apps/web-antd/src/views/aiot/alarm/list/index.vue +++ b/apps/web-antd/src/views/aiot/alarm/list/index.vue @@ -6,10 +6,14 @@ import { h, ref } from 'vue'; import { Page } from '@vben/common-ui'; -import { Button, Image, message, Modal, Tag } from 'ant-design-vue'; +import { Image, message, Modal, Tag } from 'ant-design-vue'; import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table'; -import { getAlert, getAlertPage, handleAlert } from '#/api/aiot/alarm'; +import { + getAlert, + getAlertPage, + handleAlert, +} from '#/api/aiot/alarm'; import { ALERT_LEVEL_OPTIONS, @@ -117,37 +121,61 @@ async function handleView(row: AiotAlarmApi.Alert) { } } -/** 处理告警 */ -async function handleProcess(row: AiotAlarmApi.Alert, status: string) { - const statusText = status === 'handled' ? '处理' : '忽略'; - Modal.confirm({ - title: `${statusText}告警`, - content: h('div', [ - h('p', `确定要${statusText}该告警吗?`), - h('p', { class: 'text-gray-500 text-sm' }, `告警编号:${row.alertNo}`), - h('textarea', { - id: 'processRemark', - class: 'ant-input mt-2', - rows: 3, - placeholder: '请输入处理备注(可选)', - }), - ]), - async onOk() { - const textarea = document.querySelector( - '#processRemark', - ) as HTMLTextAreaElement; - const remark = textarea?.value || ''; +/** 处理告警 — "处理"弹窗(支持备注) */ +const handleModalVisible = ref(false); +const handleModalRow = ref(null); +const handleRemark = ref(''); +const handleSubmitting = ref(false); +function openHandleModal(row: AiotAlarmApi.Alert) { + handleModalRow.value = row; + handleRemark.value = ''; + handleModalVisible.value = true; +} + +async function submitHandle() { + const row = handleModalRow.value; + if (!row) return; + + handleSubmitting.value = true; + try { + await handleAlert( + row.alarmId || row.id!, + 'handled', + handleRemark.value || undefined, + ); + message.success('处理成功'); + handleModalVisible.value = false; + handleRefresh(); + } catch (error) { + console.error('处理失败:', error); + message.error('处理失败'); + } finally { + handleSubmitting.value = false; + } +} + +/** 处理告警 — "误报"确认弹窗 */ +function handleFalseAlarm(row: AiotAlarmApi.Alert) { + Modal.confirm({ + title: '标记误报', + content: h('div', [ + h('p', '确定要将该告警标记为误报吗?'), + h('p', { class: 'text-gray-500 text-sm' }, `告警编号:${row.alertNo}`), + ]), + okText: '确定', + cancelText: '取消', + async onOk() { const hideLoading = message.loading({ content: '正在处理...', duration: 0, }); try { - await handleAlert(row.alarmId || row.id!, status, remark); - message.success(`${statusText}成功`); + await handleAlert(row.alarmId || row.id!, 'ignored'); + message.success('已标记为误报'); handleRefresh(); } catch (error) { - console.error(`${statusText}失败:`, error); + console.error('标记误报失败:', error); throw error; } finally { hideLoading(); @@ -272,14 +300,14 @@ const [Grid, gridApi] = useVbenVxeGrid({ label: '处理', type: 'link', icon: ACTION_ICON.EDIT, - onClick: handleProcess.bind(null, row, 'handled'), + onClick: openHandleModal.bind(null, row), ifShow: row.status === 'pending', }, { - label: '忽略', + label: '误报', type: 'link', danger: true, - onClick: handleProcess.bind(null, row, 'ignored'), + onClick: handleFalseAlarm.bind(null, row), ifShow: row.status === 'pending', }, ]" @@ -409,5 +437,30 @@ const [Grid, gridApi] = useVbenVxeGrid({ + + + +
+
+ 告警编号:{{ handleModalRow.alertNo }} +
+
+
处理备注
+