From d6cc87d9a2d1000afd2db6dae006bb081b0810fe Mon Sep 17 00:00:00 2001 From: katherinehhh Date: Fri, 4 Aug 2023 10:56:34 +0800 Subject: [PATCH] refactor: association field support sorting rules in sub-table (#2326) * refactor: association field support sorting rules in sub-table * refactor: code improve --- .../antd/form-item/FormItem.tsx | 107 +--------------- .../antd/table-v2/Table.Column.Designer.tsx | 56 +++++---- .../src/schema-settings/SchemaSettings.tsx | 117 ++++++++++++++++++ 3 files changed, 149 insertions(+), 131 deletions(-) diff --git a/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx b/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx index 06235d1b1..08d061fe3 100644 --- a/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx +++ b/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx @@ -16,7 +16,6 @@ import { useCollection, useCollectionFilterOptions, useCollectionManager, - useSortFields, } from '../../../collection-manager'; import { isTitleField } from '../../../collection-manager/Configuration/CollectionFields'; import { GeneralSchemaItems } from '../../../schema-items/GeneralSchemaItems'; @@ -195,21 +194,8 @@ FormItem.Designer = function Designer() { } const dataSource = useCollectionFilterOptions(collectionField?.target); const defaultFilter = fieldSchema?.['x-component-props']?.service?.params?.filter || {}; - const sortFields = useSortFields(collectionField?.target); - const defaultSort = field.componentProps?.service?.params?.sort || []; const fieldMode = field?.componentProps?.['mode'] || (isFileField ? 'FileManager' : 'Select'); const isSelectFieldMode = isAssociationField && fieldMode === 'Select'; - const sort = defaultSort?.map((item: string) => { - return item?.startsWith('-') - ? { - field: item.substring(1), - direction: 'desc', - } - : { - field: item, - direction: 'asc', - }; - }); const isSubFormMode = fieldSchema['x-component-props']?.mode === 'Nester'; const isPickerMode = fieldSchema['x-component-props']?.mode === 'Picker'; const showFieldMode = isAssociationField && fieldModeOptions && !isTableField; @@ -424,98 +410,7 @@ FormItem.Designer = function Designer() { }} /> )} - {isSelectFieldMode && !field.readPretty && ( - { - const sortArr = sort.map((item) => { - return item.direction === 'desc' ? `-${item.field}` : item.field; - }); - - _.set(field.componentProps, 'service.params.sort', sortArr); - fieldSchema['x-component-props'] = field.componentProps; - dn.emit('patch', { - schema: { - ['x-uid']: fieldSchema['x-uid'], - 'x-component-props': field.componentProps, - }, - }); - }} - /> - )} + {isSelectFieldMode && !field.readPretty && } {showFieldMode && ( { const targetCollection = getCollection(collectionField?.target); const isFileField = isFileCollection(targetCollection); const isSubTableColumn = ['QuickEdit', 'FormItem'].includes(fieldSchema['x-decorator']); - const { currentMode, field: tableField } = useAssociationFieldContext(); + const { currentMode } = useAssociationFieldContext(); const defaultFilter = fieldSchema?.['x-component-props']?.service?.params?.filter || {}; const dataSource = useCollectionFilterOptions(collectionField?.target); const isDateField = ['datetime', 'createdAt', 'updatedAt'].includes(collectionField?.interface); @@ -132,10 +133,9 @@ export const TableColumnDesigner = (props) => { set(field.componentProps, 'service.params.filter', filter); fieldSchema['x-component-props'] = field.componentProps; const path = field.path?.splice(field.path?.length - 1, 1); - (tableField as any)?.value.map((_, index) => { - field.form.query(`${path.concat(`${index}.` + fieldSchema.name)}`).take((f) => { - set(f.componentProps, 'service.params.filter', filter); - }); + field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { + // set(f.componentProps, 'service.params.filter', filter); + f.componentProps.service.params.filter = filter; }); dn.emit('patch', { schema: { @@ -239,7 +239,8 @@ export const TableColumnDesigner = (props) => { label, }; fieldSchema['x-component-props']['fieldNames'] = fieldNames; - field.query(`.*.${fieldSchema.name}`).take((f) => { + const path = field.path?.splice(field.path?.length - 1, 1); + field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { f.componentProps.fieldNames = fieldNames; }); dn.emit('patch', { @@ -318,10 +319,8 @@ export const TableColumnDesigner = (props) => { fieldSchema['required'] = required; schema['required'] = required; const path = field.path?.splice(field.path?.length - 1, 1); - (tableField as any)?.value.map((_, index) => { - field.form.query(`${path.concat(`${index}.` + fieldSchema.name)}`).take((f) => { - f.required = required; - }); + field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { + f.required = required; }); dn.emit('patch', { schema, @@ -354,11 +353,9 @@ export const TableColumnDesigner = (props) => { fieldSchema['x-disabled'] = true; schema['x-read-pretty'] = false; schema['x-disabled'] = true; - (tableField as any)?.value.map((_, index) => { - field.form.query(`${path.concat(`${index}.` + fieldSchema.name)}`).take((f) => { - f.readonly = true; - f.disabled = true; - }); + field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { + f.readonly = true; + f.disabled = true; }); break; } @@ -367,10 +364,8 @@ export const TableColumnDesigner = (props) => { fieldSchema['x-disabled'] = false; schema['x-read-pretty'] = true; schema['x-disabled'] = false; - (tableField as any)?.value.map((_, index) => { - field.form.query(`${path.concat(`${index}.` + fieldSchema.name)}`).take((f) => { - f.readPretty = true; - }); + field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { + f.readPretty = true; }); break; } @@ -379,11 +374,9 @@ export const TableColumnDesigner = (props) => { fieldSchema['x-disabled'] = false; schema['x-read-pretty'] = false; schema['x-disabled'] = false; - (tableField as any)?.value.map((_, index) => { - field.form.query(`${path.concat(`${index}.` + fieldSchema.name)}`).take((f) => { - f.readPretty = false; - f.disabled + false; - }); + field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { + f.readPretty = false; + f.disabled + false; }); break; } @@ -398,7 +391,20 @@ export const TableColumnDesigner = (props) => { /> )} {isDateField && } - + {isSubTableColumn && + !field?.readPretty && + ['obo', 'oho', 'o2o', 'o2m', 'm2m', 'm2o'].includes(collectionField?.interface) && ( + { + const path = field.path?.splice(field.path?.length - 1, 1); + field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { + f.componentProps.service = f.componentProps.service || { params: {} }; + f.componentProps.service.params.sort = sortArr; + }); + }} + /> + )} {isSubTableColumn && !field?.readPretty && isShowDefaultValue(collectionField, getInterface) && ( )} diff --git a/packages/core/client/src/schema-settings/SchemaSettings.tsx b/packages/core/client/src/schema-settings/SchemaSettings.tsx index a3e2246ca..ab26e84d9 100644 --- a/packages/core/client/src/schema-settings/SchemaSettings.tsx +++ b/packages/core/client/src/schema-settings/SchemaSettings.tsx @@ -56,6 +56,7 @@ import { useFilterBlock, useGlobalTheme, useLinkageCollectionFilterOptions, + useSortFields, } from '..'; import { useTableBlockContext } from '../block-provider'; import { findFilterTargets, updateFilterTargets } from '../block-provider/hooks'; @@ -1537,6 +1538,122 @@ SchemaSettings.DefaultValue = function DefaultValueConfigure(props) { /> ); }; + +SchemaSettings.SortingRule = function SortRuleConfigure(props) { + const field = useField(); + const { dn } = useDesignable(); + const { t } = useTranslation(); + const currentSchema = useFieldSchema(); + const { getField } = useCollection(); + const { getCollectionJoinField } = useCollectionManager(); + const fieldSchema = props?.fieldSchema ?? currentSchema; + const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']); + const sortFields = useSortFields(collectionField?.target); + const defaultSort = fieldSchema['x-component-props']?.service?.params?.sort || []; + const sort = defaultSort?.map((item: string) => { + return item?.startsWith('-') + ? { + field: item.substring(1), + direction: 'desc', + } + : { + field: item, + direction: 'asc', + }; + }); + return ( + { + const sortArr = sort.map((item) => { + return item.direction === 'desc' ? `-${item.field}` : item.field; + }); + _.set(field.componentProps, 'service.params.sort', sortArr); + props?.onSubmitCallBack?.(sortArr); + fieldSchema['x-component-props'] = field.componentProps; + dn.emit('patch', { + schema: { + ['x-uid']: fieldSchema['x-uid'], + 'x-component-props': field.componentProps, + }, + }); + }} + /> + ); +}; // 是否显示默认值配置项 export const isShowDefaultValue = (collectionField: CollectionFieldOptions, getInterface) => { return (