From 4f295415986ae9fd11a512aeb873c64c0b0d661c Mon Sep 17 00:00:00 2001 From: Zeke Zhang <958414905@qq.com> Date: Wed, 16 Apr 2025 09:11:01 +0800 Subject: [PATCH] refactor: simplify SchemaInitializerItemGroup and update menu item handling --- .../components/SchemaInitializerItemGroup.tsx | 9 +- .../useGetSchemaInitializerMenuItems.tsx | 11 +- .../items/DataBlockInitializer.tsx | 22 ++- .../client/src/schema-initializer/utils.ts | 154 +++++++++--------- 4 files changed, 105 insertions(+), 91 deletions(-) diff --git a/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItemGroup.tsx b/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItemGroup.tsx index 2e07a2adf6..ab4f1126da 100644 --- a/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItemGroup.tsx +++ b/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItemGroup.tsx @@ -15,7 +15,6 @@ import { SchemaInitializerOptions } from '../types'; import { SchemaInitializerChildren } from './SchemaInitializerChildren'; import { SchemaInitializerDivider } from './SchemaInitializerDivider'; import { useSchemaInitializerStyles } from './style'; -import { useMenuSearch } from './SchemaInitializerItemSearchFields'; export interface SchemaInitializerItemGroupProps { title: string; children?: SchemaInitializerOptions['items']; @@ -47,11 +46,5 @@ export const SchemaInitializerItemGroup: FC = ( export const SchemaInitializerItemGroupInternal = () => { const itemConfig: any = useSchemaInitializerItem(); - - const searchedChildren = useMenuSearch(itemConfig); - if (itemConfig.name && itemConfig.name !== 'displayFields') { - return ; - } - /* eslint-disable react/no-children-prop */ - return ; + return ; }; diff --git a/packages/core/client/src/application/schema-initializer/hooks/useGetSchemaInitializerMenuItems.tsx b/packages/core/client/src/application/schema-initializer/hooks/useGetSchemaInitializerMenuItems.tsx index 6d374ba82d..6e09d1b1eb 100644 --- a/packages/core/client/src/application/schema-initializer/hooks/useGetSchemaInitializerMenuItems.tsx +++ b/packages/core/client/src/application/schema-initializer/hooks/useGetSchemaInitializerMenuItems.tsx @@ -68,12 +68,17 @@ export function useGetSchemaInitializerMenuItems(onClick?: (args: any) => void) }; } if (item.type === 'subMenu') { - const label = compiledTitle; const key = item.key || item.name || `${parentKey}-sub-menu-${indexA}`; + return { key, - label, - children: item?.children?.length ? getMenuItems(item.children, key) : [], + label: , + // 子菜单的内容已经完全交给 SchemaInitializerChild 处理了，所以这些属性不需要传递下去。但是为了兼容旧版的代码，这里还暂时保留。 + item_deprecated: { + key, + label: compiledTitle, + children: item?.children?.length ? getMenuItems(item.children, key) : [], + }, }; } if (item.isMenuType) { diff --git a/packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx index c2cdfc525e..10069fd54c 100644 --- a/packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx +++ b/packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx @@ -147,22 +147,30 @@ export function useMenuSearch({ const currentItems = useMemo(() => { if (isMuliSource) { if (!openKey) return []; - return data.find((item) => (item.key || item.name) === openKey)?.children || []; + let result = data.find((item) => (item.key || item.name) === openKey); + result = result.item_deprecated || result; + + return result?.children || []; } - return data[0]?.children || []; + + let result = data[0]; + result = result.item_deprecated || result; + return result?.children || []; }, [data, isMuliSource, openKey]); // 根据搜索的值进行处理 const searchedItems = useMemo(() => { if (!searchValue) return currentItems; const lowerSearchValue = searchValue.toLocaleLowerCase(); - return currentItems.filter( - (item) => + return currentItems.filter((item) => { + item = item.item_deprecated || item; + return ( (item.label || item.title) && String(item.label || item.title) .toLocaleLowerCase() - .includes(lowerSearchValue), - ); + .includes(lowerSearchValue) + ); + }); }, [searchValue, currentItems]); const shouldLoadMore = useMemo(() => searchedItems.length > count, [count, searchedItems]); @@ -248,6 +256,8 @@ export function useMenuSearch({ const res = useMemo(() => { if (!isMuliSource) return resultItems; return data.map((item) => { + item = item.item_deprecated || item; + if (openKey && item.key === openKey) { return { ...item, diff --git a/packages/core/client/src/schema-initializer/utils.ts b/packages/core/client/src/schema-initializer/utils.ts index b54f4643d2..4d01d45184 100644 --- a/packages/core/client/src/schema-initializer/utils.ts +++ b/packages/core/client/src/schema-initializer/utils.ts @@ -219,92 +219,98 @@ function getGroupItemForTable({ depth: number; t: any; }) { - const subFields = getCollectionFields(field.target); - const items = subFields - ?.filter( - (subField) => subField?.interface && !['subTable'].includes(subField?.interface) && !subField?.treeChildren, - ) - ?.map((subField) => { - const interfaceConfig = getInterface(subField.interface); - const newSchemaName = `${schemaName}.${subField.name}`; - const schema = { - // type: 'string', - name: newSchemaName, - // title: subField?.uiSchema?.title || subField.name, - 'x-component': 'CollectionField', - 'x-read-pretty': true, - 'x-collection-field': `${field.target}.${subField.name}`, - 'x-component-props': {}, - }; + const getChildren = () => { + const subFields = getCollectionFields(field.target); + const items = subFields + ?.filter( + (subField) => subField?.interface && !['subTable'].includes(subField?.interface) && !subField?.treeChildren, + ) + ?.map((subField) => { + const interfaceConfig = getInterface(subField.interface); + const newSchemaName = `${schemaName}.${subField.name}`; + const schema = { + // type: 'string', + name: newSchemaName, + // title: subField?.uiSchema?.title || subField.name, + 'x-component': 'CollectionField', + 'x-read-pretty': true, + 'x-collection-field': `${field.target}.${subField.name}`, + 'x-component-props': {}, + }; - return { - type: 'item', - key: `${field.target}_${subField.name}_${newSchemaName}`, - name: newSchemaName, - title: subField?.uiSchema?.title || subField.name, - Component: 'TableCollectionFieldInitializer', - find: findTableColumn, - remove: removeTableColumn, - schemaInitialize: (s) => { - interfaceConfig?.schemaInitialize?.(s, { - field: subField, - readPretty: true, - block: 'Table', - targetCollection: getCollection(field.target), - }); - }, - field: subField, - schema, - } as SchemaInitializerItemType; - }); - - const displayCollectionFields = { - type: 'itemGroup', - key: `${field.target}_${schemaName}_displayFields`, - name: `${schemaName}-displayCollectionFields`, - title: t('Display fields'), - children: items, - }; - - const children = [displayCollectionFields]; - - if (depth < maxDepth) { - const subChildren = subFields - ?.filter((subField) => { - return ['o2o', 'oho', 'obo', 'm2o'].includes(subField.interface); - }) - .map((subField) => { - return getGroupItemForTable({ - getCollectionFields, + return { + type: 'item', + key: `${field.target}_${subField.name}_${newSchemaName}`, + name: newSchemaName, + title: subField?.uiSchema?.title || subField.name, + Component: 'TableCollectionFieldInitializer', + find: findTableColumn, + remove: removeTableColumn, + schemaInitialize: (s) => { + interfaceConfig?.schemaInitialize?.(s, { + field: subField, + readPretty: true, + block: 'Table', + targetCollection: getCollection(field.target), + }); + }, field: subField, - getInterface, - getCollection, - schemaName: `${schemaName}.${subField.name}`, - maxDepth, - depth: depth + 1, - t, - }); + schema, + } as SchemaInitializerItemType; }); - if (subChildren.length) { - const group: any = { - type: 'itemGroup', - key: `${field.target}_${schemaName}_associationFields`, - name: `${schemaName}-associationFields`, - title: t('Display association fields'), - children: subChildren, - }; + const displayCollectionFields = { + type: 'itemGroup', + key: `${field.target}_${schemaName}_displayFields`, + name: `${schemaName}-displayCollectionFields`, + title: t('Display fields'), + children: items, + }; - children.push(group); + const children = [displayCollectionFields]; + + if (depth < maxDepth) { + const subChildren = subFields + ?.filter((subField) => { + return ['o2o', 'oho', 'obo', 'm2o'].includes(subField.interface); + }) + .map((subField) => { + return getGroupItemForTable({ + getCollectionFields, + field: subField, + getInterface, + getCollection, + schemaName: `${schemaName}.${subField.name}`, + maxDepth, + depth: depth + 1, + t, + }); + }); + + if (subChildren.length) { + const group: any = { + type: 'itemGroup', + key: `${field.target}_${schemaName}_associationFields`, + name: `${schemaName}-associationFields`, + title: t('Display association fields'), + children: subChildren, + }; + + children.push(group); + } } - } + + return children; + }; return { type: 'subMenu', key: `${field.target}_${schemaName}_submenu`, name: schemaName, title: field.uiSchema?.title, - children, + useChildren() { + return getChildren() || []; + }, } as SchemaInitializerItemType; }