继电器图增加Ctrl和alt快捷键

src/components/draw-app/properties/CiCjConfig.vue

@@ -76,6 +76,7 @@ import { QForm, useQuasar } from 'quasar';
 import { JlGraphic } from 'jl-graphic';
 import {
   CiCjConfigCeil,
+  PressKeyForCiCjQd,
   useRelayCabinetStore,
 } from 'src/stores/relayCabinet-store';
 import { Relay } from 'src/graphics/relay/Relay';
@@ -116,17 +117,41 @@ watch(
       selectGraphic.push(...selectFilter);
       selectGraphic = Array.from(new Set(selectGraphic));
       relayCabinetStore.getDrawApp().updateSelected(...selectGraphic);
+      const click = relayCabinetStore.editCiCjConfigIndex as CiCjConfigCeil;
       collectionConfig.value.refRelaysCode = selectGraphic.map((g) => {
-        const click = relayCabinetStore.editCiCjConfigIndex as CiCjConfigCeil;
         const hasChoose = map
           .get(`${click.row}-${click.col}`)
           ?.find((cjDataItem) => cjDataItem.relayId == g.id);
-        const pos = hasChoose?.position || 0;
+        let isPressKeyPos = 0;
+        if (relayCabinetStore.currentPressKey == PressKeyForCiCjQd.alt) {
+          isPressKeyPos = 1;
+        }
+        const pos = hasChoose?.position || isPressKeyPos;
         return { code: (g as Relay).datas.code, pos };
       });
       collectionConfig.value.refRelays = selectGraphic.map(
         (g) => g.id
       ) as number[];
+      if (
+        relayCabinetStore.currentPressKey == PressKeyForCiCjQd.ctrl ||
+        relayCabinetStore.currentPressKey == PressKeyForCiCjQd.alt
+      ) {
+        onSubmit();
+        let nestPos = {
+          row: click.row + 1,
+          col: click.col,
+        };
+        if (click.row + 1 <= CiCjListRows) {
+          relayCabinetStore.editCiCjConfigIndex = nestPos;
+        }
+        if (click.row + 1 > CiCjListRows && click.col < CiCjListCols) {
+          nestPos = {
+            row: 1,
+            col: click.col + 1,
+          };
+          relayCabinetStore.editCiCjConfigIndex = nestPos;
+        }
+      }
     }
   }
 );
@@ -142,9 +167,14 @@ watch(
   }
 );
 
+let CiCjListRows = 0;
+let CiCjListCols = 0;
 onMounted(() => {
   onReset();
   getEditData();
+  const ciCjList = loadCiCjList();
+  CiCjListRows = ciCjList.dsCount;
+  CiCjListCols = ciCjList.cjList.length;
 });
 
 function getEditData() {
@@ -181,39 +211,35 @@ function updateMap(ciCjList: relayCabinetGraphicData.CiCj) {
 }
 
 const myForm = ref<QForm | null>(null);
-async function onSubmit() {
-  myForm.value?.validate().then(async (res) => {
-    if (res) {
-      try {
-        const ciCjList = loadCiCjList();
-        const click = relayCabinetStore.editCiCjConfigIndex as CiCjConfigCeil;
-        ciCjList.cjList[click.col - 1].bitList[click.row - 1].refRelays = [];
-        collectionConfig.value.refRelays.forEach((relayId, index) => {
-          ciCjList.cjList[click.col - 1].bitList[click.row - 1].refRelays.push(
-            new relayCabinetGraphicData.CjDataItem({
-              relayId,
-              position: collectionConfig.value.refRelaysCode[index].pos,
-            })
-          );
-        });
-        relayCabinetStore.updateCiCjList = true;
-        $q.notify({
-          type: 'positive',
-          message: '更新成功',
-        });
-        showCollectionConfig.value = false;
-      } catch (err) {
-        $q.notify({
-          type: 'negative',
-          message: '更新失败',
-        });
-      } finally {
-        setTimeout(() => {
-          showCollectionConfig.value = true;
-        }, 0);
-      }
-    }
-  });
+function onSubmit() {
+  try {
+    const ciCjList = loadCiCjList();
+    const click = relayCabinetStore.editCiCjConfigIndex as CiCjConfigCeil;
+    ciCjList.cjList[click.col - 1].bitList[click.row - 1].refRelays = [];
+    collectionConfig.value.refRelays.forEach((relayId, index) => {
+      ciCjList.cjList[click.col - 1].bitList[click.row - 1].refRelays.push(
+        new relayCabinetGraphicData.CjDataItem({
+          relayId,
+          position: collectionConfig.value.refRelaysCode[index].pos,
+        })
+      );
+    });
+    relayCabinetStore.updateCiCjList = true;
+    $q.notify({
+      type: 'positive',
+      message: '更新成功',
+    });
+    showCollectionConfig.value = false;
+  } catch (err) {
+    $q.notify({
+      type: 'negative',
+      message: '更新失败',
+    });
+  } finally {
+    setTimeout(() => {
+      showCollectionConfig.value = true;
+    }, 0);
+  }
 }
 
 function removeSelect(removeIndex: number) {

src/components/draw-app/properties/CiQdConfig.vue

@@ -67,6 +67,7 @@ import { QForm, useQuasar } from 'quasar';
 import { JlGraphic } from 'jl-graphic';
 import {
   CiCjConfigCeil,
+  PressKeyForCiCjQd,
   useRelayCabinetStore,
 } from 'src/stores/relayCabinet-store';
 import { Relay } from 'src/graphics/relay/Relay';
@@ -108,6 +109,27 @@ watch(
       collectionConfig.value.refRelays = selectGraphic.map(
         (g) => g.id
       ) as number[];
+      if (
+        relayCabinetStore.currentPressKey == PressKeyForCiCjQd.ctrl ||
+        relayCabinetStore.currentPressKey == PressKeyForCiCjQd.alt
+      ) {
+        onSubmit();
+        const click = relayCabinetStore.editCiCjConfigIndex as CiCjConfigCeil;
+        let nestPos = {
+          row: click.row + 1,
+          col: click.col,
+        };
+        if (click.row + 1 <= CiQdListRows) {
+          relayCabinetStore.editCiCjConfigIndex = nestPos;
+        }
+        if (click.row + 1 > CiQdListRows && click.col < CiQdListCols) {
+          nestPos = {
+            row: 1,
+            col: click.col + 1,
+          };
+          relayCabinetStore.editCiCjConfigIndex = nestPos;
+        }
+      }
     }
   }
 );
@@ -122,9 +144,14 @@ watch(
   }
 );
 
