fix conflict

This commit is contained in:
Yoan.liu
2025-02-12 09:53:09 +08:00
42 changed files with 1923 additions and 157 deletions

View File

@@ -16,15 +16,18 @@ import { useAntdForm, useAntdFormName, useZustandShallowSelector } from "@/hooks
import { useWorkflowStore } from "@/stores/workflow";
import DeployNodeConfigFormAliyunALBConfig from "./DeployNodeConfigFormAliyunALBConfig";
import DeployNodeConfigFormAliyunCASDeployConfig from "./DeployNodeConfigFormAliyunCASDeployConfig";
import DeployNodeConfigFormAliyunCDNConfig from "./DeployNodeConfigFormAliyunCDNConfig";
import DeployNodeConfigFormAliyunCLBConfig from "./DeployNodeConfigFormAliyunCLBConfig";
import DeployNodeConfigFormAliyunDCDNConfig from "./DeployNodeConfigFormAliyunDCDNConfig";
import DeployNodeConfigFormAliyunESAConfig from "./DeployNodeConfigFormAliyunESAConfig";
import DeployNodeConfigFormAliyunLiveConfig from "./DeployNodeConfigFormAliyunLiveConfig";
import DeployNodeConfigFormAliyunNLBConfig from "./DeployNodeConfigFormAliyunNLBConfig";
import DeployNodeConfigFormAliyunOSSConfig from "./DeployNodeConfigFormAliyunOSSConfig";
import DeployNodeConfigFormAliyunWAFConfig from "./DeployNodeConfigFormAliyunWAFConfig";
import DeployNodeConfigFormAWSCloudFrontConfig from "./DeployNodeConfigFormAWSCloudFrontConfig";
import DeployNodeConfigFormBaiduCloudCDNConfig from "./DeployNodeConfigFormBaiduCloudCDNConfig";
import DeployNodeConfigFormBaotaPanelSiteConfig from "./DeployNodeConfigFormBaotaPanelSiteConfig";
import DeployNodeConfigFormBytePlusCDNConfig from "./DeployNodeConfigFormBytePlusCDNConfig";
import DeployNodeConfigFormDogeCloudCDNConfig from "./DeployNodeConfigFormDogeCloudCDNConfig";
import DeployNodeConfigFormEdgioApplicationsConfig from "./DeployNodeConfigFormEdgioApplicationsConfig";
@@ -41,6 +44,7 @@ import DeployNodeConfigFormTencentCloudCOSConfig from "./DeployNodeConfigFormTen
import DeployNodeConfigFormTencentCloudCSSConfig from "./DeployNodeConfigFormTencentCloudCSSConfig.tsx";
import DeployNodeConfigFormTencentCloudECDNConfig from "./DeployNodeConfigFormTencentCloudECDNConfig.tsx";
import DeployNodeConfigFormTencentCloudEOConfig from "./DeployNodeConfigFormTencentCloudEOConfig.tsx";
import DeployNodeConfigFormTencentCloudSSLDeployConfig from "./DeployNodeConfigFormTencentCloudSSLDeployConfig";
import DeployNodeConfigFormUCloudUCDNConfig from "./DeployNodeConfigFormUCloudUCDNConfig.tsx";
import DeployNodeConfigFormUCloudUS3Config from "./DeployNodeConfigFormUCloudUS3Config.tsx";
import DeployNodeConfigFormVolcEngineCDNConfig from "./DeployNodeConfigFormVolcEngineCDNConfig.tsx";
@@ -123,12 +127,16 @@ const DeployNodeConfigForm = forwardRef<DeployNodeConfigFormInstance, DeployNode
switch (fieldProvider) {
case DEPLOY_PROVIDERS.ALIYUN_ALB:
return <DeployNodeConfigFormAliyunALBConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.ALIYUN_CAS_DEPLOY:
return <DeployNodeConfigFormAliyunCASDeployConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.ALIYUN_CLB:
return <DeployNodeConfigFormAliyunCLBConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.ALIYUN_CDN:
return <DeployNodeConfigFormAliyunCDNConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.ALIYUN_DCDN:
return <DeployNodeConfigFormAliyunDCDNConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.ALIYUN_ESA:
return <DeployNodeConfigFormAliyunESAConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.ALIYUN_LIVE:
return <DeployNodeConfigFormAliyunLiveConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.ALIYUN_NLB:
@@ -141,6 +149,8 @@ const DeployNodeConfigForm = forwardRef<DeployNodeConfigFormInstance, DeployNode
return <DeployNodeConfigFormAWSCloudFrontConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.BAIDUCLOUD_CDN:
return <DeployNodeConfigFormBaiduCloudCDNConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.BAOTAPANEL_SITE:
return <DeployNodeConfigFormBaotaPanelSiteConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.BYTEPLUS_CDN:
return <DeployNodeConfigFormBytePlusCDNConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.DOGECLOUD_CDN:
@@ -173,6 +183,8 @@ const DeployNodeConfigForm = forwardRef<DeployNodeConfigFormInstance, DeployNode
return <DeployNodeConfigFormTencentCloudECDNConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.TENCENTCLOUD_EO:
return <DeployNodeConfigFormTencentCloudEOConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.TENCENTCLOUD_SSL_DEPLOY:
return <DeployNodeConfigFormTencentCloudSSLDeployConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.UCLOUD_UCDN:
return <DeployNodeConfigFormUCloudUCDNConfig {...nestedFormProps} />;
case DEPLOY_PROVIDERS.UCLOUD_US3:
@@ -261,7 +273,7 @@ const DeployNodeConfigForm = forwardRef<DeployNodeConfigFormInstance, DeployNode
<Form className={className} style={style} {...formProps} disabled={disabled} layout="vertical" scrollToFirstError onValuesChange={handleFormChange}>
<Show
when={!!fieldProvider}
fallback={<DeployProviderPicker placeholder={t("workflow_node.deploy.search.provider.placeholder")} onSelect={handleProviderPick} />}
fallback={<DeployProviderPicker autoFocus placeholder={t("workflow_node.deploy.search.provider.placeholder")} onSelect={handleProviderPick} />}
>
<Form.Item name="provider" label={t("workflow_node.deploy.form.provider.label")} rules={[formRule]}>
<DeployProviderSelect

View File

@@ -0,0 +1,235 @@
import { memo } from "react";
import { useTranslation } from "react-i18next";
import { FormOutlined as FormOutlinedIcon } from "@ant-design/icons";
import { Alert, Button, Form, type FormInstance, Input, Space } from "antd";
import { createSchemaFieldRule } from "antd-zod";
import { z } from "zod";
import ModalForm from "@/components/ModalForm";
import MultipleInput from "@/components/MultipleInput";
import { useAntdForm } from "@/hooks";
type DeployNodeConfigFormAliyunCASDeployConfigFieldValues = Nullish<{
region: string;
resourceIds: string;
contactIds?: string;
}>;
export type DeployNodeConfigFormAliyunCASDeployConfigProps = {
form: FormInstance;
formName: string;
disabled?: boolean;
initialValues?: DeployNodeConfigFormAliyunCASDeployConfigFieldValues;
onValuesChange?: (values: DeployNodeConfigFormAliyunCASDeployConfigFieldValues) => void;
};
const MULTIPLE_INPUT_DELIMITER = ";";
const initFormModel = (): DeployNodeConfigFormAliyunCASDeployConfigFieldValues => {
return {};
};
const DeployNodeConfigFormAliyunCASDeployConfig = ({
form: formInst,
formName,
disabled,
initialValues,
onValuesChange,
}: DeployNodeConfigFormAliyunCASDeployConfigProps) => {
const { t } = useTranslation();
const formSchema = z.object({
region: z
.string({ message: t("workflow_node.deploy.form.aliyun_cas_deploy_region.placeholder") })
.nonempty(t("workflow_node.deploy.form.aliyun_cas_deploy_region.placeholder"))
.trim(),
resourceIds: z.string({ message: t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.placeholder") }).refine((v) => {
return String(v)
.split(MULTIPLE_INPUT_DELIMITER)
.every((e) => /^[1-9]\d*$/.test(e));
}, t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.errmsg.invalid")),
contactIds: z
.string({ message: t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.placeholder") })
.nullish()
.refine((v) => {
if (!v) return true;
return String(v)
.split(MULTIPLE_INPUT_DELIMITER)
.every((e) => /^[1-9]\d*$/.test(e));
}, t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.errmsg.invalid")),
});
const formRule = createSchemaFieldRule(formSchema);
const fieldResourceIds = Form.useWatch<string>("resourceIds", formInst);
const fieldContactIds = Form.useWatch<string>("contactIds", formInst);
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.deploy.form.aliyun_cas_deploy_region.label")}
rules={[formRule]}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.aliyun_cas_deploy_region.tooltip") }}></span>}
>
<Input placeholder={t("workflow_node.deploy.form.aliyun_cas_deploy_region.placeholder")} />
</Form.Item>
<Form.Item
label={t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.label")}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.tooltip") }}></span>}
>
<Space.Compact style={{ width: "100%" }}>
<Form.Item name="resourceIds" noStyle rules={[formRule]}>
<Input
allowClear
disabled={disabled}
value={fieldResourceIds}
placeholder={t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.placeholder")}
onChange={(e) => {
formInst.setFieldValue("resourceIds", e.target.value);
}}
/>
</Form.Item>
<ResourceIdsModalInput
value={fieldResourceIds}
trigger={
<Button disabled={disabled}>
<FormOutlinedIcon />
</Button>
}
onChange={(value) => {
formInst.setFieldValue("resourceIds", value);
}}
/>
</Space.Compact>
</Form.Item>
<Form.Item
label={t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.label")}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.tooltip") }}></span>}
>
<Space.Compact style={{ width: "100%" }}>
<Form.Item name="contactIds" noStyle rules={[formRule]}>
<Input
allowClear
disabled={disabled}
value={fieldContactIds}
placeholder={t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.placeholder")}
onChange={(e) => {
formInst.setFieldValue("contactIds", e.target.value);
}}
/>
</Form.Item>
<ContactIdsModalInput
value={fieldContactIds}
trigger={
<Button disabled={disabled}>
<FormOutlinedIcon />
</Button>
}
onChange={(value) => {
formInst.setFieldValue("contactIds", value);
}}
/>
</Space.Compact>
</Form.Item>
<Form.Item>
<Alert type="info" message={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.aliyun_cas_deploy.guide") }}></span>} />
</Form.Item>
</Form>
);
};
const ResourceIdsModalInput = memo(({ value, trigger, onChange }: { value?: string; trigger?: React.ReactNode; onChange?: (value: string) => void }) => {
const { t } = useTranslation();
const formSchema = z.object({
resourceIds: z.array(z.string()).refine((v) => {
return v.every((e) => !e?.trim() || /^[1-9]\d*$/.test(e));
}, t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.errmsg.invalid")),
});
const formRule = createSchemaFieldRule(formSchema);
const { form: formInst, formProps } = useAntdForm({
name: "workflowNodeDeployConfigFormAliyunCASResourceIdsModalInput",
initialValues: { resourceIds: value?.split(MULTIPLE_INPUT_DELIMITER) },
onSubmit: (values) => {
onChange?.(
values.resourceIds
.map((e) => e.trim())
.filter((e) => !!e)
.join(MULTIPLE_INPUT_DELIMITER)
);
},
});
return (
<ModalForm
{...formProps}
layout="vertical"
form={formInst}
modalProps={{ destroyOnClose: true }}
title={t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.multiple_input_modal.title")}
trigger={trigger}
validateTrigger="onSubmit"
width={480}
>
<Form.Item name="resourceIds" rules={[formRule]}>
<MultipleInput placeholder={t("workflow_node.deploy.form.aliyun_cas_deploy_resource_ids.multiple_input_modal.placeholder")} />
</Form.Item>
</ModalForm>
);
});
const ContactIdsModalInput = memo(({ value, trigger, onChange }: { value?: string; trigger?: React.ReactNode; onChange?: (value: string) => void }) => {
const { t } = useTranslation();
const formSchema = z.object({
contactIds: z.array(z.string()).refine((v) => {
return v.every((e) => !e?.trim() || /^[1-9]\d*$/.test(e));
}, t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.errmsg.invalid")),
});
const formRule = createSchemaFieldRule(formSchema);
const { form: formInst, formProps } = useAntdForm({
name: "workflowNodeDeployConfigFormAliyunCASDeploymentJobContactIdsModalInput",
initialValues: { contactIds: value?.split(MULTIPLE_INPUT_DELIMITER) },
onSubmit: (values) => {
onChange?.(
values.contactIds
.map((e) => e.trim())
.filter((e) => !!e)
.join(MULTIPLE_INPUT_DELIMITER)
);
},
});
return (
<ModalForm
{...formProps}
layout="vertical"
form={formInst}
modalProps={{ destroyOnClose: true }}
title={t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.multiple_input_modal.title")}
trigger={trigger}
validateTrigger="onSubmit"
width={480}
>
<Form.Item name="contactIds" rules={[formRule]}>
<MultipleInput placeholder={t("workflow_node.deploy.form.aliyun_cas_deploy_contact_ids.multiple_input_modal.placeholder")} />
</Form.Item>
</ModalForm>
);
});
export default DeployNodeConfigFormAliyunCASDeployConfig;

View File

@@ -0,0 +1,78 @@
import { useTranslation } from "react-i18next";
import { Form, type FormInstance, Input } from "antd";
import { createSchemaFieldRule } from "antd-zod";
import { z } from "zod";
type DeployNodeConfigFormAliyunESAConfigFieldValues = Nullish<{
region: string;
siteId: string;
}>;
export type DeployNodeConfigFormAliyunESAConfigProps = {
form: FormInstance;
formName: string;
disabled?: boolean;
initialValues?: DeployNodeConfigFormAliyunESAConfigFieldValues;
onValuesChange?: (values: DeployNodeConfigFormAliyunESAConfigFieldValues) => void;
};
const initFormModel = (): DeployNodeConfigFormAliyunESAConfigFieldValues => {
return {};
};
const DeployNodeConfigFormAliyunESAConfig = ({
form: formInst,
formName,
disabled,
initialValues,
onValuesChange,
}: DeployNodeConfigFormAliyunESAConfigProps) => {
const { t } = useTranslation();
const formSchema = z.object({
region: z
.string({ message: t("workflow_node.deploy.form.aliyun_esa_region.placeholder") })
.nonempty(t("workflow_node.deploy.form.aliyun_esa_region.placeholder"))
.trim(),
siteId: z
.string({ message: t("workflow_node.deploy.form.aliyun_esa_site_id.placeholder") })
.regex(/^[1-9]\d*$/, t("workflow_node.deploy.form.aliyun_esa_site_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.deploy.form.aliyun_esa_region.label")}
rules={[formRule]}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.aliyun_esa_region.tooltip") }}></span>}
>
<Input placeholder={t("workflow_node.deploy.form.aliyun_esa_region.placeholder")} />
</Form.Item>
<Form.Item
name="siteId"
label={t("workflow_node.deploy.form.aliyun_esa_site_id.label")}
rules={[formRule]}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.aliyun_esa_site_id.tooltip") }}></span>}
>
<Input placeholder={t("workflow_node.deploy.form.aliyun_esa_site_id.placeholder")} />
</Form.Item>
</Form>
);
};
export default DeployNodeConfigFormAliyunESAConfig;

View File

@@ -0,0 +1,64 @@
import { useTranslation } from "react-i18next";
import { Form, type FormInstance, Input } from "antd";
import { createSchemaFieldRule } from "antd-zod";
import { z } from "zod";
type DeployNodeConfigFormBaotaPanelSiteConfigFieldValues = Nullish<{
siteName: string;
}>;
export type DeployNodeConfigFormBaotaPanelSiteConfigProps = {
form: FormInstance;
formName: string;
disabled?: boolean;
initialValues?: DeployNodeConfigFormBaotaPanelSiteConfigFieldValues;
onValuesChange?: (values: DeployNodeConfigFormBaotaPanelSiteConfigFieldValues) => void;
};
const initFormModel = (): DeployNodeConfigFormBaotaPanelSiteConfigFieldValues => {
return {};
};
const DeployNodeConfigFormBaotaPanelSiteConfig = ({
form: formInst,
formName,
disabled,
initialValues,
onValuesChange,
}: DeployNodeConfigFormBaotaPanelSiteConfigProps) => {
const { t } = useTranslation();
const formSchema = z.object({
siteName: z
.string({ message: t("workflow_node.deploy.form.baotapanel_site_name.placeholder") })
.nonempty(t("workflow_node.deploy.form.baotapanel_site_name.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="siteName"
label={t("workflow_node.deploy.form.baotapanel_site_name.label")}
rules={[formRule]}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.baotapanel_site_name.tooltip") }}></span>}
>
<Input placeholder={t("workflow_node.deploy.form.baotapanel_site_name.placeholder")} />
</Form.Item>
</Form>
);
};
export default DeployNodeConfigFormBaotaPanelSiteConfig;

View File

@@ -22,14 +22,14 @@ export type DeployNodeConfigFormTencentCloudCLBConfigProps = {
onValuesChange?: (values: DeployNodeConfigFormTencentCloudCLBConfigFieldValues) => void;
};
const RESOURCE_TYPE_SSLDEPLOY = "ssl-deploy" as const;
const RESOURCE_TYPE_VIA_SSLDEPLOY = "ssl-deploy" as const;
const RESOURCE_TYPE_LOADBALANCER = "loadbalancer" as const;
const RESOURCE_TYPE_LISTENER = "listener" as const;
const RESOURCE_TYPE_RULEDOMAIN = "ruledomain" as const;
const initFormModel = (): DeployNodeConfigFormTencentCloudCLBConfigFieldValues => {
return {
resourceType: RESOURCE_TYPE_SSLDEPLOY,
resourceType: RESOURCE_TYPE_VIA_SSLDEPLOY,
};
};
@@ -44,7 +44,7 @@ const DeployNodeConfigFormTencentCloudCLBConfig = ({
const formSchema = z.object({
resourceType: z.union(
[z.literal(RESOURCE_TYPE_SSLDEPLOY), z.literal(RESOURCE_TYPE_LOADBALANCER), z.literal(RESOURCE_TYPE_LISTENER), z.literal(RESOURCE_TYPE_RULEDOMAIN)],
[z.literal(RESOURCE_TYPE_VIA_SSLDEPLOY), z.literal(RESOURCE_TYPE_LOADBALANCER), z.literal(RESOURCE_TYPE_LISTENER), z.literal(RESOURCE_TYPE_RULEDOMAIN)],
{ message: t("workflow_node.deploy.form.tencentcloud_clb_resource_type.placeholder") }
),
region: z
@@ -62,7 +62,7 @@ const DeployNodeConfigFormTencentCloudCLBConfig = ({
.trim()
.nullish()
.refine(
(v) => ![RESOURCE_TYPE_SSLDEPLOY, RESOURCE_TYPE_LISTENER, RESOURCE_TYPE_RULEDOMAIN].includes(fieldResourceType) || !!v?.trim(),
(v) => ![RESOURCE_TYPE_VIA_SSLDEPLOY, RESOURCE_TYPE_LISTENER, RESOURCE_TYPE_RULEDOMAIN].includes(fieldResourceType) || !!v?.trim(),
t("workflow_node.deploy.form.tencentcloud_clb_listener_id.placeholder")
),
domain: z
@@ -89,7 +89,7 @@ const DeployNodeConfigFormTencentCloudCLBConfig = ({
>
<Form.Item name="resourceType" label={t("workflow_node.deploy.form.tencentcloud_clb_resource_type.label")} rules={[formRule]}>
<Select placeholder={t("workflow_node.deploy.form.tencentcloud_clb_resource_type.placeholder")}>
<Select.Option key={RESOURCE_TYPE_SSLDEPLOY} value={RESOURCE_TYPE_SSLDEPLOY}>
<Select.Option key={RESOURCE_TYPE_VIA_SSLDEPLOY} value={RESOURCE_TYPE_VIA_SSLDEPLOY}>
{t("workflow_node.deploy.form.tencentcloud_clb_resource_type.option.ssl_deploy.label")}
</Select.Option>
<Select.Option key={RESOURCE_TYPE_LOADBALANCER} value={RESOURCE_TYPE_LOADBALANCER}>
@@ -123,7 +123,9 @@ const DeployNodeConfigFormTencentCloudCLBConfig = ({
</Form.Item>
<Show
when={fieldResourceType === RESOURCE_TYPE_SSLDEPLOY || fieldResourceType === RESOURCE_TYPE_LISTENER || fieldResourceType === RESOURCE_TYPE_RULEDOMAIN}
when={
fieldResourceType === RESOURCE_TYPE_VIA_SSLDEPLOY || fieldResourceType === RESOURCE_TYPE_LISTENER || fieldResourceType === RESOURCE_TYPE_RULEDOMAIN
}
>
<Form.Item
name="listenerId"
@@ -135,7 +137,7 @@ const DeployNodeConfigFormTencentCloudCLBConfig = ({
</Form.Item>
</Show>
<Show when={fieldResourceType === RESOURCE_TYPE_SSLDEPLOY}>
<Show when={fieldResourceType === RESOURCE_TYPE_VIA_SSLDEPLOY}>
<Form.Item
name="domain"
label={t("workflow_node.deploy.form.tencentcloud_clb_snidomain.label")}

View File

@@ -0,0 +1,159 @@
import { memo } from "react";
import { useTranslation } from "react-i18next";
import { FormOutlined as FormOutlinedIcon } from "@ant-design/icons";
import { Alert, Button, Form, type FormInstance, Input, Space } from "antd";
import { createSchemaFieldRule } from "antd-zod";
import { z } from "zod";
import ModalForm from "@/components/ModalForm";
import MultipleInput from "@/components/MultipleInput";
import { useAntdForm } from "@/hooks";
type DeployNodeConfigFormTencentCloudSSLDeployConfigFieldValues = Nullish<{
region: string;
resourceType: string;
resourceIds: string;
}>;
export type DeployNodeConfigFormTencentCloudSSLDeployConfigProps = {
form: FormInstance;
formName: string;
disabled?: boolean;
initialValues?: DeployNodeConfigFormTencentCloudSSLDeployConfigFieldValues;
onValuesChange?: (values: DeployNodeConfigFormTencentCloudSSLDeployConfigFieldValues) => void;
};
const MULTIPLE_INPUT_DELIMITER = ";";
const initFormModel = (): DeployNodeConfigFormTencentCloudSSLDeployConfigFieldValues => {
return {};
};
const DeployNodeConfigFormTencentCloudSSLDeployConfig = ({
form: formInst,
formName,
disabled,
initialValues,
onValuesChange,
}: DeployNodeConfigFormTencentCloudSSLDeployConfigProps) => {
const { t } = useTranslation();
const formSchema = z.object({
region: z
.string({ message: t("workflow_node.deploy.form.tencentcloud_ssl_deploy_region.placeholder") })
.nonempty(t("workflow_node.deploy.form.tencentcloud_ssl_deploy_region.placeholder"))
.trim(),
resourceType: z
.string({ message: t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_type.placeholder") })
.nonempty(t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_type.placeholder"))
.trim(),
resourceIds: z.string({ message: t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.placeholder") }).refine((v) => {
return String(v)
.split(MULTIPLE_INPUT_DELIMITER)
.every((e) => /^[A-Za-z0-9._-]+$/.test(e));
}, t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.errmsg.invalid")),
});
const formRule = createSchemaFieldRule(formSchema);
const fieldResourceIds = Form.useWatch<string>("resourceIds", formInst);
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.deploy.form.tencentcloud_ssl_deploy_region.label")}
rules={[formRule]}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.tencentcloud_ssl_deploy_region.tooltip") }}></span>}
>
<Input placeholder={t("workflow_node.deploy.form.tencentcloud_ssl_deploy_region.placeholder")} />
</Form.Item>
<Form.Item
label={t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.label")}
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.tooltip") }}></span>}
>
<Space.Compact style={{ width: "100%" }}>
<Form.Item name="resourceIds" noStyle rules={[formRule]}>
<Input
allowClear
disabled={disabled}
value={fieldResourceIds}
placeholder={t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.placeholder")}
onChange={(e) => {
formInst.setFieldValue("resourceIds", e.target.value);
}}
/>
</Form.Item>
<ResourceIdsModalInput
value={fieldResourceIds}
trigger={
<Button disabled={disabled}>
<FormOutlinedIcon />
</Button>
}
onChange={(value) => {
formInst.setFieldValue("resourceIds", value);
}}
/>
</Space.Compact>
</Form.Item>
<Form.Item>
<Alert type="info" message={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.tencentcloud_ssl_deploy.guide") }}></span>} />
</Form.Item>
</Form>
);
};
const ResourceIdsModalInput = memo(({ value, trigger, onChange }: { value?: string; trigger?: React.ReactNode; onChange?: (value: string) => void }) => {
const { t } = useTranslation();
const formSchema = z.object({
resourceIds: z.array(z.string()).refine((v) => {
return v.every((e) => !e?.trim() || /^[A-Za-z0-9._-]+$/.test(e));
}, t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.errmsg.invalid")),
});
const formRule = createSchemaFieldRule(formSchema);
const { form: formInst, formProps } = useAntdForm({
name: "workflowNodeDeployConfigFormTencentCloudSSLDeployResourceIdsModalInput",
initialValues: { resourceIds: value?.split(MULTIPLE_INPUT_DELIMITER) },
onSubmit: (values) => {
onChange?.(
values.resourceIds
.map((e) => e.trim())
.filter((e) => !!e)
.join(MULTIPLE_INPUT_DELIMITER)
);
},
});
return (
<ModalForm
{...formProps}
layout="vertical"
form={formInst}
modalProps={{ destroyOnClose: true }}
title={t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.multiple_input_modal.title")}
trigger={trigger}
validateTrigger="onSubmit"
width={480}
>
<Form.Item name="resourceIds" rules={[formRule]}>
<MultipleInput placeholder={t("workflow_node.deploy.form.tencentcloud_ssl_deploy_resource_ids.multiple_input_modal.placeholder")} />
</Form.Item>
</ModalForm>
);
});
export default DeployNodeConfigFormTencentCloudSSLDeployConfig;

View File

@@ -260,7 +260,7 @@ const SharedNodeConfigDrawer = ({
const oldValues = Object.fromEntries(Object.entries(node.config ?? {}).filter(([_, value]) => value !== null && value !== undefined));
const newValues = Object.fromEntries(Object.entries(getFormValues()).filter(([_, value]) => value !== null && value !== undefined));
const changed = !isEqual(oldValues, newValues);
const changed = !isEqual(oldValues, {}) && !isEqual(oldValues, newValues);
const { promise, resolve, reject } = Promise.withResolvers();
if (changed) {