test/nocobase2
1
0
Fork 0
mirror of https://gitee.com/nocobase/nocobase.git synced 2024-12-05 05:38:23 +08:00
Code Issues Actions 26 Packages Projects Releases Wiki Activity

refactor(radio): radio support multiple field types (#3706)

Browse Source 
* style: fieldTitleInput style improve

* refactor: radio support mutiple type

* refactor: code improve
This commit is contained in:
katherinehhh 2024-03-13 16:44:17 +08:00 committed by GitHub
parent f6590d1331
commit 0779a4eab3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 10 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/core/client/src/schema-component/antd/date-picker/DatePicker.tsx
View File

@ -38,7 +38,6 @@ const InternalRangePicker = connect(
export const DatePicker = (props) => { export const DatePicker = (props) => {
const { utc = true } = useDatePickerContext(); const { utc = true } = useDatePickerContext();
const value = Array.isArray(props.value) ? props.value[0] : props.value; const value = Array.isArray(props.value) ? props.value[0] : props.value;
console.log(value);
props = { utc, ...props }; props = { utc, ...props };
return <InternalDatePicker {...props} value={value} />; return <InternalDatePicker {...props} value={value} />;
}; };

14
packages/core/client/src/schema-component/antd/radio/Radio.tsx
View File

@ -2,7 +2,7 @@ import { connect, mapProps, mapReadPretty, useField } from '@formily/react';
import { isValid } from '@formily/shared'; import { isValid } from '@formily/shared';
import { Radio as AntdRadio, Tag } from 'antd'; import { Radio as AntdRadio, Tag } from 'antd';
import type { RadioGroupProps, RadioProps } from 'antd/es/radio'; import type { RadioGroupProps, RadioProps } from 'antd/es/radio';
import React from 'react'; import React, { useState, useEffect } from 'react';
import { useCollectionField } from '../../../data-source/collection-field/CollectionFieldProvider'; import { useCollectionField } from '../../../data-source/collection-field/CollectionFieldProvider';
type ComposedRadio = React.FC<RadioProps> & { type ComposedRadio = React.FC<RadioProps> & {
@ -25,10 +25,15 @@ Radio.Group = connect(
{ {
dataSource: 'options', dataSource: 'options',
}, },
(props) => { (props: any, field: any) => {
useEffect(() => {
const defaultOption = field.dataSource?.find((option) => option.value == props.value);
if (defaultOption) {
field.setValue(defaultOption.value);
}
}, [props.value, field.dataSource]);
return { return {
...props, ...props,
value: props.value && typeof props.value !== 'boolean' ? props.value.toString() : props.value,
}; };
}, },
), ),
@ -40,11 +45,10 @@ Radio.Group = connect(
const field = useField<any>(); const field = useField<any>();
const collectionField = useCollectionField(); const collectionField = useCollectionField();
const dataSource = field.dataSource || collectionField?.uiSchema.enum || []; const dataSource = field.dataSource || collectionField?.uiSchema.enum || [];
const val = value ? props.value.toString() : value;
return ( return (
<div> <div>
{dataSource {dataSource
.filter((option) => option.value === val) .filter((option) => option.value == value)
.map((option, key) => ( .map((option, key) => (
<Tag key={key} color={option.color} icon={option.icon}> <Tag key={key} color={option.color} icon={option.icon}>
{option.label} {option.label}

2
packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/components/FieldTitleInput.tsx
View File

@ -38,7 +38,7 @@ export const FieldTitleInput = observer(
useEffect(() => { useEffect(() => {
setTitleValue(value); setTitleValue(value);
}, [value]); }, [value]);
return <Input value={titleValue} onChange={handleChange} />; return <Input value={titleValue} onChange={handleChange} style={{ minWidth: '100px' }} />;
}, },
{ displayName: 'FieldTitleInput' }, { displayName: 'FieldTitleInput' },
); );