From fdee69bdafb1ec73d538fb6027336f07e24e656b Mon Sep 17 00:00:00 2001 From: Fu Diwei Date: Mon, 12 May 2025 21:34:00 +0800 Subject: [PATCH 01/10] feat(ui): move settings page entry from topbar to sider-menu --- ui/src/i18n/locales/en/nls.common.json | 1 - ui/src/i18n/locales/zh/nls.common.json | 1 - ui/src/pages/ConsoleLayout.tsx | 9 ++------- 3 files changed, 2 insertions(+), 9 deletions(-) diff --git a/ui/src/i18n/locales/en/nls.common.json b/ui/src/i18n/locales/en/nls.common.json index 0c3cd5df..32241963 100644 --- a/ui/src/i18n/locales/en/nls.common.json +++ b/ui/src/i18n/locales/en/nls.common.json @@ -20,7 +20,6 @@ "common.menu.theme": "Change theme", "common.menu.locale": "Change language", - "common.menu.settings": "Settings", "common.menu.logout": "Log-out", "common.menu.document": "Document", diff --git a/ui/src/i18n/locales/zh/nls.common.json b/ui/src/i18n/locales/zh/nls.common.json index fe3a9e06..8458c5b5 100644 --- a/ui/src/i18n/locales/zh/nls.common.json +++ b/ui/src/i18n/locales/zh/nls.common.json @@ -20,7 +20,6 @@ "common.menu.theme": "切换主题", "common.menu.locale": "切换语言", - "common.menu.settings": "系统设置", "common.menu.logout": "退出登录", "common.menu.document": "文档", diff --git a/ui/src/pages/ConsoleLayout.tsx b/ui/src/pages/ConsoleLayout.tsx index 4fbaf492..ed9d635f 100644 --- a/ui/src/pages/ConsoleLayout.tsx +++ b/ui/src/pages/ConsoleLayout.tsx @@ -31,10 +31,6 @@ const ConsoleLayout = () => { navigate("/login"); }; - const handleSettingsClick = () => { - navigate("/settings/account"); - }; - const auth = getAuthStore(); if (!auth.isValid || !auth.isSuperuser) { return ; @@ -66,9 +62,6 @@ const ConsoleLayout = () => { - - diff --git a/ui/src/components/access/AccessEditModal.tsx b/ui/src/components/access/AccessEditModal.tsx index 9cfb5b0f..79edb113 100644 --- a/ui/src/components/access/AccessEditModal.tsx +++ b/ui/src/components/access/AccessEditModal.tsx @@ -95,7 +95,7 @@ const AccessEditModal = ({ data, loading, trigger, scene, usage, afterSubmit, .. cancelButtonProps={{ disabled: formPending }} closable confirmLoading={formPending} - destroyOnClose + destroyOnHidden loading={loading} okText={scene === "edit" ? t("common.button.save") : t("common.button.submit")} open={open} diff --git a/ui/src/components/access/AccessForm.tsx b/ui/src/components/access/AccessForm.tsx index 5f82ad67..02a71854 100644 --- a/ui/src/components/access/AccessForm.tsx +++ b/ui/src/components/access/AccessForm.tsx @@ -1,12 +1,14 @@ -import { forwardRef, useImperativeHandle, useMemo } from "react"; +import { forwardRef, useImperativeHandle, useMemo, useState } from "react"; import { useTranslation } from "react-i18next"; import { Form, type FormInstance, Input } from "antd"; import { createSchemaFieldRule } from "antd-zod"; import { z } from "zod"; +import AccessProviderPicker from "@/components/provider/AccessProviderPicker"; import AccessProviderSelect from "@/components/provider/AccessProviderSelect"; +import Show from "@/components/Show"; import { type AccessModel } from "@/domain/access"; -import { ACCESS_PROVIDERS, ACCESS_USAGES } from "@/domain/provider"; +import { ACCESS_PROVIDERS, ACCESS_USAGES, type AccessProvider } from "@/domain/provider"; import { useAntdForm, useAntdFormName } from "@/hooks"; import AccessForm1PanelConfig from "./AccessForm1PanelConfig"; @@ -107,9 +109,22 @@ const AccessForm = forwardRef(({ className, }); const formRule = createSchemaFieldRule(formSchema); const { form: formInst, formProps } = useAntdForm({ + name: "accessForm", initialValues: initialValues, }); + const providerFilter = useMemo(() => { + switch (usage) { + case "both-dns-hosting": + return (record: AccessProvider) => record.usages.includes(ACCESS_USAGES.DNS) || record.usages.includes(ACCESS_USAGES.HOSTING); + case "ca-only": + return (record: AccessProvider) => record.usages.includes(ACCESS_USAGES.CA); + case "notification-only": + return (record: AccessProvider) => record.usages.includes(ACCESS_USAGES.NOTIFICATION); + } + + return undefined; + }, [usage]); const providerLabel = useMemo(() => { switch (usage) { case "ca-only": @@ -139,10 +154,11 @@ const AccessForm = forwardRef(({ className, return undefined; }, [usage]); - const fieldProvider = Form.useWatch("provider", formInst); + const fieldProvider = Form.useWatch["provider"]>("provider", formInst); + const [fieldProviderPicked, setFieldProviderPicked] = useState(initialValues?.provider); // bugfix: Form.useWatch 在条件渲染下不生效，这里用单独的变量存放 Picker 组件选择的值 const [nestedFormInst] = Form.useForm(); - const nestedFormName = useAntdFormName({ form: nestedFormInst, name: "accessEditFormConfigForm" }); + const nestedFormName = useAntdFormName({ form: nestedFormInst, name: "accessConfigForm" }); const nestedFormEl = useMemo(() => { const nestedFormProps = { form: nestedFormInst, @@ -272,7 +288,13 @@ const AccessForm = forwardRef(({ className, case ACCESS_PROVIDERS.ZEROSSL: return ; } - }, [disabled, initialValues?.config, fieldProvider, nestedFormInst, nestedFormName]); + }, [usage, disabled, initialValues?.config, fieldProvider, nestedFormInst, nestedFormName]); + + const handleProviderPick = (value: string) => { + setFieldProviderPicked(value); + formInst.setFieldValue("provider", value); + onValuesChange?.(formInst.getFieldsValue(true)); + }; const handleFormProviderChange = (name: string) => { if (name === nestedFormName) { @@ -312,30 +334,32 @@ const AccessForm = forwardRef(({ className,
- - - + + } + > + + + - - { - if (usage == null) return true; - - switch (usage) { - case "both-dns-hosting": - return record.usages.includes(ACCESS_USAGES.DNS) || record.usages.includes(ACCESS_USAGES.HOSTING); - case "ca-only": - return record.usages.includes(ACCESS_USAGES.CA); - case "notification-only": - return record.usages.includes(ACCESS_USAGES.NOTIFICATION); - } - }} - disabled={scene !== "add"} - placeholder={providerPlaceholder} - showOptionTags={usage == null || (usage === "both-dns-hosting" ? { [ACCESS_USAGES.DNS]: true, [ACCESS_USAGES.HOSTING]: true } : false)} - showSearch={!disabled} - /> - + + + +
{nestedFormEl} diff --git a/ui/src/components/access/AccessFormWebhookConfig.tsx b/ui/src/components/access/AccessFormWebhookConfig.tsx index 4bbc6754..0108d7b3 100644 --- a/ui/src/components/access/AccessFormWebhookConfig.tsx +++ b/ui/src/components/access/AccessFormWebhookConfig.tsx @@ -283,7 +283,7 @@ const AccessFormWebhookConfig = ({ form: formInst, formName, disabled, initialVa - +