From 530c8e808a4faba10575cd921cd85154d859d19a Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Thu, 9 Dec 2021 14:57:58 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E7=A7=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=AB=AF=E4=BB=AA=E8=A1=A8=E6=9D=BF=E9=A2=84=E8=A7=88=E5=85=A5?=
 =?UTF-8?q?=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../canvas/mobile/PreviewMobile.vue           | 93 +++++++++++++++++++
 1 file changed, 93 insertions(+)
 create mode 100644 frontend/src/components/canvas/mobile/PreviewMobile.vue

diff --git a/frontend/src/components/canvas/mobile/PreviewMobile.vue b/frontend/src/components/canvas/mobile/PreviewMobile.vue
new file mode 100644
index 0000000000..04805e2d47
--- /dev/null
+++ b/frontend/src/components/canvas/mobile/PreviewMobile.vue
@@ -0,0 +1,93 @@
+<template>
+  <div v-loading="dataLoading" class="bg">
+    <Preview v-if="!dataLoading" />
+  </div>
+</template>
+<script>
+import Preview from './Preview'
+import { uuid } from 'vue-uuid'
+import { findOne } from '@/api/panel/panel'
+import { getPanelAllLinkageInfo } from '@/api/panel/linkage'
+import { queryPanelJumpInfo, queryTargetPanelJumpInfo } from '@/api/panel/linkJump'
+
+export default {
+  components: { Preview },
+  props: {
+    panelId: {
+      type: String,
+      require: true
+    }
+  },
+  data() {
+    return {
+      dataLoading: false
+    }
+  },
+  mounted() {
+    this.restore()
+  },
+  methods: {
+    restore() {
+      this.dataLoading = true
+      // 加载视图数据
+      findOne(this.panelId).then(response => {
+        this.dataLoading = false
+        this.$store.commit('setComponentData', this.resetID(JSON.parse(response.data.panelData)))
+        this.$store.commit('setCanvasStyle', JSON.parse(response.data.panelStyle))
+        const data = {
+          id: response.data.id,
+          name: response.data.name
+        }
+        // 刷新联动信息
+        getPanelAllLinkageInfo(this.panelId).then(rsp => {
+          this.$store.commit('setNowPanelTrackInfo', rsp.data)
+        })
+        // 刷新跳转信息
+        queryPanelJumpInfo(this.panelId).then(rsp => {
+          this.$store.commit('setNowPanelJumpInfo', rsp.data)
+        })
+
+        // 如果含有跳转参数 进行触发
+        const tempParam = localStorage.getItem('jumpInfoParam')
+        if (tempParam) {
+          localStorage.removeItem('jumpInfoParam')
+          const jumpParam = JSON.parse(tempParam)
+          const jumpRequestParam = {
+            sourcePanelId: jumpParam.sourcePanelId,
+            sourceViewId: jumpParam.sourceViewId,
+            sourceFieldId: jumpParam.sourceFieldId,
+            targetPanelId: this.panelId
+          }
+          this.dataLoading = true
+          // 刷新跳转目标仪表板联动信息
+          queryTargetPanelJumpInfo(jumpRequestParam).then(rsp => {
+            this.dataLoading = false
+            this.$store.commit('setNowTargetPanelJumpInfo', rsp.data)
+            this.$store.commit('addViewTrackFilter', jumpParam)
+          })
+        }
+        this.$store.dispatch('panel/setPanelInfo', data)
+      })
+    },
+    resetID(data) {
+      if (data) {
+        data.forEach(item => {
+          item.type !== 'custom' && (item.id = uuid.v1())
+        })
+      }
+      return data
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .bg {
+    width: 100%;
+    height: 100vh!important;
+    min-width: 800px;
+    min-height: 600px;
+    background-color: #f7f8fa;
+  }
+</style>
+