From 701da4829c56925b9135f6355212d247374ac36e Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Wed, 15 Jun 2022 10:04:28 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20pdf=E5=AF=BC=E5=87=BA=E6=88=AA=E5=B1=8F?=
 =?UTF-8?q?=E4=B8=8D=E5=85=A8=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../canvas/components/Editor/Preview.vue      | 63 +++++++++++--------
 1 file changed, 36 insertions(+), 27 deletions(-)

diff --git a/frontend/src/components/canvas/components/Editor/Preview.vue b/frontend/src/components/canvas/components/Editor/Preview.vue
index aeb4046729..c24992499d 100644
--- a/frontend/src/components/canvas/components/Editor/Preview.vue
+++ b/frontend/src/components/canvas/components/Editor/Preview.vue
@@ -82,6 +82,8 @@ import UserViewMobileDialog from '@/components/canvas/custom-component/UserViewM
 import bus from '@/utils/bus'
 import { buildFilterMap } from '@/utils/conditionUtil'
 import { hasDataPermission } from '@/utils/permission'
+const erd = elementResizeDetectorMaker()
+
 export default {
   components: { UserViewMobileDialog, ComponentWrapper, UserViewDialog, CanvasOptBar },
   model: {
@@ -273,37 +275,17 @@ export default {
   },
   mounted() {
     this._isMobile()
-    const _this = this
-    const erd = elementResizeDetectorMaker()
-    const canvasMain = document.getElementById('canvasInfoMain')
-    // 监听主div变动事件
-    if (canvasMain) {
-      erd.listenTo(canvasMain, element => {
-        _this.$nextTick(() => {
-          _this.restore()
-        })
-      })
-    }
-    // 监听画布div变动事件
-    const tempCanvas = document.getElementById('canvasInfoTemp')
-    if (tempCanvas) {
-      erd.listenTo(document.getElementById('canvasInfoTemp'), element => {
-        _this.$nextTick(() => {
-          // 将mainHeight 修改为px 临时解决html2canvas 截图不全的问题
-          _this.mainHeight = tempCanvas.scrollHeight + 'px!important'
-          this.$emit('mainHeightChange', _this.mainHeight)
-        })
-      })
-    }
-    eventBus.$on('openChartDetailsDialog', this.openChartDetailsDialog)
-    _this.$store.commit('clearLinkageSettingInfo', false)
-    _this.canvasStyleDataInit()
+    this.initListen()
+    this.$store.commit('clearLinkageSettingInfo', false)
+    this.canvasStyleDataInit()
     // 如果当前终端设备是移动端，则进行移动端的布局设计
-    if (_this.terminal === 'mobile') {
-      _this.initMobileCanvas()
+    if (this.terminal === 'mobile') {
+      this.initMobileCanvas()
     }
   },
   beforeDestroy() {
+    erd.uninstall(this.$refs.canvasInfoTemp)
+    erd.uninstall(this.$refs.canvasInfoMain)
     clearInterval(this.timer)
   },
   methods: {
@@ -404,6 +386,33 @@ export default {
     },
     canvasScroll() {
       bus.$emit('onScroll')
+    },
+    initListen() {
+      const _this = this
+      const canvasMain = document.getElementById('canvasInfoMain')
+      // 监听主div变动事件
+      if (canvasMain) {
+        erd.listenTo(canvasMain, element => {
+          _this.$nextTick(() => {
+            _this.restore()
+          })
+        })
+      }
+      setTimeout(() => {
+        // 监听画布div变动事件
+        const tempCanvas = document.getElementById('canvasInfoTemp')
+        if (tempCanvas) {
+          erd.listenTo(document.getElementById('canvasInfoTemp'), element => {
+            _this.$nextTick(() => {
+              // 将mainHeight 修改为px 临时解决html2canvas 截图不全的问题
+              _this.mainHeight = tempCanvas.scrollHeight + 'px!important'
+              this.$emit('mainHeightChange', _this.mainHeight)
+            })
+          })
+        }
+      }, 1500)
+
+      eventBus.$on('openChartDetailsDialog', this.openChartDetailsDialog)
     }
   }
 }