466507a196
- 补提交 giftTraffic i18n key(此前仅表单落库,中文界面显示英文兜底) - 修正描述:0=时长模式(按试用时长配置),>0=流量模式不限时用完为止 (原文案「0=不限流量」与后端实际语义相反,会误导运营配置)
574 lines
22 KiB
TypeScript
574 lines
22 KiB
TypeScript
import { zodResolver } from "@hookform/resolvers/zod";
|
|
import { useQuery } from "@tanstack/react-query";
|
|
import { Button } from "@workspace/ui/components/button";
|
|
import {
|
|
Form,
|
|
FormControl,
|
|
FormDescription,
|
|
FormField,
|
|
FormItem,
|
|
FormLabel,
|
|
FormMessage,
|
|
} from "@workspace/ui/components/form";
|
|
import { ScrollArea } from "@workspace/ui/components/scroll-area";
|
|
import {
|
|
Sheet,
|
|
SheetContent,
|
|
SheetFooter,
|
|
SheetHeader,
|
|
SheetTitle,
|
|
SheetTrigger,
|
|
} from "@workspace/ui/components/sheet";
|
|
import { Switch } from "@workspace/ui/components/switch";
|
|
import { Textarea } from "@workspace/ui/components/textarea";
|
|
import { Combobox } from "@workspace/ui/composed/combobox";
|
|
import { EnhancedInput } from "@workspace/ui/composed/enhanced-input";
|
|
import { Icon } from "@workspace/ui/composed/icon";
|
|
import {
|
|
getRegisterConfig,
|
|
updateRegisterConfig,
|
|
} from "@workspace/ui/services/admin/system";
|
|
import { useEffect, useState } from "react";
|
|
import { useForm } from "react-hook-form";
|
|
import { useTranslation } from "react-i18next";
|
|
import { toast } from "sonner";
|
|
import { z } from "zod";
|
|
import { useSubscribe } from "@/stores/subscribe";
|
|
|
|
const registerSchema = z.object({
|
|
stop_register: z.boolean().optional(),
|
|
enable_trial: z.boolean().optional(),
|
|
trial_subscribe: z.number().optional(),
|
|
trial_time: z.number().optional(),
|
|
trial_time_unit: z.string().optional(),
|
|
gift_traffic: z.number().optional(),
|
|
enable_trial_email_whitelist: z.boolean().optional(),
|
|
trial_email_domain_whitelist: z.string().optional(),
|
|
enable_ip_register_limit: z.boolean().optional(),
|
|
ip_register_limit: z.number().optional(),
|
|
ip_register_limit_duration: z.number().optional(),
|
|
device_limit: z.number().optional(),
|
|
});
|
|
|
|
type RegisterFormData = z.infer<typeof registerSchema>;
|
|
|
|
export default function RegisterConfig() {
|
|
const { t } = useTranslation("system");
|
|
const [open, setOpen] = useState(false);
|
|
const [loading, setLoading] = useState(false);
|
|
|
|
const { data, refetch } = useQuery({
|
|
queryKey: ["getRegisterConfig"],
|
|
queryFn: async () => {
|
|
const { data } = await getRegisterConfig();
|
|
return data.data;
|
|
},
|
|
enabled: open,
|
|
});
|
|
|
|
const { subscribes } = useSubscribe();
|
|
|
|
const form = useForm<RegisterFormData>({
|
|
resolver: zodResolver(registerSchema),
|
|
defaultValues: {
|
|
stop_register: false,
|
|
enable_trial: false,
|
|
trial_subscribe: undefined,
|
|
trial_time: 0,
|
|
trial_time_unit: "day",
|
|
gift_traffic: 0,
|
|
enable_trial_email_whitelist: false,
|
|
trial_email_domain_whitelist: "",
|
|
enable_ip_register_limit: false,
|
|
ip_register_limit: 1,
|
|
ip_register_limit_duration: 1,
|
|
device_limit: 5,
|
|
},
|
|
});
|
|
|
|
useEffect(() => {
|
|
if (data) {
|
|
form.reset(data);
|
|
}
|
|
}, [data, form]);
|
|
|
|
async function onSubmit(values: RegisterFormData) {
|
|
setLoading(true);
|
|
try {
|
|
await updateRegisterConfig(values as API.RegisterConfig);
|
|
toast.success(t("register.saveSuccess", "Save Successful"));
|
|
refetch();
|
|
setOpen(false);
|
|
} catch (_error) {
|
|
toast.error(t("register.saveFailed", "Save Failed"));
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Sheet onOpenChange={setOpen} open={open}>
|
|
<SheetTrigger asChild>
|
|
<div className="flex cursor-pointer items-center justify-between transition-colors">
|
|
<div className="flex items-center gap-3">
|
|
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10">
|
|
<Icon
|
|
className="h-5 w-5 text-primary"
|
|
icon="mdi:account-plus-outline"
|
|
/>
|
|
</div>
|
|
<div className="flex-1">
|
|
<p className="font-medium">
|
|
{t("register.title", "Registration Settings")}
|
|
</p>
|
|
<p className="text-muted-foreground text-sm">
|
|
{t(
|
|
"register.description",
|
|
"Configure user registration related settings"
|
|
)}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<Icon className="size-6" icon="mdi:chevron-right" />
|
|
</div>
|
|
</SheetTrigger>
|
|
<SheetContent className="w-[600px] max-w-full md:max-w-screen-md">
|
|
<SheetHeader>
|
|
<SheetTitle>
|
|
{t("register.title", "Registration Settings")}
|
|
</SheetTitle>
|
|
</SheetHeader>
|
|
<ScrollArea className="h-[calc(100dvh-48px-36px-36px-24px-env(safe-area-inset-top))] px-6">
|
|
<Form {...form}>
|
|
<form
|
|
className="space-y-2 pt-4"
|
|
id="register-form"
|
|
onSubmit={form.handleSubmit(onSubmit)}
|
|
>
|
|
<FormField
|
|
control={form.control}
|
|
name="stop_register"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t(
|
|
"register.stopNewUserRegistration",
|
|
"Stop New User Registration"
|
|
)}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<Switch
|
|
checked={field.value}
|
|
className="!mt-0 float-end"
|
|
onCheckedChange={field.onChange}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.stopNewUserRegistrationDescription",
|
|
"When enabled, new user registration will be disabled"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="enable_ip_register_limit"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t(
|
|
"register.ipRegistrationLimit",
|
|
"IP Registration Limit"
|
|
)}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<Switch
|
|
checked={field.value}
|
|
className="!mt-0 float-end"
|
|
onCheckedChange={field.onChange}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.ipRegistrationLimitDescription",
|
|
"Limit the number of registrations from a single IP address"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
{form.watch("enable_ip_register_limit") && (
|
|
<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
|
|
<FormField
|
|
control={form.control}
|
|
name="ip_register_limit"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t(
|
|
"register.registrationLimitCount",
|
|
"Registration Limit Count"
|
|
)}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<EnhancedInput
|
|
min={1}
|
|
onValueBlur={(value) =>
|
|
field.onChange(Number(value))
|
|
}
|
|
placeholder={t(
|
|
"register.inputPlaceholder",
|
|
"Please enter"
|
|
)}
|
|
type="number"
|
|
value={field.value}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.registrationLimitCountDescription",
|
|
"Number of registrations allowed per IP within the limit period"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="ip_register_limit_duration"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t(
|
|
"register.registrationLimitExpire",
|
|
"Limit Period"
|
|
)}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<EnhancedInput
|
|
min={1}
|
|
onValueBlur={(value) =>
|
|
field.onChange(Number(value))
|
|
}
|
|
placeholder={t(
|
|
"register.inputPlaceholder",
|
|
"Please enter"
|
|
)}
|
|
suffix={t("register.minute", "Minute(s)")}
|
|
type="number"
|
|
value={field.value}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.registrationLimitExpireDescription",
|
|
"Duration for IP registration limit (minutes)"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
</div>
|
|
)}
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="device_limit"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t("register.deviceLimit", "Device Limit")}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<EnhancedInput
|
|
min={1}
|
|
onValueBlur={(value) => field.onChange(Number(value))}
|
|
placeholder={t(
|
|
"register.inputPlaceholder",
|
|
"Please enter"
|
|
)}
|
|
type="number"
|
|
value={field.value}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.deviceLimitDescription",
|
|
"Maximum number of devices allowed per user"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="enable_trial"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t("register.enableTrial", "Enable Trial")}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<Switch
|
|
checked={field.value}
|
|
className="!mt-0 float-end"
|
|
onCheckedChange={field.onChange}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.enableTrialDescription",
|
|
"When enabled, new users will receive a trial subscription upon registration"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
{form.watch("enable_trial") && (
|
|
<>
|
|
<FormField
|
|
control={form.control}
|
|
name="trial_time"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t("register.trialConfig", "Trial Configuration")}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<div className="flex gap-2">
|
|
<EnhancedInput
|
|
className="flex-1"
|
|
min={0}
|
|
onValueBlur={(value) =>
|
|
field.onChange(Number(value))
|
|
}
|
|
placeholder={t(
|
|
"register.inputPlaceholder",
|
|
"Please enter"
|
|
)}
|
|
prefix={
|
|
<FormField
|
|
control={form.control}
|
|
name="trial_subscribe"
|
|
render={({ field }) => (
|
|
<Combobox
|
|
className="w-32 rounded-r-none bg-secondary"
|
|
onChange={(value: number) => {
|
|
if (value) {
|
|
field.onChange(value);
|
|
}
|
|
}}
|
|
options={subscribes?.map((item) => ({
|
|
label: item.name!,
|
|
value: item.id!,
|
|
}))}
|
|
placeholder={t(
|
|
"register.selectPlaceholder",
|
|
"Please select"
|
|
)}
|
|
value={field.value}
|
|
/>
|
|
)}
|
|
/>
|
|
}
|
|
suffix={
|
|
<FormField
|
|
control={form.control}
|
|
name="trial_time_unit"
|
|
render={({ field: unitField }) => (
|
|
<Combobox
|
|
className="w-32 rounded-l-none bg-secondary"
|
|
onChange={(value: string) => {
|
|
unitField.onChange(value);
|
|
}}
|
|
options={[
|
|
{
|
|
label: t("register.none", "None"),
|
|
value: "None",
|
|
},
|
|
{
|
|
label: t("register.year", "Year(s)"),
|
|
value: "Year",
|
|
},
|
|
{
|
|
label: t(
|
|
"register.month",
|
|
"Month(s)"
|
|
),
|
|
value: "Month",
|
|
},
|
|
{
|
|
label: t("register.day", "Day(s)"),
|
|
value: "Day",
|
|
},
|
|
{
|
|
label: t("register.hour", "Hour(s)"),
|
|
value: "Hour",
|
|
},
|
|
{
|
|
label: t(
|
|
"register.minute",
|
|
"Minute(s)"
|
|
),
|
|
value: "Minute",
|
|
},
|
|
]}
|
|
placeholder={t(
|
|
"register.selectPlaceholder",
|
|
"Please select"
|
|
)}
|
|
value={unitField.value}
|
|
/>
|
|
)}
|
|
/>
|
|
}
|
|
type="number"
|
|
value={field.value}
|
|
/>
|
|
</div>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.trialConfigDescription",
|
|
"Configure trial subscription, duration and time unit for new users upon registration"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="gift_traffic"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t("register.giftTraffic", "Gift Traffic")}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<EnhancedInput
|
|
min={0}
|
|
onValueBlur={(value) =>
|
|
field.onChange(Number(value))
|
|
}
|
|
placeholder={t(
|
|
"register.inputPlaceholder",
|
|
"Please enter"
|
|
)}
|
|
suffix="GB"
|
|
type="number"
|
|
value={field.value}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.giftTrafficDescription",
|
|
"Gift traffic for new users (GB). 0 = duration mode (uses the trial duration above); >0 = quota mode: N GB with no time limit, trial duration is ignored"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="enable_trial_email_whitelist"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t(
|
|
"register.enableTrialEmailWhitelist",
|
|
"Email Domain Whitelist"
|
|
)}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<Switch
|
|
checked={field.value}
|
|
className="!mt-0 float-end"
|
|
onCheckedChange={field.onChange}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.enableTrialEmailWhitelistDescription",
|
|
"When enabled, trial subscription is only granted to emails with whitelisted domains"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
{form.watch("enable_trial_email_whitelist") && (
|
|
<FormField
|
|
control={form.control}
|
|
name="trial_email_domain_whitelist"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>
|
|
{t(
|
|
"register.trialEmailDomainWhitelist",
|
|
"Whitelisted Domains"
|
|
)}
|
|
</FormLabel>
|
|
<FormControl>
|
|
<Textarea
|
|
placeholder={t(
|
|
"register.trialEmailDomainWhitelistPlaceholder",
|
|
"gmail.com,outlook.com,edu.cn"
|
|
)}
|
|
rows={3}
|
|
{...field}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
{t(
|
|
"register.trialEmailDomainWhitelistDescription",
|
|
"Comma-separated list of allowed email domains for trial subscription"
|
|
)}
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
)}
|
|
</>
|
|
)}
|
|
</form>
|
|
</Form>
|
|
</ScrollArea>
|
|
<SheetFooter className="flex-row justify-end gap-2 pt-3">
|
|
<Button
|
|
disabled={loading}
|
|
onClick={() => setOpen(false)}
|
|
variant="outline"
|
|
>
|
|
{t("common.cancel", "Cancel")}
|
|
</Button>
|
|
<Button disabled={loading} form="register-form" type="submit">
|
|
{loading && (
|
|
<Icon className="mr-2 animate-spin" icon="mdi:loading" />
|
|
)}
|
|
{t("common.save", "Save Settings")}
|
|
</Button>
|
|
</SheetFooter>
|
|
</SheetContent>
|
|
</Sheet>
|
|
);
|
|
}
|