diff --git a/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/CollectionFields.tsx b/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/CollectionFields.tsx index c2675e7643..b3920df3d7 100644 --- a/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/CollectionFields.tsx +++ b/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/CollectionFields.tsx @@ -84,14 +84,14 @@ export const CollectionFields = () => { }; const dm = useDataSourceManager(); - const handleFieldChange = async (value, filterByTk) => { + const handleFieldChange = async (value, filterByTk, flag = true) => { await api.request({ url: `dataSourcesCollections/${dataSourceKey}.${name}/fields:update?filterByTk=${filterByTk}`, method: 'post', data: value, }); dm.getDataSource(dataSourceKey).reload(); - message.success(t('Saved successfully')); + flag && message.success(t('Saved successfully')); }; const useTitleFieldProps = () => { return { diff --git a/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/components/CollectionFieldInterfaceSelect.tsx b/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/components/CollectionFieldInterfaceSelect.tsx index cad9c93b04..db5321525c 100644 --- a/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/components/CollectionFieldInterfaceSelect.tsx +++ b/packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/components/CollectionFieldInterfaceSelect.tsx @@ -1,6 +1,6 @@ import { observer, useForm, useField } from '@formily/react'; import { Select, Tag } from 'antd'; -import React, { useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { useCompile, useCollectionManager_deprecated, useRecord, useFieldInterfaceOptions } from '@nocobase/client'; const getInterfaceOptions = (data, type) => { @@ -31,7 +31,37 @@ export const CollectionFieldInterfaceSelect = observer( const data = getInterfaceOptions(initOptions, record.type); const form = useForm(); const field = useField(); + const [selectValue, setSelectValue] = useState(value); const [options, setOptions] = useState(data); + const targetRecord = Object.values(form.values)?.[0]?.[field.index]; + const targetType = targetRecord?.type || record.type; + useEffect(() => { + //只有一个选项的时候选中该选项 + if (options.length === 1 && options[0]?.children?.length === 1) { + const targetValue = options[0]?.children?.[0]?.name; + if (targetValue !== selectValue) { + const interfaceConfig = getInterface(targetValue); + handleFieldChange( + { + interface: targetValue, + uiSchema: { title: record?.uiSchema?.title, ...interfaceConfig?.default?.uiSchema }, + }, + record.name, + false, + ); + setSelectValue(targetValue); + } + } + }, [options]); + + useEffect(() => { + if (record?.possibleTypes) { + const targetRecord = Object.values(form.values)?.[0]?.[field.index]; + const targetType = targetRecord?.type || record.type; + const newOptions = getInterfaceOptions(initOptions, targetType); + setOptions(newOptions); + } + }, [targetType]); return ['oho', 'obo', 'o2m', 'm2o', 'm2m'].includes(record.interface) ? ( {compile(initOptions.find((h) => h.key === 'relation')['children'].find((v) => v.name === value)?.['label'])} @@ -41,7 +71,7 @@ export const CollectionFieldInterfaceSelect = observer( aria-label={`field-interface-${record?.type}`} //@ts-ignore role="button" - defaultValue={value} + value={selectValue} style={{ width: '100%' }} popupMatchSelectWidth={false} onChange={(value) => { @@ -53,14 +83,7 @@ export const CollectionFieldInterfaceSelect = observer( }, record.name, ); - }} - onDropdownVisibleChange={(open) => { - if (open && record?.possibleTypes) { - const targetRecord = Object.values(form.values)?.[0]?.[field.index]; - const targetType = targetRecord?.type || record.type; - const newOptions = getInterfaceOptions(initOptions, targetType); - setOptions(newOptions); - } + setSelectValue(value); }} > {options.map((group) => (