From 7960180858629a7b67f8f3894e211059b4029e2d Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Tue, 3 Aug 2021 11:31:17 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E9=A2=84=E8=A7=88=E7=95=8C=E9=9D=A2?=
 =?UTF-8?q?=E7=82=B9=E5=87=BB=E7=BB=84=E4=BB=B6=E6=98=BE=E7=A4=BA=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=E5=85=A5=E5=8F=A3=EF=BC=8C=E7=82=B9=E5=87=BB=E7=A9=BA?=
 =?UTF-8?q?=E7=99=BD=E4=B9=9F=E5=8F=96=E6=B6=88=E8=AE=BE=E7=BD=AE=E5=85=A5?=
 =?UTF-8?q?=E5=8F=A3=EF=BC=9B=E5=8E=BB=E6=8E=89=E5=8E=9F=E6=9C=89=E9=BC=A0?=
 =?UTF-8?q?=E6=A0=87=E7=A7=BB=E5=85=A5=E6=98=BE=E7=A4=BA=E7=9A=84=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Editor/ComponentWrapper.vue    | 20 +++++++++++++++++--
 .../canvas/components/Editor/Preview.vue      | 15 +++++++++++++-
 2 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue
index fd39afd240..43f1fcfda7 100644
--- a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue
+++ b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue
@@ -4,7 +4,9 @@
     :class="{'gap_class':canvasStyleData.panel.gap==='yes'}"
     class="component"
     @click="handleClick"
+    @mousedown="elementMouseDown"
   >
+    <edit-bar v-if="config === curComponent" />
     <de-out-widget
       v-if="config.type==='custom'"
       :id="'component' + config.id"
@@ -33,8 +35,10 @@ import runAnimation from '@/components/canvas/utils/runAnimation'
 import { mixins } from '@/components/canvas/utils/events'
 import { mapState } from 'vuex'
 import DeOutWidget from '@/components/dataease/DeOutWidget'
+import EditBar from '@/components/canvas/components/Editor/EditBar'
+
 export default {
-  components: { DeOutWidget },
+  components: { DeOutWidget, EditBar },
   mixins: [mixins],
   props: {
     config: {
@@ -60,7 +64,8 @@ export default {
   },
   computed: {
     ...mapState([
-      'canvasStyleData'
+      'canvasStyleData',
+      'curComponent'
     ])
   },
   mounted() {
@@ -94,6 +99,17 @@ export default {
       Object.keys(events).forEach(event => {
         this[event](events[event])
       })
+    },
+    elementMouseDown(e) {
+      debugger
+      // private 设置当前组件数据及状态
+      this.$store.commit('setClickComponentStatus', true)
+      if (this.config.component !== 'v-text' && this.config.component !== 'rect-shape' && this.config.component !== 'de-input-search' && this.config.component !== 'de-number-range') {
+        e.preventDefault()
+      }
+      // 阻止冒泡事件
+      e.stopPropagation()
+      this.$store.commit('setCurComponent', { component: this.config, index: this.index })
     }
   }
 }
diff --git a/frontend/src/components/canvas/components/Editor/Preview.vue b/frontend/src/components/canvas/components/Editor/Preview.vue
index 5b8fcbd1c9..9b6728fbf5 100644
--- a/frontend/src/components/canvas/components/Editor/Preview.vue
+++ b/frontend/src/components/canvas/components/Editor/Preview.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="canvasInfoTemp" :style="customStyle" class="bg">
+  <div id="canvasInfoTemp" :style="customStyle" class="bg" @mouseup="deselectCurComponent" @mousedown="handleMouseDown">
     <el-row v-if="componentDataShow.length===0" style="height: 100%;" class="custom-position">
       {{ $t('panel.panelNull') }}
     </el-row>
@@ -121,6 +121,8 @@ export default {
       return this.componentDataShow
     },
     ...mapState([
+      'isClickComponent',
+      'curComponent',
       'componentData',
       'canvasStyleData'
     ])
@@ -204,6 +206,17 @@ export default {
     },
     exportExcel() {
       this.$refs['userViewDialog'].exportExcel()
+    },
+    deselectCurComponent(e) {
+      debugger
+      if (!this.isClickComponent) {
+        this.$store.commit('setCurComponent', { component: null, index: null })
+      }
+    },
+    handleMouseDown() {
+      // console.log('handleMouseDown123')
+
+      this.$store.commit('setClickComponentStatus', false)
     }
   }
 }