diff --git a/core/core-frontend/src/custom-component/v-query/Component.vue b/core/core-frontend/src/custom-component/v-query/Component.vue index d7e012c48a..4c39ae6984 100644 --- a/core/core-frontend/src/custom-component/v-query/Component.vue +++ b/core/core-frontend/src/custom-component/v-query/Component.vue @@ -33,6 +33,7 @@ import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain' import { comInfo } from './com-info' import { useEmitt } from '@/hooks/web/useEmitt' import StyleInject from './StyleInject.vue' +import { getKeyList, reRenderAll } from '@/custom-component/v-query/QueryUtils' const props = defineProps({ view: { type: Object, @@ -341,29 +342,6 @@ const releaseSelect = id => { unMountSelect.value = unMountSelect.value.filter(ele => ele !== id) } -const getKeyList = next => { - let checkedFieldsMapArr = Object.entries(next.checkedFieldsMap).filter(ele => - next.checkedFields.includes(ele[0]) - ) - if (next.displayType === '9') { - checkedFieldsMapArr = ( - next.treeCheckedList?.length - ? next.treeCheckedList.filter((_, index) => index < next.treeFieldList.length) - : next.treeFieldList.map(() => { - return { - checkedFields: [...next.checkedFields], - checkedFieldsMap: cloneDeep(next.checkedFieldsMap) - } - }) - ) - .map(item => - Object.entries(item.checkedFieldsMap).filter(ele => item.checkedFields.includes(ele[0])) - ) - .flat() - } - return checkedFieldsMapArr.filter(ele => !!ele[1]).map(ele => ele[0]) -} - const fillRequireVal = arr => { element.value.propValue?.forEach(next => { if (arr.some(itx => next.checkedFields.includes(itx)) && next.required) { @@ -663,20 +641,6 @@ const addCriteriaConfigOut = () => { queryConfig.value.setConditionOut() } -const reRenderAll = (oldArr, newArr) => { - const newArrIds = newArr.map(ele => ele.id) - const emitterList = (oldArr || []).reduce((pre, next) => { - if (newArrIds.includes(next.id)) return pre - const keyList = getKeyList(next) - pre = [...new Set([...keyList, ...pre])] - return pre - }, []) - if (!emitterList.length) return - emitterList.forEach(ele => { - emitter.emit(`query-data-${ele}`) - }) -} - const delQueryConfig = index => { const com = cloneDeep(unref(list)) list.value.splice(index, 1) diff --git a/core/core-frontend/src/custom-component/v-query/QueryUtils.ts b/core/core-frontend/src/custom-component/v-query/QueryUtils.ts new file mode 100644 index 0000000000..ba34069842 --- /dev/null +++ b/core/core-frontend/src/custom-component/v-query/QueryUtils.ts @@ -0,0 +1,52 @@ +import { cloneDeep } from 'lodash-es' +import { useEmitt } from '@/hooks/web/useEmitt' +const { emitter } = useEmitt() + +export const reRenderAll = (oldArr, newArr) => { + const newArrIds = newArr.map(ele => ele.id) + const emitterList = (oldArr || []).reduce((pre, next) => { + if (newArrIds.includes(next.id)) return pre + const keyList = getKeyList(next) + pre = [...new Set([...keyList, ...pre])] + return pre + }, []) + if (!emitterList.length) return + emitterList.forEach(ele => { + emitter.emit(`query-data-${ele}`) + }) +} + +export const reRenderAfterDelete = oldArr => { + const emitterList = (oldArr || []).reduce((pre, next) => { + const keyList = getKeyList(next) + pre = [...new Set([...keyList, ...pre])] + return pre + }, []) + if (!emitterList.length) return + emitterList.forEach(ele => { + emitter.emit(`query-data-${ele}`) + }) +} + +export const getKeyList = next => { + let checkedFieldsMapArr = Object.entries(next.checkedFieldsMap).filter(ele => + next.checkedFields.includes(ele[0]) + ) + if (next.displayType === '9') { + checkedFieldsMapArr = ( + next.treeCheckedList?.length + ? next.treeCheckedList.filter((_, index) => index < next.treeFieldList.length) + : next.treeFieldList.map(() => { + return { + checkedFields: [...next.checkedFields], + checkedFieldsMap: cloneDeep(next.checkedFieldsMap) + } + }) + ) + .map(item => + Object.entries(item.checkedFieldsMap).filter(ele => item.checkedFields.includes(ele[0])) + ) + .flat() + } + return checkedFieldsMapArr.filter(ele => !!ele[1]).map(ele => ele[0]) +} 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 e4f3a70662..1afb57ae5b 100644 --- a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts +++ b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts @@ -31,6 +31,7 @@ import { filterParamsOptions } from '@/utils/componentUtils' import { formatterItem } from '@/views/chart/components/js/formatter' +import { reRenderAfterDelete } from '@/custom-component/v-query/QueryUtils' const { t } = useI18n() export const dvMainStore = defineStore('dataVisualization', { @@ -594,8 +595,11 @@ export const dvMainStore = defineStore('dataVisualization', { } if (/\d/.test(index)) { + const deletedComponent = componentData[index] this.curComponentIndex = null componentData.splice(index, 1) + // VQuery 组件 + deletedComponent?.component === 'VQuery' && reRenderAfterDelete(deletedComponent.propValue) } }, updateCurDvInfo(dvInfo) {