+let CiQdListRows = 0;
+let CiQdListCols = 0;
 onMounted(() => {
   onReset();
   getEditData();
+  const ciQdList = loadCiQdList();
+  CiQdListRows = ciQdList.dsCount;
+  CiQdListCols = ciQdList.qdList.length;
 });
 
 function getEditData() {
@@ -147,32 +174,28 @@ function getEditData() {
 }
 
 const myForm = ref<QForm | null>(null);
-async function onSubmit() {
-  myForm.value?.validate().then(async (res) => {
-    if (res) {
-      try {
-        const ciQdList = loadCiQdList();
-        const click = relayCabinetStore.editCiCjConfigIndex as CiCjConfigCeil;
-        ciQdList.qdList[click.col - 1].bitList[click.row - 1].refRelays =
-          collectionConfig.value.refRelays;
-        $q.notify({
-          type: 'positive',
-          message: '更新成功',
-        });
-        showCollectionConfig.value = false;
-        relayCabinetStore.updateCiCjList = true;
-      } catch (err) {
-        $q.notify({
-          type: 'negative',
-          message: '更新失败',
-        });
-      } finally {
-        setTimeout(() => {
-          showCollectionConfig.value = true;
-        }, 0);
-      }
-    }
-  });
+function onSubmit() {
+  try {
+    const ciQdList = loadCiQdList();
+    const click = relayCabinetStore.editCiCjConfigIndex as CiCjConfigCeil;
+    ciQdList.qdList[click.col - 1].bitList[click.row - 1].refRelays =
+      collectionConfig.value.refRelays;
+    $q.notify({
+      type: 'positive',
+      message: '更新成功',
+    });
+    showCollectionConfig.value = false;
+    relayCabinetStore.updateCiCjList = true;
+  } catch (err) {
+    $q.notify({
+      type: 'negative',
+      message: '更新失败',
+    });
+  } finally {
+    setTimeout(() => {
+      showCollectionConfig.value = true;
+    }, 0);
+  }
 }
 
 function removeSelect(removeIndex: number) {

src/drawApp/relayCabinetLayoutApp.ts

@@ -230,39 +230,10 @@ export function saveDrawDatas(app: IDrawApp) {
       );
     }
   });
-  // storage.relayCabinets.forEach((item) => {
-  //   item.common.newId = +item.common.id;
-  // });
-  // storage.relays.forEach((item) => {
-  //   item.common.newId = +item.common.id;
-  // });
-  // storage.phaseFailureProtectors.forEach((item) => {
-  //   item.common.newId = +item.common.id;
-  // });
-  // storage.signalFaultAlarms.forEach((item) => {
-  //   item.common.newId = +item.common.id;
-  // });
   storage.deviceRelateRelayList = refRelaysList;
   storage.UniqueIdPrefix = UniqueIdPrefix;
   storage.ciCjList = ciCjList;
   storage.ciQdList = ciQdList;
-  // storage.deviceRelateRelayList.forEach((item) => {
-  //   item.combinationtypes.forEach((itemB) => {
-  //     itemB.newrefRelays = itemB.refRelays.map((item) => +item);
-  //   });
-  // });
-  // storage.ciCjList?.cjList.forEach((item) => {
-  //   item.bitList.forEach((item) => {
-  //     item.refRelays.forEach((itemB) => {
-  //       itemB.newrelayId = +itemB.relayId;
-  //     });
-  //   });
-  // });
-  // storage.ciQdList?.qdList.forEach((item) => {
-  //   item.bitList.forEach((itemB) => {
-  //     itemB.newrefRelays = itemB.refRelays.map((item) => +item);
-  //   });
-  // });
   const base64 = fromUint8Array(storage.serialize());
   console.log('保存数据', storage);
   return base64;
