From c72d4aefb9c1a2b0693307c257af08e9c0759a95 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E5=A6=8D?= <1455167345@qq.com>
Date: Tue, 25 Feb 2025 17:07:16 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E7=BB=84=E5=90=88=E7=9A=84?=
 =?UTF-8?q?=E4=BA=8B=E4=BB=B6=E5=86=85=E5=AE=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/eventHandler.hook.ts                | 16 ++--
 .../components/PreviewRenderGroup/index.vue   | 76 ++++++++-----------
 2 files changed, 41 insertions(+), 51 deletions(-)

diff --git a/src/hooks/eventHandler.hook.ts b/src/hooks/eventHandler.hook.ts
index dd3704f..d7645cf 100644
--- a/src/hooks/eventHandler.hook.ts
+++ b/src/hooks/eventHandler.hook.ts
@@ -9,7 +9,7 @@ const ceshiFunction = mapFun();
 
 // 交互事件
 export const eventHandlerHook = (
-  comonentList: any,
+  componentList: any,
   interactConfigEvents: any,
   type: string,
   params: any = null,
@@ -24,7 +24,7 @@ export const eventHandlerHook = (
       }
     }
   }
-  for (let i = 0; i < comonentList.length; i++) {
+  for (let i = 0; i < componentList.length; i++) {
     for (let j = 0; j < elementList.length; j++) {
       if (elementList[j].movement == 'newaddress') {
         // 打开新页面
@@ -63,8 +63,8 @@ export const eventHandlerHook = (
       } else if (elementList[j].movement == 'reveal') {
         // 显示
         for (let k = 0; k < elementList[j].elementId.length; k++) {
-          if (comonentList[i].id == elementList[j].elementId[k]) {
-            obj = comonentList[i];
+          if (componentList[i].id == elementList[j].elementId[k]) {
+            obj = componentList[i];
             index = i;
             obj.status.hide = false;
             chartEditStore.updateComponentList(index, obj);
@@ -73,8 +73,8 @@ export const eventHandlerHook = (
       } else if (elementList[j].movement == 'hidden') {
         // 隐藏
         for (let k = 0; k < elementList[j].elementId.length; k++) {
-          if (comonentList[i].id == elementList[j].elementId[k]) {
-            obj = comonentList[i];
+          if (componentList[i].id == elementList[j].elementId[k]) {
+            obj = componentList[i];
             index = i;
             obj.status.hide = true;
             chartEditStore.updateComponentList(index, obj);
@@ -83,7 +83,7 @@ export const eventHandlerHook = (
       } else if (elementList[j].movement == 'map') {
         // 地图事件联动
         for (let k = 0; k < elementList[j].elementId.length; k++) {
-          if (comonentList[i].id == elementList[j].elementId[k]) {
+          if (componentList[i].id == elementList[j].elementId[k]) {
             if (params) {
               ceshiFunction[elementList[j].funName](params);
             } else {
@@ -94,7 +94,7 @@ export const eventHandlerHook = (
       } else if (elementList[j].movement == 'communication') {
         // 组件通信
         for (let k = 0; k < elementList[j].elementId.length; k++) {
-          if (comonentList[i].id == elementList[j].elementId[k]) {
+          if (componentList[i].id == elementList[j].elementId[k]) {
             EventBus.emit(elementList[j].elementId[k] + type, params);
           }
         }
diff --git a/src/views/preview/components/PreviewRenderGroup/index.vue b/src/views/preview/components/PreviewRenderGroup/index.vue
index f382480..ed05bca 100644
--- a/src/views/preview/components/PreviewRenderGroup/index.vue
+++ b/src/views/preview/components/PreviewRenderGroup/index.vue
@@ -73,56 +73,46 @@
       required: true,
     },
   });
-  // 单击交互
-  const clickElementItem = ref([]);
-  // 双击交互
-  const dbclickElementItem = ref([]);
-  // 右击交互
-  const rightclickElementItem = ref([]);
-  // 鼠标移入交互
-  const mouseenterElementItem = ref([]);
-  // 鼠标移出交互
-  const mouseleaveElementItem = ref([]);
 
-  const list = props.groupData.events.interactConfigEvents;
-  for (let i = 0; i < list.length; i++) {
-    if (list[i].type == 'click') {
-      for (let j = 0; j < list[i].movementList.length; j++) {
-        clickElementItem.value.push(list[i].movementList[j]);
-      }
-    } else if (list[i].type == 'dblclick') {
-      for (let j = 0; j < list[i].movementList.length; j++) {
-        dbclickElementItem.value.push(list[i].movementList[j]);
-      }
-    } else if (list[i].type == 'rightclick') {
-      for (let j = 0; j < list[i].movementList.length; j++) {
-        rightclickElementItem.value.push(list[i].movementList[j]);
-      }
-    } else if (list[i].type == 'mousein') {
-      for (let j = 0; j < list[i].movementList.length; j++) {
-        mouseenterElementItem.value.push(list[i].movementList[j]);
-      }
-    } else if (list[i].type == 'mouseout') {
-      for (let j = 0; j < list[i].movementList.length; j++) {
-        mouseleaveElementItem.value.push(list[i].movementList[j]);
-      }
-    }
-  }
-  const clickBtn = () => {
-    eventHandlerHook(chartEditStore.getComponentList, clickElementItem.value);
+  const clickBtn = (val) => {
+    eventHandlerHook(
+      chartEditStore.getComponentList,
+      props.groupData.events.interactConfigEvents,
+      'click',
+      val,
+    );
   };
-  const dblclickBtn = () => {
-    eventHandlerHook(chartEditStore.getComponentList, dbclickElementItem.value);
+  const dblclickBtn = (val) => {
+    eventHandlerHook(
+      chartEditStore.getComponentList,
+      props.groupData.events.interactConfigEvents,
+      'dblclick',
+      val,
+    );
   };
   const rightclickBtn = (event) => {
     event.preventDefault(); // 阻止默认的右键菜单
-    eventHandlerHook(chartEditStore.getComponentList, rightclickElementItem.value);
+    eventHandlerHook(
+      chartEditStore.getComponentList,
+      props.groupData.events.interactConfigEvents,
+      'rightclick',
+    );
   };
-  const mouseenterBtn = () => {
-    eventHandlerHook(chartEditStore.getComponentList, mouseenterElementItem.value);
+  const mouseenterBtn = (val) => {
+    eventHandlerHook(
+      chartEditStore.getComponentList,
+      props.groupData.events.interactConfigEvents,
+      'mousein',
+      val,
+    );
   };
-  const mouseleaveBtn = () => {
-    eventHandlerHook(chartEditStore.getComponentList, mouseleaveElementItem.value);
+  const mouseleaveBtn = (val) => {
+    eventHandlerHook(
+      chartEditStore.getComponentList,
+      props.groupData.events.interactConfigEvents,
+      'mouseout',
+      val,
+    );
   };
 </script>