From 20dc9716f6b987cb420dce25fc9fbfc90735d6dd Mon Sep 17 00:00:00 2001 From: wangjiahao <1522128093@qq.com> Date: Wed, 22 May 2024 14:46:35 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E4=BB=AA=E8=A1=A8=E6=9D=BF):=20=E4=BB=AA?= =?UTF-8?q?=E8=A1=A8=E6=9D=BF=E6=95=B0=E6=8D=AE=E5=A4=A7=E5=B1=8F=E6=94=AF?= =?UTF-8?q?=E6=8C=81div=E5=B5=8C=E5=85=A5=E5=A4=96=E9=83=A8=E4=BC=A0?= =?UTF-8?q?=E5=8F=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../data-visualization/canvas/DePreview.vue | 15 +++++++ .../src/pages/panel/DashboardPreview.vue | 27 ++++++++++++ core/core-frontend/src/pages/panel/main.ts | 7 ++++ .../src/store/modules/embedded.ts | 10 +++++ .../data-visualization/PreviewCanvas.vue | 42 +------------------ 5 files changed, 60 insertions(+), 41 deletions(-) diff --git a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue index 67dc784914..62c0d551f2 100644 --- a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue +++ b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue @@ -236,6 +236,19 @@ const initWatermark = (waterDomId = 'preview-canvas-main') => { } } +// 目标校验： 需要校验targetDvId 是否是当前可视化资源ID +const winMsgHandle = event => { + console.info('PostMessage Params Received') + const msgInfo = event.data + // 校验targetDvId + if (msgInfo && msgInfo.type === 'attachParams' && msgInfo.targetDvId === dvInfo.value.id + '') { + const attachParam = msgInfo.params + if (attachParam) { + dvMainStore.addOuterParamsFilter(attachParam, 'outer') + } + } +} + onMounted(() => { initRefreshTimer() resetLayout() @@ -245,10 +258,12 @@ onMounted(() => { restore() initWatermark() }) + window.addEventListener('message', winMsgHandle) }) onBeforeUnmount(() => { clearInterval(refreshTimer.value) + window.removeEventListener('message', winMsgHandle) }) const userViewEnlargeOpen = (opt, item) => { diff --git a/core/core-frontend/src/pages/panel/DashboardPreview.vue b/core/core-frontend/src/pages/panel/DashboardPreview.vue index e3e641e8f7..b1353682cf 100644 --- a/core/core-frontend/src/pages/panel/DashboardPreview.vue +++ b/core/core-frontend/src/pages/panel/DashboardPreview.vue @@ -5,10 +5,15 @@ import { interactiveStoreWithOut } from '@/store/modules/interactive' import { useEmbedded } from '@/store/modules/embedded' import { check } from '@/utils/CrossPermission' import { useCache } from '@/hooks/web/useCache' +import { getOuterParamsInfo } from '@/api/visualization/outerParams' +import { ElMessage } from 'element-plus-secondary' +import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain' +import { useI18n } from '@/hooks/web/useI18n' const { wsCache } = useCache() const interactiveStore = interactiveStoreWithOut() const embeddedStore = useEmbedded() const dashboardPreview = ref(null) +const { t } = useI18n() const state = reactive({ canvasDataPreview: null, canvasStylePreview: null, @@ -16,6 +21,8 @@ const state = reactive({ dvInfo: null, curPreviewGap: 0 }) +const dvMainStore = dvMainStoreWithOut() + const checkPer = async resourceId => { if (!window.DataEaseBi || !resourceId) { return true @@ -30,6 +37,23 @@ onBeforeMount(async () => { if (!checkResult) { return } + + // 添加外部参数 + let attachParam + await getOuterParamsInfo(embeddedStore.dvId).then(rsp => { + dvMainStore.setNowPanelOuterParamsInfo(rsp.data) + }) + + // div嵌入 + if (embeddedStore.outerParams) { + try { + attachParam = JSON.parse(embeddedStore.outerParams) + } catch (e) { + console.error(e) + ElMessage.error(t('visualization.outer_param_decode_error')) + } + } + initCanvasData( embeddedStore.dvId, embeddedStore.busiFlag, @@ -48,6 +72,9 @@ onBeforeMount(async () => { nextTick(() => { dashboardPreview.value.restore() }) + if (attachParam) { + dvMainStore.addOuterParamsFilter(attachParam) + } } ) }) diff --git a/core/core-frontend/src/pages/panel/main.ts b/core/core-frontend/src/pages/panel/main.ts index 35f561db53..7023518fbf 100644 --- a/core/core-frontend/src/pages/panel/main.ts +++ b/core/core-frontend/src/pages/panel/main.ts @@ -70,6 +70,7 @@ const setupAll = async ( dom: string, type: string, busiFlag: string, + outerParams: string, token: string, baseUrl: string, dvId: string, @@ -86,6 +87,7 @@ const setupAll = async ( const embeddedStore = useEmbedded() embeddedStore.setType(type) embeddedStore.setBusiFlag(busiFlag) + embeddedStore.setOuterParams(outerParams) embeddedStore.setToken(token) embeddedStore.setBaseUrl(baseUrl) embeddedStore.setDvId(dvId) @@ -129,6 +131,7 @@ class DataEaseBi { | 'DashboardPanel' dvId: string busiFlag: 'dashboard' | 'dataV' + outerParams: string resourceId: string pid: string chartId: string @@ -139,6 +142,7 @@ class DataEaseBi { this.type = type this.token = options.token this.busiFlag = options.busiFlag + this.outerParams = options.outerParams this.baseUrl = options.baseUrl this.dvId = options.dvId this.pid = options.pid @@ -152,6 +156,7 @@ class DataEaseBi { this.deOptions.container, this.type, this.busiFlag, + this.outerParams, this.token, this.baseUrl, this.dvId, @@ -169,6 +174,7 @@ class DataEaseBi { const embeddedStore = useEmbedded() embeddedStore.setType(null) embeddedStore.setBusiFlag(null) + embeddedStore.setOuterParams(null) embeddedStore.setToken(null) embeddedStore.setBaseUrl(null) embeddedStore.setDvId(null) @@ -179,6 +185,7 @@ class DataEaseBi { this.type = null this.token = null this.busiFlag = null + this.outerParams = null this.baseUrl = null this.dvId = null this.pid = null diff --git a/core/core-frontend/src/store/modules/embedded.ts b/core/core-frontend/src/store/modules/embedded.ts index c7050d3b83..1826cdc687 100644 --- a/core/core-frontend/src/store/modules/embedded.ts +++ b/core/core-frontend/src/store/modules/embedded.ts @@ -4,6 +4,7 @@ interface AppState { type: string token: string busiFlag: string + outerParams: string baseUrl: string dvId: string pid: string @@ -17,6 +18,7 @@ export const userStore = defineStore('embedded', { type: '', token: '', busiFlag: '', + outerParams: '', baseUrl: '', dvId: '', pid: '', @@ -34,6 +36,9 @@ export const userStore = defineStore('embedded', { getBusiFlag(): string { return this.busiFlag }, + getOuterParams(): string { + return this.outerParams + }, getBaseUrl(): string { return this.baseUrl }, @@ -53,6 +58,7 @@ export const userStore = defineStore('embedded', { return { embeddedToken: this.token, busiFlag: this.busiFlag, + outerParams: this.outerParams, type: this.type, dvId: this.dvId, chartId: this.chartId, @@ -71,6 +77,9 @@ export const userStore = defineStore('embedded', { setBusiFlag(busiFlag: string) { this.busiFlag = busiFlag }, + setOuterParams(outerParams: string) { + this.outerParams = outerParams + }, setBaseUrl(baseUrl: string) { this.baseUrl = baseUrl }, @@ -90,6 +99,7 @@ export const userStore = defineStore('embedded', { this.type = data['type'] this.token = data['embeddedToken'] this.busiFlag = data['busiFlag'] + this.outerParams = data['outerParams'] this.dvId = data['dvId'] this.chartId = data['chartId'] this.pid = data['pid'] diff --git a/core/core-frontend/src/views/data-visualization/PreviewCanvas.vue b/core/core-frontend/src/views/data-visualization/PreviewCanvas.vue index 7bc91bcc59..6f74804593 100644 --- a/core/core-frontend/src/views/data-visualization/PreviewCanvas.vue +++ b/core/core-frontend/src/views/data-visualization/PreviewCanvas.vue @@ -1,6 +1,6 @@