Merge pull request #9543 from dataease/pr@dev-v2_bug_fix

fix(嵌入式): 修复嵌入式移动端bug

core/core-frontend/src/views/dashboard/MobileConfigPanel.vue

@@ -46,7 +46,6 @@ const iframeSrc = computed(() => {
     ? `${embeddedStore.baseUrl}mobile.html#/panel`
     : './mobile.html#/panel'
 })
-
 const handleLoad = () => {
   mobileStatusChange(
     'panelInit',
@@ -67,7 +66,19 @@ const componentDataNotInMobile = computed(() => {
   return componentData.value.filter(ele => !ele.inMobile)
 })
 
+const newWindow = ref()
+
 const hanedleMessage = event => {
+  if (event.data?.msgOrigin === 'de-fit2cloud' && !!embeddedStore.token) {
+    const params = {
+      embeddedToken: embeddedStore.token
+    }
+    params['de-embedded'] = true
+    const contentWindow = newWindow.value.contentWindow
+    console.log('call back from dataease!', contentWindow)
+    contentWindow.postMessage(params, '*')
+    return
+  }
   if (event.data.type === 'panelInit') {
     loadCanvasData()
   }
@@ -214,7 +225,7 @@ const save = () => {
         {{ dvInfo.name }}
       </div>
       <div class="config-panel-content" v-loading="mobileLoading">
-        <iframe :src="iframeSrc" frameborder="0" width="375" />
+        <iframe ref="newWindow" :src="iframeSrc" frameborder="0" width="375" />
       </div>
       <div class="config-panel-foot"></div>
     </div>

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

@@ -3,6 +3,7 @@ import { onBeforeMount, ref, onBeforeUnmount } from 'vue'
 import { useEmitt } from '@/hooks/web/useEmitt'
 import eventBus from '@/utils/eventBus'
 import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
+import { XpackComponent } from '@/components/plugin'
 import DePreviewMobile from './MobileInPc.vue'
 const panelInit = ref(false)
 const dvMainStore = dvMainStoreWithOut()
@@ -61,7 +62,7 @@ const hanedleMessage = event => {
   }
 
   if (event.data.type === 'mobileSave') {
-    window.top.postMessage(
+    window.parent.postMessage(
       {
         type: 'mobileSaveFromMobile',
         value: dvMainStore.componentData.reduce((pre, next) => {
@@ -89,8 +90,15 @@ const hanedleMessage = event => {
   }
 }
 
-onBeforeMount(async () => {
+const initIframe = () => {
-  window.top.postMessage({ type: 'panelInit', value: true }, '*')
+  panelInit.value = false
+  setTimeout(() => {
+    panelInit.value = true
+  })
+}
+
+onBeforeMount(() => {
+  window.parent.postMessage({ type: 'panelInit', value: true }, '*')
   window.addEventListener('message', hanedleMessage)
   useEmitt({
     name: 'onMobileStatusChange',
@@ -101,7 +109,7 @@ onBeforeMount(async () => {
 })
 
 const mobileStatusChange = (type, value) => {
-  window.top.postMessage({ type, value }, '*')
+  window.parent.postMessage({ type, value }, '*')
   if (type === 'delFromMobile') {
     eventBus.emit('removeMatrixItemById-canvas-main', value)
   }
@@ -116,6 +124,10 @@ onBeforeUnmount(() => {
   <div class="panel-mobile">
     <de-preview-mobile v-if="panelInit"></de-preview-mobile>
   </div>
+  <XpackComponent
+    @initIframe="initIframe"
+    jsname="L2NvbXBvbmVudC9lbWJlZGRlZC1pZnJhbWUvRW50cmFuY2Vz"
+  />
 </template>
 
 <style lang="less" scoped>