refactor(仪表板): 优化嵌入式iframe传参，增加仪表板ID校验等

core/core-frontend/src/custom-component/de-frame/ComponentFrame.vue

@@ -3,7 +3,7 @@
     <div v-if="element.frameLinks.src" class="main-frame">
       <iframe
         v-if="state.frameShow"
-        id="iframe"
+        :id="'iframe-' + element.id"
         :src="element.frameLinks.src"
         scrolling="auto"
         frameborder="0"

core/core-frontend/src/store/modules/data-visualization/dvMain.ts

@@ -850,10 +850,11 @@ export const dvMainStore = defineStore('dataVisualization', {
       })
     },
     // 添加外部参数的过滤条件
-    addOuterParamsFilter(params) {
+    addOuterParamsFilter(params, source = 'inner') {
       // params 结构 {key1:value1,key2:value2}
       const curComponentData = this.componentData
       if (params) {
+        const preActiveComponentIds = []
         const trackInfo = this.nowPanelOuterParamsInfo
         for (let index = 0; index < curComponentData.length; index++) {
           const element = curComponentData[index]
@@ -906,6 +907,7 @@ export const dvMainStore = defineStore('dataVisualization', {
                 // 不存在该条件 且 条件有效 直接保存该条件
                 // !filterExist && vValid && currentFilters.push(condition)
                 currentFilters.push(condition)
+                preActiveComponentIds.push(element.id)
               }
               if (element.component === 'VQuery') {
                 element.propValue.forEach(filterItem => {
@@ -951,6 +953,11 @@ export const dvMainStore = defineStore('dataVisualization', {
             curComponentData[index] = element
           })
         }
+        if (source === 'outer') {
+          preActiveComponentIds.forEach(viewId => {
+            useEmitt().emitter.emit('query-data-' + viewId)
+          })
+        }
       }
     },
     trackFilterCursor(element, checkQDList, trackInfo, preActiveComponentIds, viewId) {

core/core-frontend/src/views/data-visualization/PreviewCanvas.vue

@@ -122,12 +122,16 @@ const loadCanvasDataAsync = async (dvId, dvType) => {
     }
   )
 }
+
+// 目标校验： 需要校验targetDvId 是否是当前可视化资源ID
 const winMsgHandle = event => {
-  const msgInfo = JSON.parse(event.data.info)
-  if (msgInfo.type === 'attachParams') {
+  console.info('PostMessage Params Received')
+  const msgInfo = event.data
+  // 校验targetDvId
+  if (msgInfo && msgInfo.type === 'attachParams' && msgInfo.targetDvId === state.dvInfo.id + '') {
     const attachParam = msgInfo.params
     if (attachParam) {
-      dvMainStore.addOuterParamsFilter(attachParam)
+      dvMainStore.addOuterParamsFilter(attachParam, 'outer')
     }
   }
 }
@@ -142,11 +146,11 @@ onMounted(async () => {
     return
   }
   dvMainStore.setPublicLinkStatus(props.publicLinkStatus)
-  window.addEventListener('embedParamsMessage', winMsgHandle)
+  window.addEventListener('message', winMsgHandle)
 })
 
 onUnmounted(() => {
-  window.removeEventListener('embedParamsMessage', winMsgHandle)
+  window.removeEventListener('message', winMsgHandle)
 })
 
 defineExpose({