diff --git a/src/api/AlertMock.ts b/src/api/AlertMock.ts index 3823b34..97f24af 100644 --- a/src/api/AlertMock.ts +++ b/src/api/AlertMock.ts @@ -9,9 +9,12 @@ export function mockLocalDemoTestSet( alertType: string, data: { lineId: number; - deviceInfos: { deviceName: string; deviceType: string }[]; - status: string; - groupId?: string; + deviceInfos: { + deviceName: string; + deviceType: string; + status: string; + groupId?: string; + }[][]; } ) { return api.post(`${alertUriBase}/localDemoTest/${alertType}`, data); diff --git a/src/components/alarm/setAlarmText.vue b/src/components/alarm/setAlarmText.vue index d0f3ae6..a55e103 100644 --- a/src/components/alarm/setAlarmText.vue +++ b/src/components/alarm/setAlarmText.vue @@ -26,51 +26,78 @@ :options="optionsAlertType" :rules="[(val) => val.length > 0 || '请选择故障类型!']" /> - - - - - 框选的设备 -
- - {{ item.deviceName }} - -
- -
-
+ + + + + +
+ + {{ item.deviceName }} + +
+
+ + +
+
+
+
+
({ lineId: '', alertType: '', - deviceInfos: [], - status: '', - groupId: '', + groupList: [ + { + groupName: '测试组', + groupId: '', + status: '', + deviceInfos: [], + expanded: false, + }, + ], }); const optionsAlertType = [ '蓝显', @@ -141,7 +183,12 @@ let selectGraphic: JlGraphic[] = []; watch( () => lineStore.selectedGraphics, (val) => { - if (val && val.length > 0 && setAlartTextData.value.alertType) { + if ( + val && + val.length > 0 && + setAlartTextData.value.alertType && + clickIndex !== null + ) { const selectGraphicId = selectGraphic.map((g) => g.id); const appSelectedGraphicsId = lineStore.selectedGraphics?.map( (g) => g.id @@ -176,12 +223,19 @@ watch( } selectGraphic = Array.from(new Set(selectGraphic)); lineStore.getLineApp().updateSelected(...selectGraphic); - setAlartTextData.value.deviceInfos = []; + setAlartTextData.value.groupList[clickIndex].deviceInfos = []; + const status = setAlartTextData.value.groupList[clickIndex].status; + const groupId = + setAlartTextData.value.groupList[clickIndex].groupId || ''; selectGraphic.forEach((g) => { - setAlartTextData.value.deviceInfos.push({ - deviceName: g.code, - deviceType: (DeviceType as never)[g.type + ''], - }); + setAlartTextData.value.groupList[clickIndex as number].deviceInfos.push( + { + deviceName: g.code, + deviceType: (DeviceType as never)[g.type + ''], + status, + groupId, + } + ); }); } } @@ -196,7 +250,6 @@ onMounted(() => { wheelZoom: true, }, }); - clearSelect(); onReset(); setAlartTextData.value.lineId = lineStore.lineId as unknown as string; }); @@ -211,9 +264,9 @@ async function onSubmit() { try { const params = { lineId: +setAlartTextData.value.lineId, - deviceInfos: setAlartTextData.value.deviceInfos, - status: setAlartTextData.value.status, - groupId: setAlartTextData.value.groupId, + deviceInfos: setAlartTextData.value.groupList.map( + (item) => item.deviceInfos + ), }; const alertType = (saveAlertTypeData as never)[ setAlartTextData.value.alertType + '' @@ -237,17 +290,52 @@ async function onSubmit() { }); } -function removeSelect(code: { deviceName: string; deviceType: string }) { - const removeIndex = setAlartTextData.value.deviceInfos.findIndex( - (item) => item == code - ); +let clickIndex: null | number = null; +function toggleItem(index: number) { + const lineApp = lineStore.getLineApp(); + selectGraphic = []; + lineApp.updateSelected(); + if (setAlartTextData.value.groupList[index].expanded == true) { + clickIndex = index; + const select: JlGraphic[] = []; + setAlartTextData.value.groupList[index].deviceInfos.forEach( + (deviceInfo) => { + const g = lineApp.queryStore.queryById(deviceInfo.deviceName); + select.push(g); + } + ); + lineApp.updateSelected(...select); + } else { + clickIndex = null; + } +} + +function removeSelect(removeIndex: number) { + const clickTarget = setAlartTextData.value.groupList[clickIndex as number]; selectGraphic.splice(removeIndex, 1); - setAlartTextData.value.deviceInfos.splice(removeIndex, 1); + clickTarget.deviceInfos.splice(removeIndex, 1); + clickTarget.deviceInfos.splice(removeIndex, 1); lineStore.getLineApp().updateSelected(...selectGraphic); } -function clearSelect() { - setAlartTextData.value.deviceInfos = []; +function clearAllSelect(index: number) { + setAlartTextData.value.groupList[index].deviceInfos = []; + selectGraphic = []; + lineStore.getLineApp().updateSelected(); +} + +function addSelectConfig() { + setAlartTextData.value.groupList.push({ + groupName: '测试组', + groupId: '', + status: '', + deviceInfos: [], + expanded: false, + }); +} + +function deleteSelectConfig(index: number) { + setAlartTextData.value.groupList.splice(index, 1); selectGraphic = []; lineStore.getLineApp().updateSelected(); } @@ -256,9 +344,15 @@ function onReset() { setAlartTextData.value = { lineId: lineStore.lineId as unknown as string, alertType: '', - deviceInfos: [], - status: '', - groupId: '', + groupList: [ + { + groupName: '测试组', + groupId: '', + status: '', + deviceInfos: [], + expanded: false, + }, + ], }; selectGraphic = []; }