From c0fde83b335c747587650fdf8ef2e7116ff0386a Mon Sep 17 00:00:00 2001 From: wjh Date: Tue, 19 Mar 2024 18:30:05 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E8=87=AA=E5=AE=9A?= =?UTF-8?q?=E4=B9=89=E7=BB=84=E4=BB=B6=E6=96=87=E6=9C=AC=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../FormFilter/SchemaSettingsRemove.tsx | 13 ++- .../FilterFormItemCustom.tsx | 84 ++++++++++++------- .../src/client/schema-settings/index.tsx | 2 +- 3 files changed, 65 insertions(+), 34 deletions(-) diff --git a/packages/plugins/@hera/plugin-core/src/client/components/FormFilter/SchemaSettingsRemove.tsx b/packages/plugins/@hera/plugin-core/src/client/components/FormFilter/SchemaSettingsRemove.tsx index 74054df68..f990c1086 100644 --- a/packages/plugins/@hera/plugin-core/src/client/components/FormFilter/SchemaSettingsRemove.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/components/FormFilter/SchemaSettingsRemove.tsx @@ -34,15 +34,22 @@ export const SchemaSettingsRemove: FC = (props) => { removeParentsIfNoChildren, breakRemoveOn, }; + const name = fieldSchema.name as string; + const fieldName = name.split('.')[1]; + const title = fieldSchema.title; if (field?.required) { field.required = false; fieldSchema['required'] = false; } await dn.remove(null, options); await confirm?.onOk?.(); - delete form.values['custom'][fieldSchema['collectionName']]; - const name = fieldSchema.name as string; - const title = fieldSchema.title; + if (fieldSchema['x-component'] === 'Select' || fieldSchema['x-component'] === 'AutoComplete') { + delete form.values['custom'][fieldSchema['collectionName']]; + } else { + if (form.values['custom']?.[fieldName]) { + delete form.values['custom'][fieldName]; + } + } for (const key in form.fields) { if (key.includes(name) && form.fields[key].title === title) { delete form.fields[key]; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx index 45df0fe3f..40478231a 100644 --- a/packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx @@ -29,7 +29,7 @@ import React, { memo, useCallback, useContext, useMemo } from 'react'; import { Schema, SchemaOptionsContext, observer, useField, useFieldSchema } from '@formily/react'; import { FormLayout } from '@formily/antd-v5'; import { uid } from '@formily/shared'; -import { Field } from '@formily/core'; +import { Field, onFieldValueChange } from '@formily/core'; import { EditFormulaTitleField, EditTitle, @@ -65,9 +65,11 @@ export const FilterCustomItemInitializer: React.FC<{ const itemConfig = useSchemaInitializerItem(); const { getInterface } = useCollectionManager_deprecated(); const { collections } = useCollectionManager_deprecated(); - collections.forEach((value) => { - value['label'] = value.name; - value['value'] = value.name; + const allCollection = collections.map((value) => { + return { + label: value.title, + value: value.name, + }; }); const { options: fieldComponents, values: fieldComponentValues } = useFieldComponents(); const api = useAPIClient(); @@ -105,9 +107,9 @@ export const FilterCustomItemInitializer: React.FC<{ title: t('Field collection'), 'x-decorator': 'FormItem', 'x-component': 'Select', - enum: collections, + enum: allCollection, description: t('Select a collection field to use metadata of the field'), - required: true, + 'x-visible': false, }, }, }} @@ -121,16 +123,35 @@ export const FilterCustomItemInitializer: React.FC<{ values: { name: `f_${uid()}`, }, + effects() { + onFieldValueChange('component', (field) => { + const name = field.value; + const component = field.query('.collection').take() as Field; + if (name === 'Select' || name === 'AutoComplete') { + component.setDisplay('visible'); + component.setRequired(true); + } else { + component.setDisplay('none'); + component.setRequired(false); + } + }); + }, }); - const { name, title, component, collection } = values; + const { title, component, collection } = values; const defaultSchema = getInterface(component)?.default?.uiSchema || {}; + let name; + if (component === 'Select' || component === 'AutoComplete') { + name = collection; + } else { + name = component + uid(); + } insert( gridRowColWrap({ 'x-component': component, ...defaultSchema, type: 'string', title: title, - name: 'custom.' + collection, + name: 'custom.' + name, required: false, 'x-designer': 'FilterItemCustomDesigner', 'x-decorator': 'FilterFormItem', @@ -165,33 +186,36 @@ export const FilterItemCustomDesigner: React.FC = () => { const { form } = useFormBlockContext(); const field = useField(); const { dn } = useDesignable(); + const component = fieldSchema['x-component']; return ( - { - _.set(field.componentProps, 'params', { - ...field.componentProps?.params, - filter, - }); - fieldSchema['x-component-props']['params'] = field.componentProps.params; - dn.emit('patch', { - schema: { - ['x-uid']: fieldSchema['x-uid'], - 'x-component-props': fieldSchema['x-component-props'], - }, - }); - }} - /> - - - - + {component !== 'Input' ? ( + { + _.set(field.componentProps, 'params', { + ...field.componentProps?.params, + filter, + }); + fieldSchema['x-component-props']['params'] = field.componentProps.params; + dn.emit('patch', { + schema: { + ['x-uid']: fieldSchema['x-uid'], + 'x-component-props': fieldSchema['x-component-props'], + }, + }); + }} + /> + ) : null} + {component !== 'Input' ? : null} + {component !== 'Input' ? : null} + {component !== 'Input' ? : null} + {component !== 'Input' ? : null} { const collections = useCollectionManager(); const options = collections?.dataSource['options']?.collections.map((value) => { return { - label: value.name, + label: value.title, value: value.name, }; });