Commit 1f360ec44b4c1105f84bffc090bc2edbbe955191
Merge branch 'ft-dev' into 'main'
fix:设备配置编辑回显解决 See merge request huang/yun-teng-iot-front!155
Showing
5 changed files
with
360 additions
and
179 deletions
... | ... | @@ -97,7 +97,6 @@ |
97 | 97 | const getStepTwoData: any = ref({}); |
98 | 98 | const getStepThreeData = ref([]); |
99 | 99 | const editData: any = ref({}); |
100 | - let getBackendData = reactive({}); | |
101 | 100 | let getStepFourData: any = reactive({}); |
102 | 101 | const alarmProfileData = reactive({ |
103 | 102 | alarmProfile: { |
... | ... | @@ -115,6 +114,8 @@ |
115 | 114 | const isShowOkBtnFalse = ref(true); |
116 | 115 | const isShowRule = ref(true); |
117 | 116 | const isEditAndChange = ref(true); |
117 | + const isEchoEditStatus = ref(false); | |
118 | + | |
118 | 119 | const getTitle = computed(() => |
119 | 120 | isUpdate.value == 1 ? '新增设备配置' : isUpdate.value == 2 ? '编辑设备配置' : '设备配置详情' |
120 | 121 | ); |
... | ... | @@ -122,38 +123,26 @@ |
122 | 123 | const [register, { closeModal }] = useModalInner(async (data) => { |
123 | 124 | isUpdate.value = data.isUpdate; |
124 | 125 | if (isUpdate.value == 1) { |
125 | - // proxy.$refs.DeviceProfileStep3Ref.isAddRuleStatusFunc(true); | |
126 | + try { | |
127 | + proxy.$refs.DeviceProfileStep1Ref?.customResetStepOneFunc(); | |
128 | + proxy.$refs.DeviceProfileStep1Ref?.resetIconFunc(); | |
129 | + proxy.$refs.DeviceProfileStep2Ref?.customClearStepTwoValueFunc(); | |
130 | + proxy.$refs.DeviceProfileStep3Ref?.clearStep3DataFunc(); | |
131 | + proxy.$refs.DeviceProfileStep4Ref?.clearAlaramContactAndNoticeMethodFunc(); | |
132 | + } catch {} | |
126 | 133 | isShowRule.value = true; |
127 | 134 | isShowOkBtnFalse.value = true; |
128 | 135 | current.value = 0; |
129 | 136 | isStatus.value = !data.isUpdate; |
130 | - //清空第一步数据 | |
131 | - proxy.$refs.DeviceProfileStep1Ref?.resetIconFunc(); | |
132 | - proxy.$refs.DeviceProfileStep1Ref?.customResetStepOneFunc(); | |
133 | - // proxy.$refs.DeviceProfileStep3Ref?.clearProfileDataFunc1(); | |
134 | - // proxy.$refs.DeviceProfileStep3Ref?.deleteClearCondition(); | |
135 | - //报警详细信息 | |
136 | - // proxy.$refs.DeviceProfileStep3Ref?.setRegisterFormChangeDetailFunc({ | |
137 | - // isEditStatus: false, | |
138 | - // stepThreeData: {}, | |
139 | - // }); | |
137 | + isEchoEditStatus.value = false; | |
140 | 138 | } else if (isUpdate.value == 2) { |
141 | - // isGetStepThreeData.profileData.alarms.length = 0; | |
142 | - try { | |
143 | - proxy.$refs.DeviceProfileStep3Ref?.clearEditAllRegisterFormFunc(); | |
144 | - } catch (e) { | |
145 | - return e; | |
146 | - } | |
147 | - postEditId.value = data.record.id; | |
148 | - getBackendData = await deviceConfigGetDetail(postEditId.value); | |
149 | - editData.value = getBackendData; | |
150 | - proxy.$refs.DeviceProfileStep3Ref.isAddRuleStatusFunc(true); | |
151 | 139 | isShowRule.value = true; |
152 | 140 | isShowOkBtnFalse.value = true; |
153 | 141 | current.value = 0; |
154 | - isStatus.value = data.isUpdate; | |
155 | - //清空第一步数据 | |
156 | - proxy.$refs.DeviceProfileStep1Ref.customResetStepOneFunc(); | |
142 | + postEditId.value = data.record.id; | |
143 | + editData.value = await deviceConfigGetDetail(postEditId.value); | |
144 | + // proxy.$refs.DeviceProfileStep3Ref.isAddRuleStatusFunc(true); | |
145 | + // isStatus.value = data.isUpdate; | |
157 | 146 | //回显第一步数据 |
158 | 147 | proxy.$refs.DeviceProfileStep1Ref.setStepOneFieldsValueFunc({ |
159 | 148 | name: editData.value.name, |
... | ... | @@ -161,28 +150,29 @@ |
161 | 150 | defaultQueueName: editData.value.defaultQueueName, |
162 | 151 | description: editData.value.description, |
163 | 152 | }); |
164 | - proxy.$refs.DeviceProfileStep3Ref.clearProfileDataFunc(); | |
165 | - proxy.$refs.DeviceProfileStep3Ref.addAlarmRule(); | |
153 | + // proxy.$refs.DeviceProfileStep3Ref.clearProfileDataFunc(); | |
154 | + // proxy.$refs.DeviceProfileStep3Ref.addAlarmRule(); | |
155 | + emit('success'); | |
166 | 156 | } else if (isUpdate.value == 3) { |
167 | - postEditId.value = data.record.id; | |
168 | - getBackendData = await deviceConfigGetDetail(postEditId.value); | |
169 | - editData.value = getBackendData; | |
170 | - proxy.$refs.DeviceProfileStep3Ref.isAddRuleStatusFunc(false); | |
171 | 157 | isShowRule.value = false; |
172 | 158 | isShowOkBtnFalse.value = false; |
173 | 159 | current.value = 0; |
174 | - isStatus.value = data.isUpdate; | |
175 | - //清空第一步数据 | |
176 | - proxy.$refs.DeviceProfileStep1Ref.customResetStepOneFunc(); | |
177 | - //回显第一步数据 | |
178 | - proxy.$refs.DeviceProfileStep1Ref.setStepOneFieldsValueFunc({ | |
179 | - name: editData.value.name, | |
180 | - defaultRuleChainId: editData.value.defaultRuleChainId, | |
181 | - defaultQueueName: editData.value.defaultQueueName, | |
182 | - description: editData.value.description, | |
183 | - }); | |
184 | - proxy.$refs.DeviceProfileStep3Ref.clearProfileDataFunc(); | |
185 | - proxy.$refs.DeviceProfileStep3Ref.addAlarmRule(); | |
160 | + // postEditId.value = data.record.id; | |
161 | + // getBackendData = await deviceConfigGetDetail(postEditId.value); | |
162 | + // editData.value = getBackendData; | |
163 | + // proxy.$refs.DeviceProfileStep3Ref.isAddRuleStatusFunc(false); | |
164 | + // isStatus.value = data.isUpdate; | |
165 | + // //清空第一步数据 | |
166 | + // proxy.$refs.DeviceProfileStep1Ref.customResetStepOneFunc(); | |
167 | + // //回显第一步数据 | |
168 | + // proxy.$refs.DeviceProfileStep1Ref.setStepOneFieldsValueFunc({ | |
169 | + // name: editData.value.name, | |
170 | + // defaultRuleChainId: editData.value.defaultRuleChainId, | |
171 | + // defaultQueueName: editData.value.defaultQueueName, | |
172 | + // description: editData.value.description, | |
173 | + // }); | |
174 | + // proxy.$refs.DeviceProfileStep3Ref.clearProfileDataFunc(); | |
175 | + // proxy.$refs.DeviceProfileStep3Ref.addAlarmRule(); | |
186 | 176 | } |
187 | 177 | }); |
188 | 178 | function handleStepPrev() { |
... | ... | @@ -211,81 +201,86 @@ |
211 | 201 | if (isUpdate.value == 1) { |
212 | 202 | } else if (isUpdate.value == 2) { |
213 | 203 | try { |
214 | - proxy.$refs.DeviceProfileStep3Ref.setAlaramTypeFormFunc({ | |
215 | - alarmType: editData.value?.profileData.alarms[0].alarmType, | |
216 | - }); | |
217 | - proxy.$refs.DeviceProfileStep3Ref.setTransmitAlarmFormFunc({ | |
218 | - propagate: editData.value?.profileData.alarms[0].propagate, | |
219 | - propagateRelationTypes: | |
220 | - editData.value?.profileData.alarms[0].propagateRelationTypes[0], | |
221 | - }); | |
222 | - //回显报警详细信息 | |
223 | - proxy.$refs.DeviceProfileStep3Ref.setRegisterFormChangeDetailFunc({ | |
224 | - isEditStatus: true, | |
225 | - stepThreeData: editData.value?.profileData.alarms[0].createRules, | |
226 | - stepThreeClearData: editData.value?.profileData.alarms[0].clearRule, | |
227 | - }); | |
228 | - proxy.$refs.DeviceProfileStep3Ref.setCreateRegisterFormChangeDetailFunc( | |
229 | - editData.value?.profileData.alarms[0].createRules | |
204 | + isEchoEditStatus.value = true; | |
205 | + proxy.$refs.DeviceProfileStep3Ref?.echoStep3DataFunc( | |
206 | + editData.value.profileData.alarms, | |
207 | + isEchoEditStatus.value | |
230 | 208 | ); |
231 | - proxy.$refs.DeviceProfileStep3Ref.setRegisterFormClearChangeDetailFunc({ | |
232 | - alarmDetails: editData.value?.profileData.alarms[0].clearRule.alarmDetails, | |
233 | - }); | |
234 | - proxy.$refs.DeviceProfileStep3Ref.setRegisterFormCreateAlarmFunc({ | |
235 | - default: editData.value?.profileData.alarms[0].createRules, | |
236 | - }); | |
237 | - //回显创建报警规则和清除报警规则 | |
209 | + // proxy.$refs.DeviceProfileStep3Ref.setAlaramTypeFormFunc({ | |
210 | + // alarmType: editData.value?.profileData.alarms[0].alarmType, | |
211 | + // }); | |
212 | + // proxy.$refs.DeviceProfileStep3Ref.setTransmitAlarmFormFunc({ | |
213 | + // propagate: editData.value?.profileData.alarms[0].propagate, | |
214 | + // propagateRelationTypes: | |
215 | + // editData.value?.profileData.alarms[0].propagateRelationTypes[0], | |
216 | + // }); | |
217 | + // //回显报警详细信息 | |
218 | + // proxy.$refs.DeviceProfileStep3Ref.setRegisterFormChangeDetailFunc({ | |
219 | + // isEditStatus: true, | |
220 | + // stepThreeData: editData.value?.profileData.alarms[0].createRules, | |
221 | + // stepThreeClearData: editData.value?.profileData.alarms[0].clearRule, | |
222 | + // }); | |
223 | + // proxy.$refs.DeviceProfileStep3Ref.setCreateRegisterFormChangeDetailFunc( | |
224 | + // editData.value?.profileData.alarms[0].createRules | |
225 | + // ); | |
226 | + // proxy.$refs.DeviceProfileStep3Ref.setRegisterFormClearChangeDetailFunc({ | |
227 | + // alarmDetails: editData.value?.profileData.alarms[0].clearRule.alarmDetails, | |
228 | + // }); | |
229 | + // proxy.$refs.DeviceProfileStep3Ref.setRegisterFormCreateAlarmFunc({ | |
230 | + // default: editData.value?.profileData.alarms[0].createRules, | |
231 | + // }); | |
232 | + // //回显创建报警规则和清除报警规则 | |
238 | 233 | } catch {} |
239 | 234 | } else if (isUpdate.value == 3) { |
240 | - try { | |
241 | - proxy.$refs.DeviceProfileStep3Ref.setAlaramTypeFormFunc({ | |
242 | - alarmType: editData.value?.profileData.alarms[0].alarmType, | |
243 | - }); | |
244 | - proxy.$refs.DeviceProfileStep3Ref.setTransmitAlarmFormFunc({ | |
245 | - propagate: editData.value?.profileData.alarms[0].propagate, | |
246 | - propagateRelationTypes: | |
247 | - editData.value?.profileData.alarms[0].propagateRelationTypes[0], | |
248 | - }); | |
249 | - //回显报警详细信息 | |
250 | - proxy.$refs.DeviceProfileStep3Ref.setRegisterFormChangeDetailFunc({ | |
251 | - isEditStatus: true, | |
252 | - stepThreeData: editData.value?.profileData.alarms[0].createRules, | |
253 | - stepThreeClearData: editData.value?.profileData.alarms[0].clearRule, | |
254 | - }); | |
255 | - proxy.$refs.DeviceProfileStep3Ref.setCreateRegisterFormChangeDetailFunc( | |
256 | - editData.value?.profileData.alarms[0].createRules | |
257 | - ); | |
258 | - proxy.$refs.DeviceProfileStep3Ref.setRegisterFormClearChangeDetailFunc({ | |
259 | - alarmDetails: editData.value?.profileData.alarms[0].clearRule.alarmDetails, | |
260 | - }); | |
261 | - //回显创建报警规则和清除报警规则 | |
262 | - } catch {} | |
235 | + // try { | |
236 | + // proxy.$refs.DeviceProfileStep3Ref.setAlaramTypeFormFunc({ | |
237 | + // alarmType: editData.value?.profileData.alarms[0].alarmType, | |
238 | + // }); | |
239 | + // proxy.$refs.DeviceProfileStep3Ref.setTransmitAlarmFormFunc({ | |
240 | + // propagate: editData.value?.profileData.alarms[0].propagate, | |
241 | + // propagateRelationTypes: | |
242 | + // editData.value?.profileData.alarms[0].propagateRelationTypes[0], | |
243 | + // }); | |
244 | + // //回显报警详细信息 | |
245 | + // proxy.$refs.DeviceProfileStep3Ref.setRegisterFormChangeDetailFunc({ | |
246 | + // isEditStatus: true, | |
247 | + // stepThreeData: editData.value?.profileData.alarms[0].createRules, | |
248 | + // stepThreeClearData: editData.value?.profileData.alarms[0].clearRule, | |
249 | + // }); | |
250 | + // proxy.$refs.DeviceProfileStep3Ref.setCreateRegisterFormChangeDetailFunc( | |
251 | + // editData.value?.profileData.alarms[0].createRules | |
252 | + // ); | |
253 | + // proxy.$refs.DeviceProfileStep3Ref.setRegisterFormClearChangeDetailFunc({ | |
254 | + // alarmDetails: editData.value?.profileData.alarms[0].clearRule.alarmDetails, | |
255 | + // }); | |
256 | + // //回显创建报警规则和清除报警规则 | |
257 | + // } catch {} | |
263 | 258 | } |
264 | 259 | } |
265 | 260 | //第三步 |
266 | 261 | function handleStep3Next(v, v1) { |
267 | - isEditAndChange.value = v1; | |
268 | - current.value++; | |
269 | - getStepThreeData.value = v; | |
270 | - if (isUpdate.value == 1) { | |
271 | - } else if (isUpdate.value == 2) { | |
272 | - proxy.$refs.DeviceProfileStep4Ref.setAlaramContactAndNoticeMethodFunc({ | |
273 | - alarmContactId: editData.value?.alarmProfile.alarmContactId.split(','), | |
274 | - messageMode: editData.value?.alarmProfile.messageMode.split(','), | |
275 | - }); | |
276 | - } else if (isUpdate.value == 3) { | |
277 | - proxy.$refs.DeviceProfileStep4Ref.setAlaramContactAndNoticeMethodFunc({ | |
278 | - alarmContactId: editData.value?.alarmProfile.alarmContactId.split(','), | |
279 | - messageMode: editData.value?.alarmProfile.messageMode.split(','), | |
280 | - }); | |
281 | - } | |
282 | - } | |
283 | - function handleRedo() { | |
284 | - current.value = 0; | |
262 | + try { | |
263 | + isEditAndChange.value = v1; | |
264 | + current.value++; | |
265 | + getStepThreeData.value = v; | |
266 | + proxy.$refs.DeviceProfileStep4Ref?.step3LinkStep4DefalutClose(); | |
267 | + if (isUpdate.value == 1) { | |
268 | + } else if (isUpdate.value == 2) { | |
269 | + proxy.$refs.DeviceProfileStep4Ref?.setAlaramContactAndNoticeMethodFunc({ | |
270 | + alarmContactId: editData.value?.alarmProfile.alarmContactId.split(','), | |
271 | + messageMode: editData.value?.alarmProfile.messageMode.split(','), | |
272 | + }); | |
273 | + } else if (isUpdate.value == 3) { | |
274 | + proxy.$refs.DeviceProfileStep4Ref?.setAlaramContactAndNoticeMethodFunc({ | |
275 | + alarmContactId: editData.value?.alarmProfile.alarmContactId.split(','), | |
276 | + messageMode: editData.value?.alarmProfile.messageMode.split(','), | |
277 | + }); | |
278 | + } | |
279 | + } catch {} | |
285 | 280 | } |
286 | 281 | const handleSubmit = async () => { |
282 | + const step1Val = await proxy.$refs.DeviceProfileStep1Ref?.getStep1Func(); | |
287 | 283 | if (isUpdate.value == 1) { |
288 | - const step1Val = await proxy.$refs.DeviceProfileStep1Ref?.getStep1Func(); | |
289 | 284 | isGetStepThreeData = { |
290 | 285 | ...{ |
291 | 286 | profileData: |
... | ... | @@ -342,16 +337,15 @@ |
342 | 337 | closeModal(); |
343 | 338 | try { |
344 | 339 | proxy.$refs.DeviceProfileStep1Ref?.customResetStepOneFunc(); |
340 | + proxy.$refs.DeviceProfileStep1Ref?.resetIconFunc(); | |
345 | 341 | proxy.$refs.DeviceProfileStep2Ref?.customClearStepTwoValueFunc(); |
346 | - proxy.$refs.DeviceProfileStep3Ref?.resetAlarmSeverityRefFunc(); | |
347 | - proxy.$refs.DeviceProfileStep3Ref?.resetRegisterFormCreateAlarmFunc(); | |
348 | - proxy.$refs.DeviceProfileStep3Ref?.clearDetailTemplateFunc(); | |
349 | - proxy.$refs.DeviceProfileStep3Ref?.clearEditAllRegisterFormFunc(); | |
350 | - proxy.$refs.DeviceProfileStep3Ref?.clearAllRegisterFormFunc(); | |
342 | + proxy.$refs.DeviceProfileStep3Ref?.clearStep3DataFunc(); | |
351 | 343 | proxy.$refs.DeviceProfileStep4Ref?.clearAlaramContactAndNoticeMethodFunc(); |
352 | - proxy.$refs.DeviceProfileStep3Ref?.clearProfileDataFunc1(); | |
353 | 344 | } catch {} |
354 | 345 | }; |
346 | + function handleRedo() { | |
347 | + current.value = 0; | |
348 | + } | |
355 | 349 | return { |
356 | 350 | isShowRule, |
357 | 351 | isShowOkBtnFalse, | ... | ... |
... | ... | @@ -5,10 +5,13 @@ |
5 | 5 | <p style="font-size: large">未配置报警规则</p> |
6 | 6 | </div> |
7 | 7 | <div> |
8 | - <template v-for="(item, index) in alarmsData" :key="index"> | |
8 | + <template | |
9 | + v-for="(item, index) in !getIsEchoEditStatus ? alarmsData : echoEditData" | |
10 | + :key="index" | |
11 | + > | |
9 | 12 | <span style="display: none">{{ item }}</span> |
10 | 13 | <span style="display: none">{{ index }}</span> |
11 | - <div class="cursor-pointer" style="position: relative; top: 3.5vh; right: -40.8vw"> | |
14 | + <div class="cursor-pointer" style="position: relative; top: 3.5vh; right: -41.6vw"> | |
12 | 15 | <img |
13 | 16 | style="cursor: pointer" |
14 | 17 | @click="removeAlarmRule(index, item)" |
... | ... | @@ -21,12 +24,18 @@ |
21 | 24 | margin-left: 0.21vw; |
22 | 25 | border-radius: 4px; |
23 | 26 | width: 44vw; |
24 | - height: 46vh; | |
27 | + height: 47vh; | |
25 | 28 | border: 1px solid grey; |
26 | 29 | overflow-y: scroll; |
27 | 30 | " |
28 | 31 | > |
29 | - <CommonCpns ref="commonCpnsRef" /> | |
32 | + <CommonCpns | |
33 | + ref="commonCpnsRef" | |
34 | + :step3FatherEmitCpnData="!getIsEchoEditStatus ? 1 : item" | |
35 | + :step3FatherEmitCpnStatus=" | |
36 | + !getIsEchoEditStatus ? !getIsEchoEditStatus : getIsEchoEditStatus | |
37 | + " | |
38 | + /> | |
30 | 39 | </div> |
31 | 40 | </template> |
32 | 41 | </div> |
... | ... | @@ -57,6 +66,8 @@ |
57 | 66 | const commonCpnsRef = ref(null); |
58 | 67 | const alarmsData: any = ref([]); |
59 | 68 | let profileData: any = reactive({}); |
69 | + const echoEditData: any = ref([]); | |
70 | + const getIsEchoEditStatus = ref(false); | |
60 | 71 | const prevStepFunc = () => { |
61 | 72 | emit('prev'); |
62 | 73 | }; |
... | ... | @@ -73,8 +84,30 @@ |
73 | 84 | alarmsData.value.push(profileData); |
74 | 85 | }; |
75 | 86 | const removeAlarmRule = (i, e) => { |
87 | + console.log(e); | |
76 | 88 | let delI = i; |
77 | - alarmsData.value.splice(alarmsData.value.indexOf(e), 1); | |
89 | + alarmsData.value.splice(delI, 1); | |
90 | + }; | |
91 | + /** | |
92 | + * 清空数据 | |
93 | + */ | |
94 | + const clearStep3DataFunc = () => { | |
95 | + try { | |
96 | + alarmsData.value.length = 0; | |
97 | + profileData = {}; | |
98 | + proxy.$refs.commonCpnsRef?.clearStep3CpnDataFunc(); | |
99 | + } catch {} | |
100 | + }; | |
101 | + /** | |
102 | + * 回显数据 | |
103 | + */ | |
104 | + const echoStep3DataFunc = (e, s) => { | |
105 | + try { | |
106 | + getIsEchoEditStatus.value = s; | |
107 | + if (getIsEchoEditStatus.value === true) { | |
108 | + echoEditData.value = e; | |
109 | + } | |
110 | + } catch {} | |
78 | 111 | }; |
79 | 112 | |
80 | 113 | return { |
... | ... | @@ -84,9 +117,17 @@ |
84 | 117 | alarmsData, |
85 | 118 | removeAlarmRule, |
86 | 119 | commonCpnsRef, |
120 | + clearStep3DataFunc, | |
121 | + echoStep3DataFunc, | |
122 | + echoEditData, | |
123 | + getIsEchoEditStatus, | |
87 | 124 | }; |
88 | 125 | }, |
89 | 126 | }); |
90 | 127 | </script> |
91 | 128 | |
92 | -<style lang="less" scoped></style> | |
129 | +<style lang="less" scoped> | |
130 | + ::-webkit-scrollbar { | |
131 | + display: none; | |
132 | + } | |
133 | +</style> | ... | ... |
... | ... | @@ -57,8 +57,8 @@ |
57 | 57 | const setAlaramContactAndNoticeMethodFunc = (v) => { |
58 | 58 | setFieldsValue(v); |
59 | 59 | }; |
60 | - const clearAlaramContactAndNoticeMethodFunc = async () => { | |
61 | - await resetFields(); | |
60 | + const clearAlaramContactAndNoticeMethodFunc = () => { | |
61 | + resetFields(); | |
62 | 62 | }; |
63 | 63 | const getAllFields = async (getV) => { |
64 | 64 | const values = await validate(); |
... | ... | @@ -75,6 +75,9 @@ |
75 | 75 | const closeStep4 = () => { |
76 | 76 | isShow.value = false; |
77 | 77 | }; |
78 | + const step3LinkStep4DefalutClose = () => { | |
79 | + isShow.value = false; | |
80 | + }; | |
78 | 81 | return { |
79 | 82 | clearAlaramContactAndNoticeMethodFunc, |
80 | 83 | setAlaramContactAndNoticeMethodFunc, |
... | ... | @@ -85,6 +88,7 @@ |
85 | 88 | prevStep4, |
86 | 89 | isShow, |
87 | 90 | closeStep4, |
91 | + step3LinkStep4DefalutClose, | |
88 | 92 | }; |
89 | 93 | }, |
90 | 94 | }); | ... | ... |
... | ... | @@ -60,11 +60,23 @@ |
60 | 60 | ><PlusCircleOutlined |
61 | 61 | /></a-button> |
62 | 62 | <div> |
63 | - <template v-for="(item1, index1) in formatAlarmRuleConditions" :key="index1"> | |
64 | - <p v-if="index1 == index"> | |
65 | - 报警规则条件:{{ formatAlarmRuleConditionsFunc(item1) }} | |
66 | - </p> | |
67 | - </template> | |
63 | + <div> | |
64 | + <template v-for="(item1, index1) in formatAlarmRuleConditions" :key="index1"> | |
65 | + <p v-if="index1 == index"> | |
66 | + 报警规则条件:{{ formatAlarmRuleConditionsFunc(item1) }} | |
67 | + </p> | |
68 | + </template> | |
69 | + </div> | |
70 | + <div> | |
71 | + <template | |
72 | + v-for="(item11, index11) in formatEditAlarmRuleConditions" | |
73 | + :key="index11" | |
74 | + > | |
75 | + <p v-if="index11 == index"> | |
76 | + 报警规则条件:{{ formatAlarmRuleConditionsData(item11) }} | |
77 | + </p> | |
78 | + </template> | |
79 | + </div> | |
68 | 80 | </div> |
69 | 81 | </div> |
70 | 82 | <div style="margin-left: 0.5vw"> |
... | ... | @@ -73,10 +85,19 @@ |
73 | 85 | ><PlusCircleOutlined |
74 | 86 | /></a-button> |
75 | 87 | <div> |
76 | - <p v-if="formatEnableRule.length == 0">始终启用</p> | |
77 | - <template v-for="(item2, index2) in formatEnableRule" :key="index2"> | |
78 | - <p v-if="index2 == index"> 启用规则:{{ formatEnableRuleFunc(item2) }} </p> | |
79 | - </template> | |
88 | + <p v-if="formatEnableRule.length == 0 && formatEditEnableRule.length == 0" | |
89 | + >始终启用</p | |
90 | + > | |
91 | + <div> | |
92 | + <template v-for="(item2, index2) in formatEnableRule" :key="index2"> | |
93 | + <p v-if="index2 == index"> 启用规则:{{ formatEnableRuleFunc(item2) }} </p> | |
94 | + </template> | |
95 | + </div> | |
96 | + <div> | |
97 | + <template v-for="(item22, index22) in formatEditEnableRule" :key="index22"> | |
98 | + <p v-if="index22 == index"> 启用规则:{{ formatEnableRuleData(item22) }} </p> | |
99 | + </template> | |
100 | + </div> | |
80 | 101 | </div> |
81 | 102 | </div> |
82 | 103 | <div></div> |
... | ... | @@ -132,10 +153,21 @@ |
132 | 153 | ><PlusCircleOutlined |
133 | 154 | /></a-button> |
134 | 155 | <div> |
135 | - <template v-for="(item3, index3) in formatClearAlarmRuleConditions" :key="index3"> | |
136 | - <span style="display: none">{{ index3 }}</span> | |
137 | - <p> 报警规则条件:{{ formatClearAlarmRuleConditionsFunc(item3) }} </p> | |
138 | - </template> | |
156 | + <div> | |
157 | + <template v-for="(item3, index3) in formatClearAlarmRuleConditions" :key="index3"> | |
158 | + <span style="display: none">{{ index3 }}</span> | |
159 | + <p> 报警规则条件:{{ formatClearAlarmRuleConditionsFunc(item3) }} </p> | |
160 | + </template> | |
161 | + </div> | |
162 | + <div> | |
163 | + <template | |
164 | + v-for="(item33, index33) in formatEditClearAlarmRuleConditions" | |
165 | + :key="index33" | |
166 | + > | |
167 | + <span style="display: none">{{ index33 }}</span> | |
168 | + <p> 报警规则条件:{{ formatAlarmRuleConditionsData(item33) }} </p> | |
169 | + </template> | |
170 | + </div> | |
139 | 171 | </div> |
140 | 172 | </div> |
141 | 173 | <div style="margin-left: 0.5vw"> |
... | ... | @@ -145,17 +177,25 @@ |
145 | 177 | /></a-button> |
146 | 178 | <div> |
147 | 179 | <p v-if="formatEnableRule.length == 0">始终启用</p> |
148 | - <template v-for="(item4, index4) in formatClearEnableRule" :key="index4"> | |
149 | - <span style="display: none">{{ index4 }}</span> | |
150 | - <p> 启用规则:{{ formatClearEnableRuleFunc(item4) }} </p> | |
151 | - </template> | |
180 | + <div> | |
181 | + <template v-for="(item4, index4) in formatClearEnableRule" :key="index4"> | |
182 | + <span style="display: none">{{ index4 }}</span> | |
183 | + <p> 启用规则:{{ formatClearEnableRuleFunc(item4) }} </p> | |
184 | + </template> | |
185 | + </div> | |
186 | + <div> | |
187 | + <template v-for="(item44, index44) in formatEditClearEnableRule" :key="index44"> | |
188 | + <span style="display: none">{{ index44 }}</span> | |
189 | + <p> 启用规则:{{ formatClearEnableRuleFunc(item44) }} </p> | |
190 | + </template> | |
191 | + </div> | |
152 | 192 | </div> |
153 | 193 | </div> |
154 | 194 | <div></div> |
155 | 195 | <div></div> |
156 | 196 | </div> |
157 | 197 | </div> |
158 | - <div> | |
198 | + <div style="position: relative; top: -1.2vh"> | |
159 | 199 | <a-button style="border-radius: 10px" class="mt-5" @click="clickAddClearRuleFunc" |
160 | 200 | ><PlusCircleOutlined />添加清除条件</a-button |
161 | 201 | > |
... | ... | @@ -166,9 +206,8 @@ |
166 | 206 | <!-- 创建报警规则 --> |
167 | 207 | </div> |
168 | 208 | </template> |
169 | - | |
170 | 209 | <script lang="ts"> |
171 | - import { defineComponent, ref, getCurrentInstance, nextTick, reactive } from 'vue'; | |
210 | + import { defineComponent, ref, nextTick, getCurrentInstance, reactive } from 'vue'; | |
172 | 211 | import { BasicForm, useForm } from '/@/components/Form'; |
173 | 212 | import { step3Schemas, step3HighSetting, formChangeDetailSchema } from '../data'; |
174 | 213 | import { Checkbox } from 'ant-design-vue'; |
... | ... | @@ -178,6 +217,7 @@ |
178 | 217 | import AlarmRuleConditionsCpn from '../cpns/alarmruleconditions/index.vue'; |
179 | 218 | import EnableRuleCpn from '../cpns/enablerule/index.vue'; |
180 | 219 | import { useModal } from '/@/components/Modal'; |
220 | + import { generateUUID } from '/@/hooks/web/useGenerateUUID'; | |
181 | 221 | import { formatAlarmRuleConditionsData, formatEnableRuleData } from '../common/format-data/index'; |
182 | 222 | |
183 | 223 | export default defineComponent({ |
... | ... | @@ -190,27 +230,33 @@ |
190 | 230 | AlarmRuleConditionsCpn, |
191 | 231 | EnableRuleCpn, |
192 | 232 | }, |
193 | - | |
194 | - setup() { | |
233 | + props: ['step3FatherEmitCpnData', 'step3FatherEmitCpnStatus'], | |
234 | + setup(props) { | |
195 | 235 | const { proxy } = getCurrentInstance() as any; |
196 | 236 | const createAlarmRuleData: any = ref([1]); |
197 | 237 | const AlarmRuleConditionsRef = ref(null); |
198 | 238 | const EnableRuleRef = ref(null); |
199 | 239 | const formatAlarmRuleConditions: any = ref([]); |
240 | + const formatEditAlarmRuleConditions: any = ref([]); | |
200 | 241 | const formatClearAlarmRuleConditions: any = ref([]); |
242 | + const formatEditClearAlarmRuleConditions: any = ref([]); | |
201 | 243 | const formatEnableRule: any = ref([]); |
202 | - const formatClearEnableRule: any = ref({}); | |
244 | + const formatEditEnableRule: any = ref([]); | |
245 | + const formatClearEnableRule: any = ref([]); | |
246 | + const formatEditClearEnableRule: any = ref([]); | |
203 | 247 | let alaramsObj: any = reactive({ |
204 | 248 | alarmType: null, |
205 | 249 | propagate: null, |
206 | 250 | propagateRelationTypes: null, |
207 | 251 | clearRule: {}, |
208 | 252 | createRules: {}, |
253 | + id: '', | |
209 | 254 | }); |
210 | 255 | const AlarmSeverityRef = ref(null); |
211 | 256 | const DetailTemplateRef = ref(null); |
212 | 257 | const tempDetailTemplateData: any = ref([]); |
213 | 258 | const isClearStatus = ref(false); |
259 | + const isStep3FatherAddOrEditStatus = ref(false); | |
214 | 260 | |
215 | 261 | const [registerAlarmRuleConditionsModal, { openModal: openModalAlarmRuleConditions }] = |
216 | 262 | useModal(); |
... | ... | @@ -220,13 +266,27 @@ |
220 | 266 | { openModal: openModalClearAlarmRuleConditions }, |
221 | 267 | ] = useModal(); |
222 | 268 | const [registerClearEnableRuleModal, { openModal: openModalClearEnableRule }] = useModal(); |
223 | - const [registerForm, { validate: getAlarmTypeValFunc }] = useForm({ | |
269 | + const [ | |
270 | + registerForm, | |
271 | + { | |
272 | + setFieldsValue: setAlarmTypeValFunc, | |
273 | + validate: getAlarmTypeValFunc, | |
274 | + resetFields: resetAlarmTypeValFunc, | |
275 | + }, | |
276 | + ] = useForm({ | |
224 | 277 | labelWidth: 120, |
225 | 278 | schemas: step3Schemas, |
226 | 279 | showResetButton: false, |
227 | 280 | showSubmitButton: false, |
228 | 281 | }); |
229 | - const [registerFormHighSetting, { getFieldsValue: getDeliverAlertsValFunc }] = useForm({ | |
282 | + const [ | |
283 | + registerFormHighSetting, | |
284 | + { | |
285 | + setFieldsValue: setDeliverAlertsValFunc, | |
286 | + getFieldsValue: getDeliverAlertsValFunc, | |
287 | + resetFields: resetDeliverAlertsValFunc, | |
288 | + }, | |
289 | + ] = useForm({ | |
230 | 290 | labelWidth: 120, |
231 | 291 | schemas: step3HighSetting, |
232 | 292 | showResetButton: false, |
... | ... | @@ -235,17 +295,22 @@ |
235 | 295 | span: 24, |
236 | 296 | }, |
237 | 297 | }); |
238 | - const [registerFormChangeClearDetail, { getFieldsValue: getRegisterFormClearChangeDetail }] = | |
239 | - useForm({ | |
240 | - labelWidth: 120, | |
241 | - schemas: formChangeDetailSchema, | |
242 | - showResetButton: false, | |
243 | - showSubmitButton: false, | |
244 | - actionColOptions: { | |
245 | - span: 24, | |
246 | - }, | |
247 | - }); | |
248 | - | |
298 | + const [ | |
299 | + registerFormChangeClearDetail, | |
300 | + { | |
301 | + setFieldsValue: setRegisterFormClearChangeDetailFunc, | |
302 | + getFieldsValue: getRegisterFormClearChangeDetailFunc, | |
303 | + resetFields: resetRegisterFormClearChangeDetailFunc, | |
304 | + }, | |
305 | + ] = useForm({ | |
306 | + labelWidth: 120, | |
307 | + schemas: formChangeDetailSchema, | |
308 | + showResetButton: false, | |
309 | + showSubmitButton: false, | |
310 | + actionColOptions: { | |
311 | + span: 24, | |
312 | + }, | |
313 | + }); | |
249 | 314 | const clickAddCreateRuleFunc = () => { |
250 | 315 | createAlarmRuleData.value.push(1); |
251 | 316 | getAddCreateRuleFunc(); |
... | ... | @@ -277,18 +342,19 @@ |
277 | 342 | }; |
278 | 343 | const clickAddClearRuleFunc = () => { |
279 | 344 | isClearStatus.value = true; |
280 | - const val6 = getRegisterFormClearChangeDetail(); | |
345 | + const val6 = getRegisterFormClearChangeDetailFunc(); | |
281 | 346 | let kongClearRule = {}; |
347 | + let kongClearEnable = {}; | |
282 | 348 | formatClearAlarmRuleConditions.value.forEach((f) => { |
283 | 349 | kongClearRule = f; |
284 | 350 | }); |
351 | + formatClearEnableRule.value.forEach((f) => { | |
352 | + kongClearEnable = f; | |
353 | + }); | |
285 | 354 | alaramsObj.clearRule = { |
286 | 355 | ...val6, |
287 | 356 | ...{ |
288 | - schedule: | |
289 | - Object.keys(formatClearEnableRule.value).length == 0 | |
290 | - ? null | |
291 | - : formatClearEnableRule.value, | |
357 | + schedule: formatClearEnableRule.value.length == 0 ? null : kongClearEnable, | |
292 | 358 | }, |
293 | 359 | ...{ |
294 | 360 | condition: formatClearAlarmRuleConditions.value.length == 0 ? null : kongClearRule, |
... | ... | @@ -318,7 +384,6 @@ |
318 | 384 | openModalEnableRule(true); |
319 | 385 | }); |
320 | 386 | }; |
321 | - | |
322 | 387 | const clickClearAlarmRuleConditionsFunc = () => { |
323 | 388 | nextTick(() => { |
324 | 389 | openModalClearAlarmRuleConditions(true); |
... | ... | @@ -347,14 +412,12 @@ |
347 | 412 | let formatMap = e.condition.map((f: any) => formatAlarmRuleConditionsData(f)); |
348 | 413 | return formatMap; |
349 | 414 | }; |
350 | - | |
351 | 415 | const getEnableRuleFunc = (e) => { |
352 | 416 | formatEnableRule.value.push(e); |
353 | 417 | }; |
354 | 418 | const getClearEnableRuleFunc = (e) => { |
355 | - formatClearEnableRule.value = e; | |
419 | + formatClearEnableRule.value.push(e); | |
356 | 420 | }; |
357 | - | |
358 | 421 | const formatEnableRuleFunc = (e) => { |
359 | 422 | let formatMap = formatEnableRuleData(e); |
360 | 423 | return formatMap; |
... | ... | @@ -363,7 +426,6 @@ |
363 | 426 | let formatMap = formatEnableRuleData(e); |
364 | 427 | return formatMap; |
365 | 428 | }; |
366 | - | |
367 | 429 | const getStep3AllDataFunc = async () => { |
368 | 430 | const val1 = await getAlarmTypeValFunc(); |
369 | 431 | const val2 = getDeliverAlertsValFunc(); |
... | ... | @@ -371,6 +433,7 @@ |
371 | 433 | val3.push(val2.propagateRelationTypes as never); |
372 | 434 | alaramsObj.alarmType = val1.alarmType; |
373 | 435 | alaramsObj.propagate = val2.propagate; |
436 | + alaramsObj.id = generateUUID(); | |
374 | 437 | if (val2.propagateRelationTypes == undefined) { |
375 | 438 | alaramsObj.propagateRelationTypes = null; |
376 | 439 | } else { |
... | ... | @@ -383,7 +446,77 @@ |
383 | 446 | } |
384 | 447 | return alaramsObj; |
385 | 448 | }; |
386 | - | |
449 | + /** | |
450 | + * 清空第三步数据 | |
451 | + */ | |
452 | + const clearStep3CpnDataFunc = () => { | |
453 | + try { | |
454 | + resetAlarmTypeValFunc(); | |
455 | + resetDeliverAlertsValFunc(); | |
456 | + proxy.$refs.AlarmSeverityRef?.resetFieldsFunc(); | |
457 | + proxy.$refs.DetailTemplateRef?.resetFieldsFunc(); | |
458 | + proxy.$refs.AlarmRuleConditionsRef?.resetFieldsFunc(); | |
459 | + proxy.$refs.EnableRuleRef?.resetFieldsFunc(); | |
460 | + resetRegisterFormClearChangeDetailFunc(); | |
461 | + formatAlarmRuleConditions.value.length = 0; | |
462 | + formatClearAlarmRuleConditions.value.length = 0; | |
463 | + formatEnableRule.value.length = 0; | |
464 | + formatClearEnableRule.value.length = 0; | |
465 | + tempDetailTemplateData.value.length = 0; | |
466 | + } catch {} | |
467 | + }; | |
468 | + /** | |
469 | + * 回显第三步数据 | |
470 | + */ | |
471 | + const echoStep3DataCpnFunc = () => { | |
472 | + try { | |
473 | + if (props.step3FatherEmitCpnData !== 1) { | |
474 | + console.log(props.step3FatherEmitCpnData); | |
475 | + isStep3FatherAddOrEditStatus.value = props.step3FatherEmitCpnStatus; | |
476 | + nextTick(() => { | |
477 | + setAlarmTypeValFunc({ | |
478 | + alarmType: props.step3FatherEmitCpnData?.alarmType, | |
479 | + }); | |
480 | + setDeliverAlertsValFunc({ | |
481 | + propagate: props.step3FatherEmitCpnData?.propagate, | |
482 | + propagateRelationTypes: props.step3FatherEmitCpnData?.propagateRelationTypes[0], | |
483 | + }); | |
484 | + if (props.step3FatherEmitCpnData?.clearRule?.alarmDetails !== '') { | |
485 | + isClearStatus.value = true; | |
486 | + nextTick(() => { | |
487 | + setRegisterFormClearChangeDetailFunc({ | |
488 | + alarmDetails: props.step3FatherEmitCpnData?.clearRule?.alarmDetails, | |
489 | + }); | |
490 | + }); | |
491 | + } | |
492 | + /** | |
493 | + * 回显第三步创建条件和清除条件 | |
494 | + */ | |
495 | + if (isStep3FatherAddOrEditStatus.value == true) { | |
496 | + let openEditRuleConditObj: any = {}; | |
497 | + for (let i in props.step3FatherEmitCpnData?.createRules) { | |
498 | + if (i == 'CRITICAL') { | |
499 | + openEditRuleConditObj = props.step3FatherEmitCpnData?.createRules[i]; | |
500 | + } else if (i == 'MAJOR') { | |
501 | + openEditRuleConditObj = props.step3FatherEmitCpnData?.createRules[i]; | |
502 | + } else if (i == 'MINOR') { | |
503 | + openEditRuleConditObj = props.step3FatherEmitCpnData?.createRules[i]; | |
504 | + } else if (i == 'WARNING') { | |
505 | + openEditRuleConditObj = props.step3FatherEmitCpnData?.createRules[i]; | |
506 | + } else if (i == 'INDETERMINATE') { | |
507 | + openEditRuleConditObj = props.step3FatherEmitCpnData?.createRules[i]; | |
508 | + } | |
509 | + } | |
510 | + formatEditAlarmRuleConditions.value = openEditRuleConditObj?.condition?.condition; | |
511 | + formatEditEnableRule.value.push(openEditRuleConditObj?.schedule); | |
512 | + } | |
513 | + formatEditClearAlarmRuleConditions.value = | |
514 | + props.step3FatherEmitCpnData?.clearRule?.condition?.condition; | |
515 | + }); | |
516 | + } | |
517 | + } catch {} | |
518 | + }; | |
519 | + echoStep3DataCpnFunc(); | |
387 | 520 | return { |
388 | 521 | registerForm, |
389 | 522 | registerFormHighSetting, |
... | ... | @@ -419,6 +552,15 @@ |
419 | 552 | getClearAlarmRuleConditionsValFunc, |
420 | 553 | getClearEnableRuleFunc, |
421 | 554 | registerFormChangeClearDetail, |
555 | + clearStep3CpnDataFunc, | |
556 | + echoStep3DataCpnFunc, | |
557 | + formatEditAlarmRuleConditions, | |
558 | + isStep3FatherAddOrEditStatus, | |
559 | + formatAlarmRuleConditionsData, | |
560 | + formatEditClearAlarmRuleConditions, | |
561 | + formatEditEnableRule, | |
562 | + formatEnableRuleData, | |
563 | + formatEditClearEnableRule, | |
422 | 564 | }; |
423 | 565 | }, |
424 | 566 | }); | ... | ... |
... | ... | @@ -70,16 +70,16 @@ |
70 | 70 | }); |
71 | 71 | }; |
72 | 72 | |
73 | - const setFieldsValueFunc = () => { | |
74 | - if (props.alarmSeverityInfo != 1) { | |
75 | - let newArr = Object.keys(props.alarmSeverityInfo); | |
76 | - setTimeout(() => { | |
77 | - newArr.forEach((f) => { | |
78 | - setFieldsValue({ default: f }); | |
79 | - }); | |
80 | - }, 10); | |
81 | - } | |
82 | - }; | |
73 | + // const setFieldsValueFunc = () => { | |
74 | + // if (props.alarmSeverityInfo != 1) { | |
75 | + // let newArr = Object.keys(props.alarmSeverityInfo); | |
76 | + // setTimeout(() => { | |
77 | + // newArr.forEach((f) => { | |
78 | + // setFieldsValue({ default: f }); | |
79 | + // }); | |
80 | + // }, 10); | |
81 | + // } | |
82 | + // }; | |
83 | 83 | // setFieldsValueFunc(); |
84 | 84 | return { |
85 | 85 | resetFieldsFunc, | ... | ... |