fix(数据大屏、仪表板): 修复部分tab组件可能在控制台打印异常问题 (#16641)

2026-05-16 05:50:45 +08:00 · 2025-08-08 13:43:01 +08:00
parent f95dfab481
commit 57822d52db
15 changed files with 43 additions and 43 deletions
--- a/core/core-frontend/src/components/dashboard/DbToolbar.vue
+++ b/core/core-frontend/src/components/dashboard/DbToolbar.vue
@@ -385,8 +385,8 @@ const batchDelete = () => {
      eventBus.emit('removeMatrixItemById-' + component.canvasId, component.id)
    }
    if (component.component === 'DeTabs') {
-      component.propValue.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+      component.propValue?.forEach(tabItem => {
+        tabItem.componentData?.forEach(tabComponent => {
          if (curBatchOptComponents.value.includes(tabComponent.id)) {
            eventBus.emit('removeMatrixItemById-' + tabComponent.canvasId, tabComponent.id)
          }
@@ -406,8 +406,8 @@ const batchCopy = () => {
      multiplexingComponents[component.id] = component
    }
    if (component.component === 'DeTabs') {
-      component.propValue.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+      component.propValue?.forEach(tabItem => {
+        tabItem.componentData?.forEach(tabComponent => {
          if (curBatchOptComponents.value.includes(tabComponent.id)) {
            multiplexingComponents[tabComponent.id] = tabComponent
          }
--- a/core/core-frontend/src/components/visualization/CanvasOptBar.vue
+++ b/core/core-frontend/src/components/visualization/CanvasOptBar.vue
@@ -77,7 +77,7 @@ const existLinkage = computed(() => {
        })
      } else if (item.component === 'DeTabs') {
        item.propValue.forEach(tabItem => {
-          tabItem.componentData.forEach(tabComponent => {
+          tabItem.componentData?.forEach(tabComponent => {
            if (tabComponent.linkageFilters && tabComponent.linkageFilters.length > 0) {
              linkageFiltersCount++
            }
--- a/core/core-frontend/src/components/visualization/ComponentEditBar.vue
+++ b/core/core-frontend/src/components/visualization/ComponentEditBar.vue
@@ -586,7 +586,7 @@ const existLinkage = computed(() => {
      })
    } else if (item.component === 'DeTabs') {
      item.propValue.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+        tabItem.componentData?.forEach(tabComponent => {
          if (linkageChange(tabComponent)) {
            linkageFiltersCount++
          }
--- a/core/core-frontend/src/components/visualization/OuterParamsSet.vue
+++ b/core/core-frontend/src/components/visualization/OuterParamsSet.vue
@@ -510,7 +510,7 @@ const initParams = async () => {
      })
    } else if (componentItem.component === 'DeTabs') {
      componentItem.propValue.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+        tabItem.componentData?.forEach(tabComponent => {
          if (tabComponent.component === 'VQuery') {
            state.baseFilterInfo.push(tabComponent)
          }
--- a/core/core-frontend/src/store/modules/data-visualization/common.ts
+++ b/core/core-frontend/src/store/modules/data-visualization/common.ts
@@ -41,7 +41,7 @@ export const getCurInfoById = curComponentId => {
      if (component.component === 'DeTabs') {
        component.propValue.forEach((tabItem, tabIndex) => {
          curTabIndex = tabIndex
-          tabItem.componentData.forEach((tabComponent, subIndex) => {
+          tabItem.componentData?.forEach((tabComponent, subIndex) => {
            if (curComponentId === tabComponent.id) {
              curIndex = subIndex
              targetComponent = tabComponent
--- a/core/core-frontend/src/store/modules/data-visualization/copy.ts
+++ b/core/core-frontend/src/store/modules/data-visualization/copy.ts
@@ -225,7 +225,7 @@ function deepCopyHelper(data, idMap) {
  // 深度拷贝Tab
  if (result.component === 'DeTabs') {
    result.propValue.forEach(tabItem => {
-      tabItem.componentData.forEach((tabComponent, i) => {
+      tabItem.componentData?.forEach((tabComponent, i) => {
        tabItem.componentData[i] = deepCopyHelper(tabComponent, idMap)
        // 对Tab的深度复制需要更换新组件的canvasId (tabsId--tabName)
        tabItem.componentData[i].canvasId = result.id + '--' + tabItem.name
--- a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts
+++ b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts
@@ -624,7 +624,7 @@ export const dvMainStore = defineStore('dataVisualization', {
          })
        } else if (item.component === 'DeTabs') {
          item.propValue.forEach(tabItem => {
-            tabItem.componentData.forEach(tabComponent => {
+            tabItem.componentData?.forEach(tabComponent => {
              this.clearTargetViewLinkage(viewId, tabComponent)
            })
          })
@@ -872,7 +872,7 @@ export const dvMainStore = defineStore('dataVisualization', {
            })
          } else if (component.component === 'DeTabs') {
            component.propValue.forEach(tabItem => {
-              tabItem.componentData.forEach(tabComponent => {
+              tabItem.componentData?.forEach(tabComponent => {
                if (this.curBatchOptComponents.includes(tabComponent.id)) {
                  if (propertyInfo.custom === 'commonBackground') {
                    tabComponent.commonBackground = deepCopy(
@@ -905,7 +905,7 @@ export const dvMainStore = defineStore('dataVisualization', {
          })
        } else if (component.component === 'DeTabs') {
          component.propValue.forEach(tabItem => {
-            tabItem.componentData.forEach(tabComponent => {
+            tabItem.componentData?.forEach(tabComponent => {
              if (this.curBatchOptComponents.includes(tabComponent.id)) {
                tabComponent.commonBackground = deepCopy(newBackground)
              }
@@ -1045,7 +1045,7 @@ export const dvMainStore = defineStore('dataVisualization', {
            })
          } else if (element.component === 'DeTabs') {
            element.propValue?.forEach(tabItem => {
-              tabItem.componentData.forEach((tabComponent, index) => {
+              tabItem.componentData?.forEach((tabComponent, index) => {
                this.trackFilterCursor(
                  tabComponent,
                  checkQDList,
@@ -1078,7 +1078,7 @@ export const dvMainStore = defineStore('dataVisualization', {
            })
          } else if (element.component === 'DeTabs') {
            element.propValue?.forEach(tabItem => {
-              tabItem.componentData.forEach((tabComponent, index) => {
+              tabItem.componentData?.forEach((tabComponent, index) => {
                this.trackWebFilterCursor(tabComponent, params)
                tabItem.componentData[index] = tabComponent
              })
@@ -1157,7 +1157,7 @@ export const dvMainStore = defineStore('dataVisualization', {
            })
          } else if (element.component === 'DeTabs') {
            element.propValue?.forEach(tabItem => {
-              tabItem.componentData.forEach((tabComponent, index) => {
+              tabItem.componentData?.forEach((tabComponent, index) => {
                this.trackOuterFilterCursor(
                  tabComponent,
                  params,
@@ -1509,7 +1509,7 @@ export const dvMainStore = defineStore('dataVisualization', {
          })
        } else if (item.component === 'DeTabs') {
          item.propValue.forEach(tabItem => {
-            tabItem.componentData.forEach(tabComponent => {
+            tabItem.componentData?.forEach(tabComponent => {
              if (tabComponent.linkageFilters && tabComponent.linkageFilters.length > 0) {
                tabComponent.linkageFilters.splice(0, tabComponent.linkageFilters.length)
                useEmitt().emitter.emit('query-data-' + tabComponent.id)
--- a/core/core-frontend/src/utils/ShapeUtils.ts
+++ b/core/core-frontend/src/utils/ShapeUtils.ts
@@ -8,8 +8,8 @@ const { componentData } = storeToRefs(dvMainStore)
 export function checkJoinGroup(item) {
  if (item.component === 'DeTabs') {
    let result = true
-    item.propValue.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+    item.propValue?.forEach(tabItem => {
+      tabItem.componentData?.forEach(tabComponent => {
        if (tabComponent.component === 'Group') {
          result = false
        }
@@ -75,8 +75,8 @@ export function itemCanvasPathCheck(item, checkType) {
 export function canvasIdMapCheck(item, pItem, pathMap) {
  pathMap[item.id] = pItem
  if (item.component === 'DeTabs') {
-    item.propValue.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+    item.propValue?.forEach(tabItem => {
+      tabItem.componentData?.forEach(tabComponent => {
        canvasIdMapCheck(tabComponent, item, pathMap)
      })
    })
--- a/core/core-frontend/src/utils/canvasStyle.ts
+++ b/core/core-frontend/src/utils/canvasStyle.ts
@@ -482,8 +482,8 @@ export function adaptTitleFontFamilyAll(fontFamily) {
        }
      })
    } else if (item.component === 'DeTabs') {
-      item.propValue.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+      item.propValue?.forEach(tabItem => {
+        tabItem.componentData?.forEach(tabComponent => {
          if (tabComponent.component === 'UserView') {
            const viewDetails = dvMainStore.canvasViewInfo[tabComponent.id]
            adaptTitleFontFamily(fontFamily, viewDetails)
@@ -550,8 +550,8 @@ export function adaptCurThemeCommonStyle(component) {
      component.style.headFontColor = DARK_THEME_COLOR_MAIN
      component.style.headFontActiveColor = DARK_THEME_COLOR_MAIN
    }
-    component.propValue.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+    component.propValue?.forEach(tabItem => {
+      tabItem.componentData?.forEach(tabComponent => {
        adaptCurThemeCommonStyle(tabComponent)
      })
    })
--- a/core/core-frontend/src/utils/canvasUtils.ts
+++ b/core/core-frontend/src/utils/canvasUtils.ts
@@ -135,7 +135,7 @@ function matrixAdaptor(componentItem) {
    })
  } else if (componentItem.component === 'DeTabs') {
    componentItem.propValue?.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+      tabItem.componentData?.forEach(tabComponent => {
        matrixAdaptor(tabComponent)
      })
    })
@@ -234,7 +234,7 @@ export function historyItemAdaptor(
    componentItem.style.fontWeight = componentItem.style.fontWeight || 'normal'
    componentItem.style.textDecoration = componentItem.style.textDecoration || 'none'
    componentItem.propValue?.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+      tabItem.componentData?.forEach(tabComponent => {
        historyItemAdaptor(tabComponent, reportFilterInfo, attachInfo, canvasVersion, canvasInfo)
      })
    })
@@ -510,7 +510,7 @@ export function initCanvasDataMobile(dvId, params, callBack) {
        ele.commonBackground = mCommonBackground || commonBackground
        if (ele.component === 'DeTabs') {
          ele.propValue?.forEach(tabItem => {
-            tabItem.componentData.forEach(tabComponent => {
+            tabItem.componentData?.forEach(tabComponent => {
              tabComponent.style = tabComponent.mStyle || tabComponent.style
              tabComponent.propValue = tabComponent.mPropValue || tabComponent.propValue
              tabComponent.events = tabComponent.mEvents || tabComponent.events
@@ -595,7 +595,7 @@ export async function canvasSaveWithParams(params, callBack) {
      })
    } else if (item.component === 'DeTabs') {
      item.propValue?.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+        tabItem.componentData?.forEach(tabComponent => {
          tabComponent.linkageFilters = []
        })
      })
@@ -688,7 +688,7 @@ export function checkJoinGroup(item) {
  if (item.component === 'DeTabs') {
    let result = true
    item.propValue?.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+      tabItem.componentData?.forEach(tabComponent => {
        if (tabComponent.component === 'Group') {
          result = false
        }
@@ -755,7 +755,7 @@ export function canvasIdMapCheck(item, pItem, pathMap) {
  pathMap[item.id] = pItem
  if (item.component === 'DeTabs') {
    item.propValue?.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+      tabItem.componentData?.forEach(tabComponent => {
        canvasIdMapCheck(tabComponent, item, pathMap)
      })
    })
@@ -837,7 +837,7 @@ export function findAllViewsId(componentData, idArray) {
      })
    } else if (item.component === 'DeTabs') {
      item.propValue?.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+        tabItem.componentData?.forEach(tabComponent => {
          idArray.push(tabComponent.id)
        })
      })
@@ -1018,7 +1018,7 @@ export function findComponentById(componentId) {
      })
    } else if (item.component === 'DeTabs') {
      item.propValue?.forEach(tabItem => {
-        tabItem.componentData.forEach(tabComponent => {
+        tabItem.componentData?.forEach(tabComponent => {
          if (tabComponent.id === componentId) {
            result = tabComponent
          }
--- a/core/core-frontend/src/utils/changeComponentsSizeWithScale.ts
+++ b/core/core-frontend/src/utils/changeComponentsSizeWithScale.ts
@@ -31,7 +31,7 @@ export function changeSizeWithScale(scale) {
 }

 function changeComponentsSizeWithScaleCircle(componentDataCopy, scale) {
-  componentDataCopy.forEach(component => {
+  componentDataCopy?.forEach(component => {
    Object.keys(component.style).forEach(key => {
      if (needToChangeDirectionAttrs.width.includes(key)) {
        // 根据原来的比例获取样式原来的尺寸
--- a/core/core-frontend/src/utils/imgUtils.ts
+++ b/core/core-frontend/src/utils/imgUtils.ts
@@ -159,7 +159,7 @@ export function dataURLToBlob(dataUrl) {
 }

 function findStaticSourceInner(componentDataInfo, staticResource) {
-  componentDataInfo.forEach(item => {
+  componentDataInfo?.forEach(item => {
    if (
      typeof item.commonBackground.outerImage === 'string' &&
      item.commonBackground.outerImage.indexOf('static-resource') > -1
--- a/core/core-frontend/src/utils/style.ts
+++ b/core/core-frontend/src/utils/style.ts
@@ -286,8 +286,8 @@ export function groupItemStyleAdaptor(component, parentStyle) {

 export function groupStyleRevertBatch(groupComponent, parentStyle) {
  if (groupComponent.component === 'DeTabs') {
-    groupComponent.propValue.forEach(tabItem => {
-      tabItem.componentData.forEach(tabComponent => {
+    groupComponent.propValue?.forEach(tabItem => {
+      tabItem.componentData?.forEach(tabComponent => {
        groupStyleRevert(tabComponent, parentStyle)
      })
    })
@@ -299,8 +299,8 @@ export function tabInnerStyleRevert(tabOuterComponent) {
    width: tabOuterComponent.style.width,
    height: tabOuterComponent.style.height - (tabOuterComponent.style.showTabTitle ? 46 : 0)
  }
-  tabOuterComponent.propValue.forEach(tabItem => {
-    tabItem.componentData.forEach(tabComponent => {
+  tabOuterComponent.propValue?.forEach(tabItem => {
+    tabItem.componentData?.forEach(tabComponent => {
      groupStyleRevert(tabComponent, parentStyle)
    })
  })
--- a/core/core-frontend/src/views/dashboard/MobileConfigPanel.vue
+++ b/core/core-frontend/src/views/dashboard/MobileConfigPanel.vue
@@ -154,7 +154,7 @@ const hanedleMessage = event => {
        }
        if (ele.component === 'DeTabs') {
          ele.propValue.forEach(tabItem => {
-            tabItem.componentData.forEach(tabComponent => {
+            tabItem.componentData?.forEach(tabComponent => {
              const {
                style: tStyle,
                propValue: tPropValue,
--- a/core/core-frontend/src/views/mobile/panel/index.vue
+++ b/core/core-frontend/src/views/mobile/panel/index.vue
@@ -36,8 +36,8 @@ const hanedleMessage = event => {
      }

      if (ele.component === 'DeTabs') {
-        ele.propValue.forEach(tabItem => {
-          tabItem.componentData.forEach(tabComponent => {
+        ele.propValue?.forEach(tabItem => {
+          tabItem.componentData?.forEach(tabComponent => {
            const {
              mStyle: tStyle,
              mCommonBackground: tCommonBackground,
@@ -126,8 +126,8 @@ const hanedleMessage = event => {
          }
          if (next.component === 'DeTabs') {
            pre[id].tab = {}
-            next.propValue.forEach(tabItem => {
-              tabItem.componentData.forEach(tabComponent => {
+            next.propValue?.forEach(tabItem => {
+              tabItem.componentData?.forEach(tabComponent => {
                const {
                  x: tx,
                  y: ty,