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

fix(default-value): fix tag in RemoteSelect (#2306)

Browse Source
This commit is contained in:
被雨水过滤的空气-Rain 2023-07-24 16:24:15 +08:00 committed by GitHub
parent 7ed4ae5018
commit 68976e0ebe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 61 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -353,73 +353,47 @@ FormItem.Designer = function Designer() {
type: 'object', type: 'object',
title: t('Set default value'), title: t('Set default value'),
properties: { properties: {
default: default: {
// isInvariable(interfaceConfig) ...(fieldSchemaWithoutRequired || {}),
// ? { 'x-decorator': 'FormItem',
// ...(fieldSchemaWithoutRequired || {}), 'x-component': 'VariableInput',
// 'x-decorator': 'FormItem', 'x-component-props': {
// 'x-component-props': { ...(fieldSchema?.['x-component-props'] || {}),
// ...fieldSchema['x-component-props'], collectionField,
// targetField, targetField,
// component: collectionName: collectionField?.collectionName,
// collectionField?.target && collectionField?.interface !== 'chinaRegion' schema: collectionField?.uiSchema,
// ? 'AssociationSelect' className: defaultInputStyle,
// : undefined, renderSchemaComponent: function Com(props) {
// service: { const s = _.cloneDeep(fieldSchemaWithoutRequired) || ({} as Schema);
// resource: collectionField?.target,
// },
// style: {
// width: '100%',
// verticalAlign: 'top',
// },
// },
// name: 'default',
// title: t('Default value'),
// default: getFieldDefaultValue(fieldSchema, collectionField),
// 'x-read-pretty': false,
// 'x-disabled': false,
// }
// :
{
...(fieldSchemaWithoutRequired || {}),
'x-decorator': 'FormItem',
'x-component': 'VariableInput',
'x-component-props': {
...(fieldSchema?.['x-component-props'] || {}),
collectionField,
targetField,
collectionName: collectionField?.collectionName,
schema: collectionField?.uiSchema,
className: defaultInputStyle,
renderSchemaComponent: function Com(props) {
const s = _.cloneDeep(fieldSchemaWithoutRequired) || ({} as Schema);
s.title = '';
s['x-read-pretty'] = false;
s['x-disabled'] = false;
return ( s.title = '';
<SchemaComponent s['x-read-pretty'] = false;
schema={{ s['x-disabled'] = false;
...(s || {}),
'x-component-props': { return (
...s['x-component-props'], <SchemaComponent
onChange: props.onChange, schema={{
value: props.value, ...(s || {}),
defaultValue: getFieldDefaultValue(s, collectionField), 'x-component-props': {
style: { ...s['x-component-props'],
width: '100%', onChange: props.onChange,
verticalAlign: 'top', value: props.value,
}, defaultValue: getFieldDefaultValue(s, collectionField),
style: {
width: '100%',
verticalAlign: 'top',
}, },
}} },
/> }}
); />
}, );
}, },
name: 'default',
title: t('Default value'),
default: getFieldDefaultValue(fieldSchema, collectionField),
}, },
name: 'default',
title: t('Default value'),
default: getFieldDefaultValue(fieldSchema, collectionField),
},
}, },
} as ISchema } as ISchema
} }

10
packages/core/client/src/schema-component/antd/remote-select/RemoteSelect.tsx
View File