@@ -615,14 +586,14 @@ export function addQdDataPositionByIndex(row: number, col: number) {
 }
 
 //一维数组变二维数组
-export function convertTo2DArray(
-  sourceArray: any[],
-  rowCount: any,
-  colCount: any
-): any[][] {
-  const result: any[][] = [];
+export function convertTo2DArray<T>(
+  sourceArray: T[],
+  rowCount: number,
+  colCount: number
+): T[][] {
+  const result: T[][] = [];
   for (let i = 0; i < rowCount; i++) {
-    const row: any[] = [];
+    const row: T[] = [];
     for (let j = 0; j < colCount; j++) {
       const index = i * colCount + j;
       row.push(sourceArray[index]);

src/layouts/RelayCabinetLayout/RelayCabinetLayout.vue

@@ -257,7 +257,10 @@ import {
   creatCiQdListByCombinationtype,
 } from 'src/drawApp/relayCabinetLayoutApp';
 import { GraphicIdGenerator, IDrawApp } from 'jl-graphic';
-import { useRelayCabinetStore } from 'src/stores/relayCabinet-store';
+import {
+  PressKeyForCiCjQd,
+  useRelayCabinetStore,
+} from 'src/stores/relayCabinet-store';
 import { onMounted, onUnmounted, reactive, ref, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import { errorNotify, successNotify } from 'src/utils/CommonNotify';
@@ -374,6 +377,8 @@ watch(
 
 onMounted(() => {
   console.log('绘制应用layout mounted');
+  document.addEventListener('keydown', handleKeyDown);
+  document.addEventListener('keyup', handleKeyUp);
   const dom = document.getElementById('draw-app-container');
   if (dom) {
     relayCabinetStore.setDraftId(+route.params.id as number);
@@ -871,7 +876,7 @@ function oneClickGeneraterRelayLayout() {
           }
         });
       }
-       //站台--关联的扣车继电器
+      //站台--关联的扣车继电器
       if (generaterRelayLayout.value.generateIKCJRelay) {
         const deviceCombinationsOfPlatform = combinationsMap.get(
           `${DeviceType.Platform}`
@@ -1203,6 +1208,33 @@ function backConfirm() {
   router.go(-1);
 }
 
+function handleKeyDown(event: KeyboardEvent) {
+  if (event.shiftKey) {
+    if (event.ctrlKey) {
+      relayCabinetStore.currentPressKey = PressKeyForCiCjQd.shiftCtrl;
+      event.preventDefault();
+      PressKeyForCiCjQd;
+    } else if (event.altKey) {
+      relayCabinetStore.currentPressKey = PressKeyForCiCjQd.shiftAlt;
+      event.preventDefault();
+    }
+  } else {
+    if (event.ctrlKey) {
+      relayCabinetStore.currentPressKey = PressKeyForCiCjQd.ctrl;
+      event.preventDefault();
+    } else if (event.altKey) {
+      relayCabinetStore.currentPressKey = PressKeyForCiCjQd.alt;
+      event.preventDefault();
+    }
+  }
+}
+
+function handleKeyUp(event: KeyboardEvent) {
+  if (event.key == 'Control' || event.key == 'Alt' || event.key == 'Shift') {
+    relayCabinetStore.currentPressKey = PressKeyForCiCjQd.null;
+  }
+}
+
 onUnmounted(() => {
   relayCabinetStore.destroy();
   relayCabinetStore.showRelateRelayConfig = false;
@@ -1218,5 +1250,7 @@ onUnmounted(() => {
   if (ciQdListDialogInstance) {
     ciQdListDialogInstance.hide();
   }
+  document.removeEventListener('keydown', handleKeyDown);
+  document.removeEventListener('keyup', handleKeyUp);
 });
 </script>

src/stores/relayCabinet-store.ts

@@ -13,6 +13,14 @@ export interface CiCjConfigCeil {
   col: number;
 }
 
+export enum PressKeyForCiCjQd {
+  null,
+  ctrl,
+  alt,
+  shiftCtrl,
+  shiftAlt,
+}
+
 export const useRelayCabinetStore = defineStore('relayCabinet', {
   state: () => ({
     drawAssistant: null as DrawAssistant | null,
@@ -24,6 +32,7 @@ export const useRelayCabinetStore = defineStore('relayCabinet', {
     editCiCjConfigIndex: null as CiCjConfigCeil | null,
     showCiCjConfig: false,
     showCiQdConfig: false,
+    currentPressKey: PressKeyForCiCjQd.null,
   }),
   getters: {
     drawMode: (state) => state.drawAssistant != null,