feat: extract some configs from access to apply logic

2025-10-04 21:44:54 +00:00 · 2025-01-11 16:31:28 +08:00
parent a0c08e841d
commit 598d0705fb
21 changed files with 647 additions and 427 deletions
--- a/ui/src/components/access/AccessForm.tsx
+++ b/ui/src/components/access/AccessForm.tsx
@@ -130,20 +130,22 @@ const AccessForm = forwardRef<AccessFormInstance, AccessFormProps>(({ className,
  };

  const handleFormChange = (_: unknown, values: AccessFormFieldValues) => {
-    if (values.provider !== fieldProvider) {
-      formInst.setFieldValue("provider", values.provider);
-    }
-
    onValuesChange?.(values);
  };

  useImperativeHandle(ref, () => {
    return {
      getFieldsValue: () => {
-        return formInst.getFieldsValue(true);
+        const values = formInst.getFieldsValue(true);
+        values.config = nestedFormInst.getFieldsValue();
+        return values;
      },
      resetFields: (fields) => {
-        return formInst.resetFields(fields);
+        formInst.resetFields(fields);
+
+        if (!!fields && fields.includes("config")) {
+          nestedFormInst.resetFields(fields);
+        }
      },
      validateFields: (nameList, config) => {
        const t1 = formInst.validateFields(nameList, config);
--- a/ui/src/components/access/AccessFormAWSConfig.tsx
+++ b/ui/src/components/access/AccessFormAWSConfig.tsx
@@ -19,8 +19,6 @@ const initFormModel = (): AccessFormAWSConfigFieldValues => {
  return {
    accessKeyId: "",
    secretAccessKey: "",
-    region: "us-east-1",
-    hostedZoneId: "",
  };
 };

@@ -38,18 +36,6 @@ const AccessFormAWSConfig = ({ form: formInst, formName, disabled, initialValues
      .min(1, t("access.form.aws_secret_access_key.placeholder"))
      .max(64, t("common.errmsg.string_max", { max: 64 }))
      .trim(),
-    // TODO: 该字段仅用于申请证书，后续迁移到工作流表单中
-    region: z
-      .string()
-      .max(64, t("common.errmsg.string_max", { max: 64 }))
-      .trim()
-      .nullish(),
-    // TODO: 该字段仅用于申请证书，后续迁移到工作流表单中
-    hostedZoneId: z
-      .string()
-      .max(64, t("common.errmsg.string_max", { max: 64 }))
-      .trim()
-      .nullish(),
  });
  const formRule = createSchemaFieldRule(formSchema);

@@ -83,24 +69,6 @@ const AccessFormAWSConfig = ({ form: formInst, formName, disabled, initialValues
      >
        <Input.Password autoComplete="new-password" placeholder={t("access.form.aws_secret_access_key.placeholder")} />
      </Form.Item>
-
-      <Form.Item
-        name="region"
-        label={t("access.form.aws_region.label")}
-        rules={[formRule]}
-        tooltip={<span dangerouslySetInnerHTML={{ __html: t("access.form.aws_region.tooltip") }}></span>}
-      >
-        <Input placeholder={t("access.form.aws_region.placeholder")} />
-      </Form.Item>
-
-      <Form.Item
-        name="hostedZoneId"
-        label={t("access.form.aws_hosted_zone_id.label")}
-        rules={[formRule]}
-        tooltip={<span dangerouslySetInnerHTML={{ __html: t("access.form.aws_hosted_zone_id.tooltip") }}></span>}
-      >
-        <Input placeholder={t("access.form.aws_hosted_zone_id.placeholder")} />
-      </Form.Item>
    </Form>
  );
 };
--- a/ui/src/components/access/AccessFormHuaweiCloudConfig.tsx
+++ b/ui/src/components/access/AccessFormHuaweiCloudConfig.tsx
@@ -19,7 +19,6 @@ const initFormModel = (): AccessFormHuaweiCloudConfigFieldValues => {
  return {
    accessKeyId: "",
    secretAccessKey: "",
-    region: "cn-north-1",
  };
 };

@@ -37,12 +36,6 @@ const AccessFormHuaweiCloudConfig = ({ form: formInst, formName, disabled, initi
      .min(1, t("access.form.huaweicloud_secret_access_key.placeholder"))
      .max(64, t("common.errmsg.string_max", { max: 64 }))
      .trim(),
-    // TODO: 该字段仅用于申请证书，后续迁移到工作流表单中
-    region: z
-      .string()
-      .max(64, t("common.errmsg.string_max", { max: 64 }))
-      .trim()
-      .nullish(),
  });
  const formRule = createSchemaFieldRule(formSchema);

@@ -76,15 +69,6 @@ const AccessFormHuaweiCloudConfig = ({ form: formInst, formName, disabled, initi
      >
        <Input.Password autoComplete="new-password" placeholder={t("access.form.huaweicloud_secret_access_key.placeholder")} />
      </Form.Item>
-
-      <Form.Item
-        name="region"
-        label={t("access.form.huaweicloud_region.label")}
-        rules={[formRule]}
-        tooltip={<span dangerouslySetInnerHTML={{ __html: t("access.form.huaweicloud_region.tooltip") }}></span>}
-      >
-        <Input placeholder={t("access.form.huaweicloud_region.placeholder")} />
-      </Form.Item>
    </Form>
  );
 };
--- a/ui/src/components/workflow/node/ApplyNodeConfigForm.tsx
+++ b/ui/src/components/workflow/node/ApplyNodeConfigForm.tsx
@@ -1,4 +1,4 @@
-import { forwardRef, memo, useEffect, useImperativeHandle, useState } from "react";
+import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { FormOutlined as FormOutlinedIcon, PlusOutlined as PlusOutlinedIcon, QuestionCircleOutlined as QuestionCircleOutlinedIcon } from "@ant-design/icons";
 import { useControllableValue } from "ahooks";
@@ -11,13 +11,16 @@ import MultipleInput from "@/components/MultipleInput";
 import AccessEditModal from "@/components/access/AccessEditModal";
 import AccessSelect from "@/components/access/AccessSelect";
 import ApplyDNSProviderSelect from "@/components/provider/ApplyDNSProviderSelect";
-import { ACCESS_USAGES, accessProvidersMap, applyDNSProvidersMap } from "@/domain/provider";
+import { ACCESS_PROVIDERS, ACCESS_USAGES, APPLY_DNS_PROVIDERS, accessProvidersMap, applyDNSProvidersMap } from "@/domain/provider";
 import { type WorkflowNodeConfigForApply } from "@/domain/workflow";
-import { useAntdForm, useZustandShallowSelector } from "@/hooks";
+import { useAntdForm, useAntdFormName, useZustandShallowSelector } from "@/hooks";
 import { useAccessesStore } from "@/stores/access";
 import { useContactEmailsStore } from "@/stores/contact";
 import { validDomainName, validIPv4Address, validIPv6Address } from "@/utils/validators";

+import ApplyNodeConfigFormAWSRoute53Config from "./ApplyNodeConfigFormAWSRoute53Config";
+import ApplyNodeConfigFormHuaweiCloudDNSConfig from "./ApplyNodeConfigFormHuaweiCloudDNSConfig";
+
 type ApplyNodeConfigFormFieldValues = Partial<WorkflowNodeConfigForApply>;

 export type ApplyNodeConfigFormProps = {
@@ -61,6 +64,7 @@ const ApplyNodeConfigForm = forwardRef<ApplyNodeConfigFormInstance, ApplyNodeCon
      providerAccessId: z
        .string({ message: t("workflow_node.apply.form.provider_access.placeholder") })
        .min(1, t("workflow_node.apply.form.provider_access.placeholder")),
+      providerConfig: z.any(),
      keyAlgorithm: z
        .string({ message: t("workflow_node.apply.form.key_algorithm.placeholder") })
        .nonempty(t("workflow_node.apply.form.key_algorithm.placeholder")),
@@ -92,6 +96,30 @@ const ApplyNodeConfigForm = forwardRef<ApplyNodeConfigFormInstance, ApplyNodeCon
    const fieldDomains = Form.useWatch<string>("domains", formInst);
    const fieldNameservers = Form.useWatch<string>("nameservers", formInst);

+    const [nestedFormInst] = Form.useForm();
+    const nestedFormName = useAntdFormName({ form: nestedFormInst, name: "workflowNodeApplyConfigFormProviderConfigForm" });
+    const nestedFormEl = useMemo(() => {
+      const nestedFormProps = {
+        form: nestedFormInst,
+        formName: nestedFormName,
+        disabled: disabled,
+        initialValues: initialValues?.providerConfig,
+      };
+
+      /*
+        注意：如果追加新的子组件，请保持以 ASCII 排序。
+        NOTICE: If you add new child component, please keep ASCII order.
+       */
+      switch (fieldProvider) {
+        case ACCESS_PROVIDERS.AWS:
+        case APPLY_DNS_PROVIDERS.AWS_ROUTE53:
+          return <ApplyNodeConfigFormAWSRoute53Config {...nestedFormProps} />;
+        case ACCESS_PROVIDERS.HUAWEICLOUD:
+        case APPLY_DNS_PROVIDERS.HUAWEICLOUD_DNS:
+          return <ApplyNodeConfigFormHuaweiCloudDNSConfig {...nestedFormProps} />;
+      }
+    }, [disabled, initialValues?.providerConfig, fieldProvider, nestedFormInst, nestedFormName]);
+
    const handleProviderSelect = (value: string) => {
      if (fieldProvider === value) return;

@@ -115,6 +143,13 @@ const ApplyNodeConfigForm = forwardRef<ApplyNodeConfigFormInstance, ApplyNodeCon
      onValuesChange?.(formInst.getFieldsValue(true));
    };

+    const handleFormProviderChange = (name: string) => {
+      if (name === nestedFormName) {
+        formInst.setFieldValue("providerConfig", nestedFormInst.getFieldsValue());
+        onValuesChange?.(formInst.getFieldsValue(true));
+      }
+    };
+
    const handleFormChange = (_: unknown, values: z.infer<typeof formSchema>) => {
      onValuesChange?.(values as ApplyNodeConfigFormFieldValues);
    };
@@ -122,101 +157,113 @@ const ApplyNodeConfigForm = forwardRef<ApplyNodeConfigFormInstance, ApplyNodeCon
    useImperativeHandle(ref, () => {
      return {
        getFieldsValue: () => {
-          return formInst.getFieldsValue(true);
+          const values = formInst.getFieldsValue(true);
+          values.providerConfig = nestedFormInst.getFieldsValue();
+          return values;
        },
        resetFields: (fields) => {
-          return formInst.resetFields(fields);
+          formInst.resetFields(fields);
+
+          if (!!fields && fields.includes("providerConfig")) {
+            nestedFormInst.resetFields(fields);
+          }
        },
        validateFields: (nameList, config) => {
-          return formInst.validateFields(nameList, config);
+          const t1 = formInst.validateFields(nameList, config);
+          const t2 = nestedFormInst.validateFields(undefined, config);
+          return Promise.all([t1, t2]).then(() => t1);
        },
      } as ApplyNodeConfigFormInstance;
    });

    return (
-      <Form className={className} style={style} {...formProps} disabled={disabled} layout="vertical" scrollToFirstError onValuesChange={handleFormChange}>
-        <Form.Item
-          label={t("workflow_node.apply.form.domains.label")}
-          tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.domains.tooltip") }}></span>}
-        >
-          <Space.Compact style={{ width: "100%" }}>
-            <Form.Item name="domains" noStyle rules={[formRule]}>
-              <Input placeholder={t("workflow_node.apply.form.domains.placeholder")} />
-            </Form.Item>
-            <DomainsModalInput
-              value={fieldDomains}
-              trigger={
-                <Button disabled={disabled}>
-                  <FormOutlinedIcon />
-                </Button>
-              }
-              onChange={(v) => {
-                formInst.setFieldValue("domains", v);
-              }}
-            />
-          </Space.Compact>
-        </Form.Item>
+      <Form.Provider onFormChange={handleFormProviderChange}>
+        <Form className={className} style={style} {...formProps} disabled={disabled} layout="vertical" scrollToFirstError onValuesChange={handleFormChange}>
+          <Form.Item
+            label={t("workflow_node.apply.form.domains.label")}
+            tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.domains.tooltip") }}></span>}
+          >
+            <Space.Compact style={{ width: "100%" }}>
+              <Form.Item name="domains" noStyle rules={[formRule]}>
+                <Input placeholder={t("workflow_node.apply.form.domains.placeholder")} />
+              </Form.Item>
+              <DomainsModalInput
+                value={fieldDomains}
+                trigger={
+                  <Button disabled={disabled}>
+                    <FormOutlinedIcon />
+                  </Button>
+                }
+                onChange={(v) => {
+                  formInst.setFieldValue("domains", v);
+                }}
+              />
+            </Space.Compact>
+          </Form.Item>

-        <Form.Item
-          name="contactEmail"
-          label={t("workflow_node.apply.form.contact_email.label")}
-          rules={[formRule]}
-          tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.contact_email.tooltip") }}></span>}
-        >
-          <EmailInput placeholder={t("workflow_node.apply.form.contact_email.placeholder")} />
-        </Form.Item>
+          <Form.Item
+            name="contactEmail"
+            label={t("workflow_node.apply.form.contact_email.label")}
+            rules={[formRule]}
+            tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.contact_email.tooltip") }}></span>}
+          >
+            <EmailInput placeholder={t("workflow_node.apply.form.contact_email.placeholder")} />
+          </Form.Item>

-        <Form.Item name="provider" label={t("workflow_node.apply.form.provider.label")} hidden rules={[formRule]}>
-          <ApplyDNSProviderSelect
-            allowClear
-            disabled
-            placeholder={t("workflow_node.apply.form.provider.placeholder")}
-            showSearch
-            onSelect={handleProviderSelect}
-          />
-        </Form.Item>
-
-        <Form.Item className="mb-0">
-          <label className="mb-1 block">
-            <div className="flex w-full items-center justify-between gap-4">
-              <div className="max-w-full grow truncate">
-                <span>{t("workflow_node.apply.form.provider_access.label")}</span>
-                <Tooltip title={t("workflow_node.apply.form.provider_access.tooltip")}>
-                  <Typography.Text className="ms-1" type="secondary">
-                    <QuestionCircleOutlinedIcon />
-                  </Typography.Text>
-                </Tooltip>
-              </div>
-              <div className="text-right">
-                <AccessEditModal
-                  preset="add"
-                  trigger={
-                    <Button size="small" type="link">
-                      <PlusOutlinedIcon />
-                      {t("workflow_node.apply.form.provider_access.button")}
-                    </Button>
-                  }
-                  afterSubmit={(record) => {
-                    const provider = accessProvidersMap.get(record.provider);
-                    if (ACCESS_USAGES.ALL === provider?.usage || ACCESS_USAGES.APPLY === provider?.usage) {
-                      formInst.setFieldValue("providerAccessId", record.id);
-                    }
-                  }}
-                />
-              </div>
-            </div>
-          </label>
-          <Form.Item name="providerAccessId" rules={[formRule]}>
-            <AccessSelect
-              placeholder={t("workflow_node.apply.form.provider_access.placeholder")}
-              filter={(record) => {
-                const provider = accessProvidersMap.get(record.provider);
-                return ACCESS_USAGES.ALL === provider?.usage || ACCESS_USAGES.APPLY === provider?.usage;
-              }}
-              onChange={handleProviderAccessSelect}
+          <Form.Item name="provider" label={t("workflow_node.apply.form.provider.label")} hidden rules={[formRule]}>
+            <ApplyDNSProviderSelect
+              allowClear
+              disabled
+              placeholder={t("workflow_node.apply.form.provider.placeholder")}
+              showSearch
+              onSelect={handleProviderSelect}
            />
          </Form.Item>
-        </Form.Item>
+
+          <Form.Item className="mb-0">
+            <label className="mb-1 block">
+              <div className="flex w-full items-center justify-between gap-4">
+                <div className="max-w-full grow truncate">
+                  <span>{t("workflow_node.apply.form.provider_access.label")}</span>
+                  <Tooltip title={t("workflow_node.apply.form.provider_access.tooltip")}>
+                    <Typography.Text className="ms-1" type="secondary">
+                      <QuestionCircleOutlinedIcon />
+                    </Typography.Text>
+                  </Tooltip>
+                </div>
+                <div className="text-right">
+                  <AccessEditModal
+                    preset="add"
+                    trigger={
+                      <Button size="small" type="link">
+                        <PlusOutlinedIcon />
+                        {t("workflow_node.apply.form.provider_access.button")}
+                      </Button>
+                    }
+                    afterSubmit={(record) => {
+                      const provider = accessProvidersMap.get(record.provider);
+                      if (ACCESS_USAGES.ALL === provider?.usage || ACCESS_USAGES.APPLY === provider?.usage) {
+                        formInst.setFieldValue("providerAccessId", record.id);
+                      }
+                    }}
+                  />
+                </div>
+              </div>
+            </label>
+            <Form.Item name="providerAccessId" rules={[formRule]}>
+              <AccessSelect
+                placeholder={t("workflow_node.apply.form.provider_access.placeholder")}
+                filter={(record) => {
+                  const provider = accessProvidersMap.get(record.provider);
+                  return ACCESS_USAGES.ALL === provider?.usage || ACCESS_USAGES.APPLY === provider?.usage;
+                }}
+                onChange={handleProviderAccessSelect}
+              />
+            </Form.Item>
+          </Form.Item>
+        </Form>
+
+        {nestedFormEl}

        <Divider className="my-1">
          <Typography.Text className="text-xs font-normal" type="secondary">
@@ -224,71 +271,73 @@ const ApplyNodeConfigForm = forwardRef<ApplyNodeConfigFormInstance, ApplyNodeCon
          </Typography.Text>
        </Divider>

-        <Form.Item name="keyAlgorithm" label={t("workflow_node.apply.form.key_algorithm.label")} rules={[formRule]}>
-          <Select
-            options={["RSA2048", "RSA3072", "RSA4096", "RSA8192", "EC256", "EC384"].map((e) => ({
-              label: e,
-              value: e,
-            }))}
-            placeholder={t("workflow_node.apply.form.key_algorithm.placeholder")}
-          />
-        </Form.Item>
+        <Form className={className} style={style} {...formProps} disabled={disabled} layout="vertical" scrollToFirstError onValuesChange={handleFormChange}>
+          <Form.Item name="keyAlgorithm" label={t("workflow_node.apply.form.key_algorithm.label")} rules={[formRule]}>
+            <Select
+              options={["RSA2048", "RSA3072", "RSA4096", "RSA8192", "EC256", "EC384"].map((e) => ({
+                label: e,
+                value: e,
+              }))}
+              placeholder={t("workflow_node.apply.form.key_algorithm.placeholder")}
+            />
+          </Form.Item>

-        <Form.Item
-          label={t("workflow_node.apply.form.nameservers.label")}
-          tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.nameservers.tooltip") }}></span>}
-        >
-          <Space.Compact style={{ width: "100%" }}>
-            <Form.Item name="nameservers" noStyle rules={[formRule]}>
-              <Input
-                allowClear
-                disabled={disabled}
+          <Form.Item
+            label={t("workflow_node.apply.form.nameservers.label")}
+            tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.nameservers.tooltip") }}></span>}
+          >
+            <Space.Compact style={{ width: "100%" }}>
+              <Form.Item name="nameservers" noStyle rules={[formRule]}>
+                <Input
+                  allowClear
+                  disabled={disabled}
+                  value={fieldNameservers}
+                  placeholder={t("workflow_node.apply.form.nameservers.placeholder")}
+                  onChange={(e) => {
+                    formInst.setFieldValue("nameservers", e.target.value);
+                  }}
+                />
+              </Form.Item>
+              <NameserversModalInput
                value={fieldNameservers}
-                placeholder={t("workflow_node.apply.form.nameservers.placeholder")}
-                onChange={(e) => {
-                  formInst.setFieldValue("nameservers", e.target.value);
+                trigger={
+                  <Button disabled={disabled}>
+                    <FormOutlinedIcon />
+                  </Button>
+                }
+                onChange={(value) => {
+                  formInst.setFieldValue("nameservers", value);
                }}
              />
-            </Form.Item>
-            <NameserversModalInput
-              value={fieldNameservers}
-              trigger={
-                <Button disabled={disabled}>
-                  <FormOutlinedIcon />
-                </Button>
-              }
-              onChange={(value) => {
-                formInst.setFieldValue("nameservers", value);
-              }}
+            </Space.Compact>
+          </Form.Item>
+
+          <Form.Item
+            name="propagationTimeout"
+            label={t("workflow_node.apply.form.propagation_timeout.label")}
+            rules={[formRule]}
+            tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.propagation_timeout.tooltip") }}></span>}
+          >
+            <Input
+              type="number"
+              allowClear
+              min={0}
+              max={3600}
+              placeholder={t("workflow_node.apply.form.propagation_timeout.placeholder")}
+              addonAfter={t("workflow_node.apply.form.propagation_timeout.suffix")}
            />
-          </Space.Compact>
-        </Form.Item>
+          </Form.Item>

-        <Form.Item
-          name="propagationTimeout"
-          label={t("workflow_node.apply.form.propagation_timeout.label")}
-          rules={[formRule]}
-          tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.propagation_timeout.tooltip") }}></span>}
-        >
-          <Input
-            type="number"
-            allowClear
-            min={0}
-            max={3600}
-            placeholder={t("workflow_node.apply.form.propagation_timeout.placeholder")}
-            addonAfter={t("workflow_node.apply.form.propagation_timeout.suffix")}
-          />
-        </Form.Item>
-
-        <Form.Item
-          name="disableFollowCNAME"
-          label={t("workflow_node.apply.form.disable_follow_cname.label")}
-          rules={[formRule]}
-          tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.disable_follow_cname.tooltip") }}></span>}
-        >
-          <Switch />
-        </Form.Item>
-      </Form>
+          <Form.Item
+            name="disableFollowCNAME"
+            label={t("workflow_node.apply.form.disable_follow_cname.label")}
+            rules={[formRule]}
+            tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.disable_follow_cname.tooltip") }}></span>}
+          >
+            <Switch />
+          </Form.Item>
+        </Form>
+      </Form.Provider>
    );
  }
 );
--- a/ui/src/components/workflow/node/ApplyNodeConfigFormAWSRoute53Config.tsx
+++ b/ui/src/components/workflow/node/ApplyNodeConfigFormAWSRoute53Config.tsx
@@ -0,0 +1,81 @@
+import { useTranslation } from "react-i18next";
+import { Form, type FormInstance, Input } from "antd";
+import { createSchemaFieldRule } from "antd-zod";
+import { z } from "zod";
+
+type ApplyNodeConfigFormAWSRoute53ConfigFieldValues = Nullish<{
+  region: string;
+  hostedZoneId: string;
+}>;
+
+export type ApplyNodeConfigFormAWSRoute53ConfigProps = {
+  form: FormInstance;
+  formName: string;
+  disabled?: boolean;
+  initialValues?: ApplyNodeConfigFormAWSRoute53ConfigFieldValues;
+  onValuesChange?: (values: ApplyNodeConfigFormAWSRoute53ConfigFieldValues) => void;
+};
+
+const initFormModel = (): ApplyNodeConfigFormAWSRoute53ConfigFieldValues => {
+  return {
+    region: "us-east-1",
+    hostedZoneId: "",
+  };
+};
+
+const ApplyNodeConfigFormAWSRoute53Config = ({
+  form: formInst,
+  formName,
+  disabled,
+  initialValues,
+  onValuesChange,
+}: ApplyNodeConfigFormAWSRoute53ConfigProps) => {
+  const { t } = useTranslation();
+
+  const formSchema = z.object({
+    region: z
+      .string({ message: t("workflow_node.apply.form.aws_route53_region.placeholder") })
+      .nonempty(t("workflow_node.apply.form.aws_route53_region.placeholder"))
+      .trim(),
+    hostedZoneId: z
+      .string({ message: t("workflow_node.apply.form.aws_route53_hosted_zone_id.placeholder") })
+      .nonempty(t("workflow_node.apply.form.aws_route53_hosted_zone_id.placeholder"))
+      .trim(),
+  });
+  const formRule = createSchemaFieldRule(formSchema);
+
+  const handleFormChange = (_: unknown, values: z.infer<typeof formSchema>) => {
+    onValuesChange?.(values);
+  };
+
+  return (
+    <Form
+      form={formInst}
+      disabled={disabled}
+      initialValues={initialValues ?? initFormModel()}
+      layout="vertical"
+      name={formName}
+      onValuesChange={handleFormChange}
+    >
+      <Form.Item
+        name="region"
+        label={t("workflow_node.apply.form.aws_route53_region.label")}
+        rules={[formRule]}
+        tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.aws_route53_region.tooltip") }}></span>}
+      >
+        <Input placeholder={t("workflow_node.apply.form.aws_route53_region.placeholder")} />
+      </Form.Item>
+
+      <Form.Item
+        name="hostedZoneId"
+        label={t("workflow_node.apply.form.aws_route53_hosted_zone_id.label")}
+        rules={[formRule]}
+        tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.aws_route53_hosted_zone_id.tooltip") }}></span>}
+      >
+        <Input placeholder={t("workflow_node.apply.form.aws_route53_hosted_zone_id.placeholder")} />
+      </Form.Item>
+    </Form>
+  );
+};
+
+export default ApplyNodeConfigFormAWSRoute53Config;
--- a/ui/src/components/workflow/node/ApplyNodeConfigFormHuaweiCloudDNSConfig.tsx
+++ b/ui/src/components/workflow/node/ApplyNodeConfigFormHuaweiCloudDNSConfig.tsx
@@ -0,0 +1,66 @@
+import { useTranslation } from "react-i18next";
+import { Form, type FormInstance, Input } from "antd";
+import { createSchemaFieldRule } from "antd-zod";
+import { z } from "zod";
+
+type ApplyNodeConfigFormHuaweiCloudDNSConfigFieldValues = Nullish<{
+  region: string;
+}>;
+
+export type ApplyNodeConfigFormHuaweiCloudDNSConfigProps = {
+  form: FormInstance;
+  formName: string;
+  disabled?: boolean;
+  initialValues?: ApplyNodeConfigFormHuaweiCloudDNSConfigFieldValues;
+  onValuesChange?: (values: ApplyNodeConfigFormHuaweiCloudDNSConfigFieldValues) => void;
+};
+
+const initFormModel = (): ApplyNodeConfigFormHuaweiCloudDNSConfigFieldValues => {
+  return {
+    region: "cn-north-1",
+  };
+};
+
+const ApplyNodeConfigFormHuaweiCloudDNSConfig = ({
+  form: formInst,
+  formName,
+  disabled,
+  initialValues,
+  onValuesChange,
+}: ApplyNodeConfigFormHuaweiCloudDNSConfigProps) => {
+  const { t } = useTranslation();
+
+  const formSchema = z.object({
+    region: z
+      .string({ message: t("workflow_node.apply.form.huaweicloud_dns_region.placeholder") })
+      .nonempty(t("workflow_node.apply.form.huaweicloud_dns_region.placeholder"))
+      .trim(),
+  });
+  const formRule = createSchemaFieldRule(formSchema);
+
+  const handleFormChange = (_: unknown, values: z.infer<typeof formSchema>) => {
+    onValuesChange?.(values);
+  };
+
+  return (
+    <Form
+      form={formInst}
+      disabled={disabled}
+      initialValues={initialValues ?? initFormModel()}
+      layout="vertical"
+      name={formName}
+      onValuesChange={handleFormChange}
+    >
+      <Form.Item
+        name="region"
+        label={t("workflow_node.apply.form.huaweicloud_dns_region.label")}
+        rules={[formRule]}
+        tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.apply.form.huaweicloud_dns_region.tooltip") }}></span>}
+      >
+        <Input placeholder={t("workflow_node.apply.form.huaweicloud_dns_region.placeholder")} />
+      </Form.Item>
+    </Form>
+  );
+};
+
+export default ApplyNodeConfigFormHuaweiCloudDNSConfig;
--- a/ui/src/components/workflow/node/DeployNodeConfigForm.tsx
+++ b/ui/src/components/workflow/node/DeployNodeConfigForm.tsx
@@ -80,7 +80,8 @@ const DeployNodeConfigForm = forwardRef<DeployNodeConfigFormInstance, DeployNode
      provider: z.string({ message: t("workflow_node.deploy.form.provider.placeholder") }).nonempty(t("workflow_node.deploy.form.provider.placeholder")),
      providerAccessId: z
        .string({ message: t("workflow_node.deploy.form.provider_access.placeholder") })
-        .nonempty(t("workflow_node.deploy.form.provider_access.placeholder")),
+        .nonempty(t("workflow_node.deploy.form.provider_access.placeholder"))
+        .refine(() => !!formInst.getFieldValue("provider"), t("workflow_node.deploy.form.provider.placeholder")),
      providerConfig: z.any(),
    });
    const formRule = createSchemaFieldRule(formSchema);
@@ -200,10 +201,16 @@ const DeployNodeConfigForm = forwardRef<DeployNodeConfigFormInstance, DeployNode
    useImperativeHandle(ref, () => {
      return {
        getFieldsValue: () => {
-          return formInst.getFieldsValue(true);
+          const values = formInst.getFieldsValue(true);
+          values.providerConfig = nestedFormInst.getFieldsValue();
+          return values;
        },
        resetFields: (fields) => {
-          return formInst.resetFields(fields);
+          formInst.resetFields(fields);
+
+          if (!!fields && fields.includes("providerConfig")) {
+            nestedFormInst.resetFields(fields);
+          }
        },
        validateFields: (nameList, config) => {
          const t1 = formInst.validateFields(nameList, config);
@@ -297,16 +304,18 @@ const DeployNodeConfigForm = forwardRef<DeployNodeConfigFormInstance, DeployNode
                placeholder={t("workflow_node.deploy.form.certificate.placeholder")}
              />
            </Form.Item>
-
-            <Divider className="my-1">
-              <Typography.Text className="text-xs font-normal" type="secondary">
-                {t("workflow_node.deploy.form.params_config.label")}
-              </Typography.Text>
-            </Divider>
          </Show>
        </Form>

-        <Show when={!!fieldProvider}>{nestedFormEl}</Show>
+        <Show when={!!fieldProvider}>
+          <Divider className="my-1">
+            <Typography.Text className="text-xs font-normal" type="secondary">
+              {t("workflow_node.deploy.form.params_config.label")}
+            </Typography.Text>
+          </Divider>
+
+          {nestedFormEl}
+        </Show>
      </Form.Provider>
    );
  }
--- a/ui/src/domain/workflow.ts
+++ b/ui/src/domain/workflow.ts
@@ -105,6 +105,7 @@ export type WorkflowNodeConfigForApply = {
  contactEmail: string;
  provider: string;
  providerAccessId: string;
+  providerConfig?: Record<string, unknown>;
  keyAlgorithm: string;
  nameservers?: string;
  propagationTimeout?: number;
--- a/ui/src/i18n/locales/en/nls.access.json
+++ b/ui/src/i18n/locales/en/nls.access.json
@@ -45,12 +45,6 @@
  "access.form.aws_secret_access_key.label": "AWS SecretAccessKey",
  "access.form.aws_secret_access_key.placeholder": "Please enter AWS SecretAccessKey",
  "access.form.aws_secret_access_key.tooltip": "For more information, see <a href=\"https://docs.aws.amazon.com/en_us/IAM/latest/UserGuide/id_credentials_access-keys.html\" target=\"_blank\">https://docs.aws.amazon.com/en_us/IAM/latest/UserGuide/id_credentials_access-keys.html</a>",
-  "access.form.aws_region.label": "AWS Region",
-  "access.form.aws_region.placeholder": "Please enter AWS region (e.g. us-east-1)",
-  "access.form.aws_region.tooltip": "For more information, see <a href=\"https://docs.aws.amazon.com/en_us/general/latest/gr/rande.html#regional-endpoints\" target=\"_blank\">https://docs.aws.amazon.com/en_us/general/latest/gr/rande.html#regional-endpoints</a>",
-  "access.form.aws_hosted_zone_id.label": "AWS hosted zone ID",
-  "access.form.aws_hosted_zone_id.placeholder": "Please enter AWS hosted zone ID",
-  "access.form.aws_hosted_zone_id.tooltip": "For more information, see <a href=\"https://docs.aws.amazon.com/en_us/Route53/latest/DeveloperGuide/hosted-zones-working-with.html\" target=\"_blank\">https://docs.aws.amazon.com/en_us/Route53/latest/DeveloperGuide/hosted-zones-working-with.html</a>",
  "access.form.baiducloud_access_key_id.label": "Baidu Cloud AccessKeyID",
  "access.form.baiducloud_access_key_id.placeholder": "Please enter Baidu Cloud AccessKeyID",
  "access.form.baiducloud_access_key_id.tooltip": "For more information, see <a href=\"https://intl.cloud.baidu.com/doc/Reference/s/jjwvz2e3p-en\" target=\"_blank\">https://intl.cloud.baidu.com/doc/Reference/s/jjwvz2e3p-en</a>",
@@ -84,9 +78,6 @@
  "access.form.huaweicloud_secret_access_key.label": "Huawei Cloud SecretAccessKey",
  "access.form.huaweicloud_secret_access_key.placeholder": "Please enter Huawei Cloud SecretAccessKey",
  "access.form.huaweicloud_secret_access_key.tooltip": "For more information, see <a href=\"https://support.huaweicloud.com/intl/en-us/usermanual-ca/ca_01_0003.html\" target=\"_blank\">https://support.huaweicloud.com/intl/en-us/usermanual-ca/ca_01_0003.html</a>",
-  "access.form.huaweicloud_region.label": "Huawei Cloud region",
-  "access.form.huaweicloud_region.placeholder": "Please enter Huawei Cloud region (e.g. cn-north-1)",
-  "access.form.huaweicloud_region.tooltip": "For more information, see <a href=\"https://console-intl.huaweicloud.com/apiexplorer/#/endpoint?locale=en-us\" target=\"_blank\">https://console-intl.huaweicloud.com/apiexplorer/#/endpoint</a>",
  "access.form.k8s_kubeconfig.label": "KubeConfig",
  "access.form.k8s_kubeconfig.placeholder": "Please enter KubeConfig file",
  "access.form.k8s_kubeconfig.upload": "Choose File ...",
--- a/ui/src/i18n/locales/en/nls.workflow.nodes.json
+++ b/ui/src/i18n/locales/en/nls.workflow.nodes.json
@@ -37,6 +37,15 @@
  "workflow_node.apply.form.provider_access.placeholder": "Please select an authorization of DNS provider",
  "workflow_node.apply.form.provider_access.tooltip": "Used to manage DNS records during ACME DNS-01 authentication.",
  "workflow_node.apply.form.provider_access.button": "Create",
+  "workflow_node.apply.form.aws_route53_region.label": "AWS Route53 Region",
+  "workflow_node.apply.form.aws_route53_region.placeholder": "Please enter AWS Route53 region (e.g. us-east-1)",
+  "workflow_node.apply.form.aws_route53_region.tooltip": "For more information, see <a href=\"https://docs.aws.amazon.com/en_us/general/latest/gr/rande.html#regional-endpoints\" target=\"_blank\">https://docs.aws.amazon.com/en_us/general/latest/gr/rande.html#regional-endpoints</a>",
+  "workflow_node.apply.form.aws_route53_hosted_zone_id.label": "AWS Route53 hosted zone ID",
+  "workflow_node.apply.form.aws_route53_hosted_zone_id.placeholder": "Please enter AWS Route53 hosted zone ID",
+  "workflow_node.apply.form.aws_route53_hosted_zone_id.tooltip": "For more information, see <a href=\"https://docs.aws.amazon.com/en_us/Route53/latest/DeveloperGuide/hosted-zones-working-with.html\" target=\"_blank\">https://docs.aws.amazon.com/en_us/Route53/latest/DeveloperGuide/hosted-zones-working-with.html</a>",
+  "workflow_node.apply.form.huaweicloud_dns_region.label": "Huawei Cloud DNS region",
+  "workflow_node.apply.form.huaweicloud_dns_region.placeholder": "Please enter Huawei Cloud DNS region (e.g. cn-north-1)",
+  "workflow_node.apply.form.huaweicloud_dns_region.tooltip": "For more information, see <a href=\"https://console-intl.huaweicloud.com/apiexplorer/#/endpoint?locale=en-us\" target=\"_blank\">https://console-intl.huaweicloud.com/apiexplorer/#/endpoint</a>",
  "workflow_node.apply.form.advanced_config.label": "Advanced settings",
  "workflow_node.apply.form.key_algorithm.label": "Certificate key algorithm",
  "workflow_node.apply.form.key_algorithm.placeholder": "Please select certificate key algorithm",
--- a/ui/src/i18n/locales/zh/nls.access.json
+++ b/ui/src/i18n/locales/zh/nls.access.json
@@ -45,12 +45,6 @@
  "access.form.aws_secret_access_key.label": "AWS SecretAccessKey",
  "access.form.aws_secret_access_key.placeholder": "请输入 AWS SecretAccessKey",
  "access.form.aws_secret_access_key.tooltip": "这是什么？请参阅 <a href=\"https://docs.aws.amazon.com/zh_cn/IAM/latest/UserGuide/id_credentials_access-keys.html\" target=\"_blank\">https://docs.aws.amazon.com/zh_cn/IAM/latest/UserGuide/id_credentials_access-keys.html</a>",
-  "access.form.aws_region.label": "AWS 区域",
-  "access.form.aws_region.placeholder": "请输入 AWS 区域（例如：us-east-1）",
-  "access.form.aws_region.tooltip": "这是什么？请参阅 <a href=\"https://docs.aws.amazon.com/zh_cn/general/latest/gr/rande.html#regional-endpoints\" target=\"_blank\">https://docs.aws.amazon.com/zh_cn/general/latest/gr/rande.html#regional-endpoints</a>",
-  "access.form.aws_hosted_zone_id.label": "AWS 托管区域 ID",
-  "access.form.aws_hosted_zone_id.placeholder": "请输入 AWS 托管区域 ID",
-  "access.form.aws_hosted_zone_id.tooltip": "这是什么？请参阅 <a href=\"https://docs.aws.amazon.com/zh_cn/Route53/latest/DeveloperGuide/hosted-zones-working-with.html\" target=\"_blank\">https://docs.aws.amazon.com/zh_cn/Route53/latest/DeveloperGuide/hosted-zones-working-with.html</a>",
  "access.form.baiducloud_access_key_id.label": "百度智能云 AccessKeyID",
  "access.form.baiducloud_access_key_id.placeholder": "请输入百度智能云 AccessKeyID",
  "access.form.baiducloud_access_key_id.tooltip": "这是什么？请参阅 <a href=\"https://cloud.baidu.com/doc/Reference/s/jjwvz2e3p\" target=\"_blank\">https://cloud.baidu.com/doc/Reference/s/jjwvz2e3p</a>",
@@ -84,9 +78,6 @@
  "access.form.huaweicloud_secret_access_key.label": "华为云 SecretAccessKey",
  "access.form.huaweicloud_secret_access_key.placeholder": "请输入华为云 SecretAccessKey",
  "access.form.huaweicloud_secret_access_key.tooltip": "这是什么？请参阅 <a href=\"https://support.huaweicloud.com/usermanual-ca/ca_01_0003.html\" target=\"_blank\">https://support.huaweicloud.com/usermanual-ca/ca_01_0003.html</a>",
-  "access.form.huaweicloud_region.label": "华为云区域",
-  "access.form.huaweicloud_region.placeholder": "请输入华为云区域（例如：cn-north-1）",
-  "access.form.huaweicloud_region.tooltip": "这是什么？请参阅 <a href=\"https://console.huaweicloud.com/apiexplorer/#/endpoint\" target=\"_blank\">https://console.huaweicloud.com/apiexplorer/#/endpoint</a>",
  "access.form.k8s_kubeconfig.label": "KubeConfig",
  "access.form.k8s_kubeconfig.placeholder": "请选择 KubeConfig 文件",
  "access.form.k8s_kubeconfig.upload": "选择文件",
--- a/ui/src/i18n/locales/zh/nls.workflow.json
+++ b/ui/src/i18n/locales/zh/nls.workflow.json
@@ -9,7 +9,7 @@
  "workflow.action.delete.confirm": "确定要删除此工作流吗？",
  "workflow.action.enable": "启用",
  "workflow.action.enable.failed.uncompleted": "请先完成流程编排并发布更改",
-  "workflow.action.disable": "禁用",
+  "workflow.action.disable": "停用",

  "workflow.props.name": "名称",
  "workflow.props.description": "描述",
--- a/ui/src/i18n/locales/zh/nls.workflow.nodes.json
+++ b/ui/src/i18n/locales/zh/nls.workflow.nodes.json
@@ -37,6 +37,15 @@
  "workflow_node.apply.form.provider_access.placeholder": "请选择 DNS 提供商授权",
  "workflow_node.apply.form.provider_access.tooltip": "用于 ACME DNS-01 认证时操作域名解析记录，注意与部署阶段所需的主机提供商相区分。",
  "workflow_node.apply.form.provider_access.button": "新建",
+  "workflow_node.apply.form.aws_route53_region.label": "AWS Route53 区域",
+  "workflow_node.apply.form.aws_route53_region.placeholder": "请输入 AWS Route53 区域（例如：us-east-1）",
+  "workflow_node.apply.form.aws_route53_region.tooltip": "这是什么？请参阅 <a href=\"https://docs.aws.amazon.com/zh_cn/general/latest/gr/rande.html#regional-endpoints\" tworkflow_node.applyank\">https://docs.aws.amazon.com/zh_cn/general/latest/gr/rande.html#regional-endpoints</a>",
+  "workflow_node.apply.form.aws_route53_hosted_zone_id.label": "AWS Route53 托管区域 ID",
+  "workflow_node.apply.form.aws_route53_hosted_zone_id.placeholder": "请输入 AWS Route53 托管区域 ID",
+  "workflow_node.apply.form.aws_route53_hosted_zone_id.tooltip": "这是什么？请参阅 <a href=\"https://docs.aws.amazon.com/zh_cn/Route53/latest/DeveloperGuide/hosted-zones-working-with.html\" target=\"_blank\">https://docs.aws.amazon.com/zh_cn/Route53/latest/DeveloperGuide/hosted-zones-working-with.html</a>",
+  "workflow_node.apply.form.huaweicloud_dns_region.label": "华为云 DNS 服务区域",
+  "workflow_node.apply.form.huaweicloud_dns_region.placeholder": "请输入华为云 DNS 服务区域（例如：cn-north-1）",
+  "workflow_node.apply.form.huaweicloud_dns_region.tooltip": "这是什么？请参阅 <a href=\"https://console.huaweicloud.com/apiexplorer/#/endpoint\" target=\"_blank\">https://console.huaweicloud.com/apiexplorer/#/endpoint</a>",
  "workflow_node.apply.form.advanced_config.label": "高级设置",
  "workflow_node.apply.form.key_algorithm.label": "数字证书算法",
  "workflow_node.apply.form.key_algorithm.placeholder": "请选择数字证书算法",