From ce8325c83c061fe2c3967ed3a5c95427fef154a5 Mon Sep 17 00:00:00 2001 From: JzoNg Date: Wed, 6 Aug 2025 14:06:33 +0800 Subject: [PATCH] update data structure --- .../delivery-method/email-configure-modal.tsx | 103 ++++++++++++++++ .../components/delivery-method/index.tsx | 56 ++++----- .../delivery-method/method-item.tsx | 114 ++++++++++-------- .../human-input/components/user-action.tsx | 14 +-- .../workflow/nodes/human-input/default.ts | 24 ++-- .../workflow/nodes/human-input/node.tsx | 4 +- .../workflow/nodes/human-input/panel.tsx | 16 ++- .../workflow/nodes/human-input/types.ts | 13 +- .../workflow/nodes/human-input/use-config.ts | 12 +- web/i18n/en-US/workflow.ts | 14 +++ web/i18n/zh-Hans/workflow.ts | 14 +++ 11 files changed, 261 insertions(+), 123 deletions(-) create mode 100644 web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx diff --git a/web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx b/web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx new file mode 100644 index 0000000000..5731efa969 --- /dev/null +++ b/web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx @@ -0,0 +1,103 @@ +import { memo, useCallback, useState } from 'react' +import { useTranslation } from 'react-i18next' +import { RiCloseLine } from '@remixicon/react' +import Modal from '@/app/components/base/modal' +import Input from '@/app/components/base/input' +import TextArea from '@/app/components/base/textarea' +import Button from '@/app/components/base/button' +import { noop } from 'lodash-es' + +const i18nPrefix = 'workflow.nodes.humanInput' + +type Recipient = { + value: string + label: string +} + +type EmailConfigureModalProps = { + isShow: boolean + onClose: () => void + onConfirm: (data: any) => void +} + +const EmailConfigureModal = ({ + isShow, + onClose, + onConfirm, +}: EmailConfigureModalProps) => { + const { t } = useTranslation() + + const [recipients, setRecipients] = useState([]) + const [subject, setSubject] = useState('') + const [body, setBody] = useState('') + + const handleConfirm = useCallback(() => { + onConfirm({ + recipients: recipients.map(recipient => recipient.value), + subject, + body, + }) + }, [recipients, subject, body, onConfirm]) + + return ( + +
+ +
+
+
{t(`${i18nPrefix}.deliveryMethod.emailConfigure.title`)}
+
{t(`${i18nPrefix}.deliveryMethod.emailConfigure.description`)}
+
+
+
+
+ {t(`${i18nPrefix}.deliveryMethod.emailConfigure.recipient`)} +
+
+
+
+ {t(`${i18nPrefix}.deliveryMethod.emailConfigure.subject`)} +
+ setSubject(e.target.value)} + placeholder={t(`${i18nPrefix}.deliveryMethod.emailConfigure.subjectPlaceholder`)} + /> +
+
+
+ {t(`${i18nPrefix}.deliveryMethod.emailConfigure.body`)} +
+