fix(移动端): 数据大屏的公共链接通过手机打开会显示“资源不存在或已经被删除” #9971

core/core-frontend/src/permission.ts

@@ -39,6 +39,8 @@ router.beforeEach(async (to, from, next) => {
     loadDone()
     if (to.name === 'link') {
       window.location.href = window.origin + '/mobile.html#' + to.path
+    } else if (to.path === '/dvCanvas') {
+      window.location.href = window.origin + '/mobile.html#' + to.path
     } else if (
       wsCache.get('user.token') ||
       isDesktop ||

core/core-frontend/src/permissionMobile.ts

@@ -17,7 +17,7 @@ const { start, done } = useNProgress()
 const interactiveStore = interactiveStoreWithOut()
 
 const { loadStart, loadDone } = usePageLoading()
-const whiteList = ['/login', '/panel'] // 不重定向白名单
+const whiteList = ['/login', '/panel', '/dvCanvas'] // 不重定向白名单
 
 router.beforeEach(async (to, _, next) => {
   start()

core/core-frontend/src/router/mobile.ts

@@ -51,6 +51,13 @@ export const routes: AppRouteRecordRaw[] = [
     hidden: true,
     meta: {},
     component: () => import('@/views/mobile/panel/Mobile.vue')
+  },
+  {
+    path: '/dvCanvas',
+    name: 'dv',
+    hidden: true,
+    meta: {},
+    component: () => import('@/views/mobile/panel/NotSupport.vue')
   }
 ]
 

core/core-frontend/src/views/mobile/panel/NotSupport.vue

@@ -0,0 +1,14 @@
+<template>
+  <div class="not-support">请注意，数据大屏不支持在移动端查阅！</div>
+</template>
+
+<style lang="less" scoped>
+.not-support {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 16px;
+}
+</style>

core/core-frontend/src/views/share/link/mobile.vue

@@ -1,8 +1,5 @@
 <template>
-  <div
-    :class="curType === 'dashboard' ? 'mobile-link-container' : 'link-container'"
-    v-loading="loading"
-  >
+  <div class="mobile-link-container" v-loading="loading">
     <LinkError v-if="!loading && !linkExist" />
     <Exp v-else-if="!loading && linkExp" />
     <PwdTips v-else-if="!loading && !pwdValid" />
@@ -15,22 +12,16 @@
       :dv-info="state.dvInfo"
       :cur-gap="state.curPreviewGap"
     ></de-preview>
-    <PreviewCanvas
-      v-else-if="curType !== 'dashboard'"
-      :class="{ 'hidden-link': loading }"
-      ref="pcanvas"
-      public-link-status="true"
-    />
   </div>
 </template>
 <script lang="ts" setup>
 import { onMounted, nextTick, ref, reactive } from 'vue'
 import { initCanvasDataMobile } from '@/utils/canvasUtils'
 import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
-import PreviewCanvas from '@/views/data-visualization/PreviewCanvas.vue'
 import DePreview from '@/components/data-visualization/canvas/DePreview.vue'
 import { ProxyInfo, shareProxy } from './ShareProxy'
 import Exp from './exp.vue'
+import router from '@/router/mobile'
 import LinkError from './error.vue'
 import PwdTips from './pwd.vue'
 const linkExist = ref(false)
@@ -83,8 +74,6 @@ const loadCanvasData = (dvId, weight?) => {
 }
 
 const curType = ref('')
-const pcanvas = ref(null)
-
 onMounted(async () => {
   const proxyInfo = (await shareProxy.loadProxy()) as ProxyInfo
   curType.value = proxyInfo.type || 'dashboard'
@@ -102,11 +91,8 @@ onMounted(async () => {
       dvMainStore.setPublicLinkStatus(true)
       loading.value = false
     } else {
-      const method = pcanvas?.value?.loadCanvasDataAsync
-      if (method) {
-        method(proxyInfo.resourceId, proxyInfo.type, null)
-      }
       loading.value = false
+      router.push('/dvCanvas')
     }
   })
 })
@@ -119,15 +105,3 @@ onMounted(async () => {
   position: relative;
 }
 </style>
-<style lang="less" scoped>
-.link-container {
-  position: absolute !important;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-}
-.hidden-link {
-  display: none !important;
-}
-</style>