File size: 1,331 Bytes
cd85d9e |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
import { Flex, Form, Input, Space } from 'antd';
import { NodeProps } from 'reactflow';
import { NodeData } from '../../interface';
import NodeDropdown from './dropdown';
import SvgIcon from '@/components/svg-icon';
import { useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import { useHandleFormValuesChange } from '../../hooks';
import styles from './index.less';
const { TextArea } = Input;
function NoteNode({ data, id }: NodeProps<NodeData>) {
const { t } = useTranslation();
const [form] = Form.useForm();
const { handleValuesChange } = useHandleFormValuesChange(id);
useEffect(() => {
form.setFieldsValue(data?.form);
}, [form, data?.form]);
return (
<section className={styles.noteNode}>
<Flex justify={'space-between'}>
<Space size={'small'}>
<SvgIcon name="note" width={14}></SvgIcon>
<span className={styles.noteTitle}>{t('flow.note')}</span>
</Space>
<NodeDropdown id={id}></NodeDropdown>
</Flex>
<Form
onValuesChange={handleValuesChange}
form={form}
className={styles.noteForm}
>
<Form.Item name="text" noStyle>
<TextArea rows={3} placeholder={t('flow.notePlaceholder')} />
</Form.Item>
</Form>
</section>
);
}
export default NoteNode;
|