tachybase_todo/packages/plugins/@hera/plugin-rental/src/client/schema-components/Movement.tsx

46 lines
1.2 KiB
TypeScript

import { useCollectionField } from '@nocobase/client';
import { connect, isValid, mapProps, mapReadPretty, useField } from '@nocobase/schema';
import { Radio, Tag } from 'antd';
import React from 'react';
import { useEffect } from 'react';
export const Movement = connect(
Radio.Group,
mapProps(
{
dataSource: 'options',
},
(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 {
...props,
};
},
),
mapReadPretty((props) => {
if (!isValid(props.value)) {
return <div></div>;
}
const { value } = props;
const field = useField<any>();
const collectionField = useCollectionField();
const dataSource = field.dataSource || collectionField?.uiSchema.enum || [];
return (
<div>
{dataSource
.filter((option) => option.value === value)
.map((option, key) => (
<Tag key={key} color={option.color} icon={option.icon}>
{option.label}
</Tag>
))}
</div>
);
}),
);