diff --git a/packages/core/client/src/block-provider/hooks/index.ts b/packages/core/client/src/block-provider/hooks/index.ts index 9f47f4e6c2..4b4e420920 100644 --- a/packages/core/client/src/block-provider/hooks/index.ts +++ b/packages/core/client/src/block-provider/hooks/index.ts @@ -1451,6 +1451,7 @@ export const useAssociationFilterBlockProps = () => { run, valueKey, labelKey, + dataScopeFilter: filter, }; }; async function doReset({ diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/TableBlockInitializer.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/TableBlockInitializer.tsx index bc3695f6df..73258a75e5 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/TableBlockInitializer.tsx +++ b/packages/core/client/src/modules/blocks/data-blocks/table/TableBlockInitializer.tsx @@ -61,14 +61,11 @@ export const TableBlockInitializer = ({ export const useCreateTableBlock = () => { const { insert } = useSchemaInitializer(); - const { getCollection } = useCollectionManager_deprecated(); const createTableBlock = ({ item }) => { - const collection = getCollection(item.name, item.dataSource); const schema = createTableBlockUISchema({ collectionName: item.name, dataSource: item.dataSource, - rowKey: collection.filterTargetKey || 'id', }); insert(schema); }; diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/__tests__/createTableBLockSchema.test.ts b/packages/core/client/src/modules/blocks/data-blocks/table/__tests__/createTableBLockSchema.test.ts index 07e5de14db..2c4ac7473e 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/__tests__/createTableBLockSchema.test.ts +++ b/packages/core/client/src/modules/blocks/data-blocks/table/__tests__/createTableBLockSchema.test.ts @@ -17,7 +17,7 @@ vi.mock('@formily/shared', () => { describe('createTableBLockSchemaV2', () => { it('should create a default table block schema with minimum options', () => { - const options = { dataSource: 'abc', collectionName: 'users', association: 'users.roles', rowKey: 'rowKey' }; + const options = { dataSource: 'abc', collectionName: 'users', association: 'users.roles' }; const schema = createTableBlockUISchema(options); expect(schema).toMatchInlineSnapshot(` @@ -85,7 +85,6 @@ describe('createTableBLockSchemaV2', () => { "params": { "pageSize": 20, }, - "rowKey": "rowKey", "showIndex": true, }, "x-filter-targets": [], diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/createTableBlockUISchema.ts b/packages/core/client/src/modules/blocks/data-blocks/table/createTableBlockUISchema.ts index 2628161034..3fb14295a4 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/createTableBlockUISchema.ts +++ b/packages/core/client/src/modules/blocks/data-blocks/table/createTableBlockUISchema.ts @@ -13,10 +13,9 @@ import { uid } from '@formily/shared'; export const createTableBlockUISchema = (options: { dataSource: string; collectionName?: string; - rowKey?: string; association?: string; }): ISchema => { - const { collectionName, dataSource, rowKey, association } = options; + const { collectionName, dataSource, association } = options; if (!dataSource) { throw new Error('dataSource is required'); @@ -35,7 +34,6 @@ export const createTableBlockUISchema = (options: { params: { pageSize: 20, }, - rowKey, showIndex: true, dragSort: false, }, diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockDecoratorProps.ts b/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockDecoratorProps.ts index bc91c97de5..2082be83fd 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockDecoratorProps.ts +++ b/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockDecoratorProps.ts @@ -11,15 +11,19 @@ import { useFieldSchema } from '@formily/react'; import { useMemo } from 'react'; import { useParsedFilter } from '../../../../../block-provider/hooks/useParsedFilter'; import { useParentRecordCommon } from '../../../useParentRecordCommon'; +import { useDataSourceManager } from '../../../../../data-source'; export const useTableBlockDecoratorProps = (props) => { const { params, parseVariableLoading } = useTableBlockParams(props); const parentRecord = useParentRecordCommon(props.association); + const dm = useDataSourceManager(); + const collection = dm.getDataSource(props.dataSource)?.collectionManager.getCollection(props.collection); return { params, parentRecord, parseVariableLoading, + rowKey: collection?.filterTargetKey || 'id', }; }; diff --git a/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx b/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx index c439277ae6..eb163b25bd 100644 --- a/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx +++ b/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx @@ -41,6 +41,7 @@ export const AssociationFilterItem = withDynamicSchemaProps( handleSearchInput: _handleSearchInput, params, run, + dataScopeFilter, valueKey: _valueKey, labelKey: _labelKey, defaultCollapse, @@ -94,7 +95,7 @@ export const AssociationFilterItem = withDynamicSchemaProps( if (searchVisible || filter) { run({ ...params?.[0], - filter: undefined, + filter: dataScopeFilter, }); } setSearchVisible(!searchVisible); diff --git a/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx b/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx index 88fbe23505..3da02019ea 100644 --- a/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx +++ b/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx @@ -10,6 +10,7 @@ import { CloseCircleOutlined } from '@ant-design/icons'; import { css } from '@emotion/css'; import { observer } from '@formily/react'; +import { sortTree } from '@nocobase/utils/client'; import { Cascader, Select, Space } from 'antd'; import React, { useCallback, useContext, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; @@ -25,7 +26,7 @@ export const FilterItem = observer( const remove = useContext(RemoveConditionContext); const { schema, - fields, + fields: _fields, operators, dataIndex, operator, @@ -35,6 +36,7 @@ export const FilterItem = observer( setValue, collectionField, } = useValues(); + const fields = sortTree(_fields, 'children', 'children', false); const style = useMemo(() => ({ marginBottom: 8 }), []); const fieldNames = useMemo( () => ({ @@ -70,6 +72,12 @@ export const FilterItem = observer( className={css` width: 160px; `} + popupClassName={css` + .ant-cascader-menu { + height: fit-content; + max-height: 50vh; + } + `} showSearch fieldNames={fieldNames} changeOnSelect={false} diff --git a/packages/core/client/src/schema-component/antd/form-item/SchemaSettingOptions.tsx b/packages/core/client/src/schema-component/antd/form-item/SchemaSettingOptions.tsx index 4193c7951d..5d2693c14b 100644 --- a/packages/core/client/src/schema-component/antd/form-item/SchemaSettingOptions.tsx +++ b/packages/core/client/src/schema-component/antd/form-item/SchemaSettingOptions.tsx @@ -535,11 +535,19 @@ export const EditOperator = () => { } field.componentProps = componentProps; + fieldSchema['x-component-props'] = componentProps; + fieldSchema.default = null; + field.value = null; + field.initialValue = null; + dn.emit('patch', { schema: { ['x-uid']: fieldSchema['x-uid'], ['x-component-props']: componentProps, ['x-filter-operator']: v, + // Clear default value when switching operators. Some operators require the default value to be an array, + // while others don't. Without clearing it, the filtering API would throw an error + default: null, }, }); dn.refresh(); diff --git a/packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx index 0bde6547ea..1b89b06071 100644 --- a/packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx +++ b/packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx @@ -39,7 +39,6 @@ export const RecordAssociationBlockInitializer = () => { } else { insert( createTableBlockUISchema({ - rowKey: collection.filterTargetKey, dataSource: collection.dataSource, association: association, }), @@ -62,7 +61,6 @@ export function useCreateAssociationTableBlock() { insert( createTableBlockUISchema({ - rowKey: collection.filterTargetKey, dataSource: collection.dataSource, association: `${field.collectionName}.${field.name}`, }), diff --git a/packages/core/utils/src/__tests__/common.test.ts b/packages/core/utils/src/__tests__/common.test.ts index 1768547f79..6bcc3da6a4 100644 --- a/packages/core/utils/src/__tests__/common.test.ts +++ b/packages/core/utils/src/__tests__/common.test.ts @@ -7,7 +7,7 @@ * For more information, please refer to: https://www.nocobase.com/agreement. */ -import { hasEmptyValue } from '../client'; +import { hasEmptyValue, sortTree } from '../client'; describe('hasEmptyValue', () => { it('should return false when there is no empty value', () => { @@ -80,3 +80,147 @@ describe('hasEmptyValue', () => { expect(hasEmptyValue(obj)).toBe(true); }); }); + +describe('sortTree', () => { + it('should return the original tree when tree is empty', () => { + expect(sortTree(null, 'order')).toBeNull(); + expect(sortTree([], 'order')).toEqual([]); + }); + + it('should sort tree nodes by a specific field in ascending order', () => { + const tree = [ + { id: 3, name: 'C', children: [] }, + { id: 1, name: 'A', children: [] }, + { id: 2, name: 'B', children: [] }, + ]; + + const result = sortTree(tree, 'id'); + + expect(result).toEqual([ + { id: 1, name: 'A', children: [] }, + { id: 2, name: 'B', children: [] }, + { id: 3, name: 'C', children: [] }, + ]); + }); + + it('should sort tree nodes by a specific field in descending order', () => { + const tree = [ + { id: 1, name: 'A', children: [] }, + { id: 3, name: 'C', children: [] }, + { id: 2, name: 'B', children: [] }, + ]; + + const result = sortTree(tree, 'id', 'children', false); + + expect(result).toEqual([ + { id: 3, name: 'C', children: [] }, + { id: 2, name: 'B', children: [] }, + { id: 1, name: 'A', children: [] }, + ]); + }); + + it('should sort tree nodes with nested children', () => { + const tree = [ + { + id: 3, + name: 'C', + items: [ + { id: 2, name: 'C-2' }, + { id: 1, name: 'C-1' }, + ], + }, + { id: 1, name: 'A', items: [] }, + { + id: 2, + name: 'B', + items: [ + { id: 3, name: 'B-3' }, + { id: 1, name: 'B-1' }, + ], + }, + ]; + + const result = sortTree(tree, 'id', 'items'); + + expect(result).toEqual([ + { id: 1, name: 'A', items: [] }, + { + id: 2, + name: 'B', + items: [ + { id: 1, name: 'B-1' }, + { id: 3, name: 'B-3' }, + ], + }, + { + id: 3, + name: 'C', + items: [ + { id: 1, name: 'C-1' }, + { id: 2, name: 'C-2' }, + ], + }, + ]); + }); + + it('should support sorting by function', () => { + const tree = [ + { id: 3, name: 'C', children: [] }, + { id: 1, name: 'A', children: [] }, + { id: 2, name: 'B', children: [] }, + ]; + + const sortByName = (node) => node.name; + const result = sortTree(tree, sortByName); + + expect(result).toEqual([ + { id: 1, name: 'A', children: [] }, + { id: 2, name: 'B', children: [] }, + { id: 3, name: 'C', children: [] }, + ]); + }); + + it('should handle complex nested structures', () => { + const tree = [ + { + id: 2, + name: 'B', + children: [ + { + id: 3, + name: 'B-3', + children: [ + { id: 2, name: 'B-3-2' }, + { id: 1, name: 'B-3-1' }, + ], + }, + { id: 1, name: 'B-1', children: [] }, + ], + }, + { id: 3, name: 'C', children: [] }, + { id: 1, name: 'A', children: [] }, + ]; + + const result = sortTree(tree, 'id'); + + expect(result).toEqual([ + { id: 1, name: 'A', children: [] }, + { + id: 2, + name: 'B', + children: [ + { id: 1, name: 'B-1', children: [] }, + { + id: 3, + name: 'B-3', + children: [ + { id: 1, name: 'B-3-1' }, + { id: 2, name: 'B-3-2' }, + ], + }, + ], + }, + { id: 3, name: 'C', children: [] }, + ]); + }); +}); diff --git a/packages/core/utils/src/common.ts b/packages/core/utils/src/common.ts index f6e9aef0b7..374b4d1cde 100644 --- a/packages/core/utils/src/common.ts +++ b/packages/core/utils/src/common.ts @@ -7,6 +7,8 @@ * For more information, please refer to: https://www.nocobase.com/agreement. */ +import _ from 'lodash'; + export const isString = (value: any): value is string => { return typeof value === 'string'; }; @@ -56,12 +58,12 @@ export const nextTick = (fn: () => void) => { }; /** - * 通用树节点深度优先遍历函数 - * @param {Object|Array} tree - 要遍历的树结构 - * @param {Function} callback - 遍历每个节点时执行的回调函数，返回真值时停止遍历并返回当前节点 - * @param {Object} options - 配置选项 - * @param {string|Function} options.childrenKey - 子节点的属性名，默认为'children'，也可以是一个函数 - * @returns {any|undefined} - 找到的节点或undefined + * Generic tree node depth-first traversal function + * @param {Object|Array} tree - The tree structure to traverse + * @param {Function} callback - The callback function executed for each node, stops traversing and returns the current node when a truthy value is returned + * @param {Object} options - Configuration options + * @param {string|Function} options.childrenKey - The property name of child nodes, defaults to 'children', can also be a function + * @returns {any|undefined} - The found node or undefined */ export function treeFind( tree: T | T[], @@ -74,20 +76,20 @@ export function treeFind( const { childrenKey = 'children' } = options; - // 处理根节点是数组的情况 + // Handle case where the root node is an array const nodes = Array.isArray(tree) ? [...tree] : [tree]; - // 深度优先搜索 + // Depth-first search for (const node of nodes) { - // 对当前节点调用回调函数 + // Call callback function on the current node if (callback(node)) { return node; } - // 获取子节点 + // Get child nodes const children = typeof childrenKey === 'function' ? childrenKey(node) : (node as any)[childrenKey]; - // 递归处理子节点 + // Recursively process child nodes if (Array.isArray(children) && children.length > 0) { const found = treeFind(children, callback, options); if (found !== undefined) { @@ -98,3 +100,31 @@ export function treeFind( return undefined; } + +/** + * Sort a tree structure + * @param {Array} tree - Tree structure array + * @param {string|Function} sortBy - Sort field or sort function + * @param {string} childrenKey - The key name of child nodes, defaults to 'children' + * @param {boolean} isAsc - Whether to sort in ascending order, defaults to true + * @returns {Array} - The sorted tree structure + */ +export function sortTree(tree: any[], sortBy: string | Function, childrenKey = 'children', isAsc = true) { + if (!tree || !Array.isArray(tree) || tree.length === 0) { + return tree; + } + + // Sort nodes at the current level + const sortedTree = _.orderBy(tree, sortBy, isAsc ? 'asc' : 'desc'); + + // Recursively sort child nodes + return sortedTree.map((node) => { + if (node[childrenKey] && node[childrenKey].length > 0) { + return { + ...node, + [childrenKey]: sortTree(node[childrenKey], sortBy, childrenKey, isAsc), + }; + } + return node; + }); +}