From 91a76966156386bdbc1dbffc95770b9568d23cff Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Fri, 9 Apr 2021 18:19:45 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E5=90=88=E5=B9=B6bug=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../canvas/components/Editor/Preview.vue      |  5 +----
 frontend/src/views/panel/edit/index.vue       |  6 +++--
 frontend/src/views/panel/list/PanelList.vue   |  2 --
 .../src/views/panel/list/PanelViewShow.vue    | 22 +++++++++----------
 4 files changed, 15 insertions(+), 20 deletions(-)

diff --git a/frontend/src/components/canvas/components/Editor/Preview.vue b/frontend/src/components/canvas/components/Editor/Preview.vue
index fbf015a06c..eca610433c 100644
--- a/frontend/src/components/canvas/components/Editor/Preview.vue
+++ b/frontend/src/components/canvas/components/Editor/Preview.vue
@@ -67,13 +67,10 @@ export default {
     // 监听div变动事件
     erd.listenTo(document.getElementById('canvasInfo'), element => {
       _this.$nextTick(() => {
+        debugger
         _this.restore()
       })
     })
-    // 监听数据变动事件
-    eventBus.$on('componentDataChange', () => {
-      _this.restore()
-    })
   },
   methods: {
     changeStyleWithScale,
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index d226d1db9c..ec0a689730 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -174,6 +174,7 @@ export default {
       }
     },
     panelInfo(newVal, oldVal) {
+      debugger
       this.init(newVal.id)
     }
   },
@@ -195,6 +196,7 @@ export default {
   },
   methods: {
     init(panelId) {
+      debugger
       // 如果临时画布有数据 则使用临时画布数据（视图编辑的时候 会保存临时画布数据）
       const componentDataTemp = this.$store.state.panel.componentDataTemp
       const canvasStyleDataTemp = this.$store.state.panel.canvasStyleDataTemp
@@ -203,8 +205,8 @@ export default {
         this.$store.commit('setCanvasStyle', JSON.parse(canvasStyleDataTemp))
       } else if (panelId) {
         get('panel/group/findOne/' + panelId).then(response => {
-          this.$store.commit('setComponentData', this.resetID(response.data.panelData))
-          this.$store.commit('setCanvasStyle', response.data.panelStyle)
+          this.$store.commit('setComponentData', this.resetID(JSON.parse(response.data.panelData)))
+          this.$store.commit('setCanvasStyle', JSON.parse(response.data.panelStyle))
         })
       }
     },
diff --git a/frontend/src/views/panel/list/PanelList.vue b/frontend/src/views/panel/list/PanelList.vue
index 1de4be8ed4..2033405310 100644
--- a/frontend/src/views/panel/list/PanelList.vue
+++ b/frontend/src/views/panel/list/PanelList.vue
@@ -424,7 +424,6 @@ export default {
           this.$store.commit('setCanvasStyle', JSON.parse(response.data.panelStyle))
           this.$store.dispatch('panel/setPanelInfo', data)
           this.currGroup = data
-          eventBus.$emit('componentDataChange', '')
         })
       }
       if (node.expanded) {
@@ -517,7 +516,6 @@ export default {
       this.authVisible = false
     },
     edit(data) {
-      // 清空临时画布
       this.$store.dispatch('panel/setPanelInfo', data)
       bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' })
     },
diff --git a/frontend/src/views/panel/list/PanelViewShow.vue b/frontend/src/views/panel/list/PanelViewShow.vue
index d9d78f2dba..3cd1800062 100644
--- a/frontend/src/views/panel/list/PanelViewShow.vue
+++ b/frontend/src/views/panel/list/PanelViewShow.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-row v-if="showMain" style="height: 100%;width: 100%;">
+  <el-row style="height: 100%;width: 100%;">
     <el-col v-if="panelInfo.name.length>0" class="panel-design">
       <el-row class="panel-design-head">
         <!--TODO 仪表盘头部区域-->
@@ -12,7 +12,7 @@
       </el-row>
       <!--TODO 仪表盘预览区域-->
       <el-row class="panel-design-preview">
-        <Preview />
+        <Preview v-if="showMain" />
       </el-row>
     </el-col>
     <el-col v-if="panelInfo.name.length===0" style="height: 100%;">
@@ -25,14 +25,13 @@
 <script>
 import Preview from '@/components/canvas/components/Editor/Preview'
 import { mapState } from 'vuex'
-import eventBus from '@/components/canvas/utils/eventBus'
 
 export default {
   name: 'PanelViewShow',
   components: { Preview },
   data() {
     return {
-      showMain: false
+      showMain: true
 
     }
   },
@@ -45,15 +44,14 @@ export default {
       'canvasStyleData'
     ])
   },
-  mounted() {
-    // 监听数据变动事件 刷新清楚历史样式
-    eventBus.$on('componentDataChange', () => {
-      // 刷新
+  watch: {
+    panelInfo(newVal, oldVla) {
+      // 刷新 进行重新渲染
       this.showMain = false
-      this.$nextTick(() => {
-        this.showMain = true
-      })
-    })
+      this.$nextTick(() => { this.showMain = true })
+    }
+  },
+  mounted() {
   },
   methods: {
     clickPreview() {