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 | 126 | format: (text) => alarmLevel(text), |
127 | 127 | }, |
128 | 128 | { |
129 | + title: '告警详情', | |
130 | + dataIndex: 'details', | |
131 | + slots: { customRender: 'details' }, | |
132 | + width: 160, | |
133 | + }, | |
134 | + { | |
129 | 135 | title: '状态', |
130 | 136 | dataIndex: 'status', |
131 | 137 | format: (text) => statusType(text), | ... | ... |
... | ... | @@ -13,17 +13,31 @@ |
13 | 13 | ]" |
14 | 14 | /> |
15 | 15 | </template> |
16 | + <template #details="{ record }"> | |
17 | + <a-button type="link" class="ml-2" @click="handleViewAlarmDetails(record)"> | |
18 | + 查看告警详情 | |
19 | + </a-button> | |
20 | + </template> | |
16 | 21 | </BasicTable> |
17 | 22 | <AlarmDetailDrawer @register="registerDetailDrawer" @success="handleSuccess" /> |
18 | 23 | </div> |
19 | 24 | </template> |
20 | 25 | <script lang="ts"> |
21 | - import { defineComponent } from 'vue'; | |
26 | + import { defineComponent, nextTick, h } from 'vue'; | |
22 | 27 | import { BasicTable, useTable, TableAction } from '/@/components/Table'; |
23 | 28 | import { alarmColumns, alarmSearchSchemas } from './config/detail.config'; |
24 | 29 | import { getDeviceAlarm } from '/@/api/device/deviceManager'; |
25 | 30 | import { useDrawer } from '/@/components/Drawer'; |
26 | 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 | 42 | export default defineComponent({ |
29 | 43 | name: 'AlarmCenter', |
... | ... | @@ -61,11 +75,85 @@ |
61 | 75 | const handleSuccess = () => { |
62 | 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 | 151 | return { |
65 | 152 | registerTable, |
66 | 153 | registerDetailDrawer, |
67 | 154 | handleDetail, |
68 | 155 | handleSuccess, |
156 | + handleViewAlarmDetails, | |
69 | 157 | }; |
70 | 158 | }, |
71 | 159 | }); | ... | ... |
... | ... | @@ -86,7 +86,6 @@ |
86 | 86 | const deviceIdKeys = Object.keys(details); |
87 | 87 | const detailObject = deviceIdKeys.map((key) => ({ label: key, value: details[key] })); |
88 | 88 | const dataFormat = await handleAlarmDetailFormat(deviceIdKeys); |
89 | - console.log(detailObject, dataFormat, 'dataFormat'); | |
90 | 89 | const dataFormats = detailObject.reduce((acc: any, curr: any) => { |
91 | 90 | dataFormat.forEach((item) => { |
92 | 91 | if (item.tbDeviceId === curr.label) { | ... | ... |