Merge pull request #8861 from dataease/pr@dev-v2@fix_iframe_embedded_dataset

fix: iframe嵌入式无法从仪表板编辑页面打开数据集

core/core-frontend/src/permission.ts

@@ -23,7 +23,7 @@ const { start, done } = useNProgress()
 const { loadStart, loadDone } = usePageLoading()
 
 const whiteList = ['/login', '/de-link', '/chart-view'] // 不重定向白名单
-const embeddedWindowWhiteList = ['/dvCanvas', '/dashboard', '/preview']
+const embeddedWindowWhiteList = ['/dvCanvas', '/dashboard', '/preview', '/dataset-embedded-form']
 const embeddedRouteWhiteList = ['/dataset-embedded', '/dataset-form', '/dataset-embedded-form']
 router.beforeEach(async (to, from, next) => {
   start()

core/core-frontend/src/views/chart/components/editor/dataset-select/DatasetSelect.vue

@@ -5,12 +5,9 @@ import { Plus, Search } from '@element-plus/icons-vue'
 import { useI18n } from '@/hooks/web/useI18n'
 import { useAppStoreWithOut } from '@/store/modules/app'
 import _ from 'lodash'
-import { useRouter } from 'vue-router'
 import { getDatasetTree } from '@/api/dataset'
 import { ElFormItem, FormInstance } from 'element-plus-secondary'
 
-const { resolve } = useRouter()
-
 const props = withDefaults(
   defineProps<{
     themes?: EditorTheme
@@ -44,7 +41,12 @@ const initDataset = () => {
     })
 }
 
-const emits = defineEmits(['update:modelValue', 'update:stateObj', 'onDatasetChange'])
+const emits = defineEmits([
+  'update:modelValue',
+  'update:stateObj',
+  'onDatasetChange',
+  'addDsWindow'
+])
 
 const _modelValue = computed({
   get() {
@@ -151,8 +153,7 @@ const refresh = () => {
   initDataset()
 }
 const addDataset = () => {
-  const { href } = resolve('/dataset-form')
-  window.open(href, '_blank')
+  emits('addDsWindow')
 }
 
 const datasetSelectorPopover = ref()

core/core-frontend/src/views/chart/components/editor/index.vue

@@ -51,7 +51,9 @@ import { useDraggable } from '@vueuse/core'
 import { set, concat, keys } from 'lodash-es'
 import { Field, getFieldByDQ } from '@/api/chart'
 import ChartTemplateInfo from '@/views/chart/components/editor/common/ChartTemplateInfo.vue'
-
+import { XpackComponent } from '@/components/plugin'
+import { useEmbedded } from '@/store/modules/embedded'
+const embeddedStore = useEmbedded()
 const snapshotStore = snapshotStoreWithOut()
 const dvMainStore = dvMainStoreWithOut()
 const { canvasCollapse, curComponent, componentData, editMode } = storeToRefs(dvMainStore)
@@ -977,15 +979,34 @@ const saveResultFilter = () => {
 const collapseChange = type => {
   canvasCollapse.value[type] = !canvasCollapse.value[type]
 }
-
+const openHandler = ref(null)
+const initOpenHandler = newWindow => {
+  if (openHandler?.value) {
+    const pm = {
+      methodName: 'initOpenHandler',
+      args: newWindow
+    }
+    openHandler.value.invokeMethod(pm)
+  }
+}
+const addDsWindow = () => {
+  const path =
+    embeddedStore.getToken && appStore.getIsIframe ? 'dataset-embedded-form' : '/dataset-form'
+  let routeData = router.resolve(path)
+  const newWindow = window.open(routeData.href, '_blank')
+  initOpenHandler(newWindow)
+}
 const editDs = () => {
+  const path =
+    embeddedStore.getToken && appStore.getIsIframe ? 'dataset-embedded-form' : '/dataset-form'
   let routeData = router.resolve({
-    path: '/dataset-form',
+    path: path,
     query: {
       id: view.value.tableId
     }
   })
-  window.open(routeData.href, '_blank')
+  const newWindow = window.open(routeData.href, '_blank')
+  initOpenHandler(newWindow)
 }
 
 const showQuotaEditCompare = item => {
@@ -1846,6 +1867,7 @@ const onRefreshChange = val => {
                 :state-obj="state"
                 v-model="view.tableId"
                 :themes="themes"
+                @add-ds-window="addDsWindow"
                 @onDatasetChange="recordSnapshotInfo('calcData')"
               />
               <el-tooltip :effect="toolTip" content="编辑数据集" placement="top">
@@ -2211,6 +2233,7 @@ const onRefreshChange = val => {
       </template>
     </el-dialog>
   </div>
+  <XpackComponent ref="openHandler" jsname="L2NvbXBvbmVudC9lbWJlZGRlZC1pZnJhbWUvT3BlbkhhbmRsZXI=" />
 </template>
 
 <style lang="less" scoped>

core/core-frontend/src/views/visualized/data/dataset/form/index.vue

@@ -39,7 +39,7 @@ import {
 import type { Table } from '@/api/dataset'
 import DatasetUnion from './DatasetUnion.vue'
 import { cloneDeep, debounce } from 'lodash-es'
-
+import { XpackComponent } from '@/components/plugin'
 interface DragEvent extends MouseEvent {
   dataTransfer: DataTransfer
 }
@@ -573,8 +573,10 @@ const getTableName = async (datasourceId, tableName) => {
     searchTable.value = tableName
   }
 }
-
-const initEdite = () => {
+let p = null
+const XpackLoaded = () => p(true)
+const initEdite = async () => {
+  await new Promise(r => (p = r))
   const { id, datasourceId, tableName } = route.query
   const { id: copyId } = route.params
   if (datasourceId) {
@@ -1896,6 +1898,11 @@ const getDsIconName = data => {
       </el-button>
     </template>
   </el-dialog>
+  <XpackComponent
+    jsname="L2NvbXBvbmVudC9lbWJlZGRlZC1pZnJhbWUvTmV3V2luZG93SGFuZGxlcg=="
+    @loaded="XpackLoaded"
+    @load-fail="XpackLoaded"
+  />
 </template>
 
 <style lang="less" scoped>

de-xpack

@@ -1 +1 @@
-Subproject commit fac43165280525519002d8aed6882ce691169280
+Subproject commit c2a9c373068f756bd0f19ba5ec1a8b56372062dc