Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a6246c2453 | |||
| 09c5216f60 | |||
| 4d84095af2 | |||
| d66b664198 | |||
| a7d89acc7f | |||
| 2a3d5a3234 |
@@ -22,10 +22,13 @@
|
||||
"inactiveMonthsPlaceholder": "Months without purchase",
|
||||
"name": "Name",
|
||||
"namePlaceholder": "Rule name",
|
||||
"noDiscounts": "This subscribe has no discount quantities and cannot be configured.",
|
||||
"promoPriceLessThanOriginalPrice": "Promo price must be lower than original price",
|
||||
"promoPriceLessThanUnitPrice": "Promo price must be lower than unit price",
|
||||
"selectEndTime": "Select time",
|
||||
"selectRule": "Select rule",
|
||||
"selectStartTime": "Select time",
|
||||
"selectQuantity": "Select discount quantity",
|
||||
"selectSubscribe": "Select subscribe",
|
||||
"type": "Rule Type",
|
||||
"windowHours": "Window Hours",
|
||||
@@ -38,10 +41,12 @@
|
||||
"name": "Name",
|
||||
"no": "No",
|
||||
"orderNo": "Order No.",
|
||||
"originalPriceHint": "Original price",
|
||||
"params": "Params",
|
||||
"prices": "Prices",
|
||||
"priority": "Priority",
|
||||
"promoPrice": "Promo Price",
|
||||
"quantity": "Quantity",
|
||||
"rule": "Rule",
|
||||
"ruleDetail": "Rule Detail",
|
||||
"rules": "Rules",
|
||||
|
||||
@@ -22,10 +22,13 @@
|
||||
"inactiveMonthsPlaceholder": "未购买的月数",
|
||||
"name": "名称",
|
||||
"namePlaceholder": "规则名称",
|
||||
"noDiscounts": "该订阅没有 discount 档位,不能配置促销价。",
|
||||
"promoPriceLessThanOriginalPrice": "促销价必须低于原价",
|
||||
"promoPriceLessThanUnitPrice": "促销价必须低于原价",
|
||||
"selectEndTime": "选择时间",
|
||||
"selectRule": "选择规则",
|
||||
"selectStartTime": "选择时间",
|
||||
"selectQuantity": "选择 discount 档位",
|
||||
"selectSubscribe": "选择订阅",
|
||||
"type": "规则类型",
|
||||
"windowHours": "新用户窗口小时数",
|
||||
@@ -38,10 +41,12 @@
|
||||
"name": "名称",
|
||||
"no": "否",
|
||||
"orderNo": "订单号",
|
||||
"originalPriceHint": "原价",
|
||||
"params": "参数",
|
||||
"prices": "商品促销价",
|
||||
"priority": "优先级",
|
||||
"promoPrice": "促销价",
|
||||
"quantity": "档位",
|
||||
"rule": "规则",
|
||||
"ruleDetail": "规则详情",
|
||||
"rules": "促销规则",
|
||||
|
||||
@@ -46,7 +46,7 @@ type RuleFilters = {
|
||||
};
|
||||
|
||||
type PriceFilters = {
|
||||
rule_id?: string;
|
||||
promo_rule_id?: string;
|
||||
subscribe_id?: string;
|
||||
};
|
||||
|
||||
@@ -301,12 +301,13 @@ export default function PromoPage() {
|
||||
}}
|
||||
columns={[
|
||||
{
|
||||
accessorKey: "rule_id",
|
||||
accessorKey: "promo_rule_id",
|
||||
header: t("rule", "Rule"),
|
||||
cell: ({ row }) =>
|
||||
row.original.rule_id
|
||||
? rules.find((rule) => rule.id === row.original.rule_id)
|
||||
?.name || `#${row.original.rule_id}`
|
||||
row.original.promo_rule_id
|
||||
? rules.find(
|
||||
(rule) => rule.id === row.original.promo_rule_id
|
||||
)?.name || `#${row.original.promo_rule_id}`
|
||||
: "--",
|
||||
},
|
||||
{
|
||||
@@ -316,6 +317,11 @@ export default function PromoPage() {
|
||||
row.original.subscribe_name ||
|
||||
getSubscribeName(row.original.subscribe_id),
|
||||
},
|
||||
{
|
||||
accessorKey: "quantity",
|
||||
header: t("quantity", "Quantity"),
|
||||
cell: ({ row }) => row.original.quantity || "--",
|
||||
},
|
||||
{
|
||||
accessorKey: "unit_price",
|
||||
header: t("unitPrice", "Unit Price"),
|
||||
@@ -361,7 +367,7 @@ export default function PromoPage() {
|
||||
}}
|
||||
params={[
|
||||
{
|
||||
key: "rule_id",
|
||||
key: "promo_rule_id",
|
||||
placeholder: t("rule", "Rule"),
|
||||
options: rules.map((rule) => ({
|
||||
label: rule.name,
|
||||
@@ -382,7 +388,7 @@ export default function PromoPage() {
|
||||
request={async (pagination, filters) => {
|
||||
const { data } = await getPromoPriceList({
|
||||
...pagination,
|
||||
rule_id: parseOptionalNumber(filters.rule_id),
|
||||
promo_rule_id: parseOptionalNumber(filters.promo_rule_id),
|
||||
subscribe_id: parseOptionalNumber(filters.subscribe_id),
|
||||
});
|
||||
return {
|
||||
@@ -398,13 +404,13 @@ export default function PromoPage() {
|
||||
action={usageRef}
|
||||
columns={[
|
||||
{
|
||||
accessorKey: "rule_id",
|
||||
accessorKey: "promo_rule_id",
|
||||
header: t("rule", "Rule"),
|
||||
cell: ({ row }) =>
|
||||
row.original.rule_name ||
|
||||
rules.find((rule) => rule.id === row.original.rule_id)
|
||||
rules.find((rule) => rule.id === row.original.promo_rule_id)
|
||||
?.name ||
|
||||
`#${row.original.rule_id}`,
|
||||
`#${row.original.promo_rule_id}`,
|
||||
},
|
||||
{
|
||||
accessorKey: "user_id",
|
||||
@@ -418,6 +424,11 @@ export default function PromoPage() {
|
||||
row.original.subscribe_name ||
|
||||
getSubscribeName(row.original.subscribe_id),
|
||||
},
|
||||
{
|
||||
accessorKey: "quantity",
|
||||
header: t("quantity", "Quantity"),
|
||||
cell: ({ row }) => row.original.quantity || "--",
|
||||
},
|
||||
{
|
||||
accessorKey: "order_no",
|
||||
header: t("orderNo", "Order No."),
|
||||
@@ -447,7 +458,7 @@ export default function PromoPage() {
|
||||
}
|
||||
params={[
|
||||
{
|
||||
key: "rule_id",
|
||||
key: "promo_rule_id",
|
||||
placeholder: t("rule", "Rule"),
|
||||
options: rules.map((rule) => ({
|
||||
label: rule.name,
|
||||
@@ -470,7 +481,7 @@ export default function PromoPage() {
|
||||
request={async (pagination, filters) => {
|
||||
const { data } = await getPromoUsageList({
|
||||
...pagination,
|
||||
rule_id: parseOptionalNumber(filters.rule_id),
|
||||
promo_rule_id: parseOptionalNumber(filters.promo_rule_id),
|
||||
subscribe_id: parseOptionalNumber(filters.subscribe_id),
|
||||
user_id: parseOptionalNumber(filters.user_id),
|
||||
order_no: filters.order_no?.trim() || undefined,
|
||||
|
||||
@@ -0,0 +1,152 @@
|
||||
/**
|
||||
* @vitest-environment jsdom
|
||||
*/
|
||||
import {
|
||||
cleanup,
|
||||
fireEvent,
|
||||
render,
|
||||
screen,
|
||||
waitFor,
|
||||
} from "@testing-library/react";
|
||||
import { afterEach, describe, expect, it, vi } from "vitest";
|
||||
import PriceForm from "./price-form";
|
||||
|
||||
globalThis.ResizeObserver = class ResizeObserver {
|
||||
observe() {
|
||||
return;
|
||||
}
|
||||
unobserve() {
|
||||
return;
|
||||
}
|
||||
disconnect() {
|
||||
return;
|
||||
}
|
||||
};
|
||||
Element.prototype.scrollIntoView = function scrollIntoView() {
|
||||
return;
|
||||
};
|
||||
|
||||
vi.mock("react-i18next", () => ({
|
||||
useTranslation: () => ({
|
||||
t: (_key: string, fallback: string): string => fallback,
|
||||
}),
|
||||
}));
|
||||
|
||||
const rules: API.PromoRule[] = [
|
||||
{
|
||||
id: 1,
|
||||
name: "Campaign Rule",
|
||||
type: "campaign",
|
||||
params: {},
|
||||
priority: 1,
|
||||
enabled: true,
|
||||
},
|
||||
];
|
||||
|
||||
const subscribes: API.SubscribeItem[] = [
|
||||
{
|
||||
id: 8,
|
||||
name: "Monthly Plan",
|
||||
unit_price: 1200,
|
||||
unit_time: "Month",
|
||||
sold: 0,
|
||||
discount: [
|
||||
{
|
||||
quantity: 3,
|
||||
discount: 90,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
const subscribesWithoutDiscounts: API.SubscribeItem[] = [
|
||||
{
|
||||
id: 8,
|
||||
name: "Monthly Plan",
|
||||
unit_price: 1200,
|
||||
unit_time: "Month",
|
||||
sold: 0,
|
||||
discount: [],
|
||||
},
|
||||
];
|
||||
|
||||
async function selectCombobox(index: number, option: string) {
|
||||
const combobox = screen.getAllByRole("combobox")[index];
|
||||
if (!combobox) throw new Error(`Combobox ${index} not found`);
|
||||
fireEvent.click(combobox);
|
||||
fireEvent.click(await screen.findByText(option));
|
||||
}
|
||||
|
||||
afterEach(() => {
|
||||
cleanup();
|
||||
vi.clearAllMocks();
|
||||
});
|
||||
|
||||
describe("PriceForm", () => {
|
||||
it("submits promo price with promo_rule_id and selected quantity item", async () => {
|
||||
const onSubmit = vi.fn().mockResolvedValue(true);
|
||||
render(
|
||||
<PriceForm onSubmit={onSubmit} rules={rules} subscribes={subscribes} />
|
||||
);
|
||||
|
||||
fireEvent.click(screen.getByRole("button", { name: "Create Promo Price" }));
|
||||
await selectCombobox(0, "Campaign Rule");
|
||||
await selectCombobox(1, "Monthly Plan");
|
||||
await selectCombobox(2, "3 x Month");
|
||||
fireEvent.change(screen.getByPlaceholderText("Enter price"), {
|
||||
target: { value: "20" },
|
||||
});
|
||||
fireEvent.click(screen.getByRole("button", { name: "Confirm" }));
|
||||
|
||||
await waitFor(() =>
|
||||
expect(onSubmit).toHaveBeenCalledWith({
|
||||
promo_rule_id: 1,
|
||||
items: [{ subscribe_id: 8, quantity: 3, promo_price: 2000 }],
|
||||
})
|
||||
);
|
||||
});
|
||||
|
||||
it("blocks submit when subscribe has no discount quantities", async () => {
|
||||
const onSubmit = vi.fn();
|
||||
render(
|
||||
<PriceForm
|
||||
onSubmit={onSubmit}
|
||||
rules={rules}
|
||||
subscribes={subscribesWithoutDiscounts}
|
||||
/>
|
||||
);
|
||||
|
||||
fireEvent.click(screen.getByRole("button", { name: "Create Promo Price" }));
|
||||
await selectCombobox(1, "Monthly Plan");
|
||||
|
||||
expect(
|
||||
screen.getByText(
|
||||
"This subscribe has no discount quantities and cannot be configured."
|
||||
)
|
||||
).not.toBeNull();
|
||||
expect(screen.getByRole("button", { name: "Confirm" })).toHaveProperty(
|
||||
"disabled",
|
||||
true
|
||||
);
|
||||
});
|
||||
|
||||
it("keeps the form open and shows an error when promo price reaches original price", async () => {
|
||||
const onSubmit = vi.fn();
|
||||
render(
|
||||
<PriceForm onSubmit={onSubmit} rules={rules} subscribes={subscribes} />
|
||||
);
|
||||
|
||||
fireEvent.click(screen.getByRole("button", { name: "Create Promo Price" }));
|
||||
await selectCombobox(0, "Campaign Rule");
|
||||
await selectCombobox(1, "Monthly Plan");
|
||||
await selectCombobox(2, "3 x Month");
|
||||
fireEvent.change(screen.getByPlaceholderText("Enter price"), {
|
||||
target: { value: "36" },
|
||||
});
|
||||
fireEvent.click(screen.getByRole("button", { name: "Confirm" }));
|
||||
|
||||
expect(
|
||||
await screen.findByText("Promo price must be lower than original price")
|
||||
).not.toBeNull();
|
||||
expect(onSubmit).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
@@ -23,11 +23,16 @@ import { useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { z } from "zod";
|
||||
import { getSubscribeUnitPrice } from "./utils";
|
||||
import {
|
||||
formatCurrency,
|
||||
getSubscribeDiscounts,
|
||||
getSubscribeUnitPrice,
|
||||
} from "./utils";
|
||||
|
||||
const priceSchema = z.object({
|
||||
rule_id: z.number().min(1),
|
||||
promo_rule_id: z.number().min(1),
|
||||
subscribe_id: z.number().min(1),
|
||||
quantity: z.number().min(1),
|
||||
promo_price: z.number().min(1),
|
||||
});
|
||||
|
||||
@@ -51,26 +56,42 @@ export default function PriceForm({
|
||||
const form = useForm<PriceFormValues>({
|
||||
resolver: zodResolver(priceSchema),
|
||||
defaultValues: {
|
||||
rule_id: 0,
|
||||
promo_rule_id: 0,
|
||||
subscribe_id: 0,
|
||||
quantity: 0,
|
||||
promo_price: 0,
|
||||
},
|
||||
});
|
||||
const subscribeId = form.watch("subscribe_id");
|
||||
const quantity = form.watch("quantity");
|
||||
const subscribe = subscribes.find((item) => item.id === subscribeId);
|
||||
const discounts = getSubscribeDiscounts(subscribe);
|
||||
const unitPrice = getSubscribeUnitPrice(subscribe);
|
||||
const originalPrice = unitPrice * quantity;
|
||||
const hasSelectedSubscribe = subscribeId > 0;
|
||||
const hasDiscounts = discounts.length > 0;
|
||||
|
||||
async function handleSubmit(values: PriceFormValues) {
|
||||
if (unitPrice > 0 && values.promo_price >= unitPrice) {
|
||||
const maxPrice = unitPrice * values.quantity;
|
||||
if (maxPrice > 0 && values.promo_price >= maxPrice) {
|
||||
form.setError("promo_price", {
|
||||
message: t(
|
||||
"form.promoPriceLessThanUnitPrice",
|
||||
"Promo price must be lower than unit price"
|
||||
"form.promoPriceLessThanOriginalPrice",
|
||||
"Promo price must be lower than original price"
|
||||
),
|
||||
});
|
||||
return;
|
||||
}
|
||||
const success = await onSubmit(values);
|
||||
const success = await onSubmit({
|
||||
promo_rule_id: values.promo_rule_id,
|
||||
items: [
|
||||
{
|
||||
subscribe_id: values.subscribe_id,
|
||||
quantity: values.quantity,
|
||||
promo_price: values.promo_price,
|
||||
},
|
||||
],
|
||||
});
|
||||
if (success) setOpen(false);
|
||||
}
|
||||
|
||||
@@ -79,7 +100,12 @@ export default function PriceForm({
|
||||
<SheetTrigger asChild>
|
||||
<Button
|
||||
onClick={() => {
|
||||
form.reset({ rule_id: 0, subscribe_id: 0, promo_price: 0 });
|
||||
form.reset({
|
||||
promo_rule_id: 0,
|
||||
subscribe_id: 0,
|
||||
quantity: 0,
|
||||
promo_price: 0,
|
||||
});
|
||||
setOpen(true);
|
||||
}}
|
||||
size="sm"
|
||||
@@ -99,7 +125,7 @@ export default function PriceForm({
|
||||
>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="rule_id"
|
||||
name="promo_rule_id"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>{t("rule", "Rule")}</FormLabel>
|
||||
@@ -126,7 +152,14 @@ export default function PriceForm({
|
||||
<FormLabel>{t("subscribe", "Subscribe")}</FormLabel>
|
||||
<FormControl>
|
||||
<Combobox<number>
|
||||
onChange={field.onChange}
|
||||
onChange={(value) => {
|
||||
field.onChange(value);
|
||||
form.setValue("quantity", 0, {
|
||||
shouldDirty: true,
|
||||
shouldValidate: true,
|
||||
});
|
||||
form.clearErrors(["quantity", "promo_price"]);
|
||||
}}
|
||||
options={subscribes
|
||||
.filter((item) => typeof item.id === "number")
|
||||
.map((item) => ({
|
||||
@@ -144,6 +177,41 @@ export default function PriceForm({
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="quantity"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>{t("quantity", "Quantity")}</FormLabel>
|
||||
<FormControl>
|
||||
<Combobox<number>
|
||||
onChange={field.onChange}
|
||||
options={discounts.map((item) => ({
|
||||
label: `${item.quantity} x ${t(
|
||||
subscribe?.unit_time || "Month",
|
||||
subscribe?.unit_time || "Month"
|
||||
)}`,
|
||||
value: item.quantity,
|
||||
}))}
|
||||
placeholder={t(
|
||||
"form.selectQuantity",
|
||||
"Select discount quantity"
|
||||
)}
|
||||
value={field.value}
|
||||
/>
|
||||
</FormControl>
|
||||
{hasSelectedSubscribe && !hasDiscounts && (
|
||||
<p className="text-destructive text-xs">
|
||||
{t(
|
||||
"form.noDiscounts",
|
||||
"This subscribe has no discount quantities and cannot be configured."
|
||||
)}
|
||||
</p>
|
||||
)}
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="promo_price"
|
||||
@@ -165,10 +233,10 @@ export default function PriceForm({
|
||||
value={field.value}
|
||||
/>
|
||||
</FormControl>
|
||||
{unitPrice > 0 && (
|
||||
{originalPrice > 0 && (
|
||||
<p className="text-muted-foreground text-xs">
|
||||
{t("unitPriceHint", "Unit price")}:{" "}
|
||||
{unitConversion("centsToDollars", unitPrice)}
|
||||
{t("originalPriceHint", "Original price")}:{" "}
|
||||
{formatCurrency(originalPrice)}
|
||||
</p>
|
||||
)}
|
||||
<FormMessage />
|
||||
@@ -178,7 +246,11 @@ export default function PriceForm({
|
||||
</form>
|
||||
</Form>
|
||||
<SheetFooter>
|
||||
<Button disabled={loading} form="promo-price-form" type="submit">
|
||||
<Button
|
||||
disabled={loading || (hasSelectedSubscribe && !hasDiscounts)}
|
||||
form="promo-price-form"
|
||||
type="submit"
|
||||
>
|
||||
{t("confirm", "Confirm")}
|
||||
</Button>
|
||||
</SheetFooter>
|
||||
|
||||
@@ -20,3 +20,9 @@ export function parseOptionalNumber(value?: string) {
|
||||
export function getSubscribeUnitPrice(subscribe?: API.SubscribeItem) {
|
||||
return typeof subscribe?.unit_price === "number" ? subscribe.unit_price : 0;
|
||||
}
|
||||
|
||||
export function getSubscribeDiscounts(subscribe?: API.SubscribeItem) {
|
||||
return (subscribe?.discount || []).filter(
|
||||
(item) => typeof item.quantity === "number" && item.quantity > 0
|
||||
);
|
||||
}
|
||||
|
||||
@@ -30,13 +30,30 @@ import { Display } from "@/components/display";
|
||||
import { useGlobalStore } from "@/stores/global";
|
||||
import { formatDate } from "@/utils/common";
|
||||
import { SubscriptionDetail } from "./subscription-detail";
|
||||
import { SubscriptionForm } from "./subscription-form";
|
||||
import {
|
||||
SubscriptionForm,
|
||||
type SubscriptionFormValues,
|
||||
} from "./subscription-form";
|
||||
|
||||
interface SharedInfo {
|
||||
ownerUserId: number;
|
||||
familyId: number;
|
||||
}
|
||||
|
||||
function toUserSubscribePayload(values: SubscriptionFormValues) {
|
||||
return {
|
||||
...values,
|
||||
expired_at: values.expired_at || 0,
|
||||
subscribe_id: values.subscribe_id || 0,
|
||||
traffic: values.traffic || 0,
|
||||
upload: values.upload || 0,
|
||||
download: values.download || 0,
|
||||
speed_limit: values.speed_limit || 0,
|
||||
device_limit: values.device_limit || 0,
|
||||
traffic_limit: values.traffic_limit || [],
|
||||
};
|
||||
}
|
||||
|
||||
export default function UserSubscription({ userId }: { userId: number }) {
|
||||
const { t } = useTranslation("user");
|
||||
const [loading, setLoading] = useState(false);
|
||||
@@ -166,7 +183,7 @@ export default function UserSubscription({ userId }: { userId: number }) {
|
||||
await updateUserSubscribe({
|
||||
user_id: Number(userId),
|
||||
user_subscribe_id: row.id,
|
||||
...values,
|
||||
...toUserSubscribePayload(values),
|
||||
});
|
||||
toast.success(t("updateSuccess", "Updated successfully"));
|
||||
ref.current?.refresh();
|
||||
@@ -278,17 +295,6 @@ export default function UserSubscription({ userId }: { userId: number }) {
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorKey: "traffic_limit",
|
||||
header: t("userTrafficLimit", "User Traffic Limit"),
|
||||
cell: ({ row }) => (
|
||||
<Display
|
||||
type="traffic"
|
||||
unlimited
|
||||
value={row.original.traffic_limit}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
id: "remaining_traffic",
|
||||
header: t("remainingTraffic", "Remaining Traffic"),
|
||||
@@ -307,10 +313,30 @@ export default function UserSubscription({ userId }: { userId: number }) {
|
||||
accessorKey: "speed_limit",
|
||||
header: t("speedLimit", "Speed Limit"),
|
||||
cell: ({ row }) => {
|
||||
const speed =
|
||||
row.original.speed_limit ||
|
||||
row.original?.subscribe?.speed_limit;
|
||||
return <Display type="trafficSpeed" unlimited value={speed} />;
|
||||
const userSpeed = row.original.speed_limit ?? 0;
|
||||
const effectiveSpeed = row.original.effective_speed ?? 0;
|
||||
const planSpeed = row.original.subscribe?.speed_limit ?? 0;
|
||||
const speed = effectiveSpeed || userSpeed || planSpeed;
|
||||
const source =
|
||||
userSpeed > 0
|
||||
? t("userOverride", "User Override")
|
||||
: t("subscriptionDefault", "Subscription Default");
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-1">
|
||||
<div className="flex items-center gap-2">
|
||||
<Display type="trafficSpeed" value={speed} />
|
||||
{row.original.is_throttled && (
|
||||
<Badge variant="destructive">
|
||||
{t("throttled", "Throttled")}
|
||||
</Badge>
|
||||
)}
|
||||
</div>
|
||||
<span className="text-muted-foreground text-xs">
|
||||
{source}
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -367,7 +393,7 @@ export default function UserSubscription({ userId }: { userId: number }) {
|
||||
setLoading(true);
|
||||
await createUserSubscribe({
|
||||
user_id: Number(userId),
|
||||
...values,
|
||||
...toUserSubscribePayload(values),
|
||||
});
|
||||
toast.success(t("createSuccess", "Created successfully"));
|
||||
ref.current?.refresh();
|
||||
|
||||
@@ -7,6 +7,7 @@ import {
|
||||
SheetTitle,
|
||||
SheetTrigger,
|
||||
} from "@workspace/ui/components/sheet";
|
||||
import { Skeleton } from "@workspace/ui/components/skeleton";
|
||||
import { Switch } from "@workspace/ui/components/switch";
|
||||
import { ConfirmButton } from "@workspace/ui/composed/confirm-button";
|
||||
import { ProTable } from "@workspace/ui/composed/pro-table/pro-table";
|
||||
@@ -16,41 +17,90 @@ import {
|
||||
kickOfflineByUserDevice,
|
||||
} from "@workspace/ui/services/admin/user";
|
||||
import { deviceIdToHash } from "@workspace/ui/utils/device";
|
||||
import { AlertTriangle, Gauge } from "lucide-react";
|
||||
import { AlertCircle, AlertTriangle, Gauge } from "lucide-react";
|
||||
import { type ReactNode, useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { toast } from "sonner";
|
||||
import { Display } from "@/components/display";
|
||||
import { IpLink } from "@/components/ip-link";
|
||||
import { formatDate } from "@/utils/common";
|
||||
|
||||
function SpeedLimitCard({ subscriptionId }: { subscriptionId: number }) {
|
||||
const { t } = useTranslation("user");
|
||||
const [detail, setDetail] = useState<API.UserSubscribeDetail | null>(null);
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [isError, setIsError] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
getUserSubscribeById({ id: subscriptionId }).then(({ data }) => {
|
||||
if (data.data) setDetail(data.data);
|
||||
});
|
||||
let ignore = false;
|
||||
|
||||
setIsLoading(true);
|
||||
setIsError(false);
|
||||
getUserSubscribeById({ id: subscriptionId })
|
||||
.then(({ data }) => {
|
||||
if (!ignore) setDetail(data.data || null);
|
||||
})
|
||||
.catch(() => {
|
||||
if (!ignore) {
|
||||
setDetail(null);
|
||||
setIsError(true);
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
if (!ignore) setIsLoading(false);
|
||||
});
|
||||
|
||||
return () => {
|
||||
ignore = true;
|
||||
};
|
||||
}, [subscriptionId]);
|
||||
|
||||
if (!detail || detail.status !== 1) return null;
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="mb-4 rounded-lg border bg-muted/30 p-3">
|
||||
<Skeleton className="mb-3 h-5 w-40" />
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
<Skeleton className="h-16" />
|
||||
<Skeleton className="h-16" />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (isError) {
|
||||
return (
|
||||
<div className="mb-4 flex items-start gap-3 rounded-lg border border-destructive/40 bg-destructive/5 p-3 text-destructive text-sm">
|
||||
<AlertCircle className="mt-0.5 h-4 w-4 shrink-0" />
|
||||
<span>
|
||||
{t("subscriptionDetailLoadFailed", "Failed to load speed settings.")}
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!detail) {
|
||||
return (
|
||||
<div className="mb-4 rounded-lg border bg-muted/30 p-3 text-muted-foreground text-sm">
|
||||
{t("subscriptionDetailEmpty", "No subscription details found.")}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (detail.status !== 1) return null;
|
||||
|
||||
const baseSpeed = detail.subscribe?.speed_limit ?? 0;
|
||||
const userSpeed = detail.speed_limit ?? 0;
|
||||
const userTraffic = detail.traffic_limit ?? 0;
|
||||
const userDeviceLimit = detail.device_limit ?? 0;
|
||||
const effectiveSpeed = detail.effective_speed ?? 0;
|
||||
const isThrottled = detail.is_throttled;
|
||||
const rules = detail.traffic_limit || [];
|
||||
const hasLimitConfig =
|
||||
baseSpeed > 0 || userSpeed > 0 || effectiveSpeed > 0 || rules.length > 0;
|
||||
|
||||
if (
|
||||
baseSpeed === 0 &&
|
||||
userSpeed === 0 &&
|
||||
userTraffic === 0 &&
|
||||
userDeviceLimit === 0 &&
|
||||
!isThrottled
|
||||
) {
|
||||
return null;
|
||||
if (!(hasLimitConfig || isThrottled)) {
|
||||
return (
|
||||
<div className="mb-4 rounded-lg border bg-muted/30 p-3 text-muted-foreground text-sm">
|
||||
{t("speedLimitEmpty", "No user-level speed limit rules configured.")}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -66,7 +116,7 @@ function SpeedLimitCard({ subscriptionId }: { subscriptionId: number }) {
|
||||
) : (
|
||||
<Gauge className="mt-0.5 h-4 w-4 shrink-0 text-muted-foreground" />
|
||||
)}
|
||||
<div className="space-y-1">
|
||||
<div className="min-w-0 flex-1 space-y-3">
|
||||
<div className="flex flex-wrap items-center gap-2 font-medium">
|
||||
{isThrottled ? (
|
||||
<>
|
||||
@@ -76,6 +126,7 @@ function SpeedLimitCard({ subscriptionId }: { subscriptionId: number }) {
|
||||
</Badge>
|
||||
{baseSpeed > 0 && (
|
||||
<span className="text-muted-foreground text-xs line-through">
|
||||
{t("subscriptionDefault", "Subscription Default")}:{" "}
|
||||
{baseSpeed} Mbps
|
||||
</span>
|
||||
)}
|
||||
@@ -93,6 +144,20 @@ function SpeedLimitCard({ subscriptionId }: { subscriptionId: number }) {
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<div className="grid gap-2 sm:grid-cols-3">
|
||||
<SpeedMetric
|
||||
label={t("subscriptionDefault", "Subscription Default")}
|
||||
value={baseSpeed}
|
||||
/>
|
||||
<SpeedMetric
|
||||
label={t("userOverride", "User Override")}
|
||||
value={userSpeed}
|
||||
/>
|
||||
<SpeedMetric
|
||||
label={t("effectiveSpeed", "Effective Speed")}
|
||||
value={effectiveSpeed}
|
||||
/>
|
||||
</div>
|
||||
{isThrottled && detail.throttle_rule && (
|
||||
<p className="text-muted-foreground text-xs">
|
||||
{detail.throttle_rule}
|
||||
@@ -104,39 +169,51 @@ function SpeedLimitCard({ subscriptionId }: { subscriptionId: number }) {
|
||||
{formatDate(detail.throttle_end)}
|
||||
</p>
|
||||
)}
|
||||
{(userSpeed > 0 || userTraffic > 0 || userDeviceLimit > 0) && (
|
||||
<dl className="grid gap-2 pt-2 text-xs sm:grid-cols-3">
|
||||
<div>
|
||||
<dt className="text-muted-foreground">
|
||||
{t("userSpeedLimit", "User Speed Limit")}
|
||||
</dt>
|
||||
<dd className="font-medium">
|
||||
<Display type="trafficSpeed" unlimited value={userSpeed} />
|
||||
</dd>
|
||||
{rules.length > 0 && (
|
||||
<div className="space-y-2">
|
||||
<p className="font-medium text-foreground text-xs">
|
||||
{t("trafficLimitRules", "Traffic Limit Rules")}
|
||||
</p>
|
||||
<div className="grid gap-2">
|
||||
{rules.map((rule, index) => (
|
||||
<div
|
||||
className="rounded-md border bg-background/60 px-3 py-2 text-muted-foreground text-xs"
|
||||
key={`${rule.stat_type}-${rule.stat_value}-${index}`}
|
||||
>
|
||||
{t("trafficLimitRuleSummary", {
|
||||
defaultValue:
|
||||
"{{traffic}} GB in {{value}} {{type}} -> {{speed}} Mbps",
|
||||
traffic: rule.traffic_usage,
|
||||
value: rule.stat_value,
|
||||
type:
|
||||
rule.stat_type === "hour"
|
||||
? t("hour", "Hour")
|
||||
: t("day", "Day"),
|
||||
speed: rule.speed_limit,
|
||||
})}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-muted-foreground">
|
||||
{t("userTrafficLimit", "User Traffic Limit")}
|
||||
</dt>
|
||||
<dd className="font-medium">
|
||||
<Display type="traffic" unlimited value={userTraffic} />
|
||||
</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-muted-foreground">
|
||||
{t("userDeviceLimit", "User Device Limit")}
|
||||
</dt>
|
||||
<dd className="font-medium">
|
||||
<Display type="number" unlimited value={userDeviceLimit} />
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function SpeedMetric({ label, value }: { label: string; value: number }) {
|
||||
const { t } = useTranslation("user");
|
||||
|
||||
return (
|
||||
<div className="rounded-md border bg-background/60 p-2">
|
||||
<div className="text-muted-foreground text-xs">{label}</div>
|
||||
<div className="font-medium text-foreground">
|
||||
{value > 0 ? `${value} Mbps` : t("unlimited", "Unlimited")}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function SubscriptionDetail({
|
||||
trigger,
|
||||
userId,
|
||||
@@ -195,11 +272,7 @@ export function SubscriptionDetail({
|
||||
accessorKey: "enabled",
|
||||
header: t("enable", "Enable"),
|
||||
cell: ({ row }) => (
|
||||
<Switch
|
||||
aria-label={t("deviceEnabled", "Device enabled")}
|
||||
checked={row.getValue("enabled")}
|
||||
disabled
|
||||
/>
|
||||
<Switch checked={row.getValue("enabled")} disabled />
|
||||
),
|
||||
},
|
||||
{ accessorKey: "id", header: "ID" },
|
||||
|
||||
@@ -3,6 +3,7 @@ import { Button } from "@workspace/ui/components/button";
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormDescription,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
@@ -19,10 +20,11 @@ import {
|
||||
} from "@workspace/ui/components/sheet";
|
||||
import { Combobox } from "@workspace/ui/composed/combobox";
|
||||
import { DatePicker } from "@workspace/ui/composed/date-picker";
|
||||
import { ArrayInput } from "@workspace/ui/composed/dynamic-inputs";
|
||||
import { EnhancedInput } from "@workspace/ui/composed/enhanced-input";
|
||||
import { Icon } from "@workspace/ui/composed/icon";
|
||||
import { unitConversion } from "@workspace/ui/utils/unit-conversions";
|
||||
import { type ReactNode, useState } from "react";
|
||||
import { type KeyboardEvent, type ReactNode, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { z } from "zod";
|
||||
@@ -36,19 +38,48 @@ interface Props {
|
||||
onSubmit: (values: SubscriptionFormValues) => Promise<boolean>;
|
||||
}
|
||||
|
||||
type SubscriptionTrafficLimitRule = API.UserSubscribeTrafficLimitRule;
|
||||
|
||||
const defaultLimitRule: SubscriptionTrafficLimitRule = {
|
||||
stat_type: "day",
|
||||
stat_value: 1,
|
||||
traffic_usage: 0,
|
||||
speed_limit: 0,
|
||||
};
|
||||
|
||||
const formSchema = z.object({
|
||||
subscribe_id: z.number().default(0),
|
||||
traffic: z.number().default(0),
|
||||
speed_limit: z.number().optional(),
|
||||
traffic_limit: z.number().optional(),
|
||||
device_limit: z.number().optional(),
|
||||
expired_at: z.number().default(0),
|
||||
upload: z.number().default(0),
|
||||
download: z.number().default(0),
|
||||
subscribe_id: z.number().optional(),
|
||||
traffic: z.number().min(0).optional(),
|
||||
speed_limit: z.number().min(0).optional(),
|
||||
device_limit: z.number().min(0).optional(),
|
||||
expired_at: z.number().nullish().optional(),
|
||||
upload: z.number().min(0).optional(),
|
||||
download: z.number().min(0).optional(),
|
||||
id: z.number().optional(),
|
||||
traffic_limit: z
|
||||
.array(
|
||||
z.object({
|
||||
stat_type: z.string(),
|
||||
stat_value: z.number().int().min(1),
|
||||
traffic_usage: z.number().min(0),
|
||||
speed_limit: z.number().min(0),
|
||||
})
|
||||
)
|
||||
.optional(),
|
||||
});
|
||||
|
||||
export type SubscriptionFormValues = z.infer<typeof formSchema>;
|
||||
type SubscriptionFormValues = z.infer<typeof formSchema>;
|
||||
|
||||
export type { SubscriptionFormValues };
|
||||
|
||||
const normalizeLimitRule = (
|
||||
item: SubscriptionTrafficLimitRule
|
||||
): SubscriptionTrafficLimitRule => ({
|
||||
stat_type: item.stat_type || "day",
|
||||
stat_value: Math.max(1, Math.floor(Number(item.stat_value) || 1)),
|
||||
traffic_usage: Math.max(0, Number(item.traffic_usage) || 0),
|
||||
speed_limit: Math.max(0, Number(item.speed_limit) || 0),
|
||||
});
|
||||
|
||||
export function SubscriptionForm({
|
||||
trigger,
|
||||
@@ -60,14 +91,14 @@ export function SubscriptionForm({
|
||||
const { t } = useTranslation("user");
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
const form = useForm({
|
||||
const form = useForm<SubscriptionFormValues>({
|
||||
resolver: zodResolver(formSchema),
|
||||
defaultValues: {
|
||||
subscribe_id: initialData?.subscribe_id || 0,
|
||||
traffic: initialData?.traffic || 0,
|
||||
traffic_limit: initialData?.traffic_limit || 0,
|
||||
speed_limit: initialData?.speed_limit || 0,
|
||||
device_limit: initialData?.device_limit || 0,
|
||||
traffic_limit: initialData?.traffic_limit || [],
|
||||
upload: initialData?.upload || 0,
|
||||
download: initialData?.download || 0,
|
||||
expired_at: initialData?.expire_time || 0,
|
||||
@@ -141,6 +172,7 @@ export function SubscriptionForm({
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<EnhancedInput
|
||||
min={0}
|
||||
placeholder={t("unlimited", "Unlimited")}
|
||||
type="number"
|
||||
{...field}
|
||||
@@ -160,52 +192,16 @@ export function SubscriptionForm({
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="traffic_limit"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t("userTrafficLimit", "User Traffic Limit")}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<EnhancedInput
|
||||
placeholder={t(
|
||||
"followSubscription",
|
||||
"Follow Subscription"
|
||||
)}
|
||||
type="number"
|
||||
{...field}
|
||||
formatInput={(value) =>
|
||||
unitConversion("bytesToGb", value)
|
||||
}
|
||||
formatOutput={(value) =>
|
||||
unitConversion("gbToBytes", value)
|
||||
}
|
||||
onValueChange={(value) => {
|
||||
form.setValue(field.name, value as number);
|
||||
}}
|
||||
suffix="GB"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="speed_limit"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t("userSpeedLimit", "User Speed Limit")}
|
||||
</FormLabel>
|
||||
<FormLabel>{t("speedLimit", "Speed Limit")}</FormLabel>
|
||||
<FormControl>
|
||||
<EnhancedInput
|
||||
placeholder={t(
|
||||
"followSubscription",
|
||||
"Follow Subscription"
|
||||
)}
|
||||
min={0}
|
||||
placeholder={t("unlimited", "Unlimited")}
|
||||
type="number"
|
||||
{...field}
|
||||
onValueChange={(value) => {
|
||||
@@ -214,6 +210,12 @@ export function SubscriptionForm({
|
||||
suffix="Mbps"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
{t(
|
||||
"userSpeedLimitDescription",
|
||||
"Set to 0 to use the subscription default speed limit."
|
||||
)}
|
||||
</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
@@ -223,15 +225,12 @@ export function SubscriptionForm({
|
||||
name="device_limit"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t("userDeviceLimit", "User Device Limit")}
|
||||
</FormLabel>
|
||||
<FormLabel>{t("deviceLimit", "Device Limit")}</FormLabel>
|
||||
<FormControl>
|
||||
<EnhancedInput
|
||||
placeholder={t(
|
||||
"followSubscription",
|
||||
"Follow Subscription"
|
||||
)}
|
||||
min={0}
|
||||
placeholder={t("unlimited", "Unlimited")}
|
||||
step={1}
|
||||
type="number"
|
||||
{...field}
|
||||
onValueChange={(value) => {
|
||||
@@ -253,6 +252,7 @@ export function SubscriptionForm({
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<EnhancedInput
|
||||
min={0}
|
||||
placeholder="0"
|
||||
type="number"
|
||||
{...field}
|
||||
@@ -282,6 +282,7 @@ export function SubscriptionForm({
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<EnhancedInput
|
||||
min={0}
|
||||
placeholder="0"
|
||||
type="number"
|
||||
{...field}
|
||||
@@ -301,6 +302,119 @@ export function SubscriptionForm({
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="traffic_limit"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t("trafficLimitRules", "Traffic Limit Rules")}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<ArrayInput<SubscriptionTrafficLimitRule>
|
||||
className="grid grid-cols-2 gap-3 lg:grid-cols-4"
|
||||
fields={[
|
||||
{
|
||||
name: "stat_type",
|
||||
type: "select",
|
||||
placeholder: t("statType", "Statistics Type"),
|
||||
value: "day",
|
||||
options: [
|
||||
{
|
||||
label: t("statTypeHour", "Hour"),
|
||||
value: "hour",
|
||||
},
|
||||
{
|
||||
label: t("statTypeDay", "Day"),
|
||||
value: "day",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: "stat_value",
|
||||
type: "number",
|
||||
placeholder: t("statValue", "Time Value"),
|
||||
min: 1,
|
||||
step: 1,
|
||||
onKeyDown: (
|
||||
e: KeyboardEvent<HTMLInputElement>
|
||||
) => {
|
||||
if (e.key === "." || e.key === ",") {
|
||||
e.preventDefault();
|
||||
}
|
||||
},
|
||||
formatOutput: (value: string | number) => {
|
||||
const num = Number(value);
|
||||
return String(
|
||||
Number.isNaN(num) ? 1 : Math.floor(num)
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "traffic_usage",
|
||||
type: "number",
|
||||
placeholder: t(
|
||||
"trafficUsage",
|
||||
"Traffic Usage (GB)"
|
||||
),
|
||||
min: 0,
|
||||
onKeyDown: (
|
||||
e: KeyboardEvent<HTMLInputElement>
|
||||
) => {
|
||||
if (e.key === "." || e.key === ",") {
|
||||
e.preventDefault();
|
||||
}
|
||||
},
|
||||
formatOutput: (value: string | number) => {
|
||||
const num = Number(value);
|
||||
return String(
|
||||
Number.isNaN(num) ? 0 : Math.floor(num)
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "speed_limit",
|
||||
type: "number",
|
||||
placeholder: t(
|
||||
"speedLimitMbps",
|
||||
"Speed Limit (Mbps)"
|
||||
),
|
||||
min: 0,
|
||||
onKeyDown: (
|
||||
e: KeyboardEvent<HTMLInputElement>
|
||||
) => {
|
||||
if (e.key === "." || e.key === ",") {
|
||||
e.preventDefault();
|
||||
}
|
||||
},
|
||||
formatOutput: (value: string | number) => {
|
||||
const num = Number(value);
|
||||
return String(
|
||||
Number.isNaN(num) ? 0 : Math.floor(num)
|
||||
);
|
||||
},
|
||||
},
|
||||
]}
|
||||
onChange={(items) => {
|
||||
field.onChange(items.map(normalizeLimitRule));
|
||||
}}
|
||||
value={
|
||||
field.value && field.value.length > 0
|
||||
? field.value
|
||||
: [defaultLimitRule]
|
||||
}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
{t(
|
||||
"trafficLimitDescription",
|
||||
"Limit speed when usage reaches the configured amount in the selected time window."
|
||||
)}
|
||||
</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="expired_at"
|
||||
|
||||
@@ -44,7 +44,7 @@ const WITHDRAWAL_METHOD_MAP: Record<number, string> = {
|
||||
0: "其他",
|
||||
1: "支付宝",
|
||||
2: "微信",
|
||||
3: "银行卡",
|
||||
3: "USDT(TRC20)",
|
||||
};
|
||||
|
||||
const rejectSchema = z.object({
|
||||
@@ -55,6 +55,12 @@ const rejectSchema = z.object({
|
||||
.max(500, "拒绝原因不能超过 500 个字符"),
|
||||
});
|
||||
|
||||
function toOptionalNumber(value?: string) {
|
||||
if (!value) return;
|
||||
const parsed = Number(value);
|
||||
return Number.isFinite(parsed) ? parsed : undefined;
|
||||
}
|
||||
|
||||
function QrCodeCell({ url }: { url?: string }) {
|
||||
const [zoomOpen, setZoomOpen] = useState(false);
|
||||
if (!url) return <span>--</span>;
|
||||
@@ -143,7 +149,7 @@ export default function WithdrawalPage() {
|
||||
const methodOptions = [
|
||||
{ value: "1", label: "支付宝" },
|
||||
{ value: "2", label: "微信" },
|
||||
{ value: "3", label: "银行卡" },
|
||||
{ value: "3", label: "USDT(TRC20)" },
|
||||
{ value: "0", label: "其他" },
|
||||
];
|
||||
|
||||
@@ -309,9 +315,9 @@ export default function WithdrawalPage() {
|
||||
const { data } = await getWithdrawalList({
|
||||
page: pagination.page,
|
||||
size: pagination.size,
|
||||
status: filter.status ? Number(filter.status) : undefined,
|
||||
method: filter.method ? Number(filter.method) : undefined,
|
||||
user_id: filter.user_id ? Number(filter.user_id) : undefined,
|
||||
status: toOptionalNumber(filter.status),
|
||||
method: toOptionalNumber(filter.method),
|
||||
user_id: toOptionalNumber(filter.user_id),
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
@@ -37,6 +37,10 @@
|
||||
"passwordHint": "If you do not enter a password, we will automatically generate one and send it to your email.",
|
||||
"paymentMethod": "Payment Method",
|
||||
"productDescription": "productDescription",
|
||||
"promo": {
|
||||
"available": "Promo Available",
|
||||
"validUntil": "Valid until"
|
||||
},
|
||||
"purchaseDuration": "Purchase Duration",
|
||||
"recharge": "Recharge",
|
||||
"rechargeAmount": "Recharge Amount",
|
||||
|
||||
@@ -37,6 +37,10 @@
|
||||
"passwordHint": "如果您不输入密码,我们将自动生成一个并发送到您的邮箱。",
|
||||
"paymentMethod": "支付方式",
|
||||
"productDescription": "商品描述",
|
||||
"promo": {
|
||||
"available": "促销可用",
|
||||
"validUntil": "有效期至"
|
||||
},
|
||||
"purchaseDuration": "购买时长",
|
||||
"recharge": "充值",
|
||||
"rechargeAmount": "充值金额",
|
||||
|
||||
@@ -17,6 +17,7 @@ import CouponInput from "@/sections/subscribe/coupon-input";
|
||||
import { SubscribeDetail } from "@/sections/subscribe/detail";
|
||||
import DurationSelector from "@/sections/subscribe/duration-selector";
|
||||
import PaymentMethods from "@/sections/subscribe/payment-methods";
|
||||
import { PromoInfo } from "@/sections/subscribe/promo-info";
|
||||
import { useGlobalStore } from "@/stores/global";
|
||||
|
||||
export default function Content({
|
||||
@@ -49,6 +50,9 @@ export default function Content({
|
||||
valid: false,
|
||||
message: "",
|
||||
});
|
||||
const selectedDiscount = subscription?.discount?.find(
|
||||
(item) => item.quantity === params.quantity
|
||||
);
|
||||
|
||||
const { data: order } = useQuery({
|
||||
enabled: !!subscription?.id && !!params.payment,
|
||||
@@ -103,7 +107,10 @@ export default function Content({
|
||||
navigate({ to: "/purchasing/order", search: { order_no } });
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
setIsEmailValid((prev) => ({
|
||||
...prev,
|
||||
message: error instanceof Error ? error.message : prev.message,
|
||||
}));
|
||||
}
|
||||
});
|
||||
}, [params, navigate]);
|
||||
@@ -285,6 +292,7 @@ export default function Content({
|
||||
show_original_price: subscription?.show_original_price,
|
||||
}}
|
||||
/>
|
||||
<PromoInfo discount={selectedDiscount} />
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
import { Badge } from "@workspace/ui/components/badge";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Display } from "@/components/display";
|
||||
|
||||
interface PromoInfoProps {
|
||||
discount?: API.SubscribeDiscount;
|
||||
}
|
||||
|
||||
export function PromoInfo({ discount }: Readonly<PromoInfoProps>) {
|
||||
const { t } = useTranslation("subscribe");
|
||||
const promo = discount?.promo;
|
||||
|
||||
if (!promo) return null;
|
||||
|
||||
return (
|
||||
<div className="flex flex-wrap items-center justify-between gap-2 rounded-md border bg-muted/40 p-3 text-sm">
|
||||
<div className="grid gap-1">
|
||||
<span className="font-medium">
|
||||
{promo.rule_name || t("promo.available", "Promo Available")}
|
||||
</span>
|
||||
{promo.end_time && (
|
||||
<span className="text-muted-foreground text-xs">
|
||||
{t("promo.validUntil", "Valid until")}:{" "}
|
||||
{new Date(promo.end_time * 1000).toLocaleString()}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
<Badge variant="secondary">
|
||||
<Display type="currency" value={promo.promo_price} />
|
||||
</Badge>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -18,6 +18,7 @@ import { useTranslation } from "react-i18next";
|
||||
import CouponInput from "@/sections/subscribe/coupon-input";
|
||||
import DurationSelector from "@/sections/subscribe/duration-selector";
|
||||
import PaymentMethods from "@/sections/subscribe/payment-methods";
|
||||
import { PromoInfo } from "@/sections/subscribe/promo-info";
|
||||
import { useGlobalStore } from "@/stores/global";
|
||||
import { SubscribeBilling } from "./billing";
|
||||
import { SubscribeDetail } from "./detail";
|
||||
@@ -41,7 +42,12 @@ export default function Purchase({
|
||||
coupon: "",
|
||||
});
|
||||
const [loading, startTransition] = useTransition();
|
||||
const lastSuccessOrderRef = useRef<any>(null);
|
||||
const lastSuccessOrderRef = useRef<API.PreOrderResponse | undefined>(
|
||||
undefined
|
||||
);
|
||||
const selectedDiscount = subscribe?.discount?.find(
|
||||
(item) => item.quantity === params.quantity
|
||||
);
|
||||
|
||||
const { data: order } = useQuery({
|
||||
enabled: !!subscribe?.id,
|
||||
@@ -140,6 +146,7 @@ export default function Purchase({
|
||||
show_original_price: subscribe?.show_original_price,
|
||||
}}
|
||||
/>
|
||||
<PromoInfo discount={selectedDiscount} />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<div className="flex flex-col justify-between text-sm">
|
||||
|
||||
@@ -63,7 +63,7 @@ import { useGlobalStore } from "@/stores/global";
|
||||
const WITHDRAWAL_METHODS = [
|
||||
{ value: 1, label: "支付宝" },
|
||||
{ value: 2, label: "微信" },
|
||||
{ value: 3, label: "银行卡" },
|
||||
{ value: 3, label: "USDT(TRC20)" },
|
||||
{ value: 0, label: "其他" },
|
||||
] as const;
|
||||
|
||||
@@ -111,13 +111,21 @@ function QrCodeView({ url }: { url: string }) {
|
||||
<img
|
||||
alt="收款码"
|
||||
className="h-16 w-16 cursor-zoom-in object-cover"
|
||||
height={64}
|
||||
src={url}
|
||||
width={64}
|
||||
/>
|
||||
</button>
|
||||
{zoomOpen && (
|
||||
<Dialog onOpenChange={setZoomOpen} open={zoomOpen}>
|
||||
<DialogContent className="max-w-sm">
|
||||
<img alt="收款码" className="w-full" src={url} />
|
||||
<img
|
||||
alt="收款码"
|
||||
className="w-full"
|
||||
height={320}
|
||||
src={url}
|
||||
width={320}
|
||||
/>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)}
|
||||
@@ -153,18 +161,16 @@ const withdrawalFormSchema = z
|
||||
if (!data.account) {
|
||||
ctx.addIssue({
|
||||
code: z.ZodIssueCode.custom,
|
||||
message: "银行卡收款账号为必填",
|
||||
path: ["account"],
|
||||
});
|
||||
}
|
||||
} else if (data.method === 0) {
|
||||
if (!data.account && !data.content) {
|
||||
ctx.addIssue({
|
||||
code: z.ZodIssueCode.custom,
|
||||
message: "收款账号和备注至少填一项",
|
||||
message: "USDT(TRC20) 地址为必填",
|
||||
path: ["account"],
|
||||
});
|
||||
}
|
||||
} else if (data.method === 0 && !(data.account || data.content)) {
|
||||
ctx.addIssue({
|
||||
code: z.ZodIssueCode.custom,
|
||||
message: "收款账号和备注至少填一项",
|
||||
path: ["account"],
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
@@ -421,9 +427,7 @@ export default function Affiliate() {
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
收款码
|
||||
<span className="ml-1 text-destructive">
|
||||
*
|
||||
</span>
|
||||
<span className="ml-1 text-destructive">*</span>
|
||||
</FormLabel>
|
||||
{watchedQrCodeUrl ? (
|
||||
<div className="relative inline-block">
|
||||
@@ -446,7 +450,9 @@ export default function Affiliate() {
|
||||
returnType="file"
|
||||
>
|
||||
<div className="flex h-24 w-24 flex-col items-center justify-center rounded border-2 border-dashed text-muted-foreground text-xs">
|
||||
{qrUploading ? "上传中..." : "点击上传\n收款码"}
|
||||
{qrUploading
|
||||
? "上传中..."
|
||||
: "点击上传\n收款码"}
|
||||
</div>
|
||||
</UploadImage>
|
||||
)}
|
||||
@@ -474,7 +480,7 @@ export default function Affiliate() {
|
||||
<Input
|
||||
placeholder={
|
||||
watchedMethod === 3
|
||||
? "请输入银行卡号或账户信息"
|
||||
? "请输入 USDT(TRC20) 收款地址"
|
||||
: "请输入收款账号(与备注至少填一项)"
|
||||
}
|
||||
{...field}
|
||||
@@ -519,9 +525,7 @@ export default function Affiliate() {
|
||||
</Button>
|
||||
<Button
|
||||
disabled={
|
||||
submitting ||
|
||||
qrUploading ||
|
||||
availableCommission <= 0
|
||||
submitting || qrUploading || availableCommission <= 0
|
||||
}
|
||||
form="withdrawal-form"
|
||||
type="submit"
|
||||
|
||||
+38
-16
@@ -307,27 +307,34 @@ declare namespace API {
|
||||
|
||||
type PromoPrice = {
|
||||
id: number;
|
||||
rule_id: number;
|
||||
promo_rule_id: number;
|
||||
subscribe_id: number;
|
||||
subscribe_name?: string;
|
||||
quantity: number;
|
||||
unit_price: number;
|
||||
promo_price: number;
|
||||
created_at?: number;
|
||||
updated_at?: number;
|
||||
};
|
||||
|
||||
type CreatePromoPriceRequest = {
|
||||
rule_id: number;
|
||||
type CreatePromoPriceItem = {
|
||||
subscribe_id: number;
|
||||
quantity: number;
|
||||
promo_price: number;
|
||||
};
|
||||
|
||||
type CreatePromoPriceRequest = {
|
||||
promo_rule_id: number;
|
||||
items: CreatePromoPriceItem[];
|
||||
};
|
||||
|
||||
type PromoUsage = {
|
||||
id: number;
|
||||
rule_id: number;
|
||||
promo_rule_id: number;
|
||||
rule_name?: string;
|
||||
subscribe_id: number;
|
||||
subscribe_name?: string;
|
||||
quantity: number;
|
||||
user_id: number;
|
||||
order_no: string;
|
||||
unit_price: number;
|
||||
@@ -462,10 +469,8 @@ declare namespace API {
|
||||
traffic: number;
|
||||
subscribe_id: number;
|
||||
speed_limit?: number;
|
||||
traffic_limit?: number;
|
||||
device_limit?: number;
|
||||
upload?: number;
|
||||
download?: number;
|
||||
traffic_limit?: UserSubscribeTrafficLimitRule[];
|
||||
};
|
||||
|
||||
type CurrencyConfig = {
|
||||
@@ -1022,7 +1027,7 @@ declare namespace API {
|
||||
type GetPromoPriceListParams = {
|
||||
page: number;
|
||||
size: number;
|
||||
rule_id?: number;
|
||||
promo_rule_id?: number;
|
||||
subscribe_id?: number;
|
||||
};
|
||||
|
||||
@@ -1038,7 +1043,7 @@ declare namespace API {
|
||||
type GetPromoUsageListParams = {
|
||||
page: number;
|
||||
size: number;
|
||||
rule_id?: number;
|
||||
promo_rule_id?: number;
|
||||
subscribe_id?: number;
|
||||
user_id?: number;
|
||||
order_no?: string;
|
||||
@@ -2221,6 +2226,13 @@ declare namespace API {
|
||||
quantity: number;
|
||||
discount: number;
|
||||
map_apple?: string;
|
||||
promo?: SubscribeDiscountPromo;
|
||||
};
|
||||
|
||||
type SubscribeDiscountPromo = {
|
||||
rule_name?: string;
|
||||
promo_price: number;
|
||||
end_time?: number;
|
||||
};
|
||||
|
||||
type SubscribeGroup = {
|
||||
@@ -2559,8 +2571,8 @@ declare namespace API {
|
||||
upload: number;
|
||||
download: number;
|
||||
speed_limit?: number;
|
||||
traffic_limit?: number;
|
||||
device_limit?: number;
|
||||
traffic_limit?: UserSubscribeTrafficLimitRule[];
|
||||
};
|
||||
|
||||
type User = {
|
||||
@@ -2649,11 +2661,14 @@ declare namespace API {
|
||||
finished_at: number;
|
||||
reset_time: number;
|
||||
traffic: number;
|
||||
traffic_limit?: number;
|
||||
speed_limit?: number;
|
||||
device_limit?: number;
|
||||
download: number;
|
||||
upload: number;
|
||||
speed_limit?: number;
|
||||
device_limit?: number;
|
||||
effective_speed?: number;
|
||||
is_throttled?: boolean;
|
||||
throttle_rule?: string;
|
||||
traffic_limit?: UserSubscribeTrafficLimitRule[];
|
||||
token: string;
|
||||
status: number;
|
||||
short: string;
|
||||
@@ -2663,6 +2678,13 @@ declare namespace API {
|
||||
updated_at: number;
|
||||
};
|
||||
|
||||
type UserSubscribeTrafficLimitRule = {
|
||||
stat_type: string;
|
||||
stat_value: number;
|
||||
traffic_usage: number;
|
||||
speed_limit: number;
|
||||
};
|
||||
|
||||
type UserSubscribeDetail = {
|
||||
id: number;
|
||||
user_id: number;
|
||||
@@ -2674,11 +2696,11 @@ declare namespace API {
|
||||
expire_time: number;
|
||||
reset_time: number;
|
||||
traffic: number;
|
||||
traffic_limit?: number;
|
||||
speed_limit?: number;
|
||||
device_limit?: number;
|
||||
download: number;
|
||||
upload: number;
|
||||
speed_limit?: number;
|
||||
device_limit?: number;
|
||||
traffic_limit?: UserSubscribeTrafficLimitRule[];
|
||||
token: string;
|
||||
status: number;
|
||||
effective_speed: number;
|
||||
|
||||
@@ -910,6 +910,13 @@ declare namespace API {
|
||||
quantity: number;
|
||||
discount: number;
|
||||
map_apple?: string;
|
||||
promo?: SubscribeDiscountPromo;
|
||||
};
|
||||
|
||||
type SubscribeDiscountPromo = {
|
||||
rule_name?: string;
|
||||
promo_price: number;
|
||||
end_time?: number;
|
||||
};
|
||||
|
||||
type SubscribeGroup = {
|
||||
|
||||
+7
@@ -1019,6 +1019,13 @@ declare namespace API {
|
||||
quantity: number;
|
||||
discount: number;
|
||||
map_apple?: string;
|
||||
promo?: SubscribeDiscountPromo;
|
||||
};
|
||||
|
||||
type SubscribeDiscountPromo = {
|
||||
rule_name?: string;
|
||||
promo_price: number;
|
||||
end_time?: number;
|
||||
};
|
||||
|
||||
type SubscribeGroup = {
|
||||
|
||||
Reference in New Issue
Block a user