ruiling/tachybase_todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: fix multi-select field not show 'Allow multiple' switch (#1857)

Browse Source 
* fix: fix multi-select field not show 'Allow multiple' switch

* fix: use uiSchema
This commit is contained in:
被雨水过滤的空气-Rairn 2023-05-15 15:26:46 +08:00 committed by GitHub
parent d2e92ead7f
commit 19a33dfe74
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 73 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
packages/core/client/src/schema-component/antd/association-select/AssociationSelect.tsx
View File

@ -15,6 +15,7 @@ import {
} from '../../../collection-manager';
import { isTitleField } from '../../../collection-manager/Configuration/CollectionFields';
import { GeneralSchemaDesigner, SchemaSettings, isPatternDisabled, isShowDefaultValue } from '../../../schema-settings';
import { useIsShowMultipleSwitch } from '../../../schema-settings/hooks/useIsShowMultipleSwitch';
import { useCompile, useDesignable, useFieldComponentOptions, useFieldTitle } from '../../hooks';
import { removeNullCondition } from '../filter';
import { RemoteSelect, RemoteSelectProps } from '../remote-select';
@ -102,6 +103,8 @@ AssociationSelect.Designer = function Designer() {
const tk = useFilterByTk();
const { dn, refresh, insertAdjacent } = useDesignable();
const compile = useCompile();
const IsShowMultipleSwitch = useIsShowMultipleSwitch();
const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']);
const fieldComponentOptions = useFieldComponentOptions();
const isSubFormAssociationField = field.address.segments.includes('__form_grid');
@ -495,36 +498,31 @@ AssociationSelect.Designer = function Designer() {
}}
/>
)}
{form &&
!form?.readPretty &&
['o2m', 'm2m'].includes(collectionField.interface) &&
fieldSchema['x-component'] !== 'TableField' && (
<SchemaSettings.SwitchItem
key="multiple"
title={t('Allow multiple')}
checked={
fieldSchema['x-component-props']?.multiple === undefined
? true
: fieldSchema['x-component-props'].multiple
}
onChange={(value) => {
const schema = {
['x-uid']: fieldSchema['x-uid'],
};
fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {};
field.componentProps = field.componentProps || {};
{IsShowMultipleSwitch() ? (
<SchemaSettings.SwitchItem
key="multiple"
title={t('Allow multiple')}
checked={
fieldSchema['x-component-props']?.multiple === undefined ? true : fieldSchema['x-component-props'].multiple
}
onChange={(value) => {
const schema = {
['x-uid']: fieldSchema['x-uid'],
};
fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {};
field.componentProps = field.componentProps || {};
fieldSchema['x-component-props'].multiple = value;
field.componentProps.multiple = value;
fieldSchema['x-component-props'].multiple = value;
field.componentProps.multiple = value;
schema['x-component-props'] = fieldSchema['x-component-props'];
dn.emit('patch', {
schema,
});
refresh();
}}
/>
)}
schema['x-component-props'] = fieldSchema['x-component-props'];
dn.emit('patch', {
schema,
});
refresh();
}}
/>
) : null}
<SchemaSettings.ModalItem
title={t('Set the data scope')}
schema={

59
packages/core/client/src/schema-component/antd/form-item/FormItem.tsx
View File

@ -8,7 +8,7 @@ import moment from 'moment';
import React, { useContext, useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import { ACLCollectionFieldProvider } from '../../../acl/ACLProvider';
import { BlockRequestContext, useFilterByTk, useFormBlockContext } from '../../../block-provider';
import { BlockRequestContext, useFormBlockContext } from '../../../block-provider';
import {
Collection,
CollectionFieldOptions,
@ -20,6 +20,7 @@ import {
import { isTitleField } from '../../../collection-manager/Configuration/CollectionFields';
import { GeneralSchemaDesigner, SchemaSettings, isPatternDisabled, isShowDefaultValue } from '../../../schema-settings';
import { VariableInput } from '../../../schema-settings/VariableInput/VariableInput';
import { useIsShowMultipleSwitch } from '../../../schema-settings/hooks/useIsShowMultipleSwitch';
import { isVariable, parseVariables, useVariablesCtx } from '../../common/utils/uitls';
import { SchemaComponent } from '../../core';
import { useCompile, useDesignable, useFieldModeOptions } from '../../hooks';
@ -99,14 +100,15 @@ export const FormItem: any = observer((props: any) => {
FormItem.Designer = function Designer() {
const { getCollectionFields, getInterface, getCollectionJoinField, getCollection } = useCollectionManager();
const { getField } = useCollection();
const tk = useFilterByTk();
const { form } = useFormBlockContext();
const field = useField<Field>();
const fieldSchema = useFieldSchema();
const { t } = useTranslation();
const { dn, refresh, insertAdjacent } = useDesignable();
const { dn, refresh } = useDesignable();
const compile = useCompile();
const variablesCtx = useVariablesCtx();
const IsShowMultipleSwitch = useIsShowMultipleSwitch();
const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']);
const targetCollection = getCollection(collectionField?.target);
const interfaceConfig = getInterface(collectionField?.interface);
@ -705,36 +707,31 @@ FormItem.Designer = function Designer() {
}}
/>
)}
{form &&
!form?.readPretty &&
['o2m', 'm2m'].includes(collectionField?.interface) &&
fieldSchema['x-component'] !== 'TableField' && (
<SchemaSettings.SwitchItem
key="multiple"
title={t('Allow multiple')}
checked={
fieldSchema['x-component-props']?.multiple === undefined
? true
: fieldSchema['x-component-props'].multiple
}
onChange={(value) => {
const schema = {
['x-uid']: fieldSchema['x-uid'],
};
fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {};
field.componentProps = field.componentProps || {};
{IsShowMultipleSwitch() ? (
<SchemaSettings.SwitchItem
key="multiple"
title={t('Allow multiple')}
checked={
fieldSchema['x-component-props']?.multiple === undefined ? true : fieldSchema['x-component-props'].multiple
}
onChange={(value) => {
const schema = {
['x-uid']: fieldSchema['x-uid'],
};
fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {};
field.componentProps = field.componentProps || {};
fieldSchema['x-component-props'].multiple = value;
field.componentProps.multiple = value;
fieldSchema['x-component-props'].multiple = value;
field.componentProps.multiple = value;
schema['x-component-props'] = fieldSchema['x-component-props'];
dn.emit('patch', {
schema,
});
refresh();
}}
/>
)}
schema['x-component-props'] = fieldSchema['x-component-props'];
dn.emit('patch', {
schema,
});
refresh();
}}
/>
) : null}
{field.readPretty && options.length > 0 && fieldSchema['x-component'] === 'CollectionField' && !isFileField && (
<SchemaSettings.SwitchItem
title={t('Enable link')}

19
packages/core/client/src/schema-settings/hooks/useIsShowMultipleSwitch.ts Normal file
View File

@ -0,0 +1,19 @@
import { useField, useFieldSchema } from '@formily/react';
import { useCollectionManager } from '../../collection-manager';
/**
* 是否显示 `允许多选` 开关
*/
export function useIsShowMultipleSwitch() {
const field = useField();
const fieldSchema = useFieldSchema();
const { getCollectionField } = useCollectionManager();
const collectionField = getCollectionField(fieldSchema['x-collection-field']);
const uiSchema = collectionField?.uiSchema || fieldSchema;
const hasMultiple = uiSchema['x-component-props']?.multiple === true;
return function IsShowMultipleSwitch() {
return !field.readPretty && fieldSchema['x-component'] !== 'TableField' && hasMultiple;
};
}