From 4eac60a9a79f3ab989408011431d9b71b02b0ff1 Mon Sep 17 00:00:00 2001 From: Zzm0809 <934230207@qq.com> Date: Sat, 23 Dec 2023 00:00:15 +0800 Subject: [PATCH] fix-alert-instance-state-bug --- .../AlertTypeChoose/InstanceForm/index.tsx | 13 +++++++++++-- .../components/AlertTypeChoose/index.tsx | 18 +++++++----------- 2 files changed, 18 insertions(+), 13 deletions(-) diff --git a/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/InstanceForm/index.tsx b/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/InstanceForm/index.tsx index df8e225007..21c092bccf 100644 --- a/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/InstanceForm/index.tsx +++ b/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/InstanceForm/index.tsx @@ -41,6 +41,9 @@ const InstanceForm: React.FC = (props) => { const [alertType, setAlertType] = useState(values.type ?? ALERT_TYPE.DINGTALK); + const [formValues, setFormValues] = useState>(values); + + const renderPreForm = () => { return ( <> @@ -87,10 +90,16 @@ const InstanceForm: React.FC = (props) => { return ( <> - + + setFormValues((prevState) => ({ ...prevState, ...allValues, ...changedValues })) + } + submitter={false} + > {renderPreForm()} - {renderFormByType(values, alertType)} + {renderFormByType(formValues, alertType)} diff --git a/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/index.tsx b/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/index.tsx index 3763065b82..26e2459683 100644 --- a/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/index.tsx +++ b/dinky-web/src/pages/RegCenter/Alert/AlertInstance/components/AlertTypeChoose/index.tsx @@ -52,7 +52,6 @@ const AlertTypeChoose: React.FC = (props) => { loading } = props; - const [formValues, setFormValues] = useState>(values); /** * init form @@ -81,17 +80,17 @@ const AlertTypeChoose: React.FC = (props) => { * when modalVisible or values changed, set form values */ useEffect(() => { - form.setFieldsValue(formValues); - }, [modalVisible, formValues, form]); + form.setFieldsValue(values); + }, [modalVisible, values, form]); const testSend = async () => { const validateFields = await form.validateFields(); - handleTest({ ...formValues, ...validateFields }); + handleTest({ ...values, ...validateFields }); }; const submit = async () => { const validateFields = await form.validateFields(); - handleSubmit({ ...formValues, ...validateFields }); + handleSubmit({ ...values, ...validateFields }); handleCancel(); }; @@ -120,18 +119,15 @@ const AlertTypeChoose: React.FC = (props) => { <> {...NORMAL_MODAL_OPTIONS} - title={formValues?.id ? l('rc.ai.modify') : l('rc.ai.create')} + title={values?.id ? l('rc.ai.modify') : l('rc.ai.create')} open={modalVisible} form={form} - initialValues={formValues} - onValuesChange={(changedValues, allValues) => - setFormValues((prevState) => ({ ...prevState, ...allValues, ...changedValues })) - } + initialValues={values} modalProps={{ onCancel: handleCancel, ...NORMAL_MODAL_OPTIONS }} submitter={{ render: () => [...renderFooter()] }} syncToInitialValues > - + );