Commit 592444b2df612c7ce331ffff4bdc730012516f03
1 parent
e3719bf7
fix: DEFECT-1557 告警记录里面加上告警详情,跟设备告警记录一致
Showing
3 changed files
with
95 additions
and
2 deletions
@@ -126,6 +126,12 @@ export const alarmColumns: BasicColumn[] = [ | @@ -126,6 +126,12 @@ export const alarmColumns: BasicColumn[] = [ | ||
126 | format: (text) => alarmLevel(text), | 126 | format: (text) => alarmLevel(text), |
127 | }, | 127 | }, |
128 | { | 128 | { |
129 | + title: '告警详情', | ||
130 | + dataIndex: 'details', | ||
131 | + slots: { customRender: 'details' }, | ||
132 | + width: 160, | ||
133 | + }, | ||
134 | + { | ||
129 | title: '状态', | 135 | title: '状态', |
130 | dataIndex: 'status', | 136 | dataIndex: 'status', |
131 | format: (text) => statusType(text), | 137 | format: (text) => statusType(text), |
@@ -13,17 +13,31 @@ | @@ -13,17 +13,31 @@ | ||
13 | ]" | 13 | ]" |
14 | /> | 14 | /> |
15 | </template> | 15 | </template> |
16 | + <template #details="{ record }"> | ||
17 | + <a-button type="link" class="ml-2" @click="handleViewAlarmDetails(record)"> | ||
18 | + 查看告警详情 | ||
19 | + </a-button> | ||
20 | + </template> | ||
16 | </BasicTable> | 21 | </BasicTable> |
17 | <AlarmDetailDrawer @register="registerDetailDrawer" @success="handleSuccess" /> | 22 | <AlarmDetailDrawer @register="registerDetailDrawer" @success="handleSuccess" /> |
18 | </div> | 23 | </div> |
19 | </template> | 24 | </template> |
20 | <script lang="ts"> | 25 | <script lang="ts"> |
21 | - import { defineComponent } from 'vue'; | 26 | + import { defineComponent, nextTick, h } from 'vue'; |
22 | import { BasicTable, useTable, TableAction } from '/@/components/Table'; | 27 | import { BasicTable, useTable, TableAction } from '/@/components/Table'; |
23 | import { alarmColumns, alarmSearchSchemas } from './config/detail.config'; | 28 | import { alarmColumns, alarmSearchSchemas } from './config/detail.config'; |
24 | import { getDeviceAlarm } from '/@/api/device/deviceManager'; | 29 | import { getDeviceAlarm } from '/@/api/device/deviceManager'; |
25 | import { useDrawer } from '/@/components/Drawer'; | 30 | import { useDrawer } from '/@/components/Drawer'; |
26 | import AlarmDetailDrawer from './cpns/AlarmDetailDrawer.vue'; | 31 | import AlarmDetailDrawer from './cpns/AlarmDetailDrawer.vue'; |
32 | + import { Modal } from 'ant-design-vue'; | ||
33 | + import { JsonPreview } from '/@/components/CodeEditor'; | ||
34 | + import { getDeviceDetail } from '/@/api/device/deviceManager'; | ||
35 | + import { getAttribute } from '/@/api/ruleengine/ruleengineApi'; | ||
36 | + import { | ||
37 | + operationNumber_OR_TIME, | ||
38 | + operationString, | ||
39 | + operationBoolean, | ||
40 | + } from '/@/views/rule/linkedge/config/formatData'; | ||
27 | 41 | ||
28 | export default defineComponent({ | 42 | export default defineComponent({ |
29 | name: 'AlarmCenter', | 43 | name: 'AlarmCenter', |
@@ -61,11 +75,85 @@ | @@ -61,11 +75,85 @@ | ||
61 | const handleSuccess = () => { | 75 | const handleSuccess = () => { |
62 | reload(); | 76 | reload(); |
63 | }; | 77 | }; |
78 | + const handleViewAlarmDetails = async (record: Recordable) => { | ||
79 | + await nextTick(); | ||
80 | + const { details } = record; | ||
81 | + const deviceIdKeys = Object.keys(details); | ||
82 | + const detailObject = deviceIdKeys.map((key) => ({ label: key, value: details[key] })); | ||
83 | + const dataFormat = await handleAlarmDetailFormat(deviceIdKeys); | ||
84 | + const dataFormats = detailObject.reduce((acc: any, curr: any) => { | ||
85 | + dataFormat.forEach((item) => { | ||
86 | + if (item.tbDeviceId === curr.label) { | ||
87 | + const findName = item.attribute.find( | ||
88 | + (item) => item.identifier === curr.value.key | ||
89 | + )?.name; | ||
90 | + const findLogin = [ | ||
91 | + ...operationNumber_OR_TIME, | ||
92 | + ...operationString, | ||
93 | + ...operationBoolean, | ||
94 | + ].find((item) => item.value === curr.value.logic)?.symbol; | ||
95 | + const findAttribute = item.attribute.find( | ||
96 | + (findItem) => findItem.identifier === curr.value.key | ||
97 | + ); | ||
98 | + const value = { | ||
99 | + ['触发属性']: findName, | ||
100 | + ['触发条件']: `${findLogin}${curr.value.logicValue}`, | ||
101 | + ['触发值']: `${curr.value.realValue}${findAttribute.detail?.dataType?.specs?.unit?.key}`, | ||
102 | + }; | ||
103 | + const data = { | ||
104 | + [item.name]: value, | ||
105 | + }; | ||
106 | + acc.push(data); | ||
107 | + } | ||
108 | + }); | ||
109 | + return [...acc]; | ||
110 | + }, []); | ||
111 | + const objectFormat = dataFormats.reduce((acc: any, curr: any) => { | ||
112 | + return { | ||
113 | + ...acc, | ||
114 | + ...curr, | ||
115 | + }; | ||
116 | + }, {}); | ||
117 | + Modal.info({ | ||
118 | + title: '告警详情', | ||
119 | + width: 600, | ||
120 | + centered: true, | ||
121 | + maskClosable: true, | ||
122 | + content: h(JsonPreview, { data: JSON.parse(JSON.stringify(objectFormat)) }), | ||
123 | + }); | ||
124 | + }; | ||
125 | + const handleAlarmDetailFormat = async (keys: string[]) => { | ||
126 | + const temp: any = []; | ||
127 | + for (let item of keys) { | ||
128 | + if (item === 'key' || item === 'data') return []; //旧数据则终止 | ||
129 | + const deviceDetailRes = await getDeviceDetail(item); | ||
130 | + const { deviceProfileId } = deviceDetailRes; | ||
131 | + if (!deviceProfileId) return []; | ||
132 | + const attributeRes = await getAttribute(deviceProfileId); | ||
133 | + const dataFormat: any = handleDataFormat(deviceDetailRes, attributeRes); | ||
134 | + temp.push(dataFormat); | ||
135 | + } | ||
136 | + return temp; | ||
137 | + }; | ||
138 | + const handleDataFormat = (deviceDetail: any, attributes: any) => { | ||
139 | + const { name, tbDeviceId } = deviceDetail; | ||
140 | + const attribute = attributes.map((item) => ({ | ||
141 | + identifier: item.identifier, | ||
142 | + name: item.name, | ||
143 | + detail: item.detail, | ||
144 | + })); | ||
145 | + return { | ||
146 | + name, | ||
147 | + tbDeviceId, | ||
148 | + attribute, | ||
149 | + }; | ||
150 | + }; | ||
64 | return { | 151 | return { |
65 | registerTable, | 152 | registerTable, |
66 | registerDetailDrawer, | 153 | registerDetailDrawer, |
67 | handleDetail, | 154 | handleDetail, |
68 | handleSuccess, | 155 | handleSuccess, |
156 | + handleViewAlarmDetails, | ||
69 | }; | 157 | }; |
70 | }, | 158 | }, |
71 | }); | 159 | }); |
@@ -86,7 +86,6 @@ | @@ -86,7 +86,6 @@ | ||
86 | const deviceIdKeys = Object.keys(details); | 86 | const deviceIdKeys = Object.keys(details); |
87 | const detailObject = deviceIdKeys.map((key) => ({ label: key, value: details[key] })); | 87 | const detailObject = deviceIdKeys.map((key) => ({ label: key, value: details[key] })); |
88 | const dataFormat = await handleAlarmDetailFormat(deviceIdKeys); | 88 | const dataFormat = await handleAlarmDetailFormat(deviceIdKeys); |
89 | - console.log(detailObject, dataFormat, 'dataFormat'); | ||
90 | const dataFormats = detailObject.reduce((acc: any, curr: any) => { | 89 | const dataFormats = detailObject.reduce((acc: any, curr: any) => { |
91 | dataFormat.forEach((item) => { | 90 | dataFormat.forEach((item) => { |
92 | if (item.tbDeviceId === curr.label) { | 91 | if (item.tbDeviceId === curr.label) { |