@ -35,6 +35,7 @@ const InternalRemoteSelect = connect(
service = {}, service = {},
wait = 300, wait = 300,
value, value,
defaultValue,
objectValue, objectValue,
manual = true, manual = true,
mapOptions, mapOptions,
@ -249,12 +250,13 @@ const InternalRemoteSelect = connect(
}; };
const options = useMemo(() => { const options = useMemo(() => {
const v = value || defaultValue;
if (!data?.data?.length) { if (!data?.data?.length) {
return value != null ? (Array.isArray(value) ? value : [value]) : []; return v != null ? (Array.isArray(v) ? v : [v]) : [];
} }
const valueOptions = (value != null && (Array.isArray(value) ? value : [value])) || []; const valueOptions = (v != null && (Array.isArray(v) ? v : [v])) || [];
return uniqBy(data?.data?.concat(valueOptions) || [], fieldNames.value); return uniqBy(data?.data?.concat(valueOptions) || [], fieldNames.value);
}, [data?.data, value]); }, [value, defaultValue, data?.data, fieldNames.value]);
const onDropdownVisibleChange = (visible) => { const onDropdownVisibleChange = (visible) => {
setOpen(visible); setOpen(visible);
@ -264,6 +266,7 @@ const InternalRemoteSelect = connect(
} }
firstRun.current = true; firstRun.current = true;
}; };
return ( return (
<Select <Select
open={open} open={open}
@ -276,6 +279,7 @@ const InternalRemoteSelect = connect(
onDropdownVisibleChange={onDropdownVisibleChange} onDropdownVisibleChange={onDropdownVisibleChange}
objectValue={objectValue} objectValue={objectValue}
value={value} value={value}
defaultValue={defaultValue}
{...others} {...others}
loading={data! ? loading : true} loading={data! ? loading : true}
options={mapOptionsToTags(options)} options={mapOptionsToTags(options)}

22
packages/core/client/src/schema-component/antd/select/Select.tsx
View File

@ -3,10 +3,10 @@ import { connect, mapProps, mapReadPretty } from '@formily/react';
import { isValid, toArr } from '@formily/shared'; import { isValid, toArr } from '@formily/shared';
import { isPlainObject } from '@nocobase/utils/client'; import { isPlainObject } from '@nocobase/utils/client';
import type { SelectProps } from 'antd'; import type { SelectProps } from 'antd';
import { Empty, Select as AntdSelect, Spin } from 'antd'; import { Select as AntdSelect, Empty, Spin } from 'antd';
import React from 'react'; import React from 'react';
import { ReadPretty } from './ReadPretty'; import { ReadPretty } from './ReadPretty';
import { defaultFieldNames, FieldNames, getCurrentOptions } from './utils'; import { FieldNames, defaultFieldNames, getCurrentOptions } from './utils';
type Props = SelectProps<any, any> & { type Props = SelectProps<any, any> & {
objectValue?: boolean; objectValue?: boolean;
@ -19,7 +19,7 @@ type Props = SelectProps<any, any> & {
const isEmptyObject = (val: any) => !isValid(val) || (typeof val === 'object' && Object.keys(val).length === 0); const isEmptyObject = (val: any) => !isValid(val) || (typeof val === 'object' && Object.keys(val).length === 0);
const ObjectSelect = (props: Props) => { const ObjectSelect = (props: Props) => {
const { value, options, onChange, fieldNames, mode, loading, rawOptions, ...others } = props; const { value, options, onChange, fieldNames, mode, loading, rawOptions, defaultValue, ...others } = props;
const toValue = (v: any) => { const toValue = (v: any) => {
if (isEmptyObject(v)) { if (isEmptyObject(v)) {
return; return;
@ -40,9 +40,11 @@ const ObjectSelect = (props: Props) => {
} }
return currentOptions.shift(); return currentOptions.shift();
}; };
return ( return (
<AntdSelect <AntdSelect
value={toValue(value)} value={toValue(value)}
defaultValue={toValue(defaultValue)}
allowClear allowClear
labelInValue labelInValue
notFoundContent={loading ? <Spin /> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />} notFoundContent={loading ? <Spin /> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
@ -78,13 +80,22 @@ const filterOption = (input, option) => (option?.label ?? '').toLowerCase().incl
const InternalSelect = connect( const InternalSelect = connect(
(props: Props) => { (props: Props) => {
const { objectValue, loading, value, rawOptions, ...others } = props; const { objectValue, loading, value, rawOptions, defaultValue, ...others } = props;
let mode: any = props.multiple ? 'multiple' : props.mode; let mode: any = props.multiple ? 'multiple' : props.mode;
if (mode && !['multiple', 'tags'].includes(mode)) { if (mode && !['multiple', 'tags'].includes(mode)) {
mode = undefined; mode = undefined;
} }
if (objectValue) { if (objectValue) {
return <ObjectSelect rawOptions={rawOptions} {...others} value={value} mode={mode} loading={loading} />; return (
<ObjectSelect
rawOptions={rawOptions}
{...others}
defaultValue={defaultValue}
value={value}
mode={mode}
loading={loading}
/>
);
} }
const toValue = (v) => { const toValue = (v) => {
if (['tags', 'multiple'].includes(props.mode) || props.multiple) { if (['tags', 'multiple'].includes(props.mode) || props.multiple) {
@ -103,6 +114,7 @@ const InternalSelect = connect(
popupMatchSelectWidth={false} popupMatchSelectWidth={false}
notFoundContent={loading ? <Spin /> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />} notFoundContent={loading ? <Spin /> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
value={toValue(value)} value={toValue(value)}
defaultValue={toValue(defaultValue)}
{...others} {...others}
onChange={(changed) => { onChange={(changed) => {
props.onChange?.(changed === undefined ? null : changed); props.onChange?.(changed === undefined ? null : changed);