diff --git a/core/core-frontend/src/custom-component/de-tabs/Component.vue b/core/core-frontend/src/custom-component/de-tabs/Component.vue index e3e96876b7..45b24ebeff 100644 --- a/core/core-frontend/src/custom-component/de-tabs/Component.vue +++ b/core/core-frontend/src/custom-component/de-tabs/Component.vue @@ -183,6 +183,7 @@ import { CommonBackground, ShorthandMode } from '@/components/visualization/component-background/Types' +import { checkFilterRemove } from '@/custom-component/v-query/QueryUtils' const dvMainStore = dvMainStoreWithOut() const snapshotStore = snapshotStoreWithOut() @@ -370,6 +371,7 @@ function deleteCur(param) { let len = element.value.propValue.length while (len--) { if (element.value.propValue[len].name === param.name) { + const deletedTab = element.value.propValue[len] element.value.propValue.splice(len, 1) const activeIndex = (len - 1 + element.value.propValue.length) % element.value.propValue.length @@ -377,6 +379,9 @@ function deleteCur(param) { state.tabShow = false nextTick(() => { state.tabShow = true + deletedTab.componentData?.forEach(tabComponent => { + checkFilterRemove(tabComponent) + }) }) } } diff --git a/core/core-frontend/src/custom-component/v-query/QueryUtils.ts b/core/core-frontend/src/custom-component/v-query/QueryUtils.ts index ba34069842..a29a31fbe6 100644 --- a/core/core-frontend/src/custom-component/v-query/QueryUtils.ts +++ b/core/core-frontend/src/custom-component/v-query/QueryUtils.ts @@ -16,6 +16,22 @@ export const reRenderAll = (oldArr, newArr) => { }) } +export const checkFilterRemove = componentTarget => { + if (componentTarget?.component === 'VQuery') { + reRenderAfterDelete(componentTarget.propValue) + } else if (componentTarget.component === 'Group') { + componentTarget.propValue.forEach(groupItem => { + checkFilterRemove(groupItem) + }) + } else if (componentTarget.component === 'DeTabs') { + componentTarget.propValue.forEach(tabItem => { + tabItem.componentData?.forEach(tabComponent => { + checkFilterRemove(tabComponent) + }) + }) + } +} + export const reRenderAfterDelete = oldArr => { const emitterList = (oldArr || []).reduce((pre, next) => { const keyList = getKeyList(next) diff --git a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts index 1afb57ae5b..ab02af6ce7 100644 --- a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts +++ b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts @@ -31,7 +31,7 @@ import { filterParamsOptions } from '@/utils/componentUtils' import { formatterItem } from '@/views/chart/components/js/formatter' -import { reRenderAfterDelete } from '@/custom-component/v-query/QueryUtils' +import { checkFilterRemove } from '@/custom-component/v-query/QueryUtils' const { t } = useI18n() export const dvMainStore = defineStore('dataVisualization', { @@ -599,7 +599,7 @@ export const dvMainStore = defineStore('dataVisualization', { this.curComponentIndex = null componentData.splice(index, 1) // VQuery 组件 - deletedComponent?.component === 'VQuery' && reRenderAfterDelete(deletedComponent.propValue) + checkFilterRemove(deletedComponent) } }, updateCurDvInfo(dvInfo) {