From f1cdab14f662554e421279489f1b06380cf567ab Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Mon, 30 Oct 2023 11:02:10 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E9=BC=A0=E6=A0=87?=
 =?UTF-8?q?=E6=BB=9A=E8=BD=AE=E5=BD=B1=E5=93=8D=E5=A4=A7=E5=B1=8F=E7=94=BB?=
 =?UTF-8?q?=E5=B8=83=E6=94=BE=E5=A4=A7=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../data-visualization/ComponentToolBar.vue   | 30 +++++++++++--------
 .../data-visualization/canvas/MarkLine.vue    |  2 +-
 .../src/views/data-visualization/index.vue    |  4 ++-
 3 files changed, 22 insertions(+), 14 deletions(-)

diff --git a/core/core-frontend/src/components/data-visualization/ComponentToolBar.vue b/core/core-frontend/src/components/data-visualization/ComponentToolBar.vue
index 996d42d3bd..59d517ec36 100644
--- a/core/core-frontend/src/components/data-visualization/ComponentToolBar.vue
+++ b/core/core-frontend/src/components/data-visualization/ComponentToolBar.vue
@@ -42,20 +42,26 @@ const reposition = () => {
 let lastWheelNum = 0
 
 const handleMouseWheel = e => {
-  const delta = e.wheelDelta ? e.wheelDelta : -e.detail
-  if (lastWheelNum === 240 && delta === 240) {
-    //放大
-    scaleIncrease(3)
-  } else if (lastWheelNum === -240 && delta === -240) {
-    // 缩小
-    scaleDecrease(3)
-  }
+  let dvMain = document.getElementById('dv-main-center')
+  let dvMainLeftSlide = document.getElementById('dv-main-left-sidebar')
+  let areaLeftWidth = dvMainLeftSlide.clientWidth
+  let areaRight = dvMain.clientWidth + areaLeftWidth
+  if (areaLeftWidth < e.clientX && e.clientX < areaRight) {
+    const delta = e.wheelDelta ? e.wheelDelta : -e.detail
+    if (lastWheelNum === 240 && delta === 240) {
+      //放大
+      scaleIncrease(3)
+    } else if (lastWheelNum === -240 && delta === -240) {
+      // 缩小
+      scaleDecrease(3)
+    }
 
-  if (delta === 240 || delta === -240) {
-    e.stopPropagation()
-    e.preventDefault()
+    if (delta === 240 || delta === -240) {
+      e.stopPropagation()
+      e.preventDefault()
+    }
+    lastWheelNum = delta
   }
-  lastWheelNum = delta
 }
 
 onMounted(() => {
diff --git a/core/core-frontend/src/components/data-visualization/canvas/MarkLine.vue b/core/core-frontend/src/components/data-visualization/canvas/MarkLine.vue
index 105a8f1480..2a87f43790 100644
--- a/core/core-frontend/src/components/data-visualization/canvas/MarkLine.vue
+++ b/core/core-frontend/src/components/data-visualization/canvas/MarkLine.vue
@@ -227,7 +227,7 @@ onMounted(() => {
 })
 </script>
 <template>
-  <div class="mark-line">
+  <div class="mark-line" id="canvas-mark-line">
     <div
       v-for="line in lines"
       v-show="lineStatus[line] || false"
diff --git a/core/core-frontend/src/views/data-visualization/index.vue b/core/core-frontend/src/views/data-visualization/index.vue
index d908c04e90..e022331b18 100644
--- a/core/core-frontend/src/views/data-visualization/index.vue
+++ b/core/core-frontend/src/views/data-visualization/index.vue
@@ -236,14 +236,16 @@ eventBus.on('handleNew', handleNew)
         :aside-position="'left'"
         :side-name="'realTimeComponent'"
         class="left-sidebar"
+        id="dv-main-left-sidebar"
         :class="{ 'preview-aside': previewStatus }"
       >
         <RealTimeComponentList />
       </dv-sidebar>
       <!-- 中间画布 -->
-      <main class="center" ref="canvasCenterRef">
+      <main id="dv-main-center" class="center" ref="canvasCenterRef">
         <el-scrollbar ref="canvasOut" class="content" :class="{ 'preview-content': previewStatus }">
           <div
+            id="canvas-dv-outer"
             ref="canvasInner"
             :style="contentStyle"
             @drop="handleDrop"