diff --git a/packages/editor/src/layouts/sidebar/data-source/DataSourceList.vue b/packages/editor/src/layouts/sidebar/data-source/DataSourceList.vue index 1bf54900..e63b9190 100644 --- a/packages/editor/src/layouts/sidebar/data-source/DataSourceList.vue +++ b/packages/editor/src/layouts/sidebar/data-source/DataSourceList.vue @@ -75,6 +75,26 @@ const getNodeTreeConfig = (id: string, dep: Dep[string], type?: string) => ({ children: getKeyTreeConfig(dep, type), }); +/** + * 生成tree中依赖节点的数据 + * @param children 节点 + * @param deps 依赖 + * @param type 依赖类型 + */ +const mergeChildren = (children: any[], deps: Dep, type?: string) => { + Object.entries(deps).forEach(([id, dep]) => { + // 已经生成过的节点 + const nodeItem = children.find((item) => item.id === id); + // 节点存在,则追加依赖的key + if (nodeItem) { + nodeItem.children = nodeItem.children.concat(getKeyTreeConfig(dep, type)); + } else { + // 节点不存在,则生成 + children.push(getNodeTreeConfig(id, dep, type)); + } + }); +}; + const list = computed(() => dataSources.value.map((ds) => { const dsDeps = dsDep.value[ds.id].deps; @@ -82,21 +102,10 @@ const list = computed(() => const dsCondDeps = dsCondDep.value[ds.id].deps; const children: any[] = []; - - const mergeChildren = (deps: Dep, type?: string) => { - Object.entries(deps).forEach(([id, dep]) => { - const nodeItem = children.find((item) => item.id === id); - if (nodeItem) { - nodeItem.children = nodeItem.children.concat(getKeyTreeConfig(dep, type)); - } else { - children.push(getNodeTreeConfig(id, dep, type)); - } - }); - }; - - mergeChildren(dsDeps); - mergeChildren(dsMethodDeps, 'method'); - mergeChildren(dsCondDeps, 'cond'); + // 数据源依赖分为三种类型:key/node、method、cond,是分开存储,这里将其合并展示 + mergeChildren(children, dsDeps); + mergeChildren(children, dsMethodDeps, 'method'); + mergeChildren(children, dsCondDeps, 'cond'); return { id: ds.id, diff --git a/packages/editor/src/services/dep.ts b/packages/editor/src/services/dep.ts index e0a5f936..40ed85e5 100644 --- a/packages/editor/src/services/dep.ts +++ b/packages/editor/src/services/dep.ts @@ -299,7 +299,7 @@ export class Watcher extends EventEmitter { const keyIsItems = key === 'items'; const fullKey = prop ? `${prop}.${key}` : key; - if (target.isTarget(key, value)) { + if (target.isTarget(fullKey, value)) { target.updateDep(node, fullKey); this.emit('update-dep', node, fullKey); } else if (!keyIsItems && Array.isArray(value)) { diff --git a/packages/editor/src/utils/dep.ts b/packages/editor/src/utils/dep.ts index a3ea6bbc..f3dae333 100644 --- a/packages/editor/src/utils/dep.ts +++ b/packages/editor/src/utils/dep.ts @@ -58,8 +58,13 @@ export const createDataSourceCondTarget = (id: string) => new Target({ type: DepTargetType.DATA_SOURCE_COND, id, - isTarget: (key: string | number, value: any) => - Array.isArray(value) && value[0] === id && Boolean(dataSourceService.getDataSourceById(id)), + isTarget: (key: string | number, value: any) => { + if (!Array.isArray(value) || value[0] !== id || !`${key}`.startsWith('displayConds')) return false; + + const ds = dataSourceService.getDataSourceById(id); + + return Boolean(ds?.fields?.find((field) => field.name === value[1])); + }, }); export const createDataSourceMethodTarget = (id: string) => diff --git a/packages/editor/tests/unit/services/dep.spec.ts b/packages/editor/tests/unit/services/dep.spec.ts index d3da54eb..65c21c01 100644 --- a/packages/editor/tests/unit/services/dep.spec.ts +++ b/packages/editor/tests/unit/services/dep.spec.ts @@ -96,7 +96,7 @@ describe('depService', () => { type: 'target', id: 'collect_2', name: 'test2', - isTarget: (key: string | number, value: any) => key === 'text1' && value === 'text', + isTarget: (key: string | number, value: any) => `${key}`.includes('text1') && value === 'text', }), );