This commit is contained in:
@@ -34,5 +34,6 @@
|
||||
"Traffic Details": "Traffic Details",
|
||||
"Device Group": "Device Group",
|
||||
"User Management": "User Management",
|
||||
"Users & Support": "Users & Support"
|
||||
"Users & Support": "Users & Support",
|
||||
"Withdrawal Management": "Withdrawal Management"
|
||||
}
|
||||
|
||||
@@ -34,5 +34,6 @@
|
||||
"Traffic Details": "流量详情",
|
||||
"Device Group": "设备组",
|
||||
"User Management": "用户管理",
|
||||
"Users & Support": "用户与支持"
|
||||
"Users & Support": "用户与支持",
|
||||
"Withdrawal Management": "提现管理"
|
||||
}
|
||||
|
||||
@@ -93,6 +93,11 @@ export function useNavs() {
|
||||
url: "/dashboard/user",
|
||||
icon: "flat-color-icons:conference-call",
|
||||
},
|
||||
{
|
||||
title: t("Withdrawal Management", "Withdrawal Management"),
|
||||
url: "/dashboard/withdrawal",
|
||||
icon: "flat-color-icons:money-transfer",
|
||||
},
|
||||
{
|
||||
title: t("Device Group", "Device Group"),
|
||||
url: "/dashboard/family",
|
||||
|
||||
@@ -17,6 +17,9 @@ const IndexLazyRouteImport = createFileRoute('/')()
|
||||
const DashboardIndexLazyRouteImport = createFileRoute('/dashboard/')()
|
||||
const DashboardServersLazyRouteImport = createFileRoute('/dashboard/servers')()
|
||||
const DashboardNodesLazyRouteImport = createFileRoute('/dashboard/nodes')()
|
||||
const DashboardWithdrawalIndexLazyRouteImport = createFileRoute(
|
||||
'/dashboard/withdrawal/',
|
||||
)()
|
||||
const DashboardUserIndexLazyRouteImport = createFileRoute('/dashboard/user/')()
|
||||
const DashboardTicketIndexLazyRouteImport =
|
||||
createFileRoute('/dashboard/ticket/')()
|
||||
@@ -123,6 +126,14 @@ const DashboardNodesLazyRoute = DashboardNodesLazyRouteImport.update({
|
||||
} as any).lazy(() =>
|
||||
import('./routes/dashboard/nodes.lazy').then((d) => d.Route),
|
||||
)
|
||||
const DashboardWithdrawalIndexLazyRoute =
|
||||
DashboardWithdrawalIndexLazyRouteImport.update({
|
||||
id: '/withdrawal/',
|
||||
path: '/withdrawal/',
|
||||
getParentRoute: () => DashboardRouteLazyRoute,
|
||||
} as any).lazy(() =>
|
||||
import('./routes/dashboard/withdrawal/index.lazy').then((d) => d.Route),
|
||||
)
|
||||
const DashboardUserIndexLazyRoute = DashboardUserIndexLazyRouteImport.update({
|
||||
id: '/user/',
|
||||
path: '/user/',
|
||||
@@ -375,6 +386,7 @@ export interface FileRoutesByFullPath {
|
||||
'/dashboard/system': typeof DashboardSystemIndexLazyRoute
|
||||
'/dashboard/ticket': typeof DashboardTicketIndexLazyRoute
|
||||
'/dashboard/user': typeof DashboardUserIndexLazyRoute
|
||||
'/dashboard/withdrawal': typeof DashboardWithdrawalIndexLazyRoute
|
||||
}
|
||||
export interface FileRoutesByTo {
|
||||
'/': typeof IndexLazyRoute
|
||||
@@ -409,6 +421,7 @@ export interface FileRoutesByTo {
|
||||
'/dashboard/system': typeof DashboardSystemIndexLazyRoute
|
||||
'/dashboard/ticket': typeof DashboardTicketIndexLazyRoute
|
||||
'/dashboard/user': typeof DashboardUserIndexLazyRoute
|
||||
'/dashboard/withdrawal': typeof DashboardWithdrawalIndexLazyRoute
|
||||
}
|
||||
export interface FileRoutesById {
|
||||
__root__: typeof rootRouteImport
|
||||
@@ -445,6 +458,7 @@ export interface FileRoutesById {
|
||||
'/dashboard/system/': typeof DashboardSystemIndexLazyRoute
|
||||
'/dashboard/ticket/': typeof DashboardTicketIndexLazyRoute
|
||||
'/dashboard/user/': typeof DashboardUserIndexLazyRoute
|
||||
'/dashboard/withdrawal/': typeof DashboardWithdrawalIndexLazyRoute
|
||||
}
|
||||
export interface FileRouteTypes {
|
||||
fileRoutesByFullPath: FileRoutesByFullPath
|
||||
@@ -482,6 +496,7 @@ export interface FileRouteTypes {
|
||||
| '/dashboard/system'
|
||||
| '/dashboard/ticket'
|
||||
| '/dashboard/user'
|
||||
| '/dashboard/withdrawal'
|
||||
fileRoutesByTo: FileRoutesByTo
|
||||
to:
|
||||
| '/'
|
||||
@@ -516,6 +531,7 @@ export interface FileRouteTypes {
|
||||
| '/dashboard/system'
|
||||
| '/dashboard/ticket'
|
||||
| '/dashboard/user'
|
||||
| '/dashboard/withdrawal'
|
||||
id:
|
||||
| '__root__'
|
||||
| '/'
|
||||
@@ -551,6 +567,7 @@ export interface FileRouteTypes {
|
||||
| '/dashboard/system/'
|
||||
| '/dashboard/ticket/'
|
||||
| '/dashboard/user/'
|
||||
| '/dashboard/withdrawal/'
|
||||
fileRoutesById: FileRoutesById
|
||||
}
|
||||
export interface RootRouteChildren {
|
||||
@@ -595,6 +612,13 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof DashboardNodesLazyRouteImport
|
||||
parentRoute: typeof DashboardRouteLazyRoute
|
||||
}
|
||||
'/dashboard/withdrawal/': {
|
||||
id: '/dashboard/withdrawal/'
|
||||
path: '/withdrawal'
|
||||
fullPath: '/dashboard/withdrawal'
|
||||
preLoaderRoute: typeof DashboardWithdrawalIndexLazyRouteImport
|
||||
parentRoute: typeof DashboardRouteLazyRoute
|
||||
}
|
||||
'/dashboard/user/': {
|
||||
id: '/dashboard/user/'
|
||||
path: '/user'
|
||||
@@ -826,6 +850,7 @@ interface DashboardRouteLazyRouteChildren {
|
||||
DashboardSystemIndexLazyRoute: typeof DashboardSystemIndexLazyRoute
|
||||
DashboardTicketIndexLazyRoute: typeof DashboardTicketIndexLazyRoute
|
||||
DashboardUserIndexLazyRoute: typeof DashboardUserIndexLazyRoute
|
||||
DashboardWithdrawalIndexLazyRoute: typeof DashboardWithdrawalIndexLazyRoute
|
||||
}
|
||||
|
||||
const DashboardRouteLazyRouteChildren: DashboardRouteLazyRouteChildren = {
|
||||
@@ -860,6 +885,7 @@ const DashboardRouteLazyRouteChildren: DashboardRouteLazyRouteChildren = {
|
||||
DashboardSystemIndexLazyRoute: DashboardSystemIndexLazyRoute,
|
||||
DashboardTicketIndexLazyRoute: DashboardTicketIndexLazyRoute,
|
||||
DashboardUserIndexLazyRoute: DashboardUserIndexLazyRoute,
|
||||
DashboardWithdrawalIndexLazyRoute: DashboardWithdrawalIndexLazyRoute,
|
||||
}
|
||||
|
||||
const DashboardRouteLazyRouteWithChildren =
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
import { createLazyFileRoute } from "@tanstack/react-router";
|
||||
import WithdrawalPage from "@/sections/withdrawal";
|
||||
|
||||
export const Route = createLazyFileRoute("/dashboard/withdrawal/")({
|
||||
component: WithdrawalPage,
|
||||
});
|
||||
@@ -0,0 +1,302 @@
|
||||
"use client";
|
||||
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import { useMutation } from "@tanstack/react-query";
|
||||
import { Badge } from "@workspace/ui/components/badge";
|
||||
import { Button } from "@workspace/ui/components/button";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@workspace/ui/components/dialog";
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from "@workspace/ui/components/form";
|
||||
import { Textarea } from "@workspace/ui/components/textarea";
|
||||
import { ConfirmButton } from "@workspace/ui/composed/confirm-button";
|
||||
import {
|
||||
ProTable,
|
||||
type ProTableActions,
|
||||
} from "@workspace/ui/composed/pro-table/pro-table";
|
||||
import {
|
||||
approveWithdrawal,
|
||||
getWithdrawalList,
|
||||
rejectWithdrawal,
|
||||
} from "@workspace/ui/services/admin/withdrawal";
|
||||
import { useRef, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { toast } from "sonner";
|
||||
import { z } from "zod";
|
||||
import { Display } from "@/components/display";
|
||||
import { UserDetail } from "@/sections/user/user-detail";
|
||||
import { formatDate } from "@/utils/common";
|
||||
|
||||
const rejectSchema = z.object({
|
||||
reason: z
|
||||
.string()
|
||||
.trim()
|
||||
.min(2, "请填写拒绝原因")
|
||||
.max(500, "拒绝原因不能超过 500 个字符"),
|
||||
});
|
||||
|
||||
export default function WithdrawalPage() {
|
||||
const { t } = useTranslation("user");
|
||||
const ref = useRef<ProTableActions>(null);
|
||||
const [rejectOpen, setRejectOpen] = useState(false);
|
||||
const [currentRow, setCurrentRow] = useState<API.WithdrawalLog | null>(null);
|
||||
const form = useForm<z.infer<typeof rejectSchema>>({
|
||||
resolver: zodResolver(rejectSchema),
|
||||
defaultValues: {
|
||||
reason: "",
|
||||
},
|
||||
});
|
||||
|
||||
const approveMutation = useMutation({
|
||||
mutationFn: async (withdrawalId: number) =>
|
||||
approveWithdrawal({ withdrawal_id: withdrawalId }),
|
||||
onSuccess: () => {
|
||||
toast.success("提现申请已通过");
|
||||
ref.current?.refresh();
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Approve withdrawal failed", error);
|
||||
toast.error("提现通过失败");
|
||||
},
|
||||
});
|
||||
|
||||
const rejectMutation = useMutation({
|
||||
mutationFn: async (values: { withdrawal_id: number; reason: string }) =>
|
||||
rejectWithdrawal(values),
|
||||
onSuccess: () => {
|
||||
toast.success("提现申请已拒绝");
|
||||
setRejectOpen(false);
|
||||
setCurrentRow(null);
|
||||
form.reset({ reason: "" });
|
||||
ref.current?.refresh();
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Reject withdrawal failed", error);
|
||||
toast.error("提现拒绝失败");
|
||||
},
|
||||
});
|
||||
|
||||
const statusOptions = [
|
||||
{ value: "0", label: "审核中" },
|
||||
{ value: "1", label: "已通过" },
|
||||
{ value: "2", label: "已拒绝" },
|
||||
];
|
||||
|
||||
const statusMap: Record<number, { label: string; className: string }> = {
|
||||
0: {
|
||||
label: "审核中",
|
||||
className: "bg-amber-100 text-amber-700 border-amber-200",
|
||||
},
|
||||
1: {
|
||||
label: "已通过",
|
||||
className: "bg-emerald-100 text-emerald-700 border-emerald-200",
|
||||
},
|
||||
2: {
|
||||
label: "已拒绝",
|
||||
className: "bg-rose-100 text-rose-700 border-rose-200",
|
||||
},
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<ProTable<API.WithdrawalLog, { status?: string; user_id?: string }>
|
||||
action={ref}
|
||||
actions={{
|
||||
render: (row) => {
|
||||
if (row.status !== 0) return [];
|
||||
|
||||
return [
|
||||
<ConfirmButton
|
||||
cancelText={t("cancel", "Cancel")}
|
||||
confirmText={t("confirm", "Confirm")}
|
||||
description="确认后将标记该提现为已通过，请确保线下打款流程已完成。"
|
||||
key="approve"
|
||||
onConfirm={async () => {
|
||||
await approveMutation.mutateAsync(row.id);
|
||||
}}
|
||||
title="确认通过提现吗？"
|
||||
trigger={
|
||||
<Button
|
||||
disabled={approveMutation.isPending}
|
||||
size="sm"
|
||||
variant="default"
|
||||
>
|
||||
通过
|
||||
</Button>
|
||||
}
|
||||
/>,
|
||||
<Button
|
||||
key="reject"
|
||||
onClick={() => {
|
||||
setCurrentRow(row);
|
||||
setRejectOpen(true);
|
||||
}}
|
||||
size="sm"
|
||||
variant="destructive"
|
||||
>
|
||||
拒绝
|
||||
</Button>,
|
||||
];
|
||||
},
|
||||
}}
|
||||
columns={[
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: "ID",
|
||||
},
|
||||
{
|
||||
accessorKey: "user_id",
|
||||
header: t("user", "User"),
|
||||
cell: ({ row }) => <UserDetail id={row.original.user_id} />,
|
||||
},
|
||||
{
|
||||
accessorKey: "amount",
|
||||
header: "提现金额",
|
||||
cell: ({ row }) => (
|
||||
<Display type="currency" value={row.original.amount} />
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorKey: "content",
|
||||
header: "收款信息",
|
||||
cell: ({ row }) => (
|
||||
<div className="max-w-[360px] break-all text-sm">
|
||||
{row.original.content || "--"}
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorKey: "status",
|
||||
header: "状态",
|
||||
cell: ({ row }) => {
|
||||
const status = statusMap[row.original.status] ?? {
|
||||
label: `未知 (${row.original.status})`,
|
||||
className: "",
|
||||
};
|
||||
return (
|
||||
<Badge className={status.className} variant="outline">
|
||||
{status.label}
|
||||
</Badge>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "reason",
|
||||
header: "拒绝原因",
|
||||
cell: ({ row }) => row.original.reason || "--",
|
||||
},
|
||||
{
|
||||
accessorKey: "created_at",
|
||||
header: "申请时间",
|
||||
cell: ({ row }) => formatDate(row.original.created_at),
|
||||
},
|
||||
{
|
||||
accessorKey: "updated_at",
|
||||
header: "更新时间",
|
||||
cell: ({ row }) => formatDate(row.original.updated_at),
|
||||
},
|
||||
]}
|
||||
header={{ title: "提现管理" }}
|
||||
params={[
|
||||
{
|
||||
key: "status",
|
||||
options: statusOptions,
|
||||
placeholder: "状态",
|
||||
},
|
||||
{
|
||||
key: "user_id",
|
||||
placeholder: "用户 ID",
|
||||
},
|
||||
]}
|
||||
request={async (pagination, filter) => {
|
||||
const { data } = await getWithdrawalList({
|
||||
page: pagination.page,
|
||||
size: pagination.size,
|
||||
status: filter.status ? Number(filter.status) : undefined,
|
||||
user_id: filter.user_id ? Number(filter.user_id) : undefined,
|
||||
});
|
||||
|
||||
return {
|
||||
list: data.data?.list || [],
|
||||
total: data.data?.total || 0,
|
||||
};
|
||||
}}
|
||||
/>
|
||||
|
||||
<Dialog
|
||||
onOpenChange={(open) => {
|
||||
setRejectOpen(open);
|
||||
if (!open) {
|
||||
setCurrentRow(null);
|
||||
form.reset({ reason: "" });
|
||||
}
|
||||
}}
|
||||
open={rejectOpen}
|
||||
>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>拒绝提现申请</DialogTitle>
|
||||
<DialogDescription>
|
||||
为用户填写本次拒绝原因，提交后该记录会更新为已拒绝。
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<Form {...form}>
|
||||
<form
|
||||
className="space-y-4"
|
||||
onSubmit={form.handleSubmit(async (values) => {
|
||||
if (!currentRow) return;
|
||||
await rejectMutation.mutateAsync({
|
||||
withdrawal_id: currentRow.id,
|
||||
reason: values.reason.trim(),
|
||||
});
|
||||
})}
|
||||
>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="reason"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>拒绝原因</FormLabel>
|
||||
<FormControl>
|
||||
<Textarea
|
||||
placeholder="请输入拒绝原因，用户端会看到这条说明"
|
||||
rows={5}
|
||||
{...field}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<DialogFooter>
|
||||
<Button
|
||||
onClick={() => setRejectOpen(false)}
|
||||
type="button"
|
||||
variant="outline"
|
||||
>
|
||||
{t("cancel", "Cancel")}
|
||||
</Button>
|
||||
<Button disabled={rejectMutation.isPending} type="submit">
|
||||
{rejectMutation.isPending ? "提交中..." : "确认拒绝"}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Form>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,11 +1,37 @@
|
||||
{
|
||||
"accountInfo": "Payout Details",
|
||||
"accountPlaceholder": "Enter bank card, Alipay, USDT wallet, or other payout details",
|
||||
"accountRequired": "Payout details are required",
|
||||
"accountTooLong": "Payout details must be 200 characters or fewer",
|
||||
"amountInvalid": "Enter a valid amount",
|
||||
"amountPositive": "Withdrawal amount must be greater than 0",
|
||||
"applyTime": "Applied At",
|
||||
"applyWithdraw": "Request Withdrawal",
|
||||
"cancel": "Cancel",
|
||||
"commissionInfo": "Commission Info",
|
||||
"commissionRate": "Commission Rate",
|
||||
"copyInviteLink": "Copy Invite Link",
|
||||
"copySuccess": "Copy Success",
|
||||
"currentCommission": "Current Commission",
|
||||
"inviteCode": "Invite Code",
|
||||
"inviteRecords": "Invite Records",
|
||||
"noReason": "None",
|
||||
"rejectReason": "Reject Reason",
|
||||
"registrationTime": "Registration Time",
|
||||
"submitWithdraw": "Submit Request",
|
||||
"submitting": "Submitting...",
|
||||
"totalCommission": "Total Commission",
|
||||
"userIdentifier": "User Identifier"
|
||||
"unknownStatus": "Unknown Status",
|
||||
"userIdentifier": "User Identifier",
|
||||
"withdrawAmount": "Withdrawal Amount",
|
||||
"withdrawAmountPlaceholder": "Enter the withdrawal amount in dollars",
|
||||
"withdrawDescription": "Submit the withdrawal amount and payout details, then wait for review.",
|
||||
"withdrawError": "Failed to submit withdrawal request",
|
||||
"withdrawRecords": "Withdrawal Records",
|
||||
"withdrawStatus": {
|
||||
"approved": "Approved",
|
||||
"pending": "Pending Review",
|
||||
"rejected": "Rejected"
|
||||
},
|
||||
"withdrawSuccess": "Withdrawal request submitted"
|
||||
}
|
||||
|
||||
@@ -1,11 +1,37 @@
|
||||
{
|
||||
"accountInfo": "收款信息",
|
||||
"accountPlaceholder": "请输入银行卡、支付宝、USDT 地址等收款信息",
|
||||
"accountRequired": "请填写收款信息",
|
||||
"accountTooLong": "收款信息不能超过 200 个字符",
|
||||
"amountInvalid": "请输入有效金额",
|
||||
"amountPositive": "提现金额必须大于 0",
|
||||
"applyTime": "申请时间",
|
||||
"applyWithdraw": "申请提现",
|
||||
"cancel": "取消",
|
||||
"commissionInfo": "佣金信息",
|
||||
"commissionRate": "佣金比例",
|
||||
"copyInviteLink": "复制邀请链接",
|
||||
"copySuccess": "复制成功",
|
||||
"currentCommission": "当前可见佣金",
|
||||
"inviteCode": "邀请码",
|
||||
"inviteRecords": "邀请记录",
|
||||
"noReason": "无",
|
||||
"rejectReason": "拒绝原因",
|
||||
"registrationTime": "注册时间",
|
||||
"submitWithdraw": "提交申请",
|
||||
"submitting": "提交中...",
|
||||
"totalCommission": "累计佣金",
|
||||
"userIdentifier": "用户标识"
|
||||
"unknownStatus": "未知状态",
|
||||
"userIdentifier": "用户标识",
|
||||
"withdrawAmount": "提现金额",
|
||||
"withdrawAmountPlaceholder": "请输入提现金额，单位为元",
|
||||
"withdrawDescription": "填写提现金额和收款信息后提交申请，等待后台审核。",
|
||||
"withdrawError": "提现申请提交失败",
|
||||
"withdrawRecords": "提现记录",
|
||||
"withdrawStatus": {
|
||||
"approved": "已通过",
|
||||
"pending": "审核中",
|
||||
"rejected": "已拒绝"
|
||||
},
|
||||
"withdrawSuccess": "提现申请已提交"
|
||||
}
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||
import { Badge } from "@workspace/ui/components/badge";
|
||||
import { Button } from "@workspace/ui/components/button";
|
||||
import {
|
||||
Card,
|
||||
@@ -9,13 +10,26 @@ import {
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
} from "@workspace/ui/components/card";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@workspace/ui/components/dialog";
|
||||
import { Input } from "@workspace/ui/components/input";
|
||||
import { Textarea } from "@workspace/ui/components/textarea";
|
||||
import { ProList } from "@workspace/ui/composed/pro-list/pro-list";
|
||||
import {
|
||||
commissionWithdraw,
|
||||
queryUserAffiliate,
|
||||
queryUserAffiliateList,
|
||||
queryWithdrawalLog,
|
||||
} from "@workspace/ui/services/user/user";
|
||||
import { formatDate } from "@workspace/ui/utils/formatting";
|
||||
import { Copy } from "lucide-react";
|
||||
import { Copy, Wallet } from "lucide-react";
|
||||
import { useState } from "react";
|
||||
import { CopyToClipboard } from "react-copy-to-clipboard";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { toast } from "sonner";
|
||||
@@ -24,7 +38,13 @@ import { useGlobalStore } from "@/stores/global";
|
||||
|
||||
export default function Affiliate() {
|
||||
const { t } = useTranslation("affiliate");
|
||||
const { user, common } = useGlobalStore();
|
||||
const { user, common, getUserInfo } = useGlobalStore();
|
||||
const queryClient = useQueryClient();
|
||||
const [withdrawOpen, setWithdrawOpen] = useState(false);
|
||||
const [amountInput, setAmountInput] = useState("");
|
||||
const [contentInput, setContentInput] = useState("");
|
||||
const [amountError, setAmountError] = useState("");
|
||||
const [contentError, setContentError] = useState("");
|
||||
const { data } = useQuery({
|
||||
queryKey: ["queryUserAffiliate"],
|
||||
queryFn: async () => {
|
||||
@@ -32,27 +52,226 @@ export default function Affiliate() {
|
||||
return response.data.data;
|
||||
},
|
||||
});
|
||||
const withdrawMutation = useMutation({
|
||||
mutationFn: async (values: { amount: number; content: string }) =>
|
||||
commissionWithdraw({
|
||||
amount: Math.round(values.amount * 100),
|
||||
content: values.content.trim(),
|
||||
}),
|
||||
onSuccess: async () => {
|
||||
toast.success(t("withdrawSuccess", "提现申请已提交"));
|
||||
setAmountInput("");
|
||||
setContentInput("");
|
||||
setAmountError("");
|
||||
setContentError("");
|
||||
setWithdrawOpen(false);
|
||||
await Promise.all([
|
||||
queryClient.invalidateQueries({ queryKey: ["queryUserAffiliate"] }),
|
||||
queryClient.invalidateQueries({ queryKey: ["queryUserInfo"] }),
|
||||
getUserInfo(),
|
||||
]);
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Withdraw request failed", error);
|
||||
toast.error(t("withdrawError", "提现申请提交失败"));
|
||||
},
|
||||
});
|
||||
|
||||
const statusMap: Record<number, { label: string; className: string }> = {
|
||||
0: {
|
||||
label: t("withdrawStatus.pending", "审核中"),
|
||||
className: "bg-amber-100 text-amber-700 border-amber-200",
|
||||
},
|
||||
1: {
|
||||
label: t("withdrawStatus.approved", "已通过"),
|
||||
className: "bg-emerald-100 text-emerald-700 border-emerald-200",
|
||||
},
|
||||
2: {
|
||||
label: t("withdrawStatus.rejected", "已拒绝"),
|
||||
className: "bg-rose-100 text-rose-700 border-rose-200",
|
||||
},
|
||||
};
|
||||
|
||||
const currentCommission = user?.commission ?? 0;
|
||||
const totalCommission = data?.total_commission ?? 0;
|
||||
|
||||
const submitWithdraw = async () => {
|
||||
const amount = Number(amountInput);
|
||||
const content = contentInput.trim();
|
||||
let hasError = false;
|
||||
|
||||
if (!Number.isFinite(amount) || amount <= 0) {
|
||||
setAmountError(t("amountPositive", "提现金额必须大于 0"));
|
||||
hasError = true;
|
||||
} else {
|
||||
setAmountError("");
|
||||
}
|
||||
|
||||
if (content.length < 2) {
|
||||
setContentError(t("accountRequired", "请填写收款信息"));
|
||||
hasError = true;
|
||||
} else if (content.length > 200) {
|
||||
setContentError(t("accountTooLong", "收款信息不能超过 200 个字符"));
|
||||
hasError = true;
|
||||
} else {
|
||||
setContentError("");
|
||||
}
|
||||
|
||||
if (hasError) return;
|
||||
|
||||
await withdrawMutation.mutateAsync({
|
||||
amount,
|
||||
content,
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardHeader className="flex flex-col gap-4 md:flex-row md:items-start md:justify-between">
|
||||
<div className="space-y-1">
|
||||
<CardTitle>{t("totalCommission", "Total Commission")}</CardTitle>
|
||||
<CardDescription>
|
||||
{t("commissionInfo", "Commission Info")}
|
||||
</CardDescription>
|
||||
</div>
|
||||
<Dialog onOpenChange={setWithdrawOpen} open={withdrawOpen}>
|
||||
<Button
|
||||
className="gap-2 self-start"
|
||||
onClick={() => setWithdrawOpen(true)}
|
||||
variant="default"
|
||||
>
|
||||
<Wallet className="h-4 w-4" />
|
||||
{t("applyWithdraw", "申请提现")}
|
||||
</Button>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>{t("applyWithdraw", "申请提现")}</DialogTitle>
|
||||
<DialogDescription>
|
||||
{t(
|
||||
"withdrawDescription",
|
||||
"填写提现金额和收款信息后提交申请，等待后台审核。"
|
||||
)}
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<div className="space-y-4">
|
||||
<div className="grid gap-3 rounded-lg border bg-muted/30 p-4 text-sm">
|
||||
<div className="flex items-center justify-between">
|
||||
<span className="text-muted-foreground">
|
||||
{t("currentCommission", "当前可见佣金")}
|
||||
</span>
|
||||
<span className="font-semibold">
|
||||
<Display type="currency" value={currentCommission} />
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center justify-between">
|
||||
<span className="text-muted-foreground">
|
||||
{t("totalCommission", "Total Commission")}
|
||||
</span>
|
||||
<span className="font-semibold">
|
||||
<Display type="currency" value={totalCommission} />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<label
|
||||
className="font-medium text-sm"
|
||||
htmlFor="withdraw-amount"
|
||||
>
|
||||
{t("withdrawAmount", "提现金额")}
|
||||
</label>
|
||||
<Input
|
||||
id="withdraw-amount"
|
||||
min="0"
|
||||
onChange={(event) => {
|
||||
setAmountInput(event.target.value);
|
||||
if (amountError) setAmountError("");
|
||||
}}
|
||||
placeholder={t(
|
||||
"withdrawAmountPlaceholder",
|
||||
"请输入提现金额，单位为元"
|
||||
)}
|
||||
step="0.01"
|
||||
type="number"
|
||||
value={amountInput}
|
||||
/>
|
||||
{amountError ? (
|
||||
<p className="text-destructive text-sm">{amountError}</p>
|
||||
) : null}
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<label
|
||||
className="font-medium text-sm"
|
||||
htmlFor="withdraw-content"
|
||||
>
|
||||
{t("accountInfo", "收款信息")}
|
||||
</label>
|
||||
<Textarea
|
||||
id="withdraw-content"
|
||||
onChange={(event) => {
|
||||
setContentInput(event.target.value);
|
||||
if (contentError) setContentError("");
|
||||
}}
|
||||
placeholder={t(
|
||||
"accountPlaceholder",
|
||||
"请输入银行卡、支付宝、USDT 地址等收款信息"
|
||||
)}
|
||||
rows={4}
|
||||
value={contentInput}
|
||||
/>
|
||||
{contentError ? (
|
||||
<p className="text-destructive text-sm">{contentError}</p>
|
||||
) : null}
|
||||
</div>
|
||||
<DialogFooter>
|
||||
<Button
|
||||
onClick={() => setWithdrawOpen(false)}
|
||||
type="button"
|
||||
variant="outline"
|
||||
>
|
||||
{t("cancel", "取消")}
|
||||
</Button>
|
||||
<Button
|
||||
disabled={withdrawMutation.isPending}
|
||||
onClick={submitWithdraw}
|
||||
type="button"
|
||||
>
|
||||
{withdrawMutation.isPending
|
||||
? t("submitting", "提交中...")
|
||||
: t("submitWithdraw", "提交申请")}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="flex items-baseline gap-2">
|
||||
<div className="grid gap-4 md:grid-cols-2">
|
||||
<div>
|
||||
<div className="text-muted-foreground text-sm">
|
||||
{t("totalCommission", "Total Commission")}
|
||||
</div>
|
||||
<div className="mt-1 flex items-baseline gap-2">
|
||||
<span className="font-bold text-3xl">
|
||||
<Display type="currency" value={data?.total_commission} />
|
||||
<Display type="currency" value={totalCommission} />
|
||||
</span>
|
||||
<span className="text-muted-foreground text-sm">
|
||||
({t("commissionRate", "Commission Rate")}:{" "}
|
||||
{user?.referral_percentage || common?.invite?.referral_percentage}
|
||||
{user?.referral_percentage ||
|
||||
common?.invite?.referral_percentage}
|
||||
%)
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-muted-foreground text-sm">
|
||||
{t("currentCommission", "当前可见佣金")}
|
||||
</div>
|
||||
<div className="mt-1 font-bold text-3xl">
|
||||
<Display type="currency" value={currentCommission} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
@@ -82,6 +301,72 @@ export default function Affiliate() {
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<ProList<API.WithdrawalLog, Record<string, unknown>>
|
||||
header={{
|
||||
title: t("withdrawRecords", "提现记录"),
|
||||
}}
|
||||
renderItem={(item) => {
|
||||
const status = statusMap[item.status] ?? {
|
||||
label: `${t("unknownStatus", "未知状态")} (${item.status})`,
|
||||
className: "",
|
||||
};
|
||||
return (
|
||||
<Card className="overflow-hidden">
|
||||
<CardContent className="space-y-3 p-4 text-sm">
|
||||
<div className="flex flex-col gap-3 md:flex-row md:items-start md:justify-between">
|
||||
<div className="space-y-1">
|
||||
<div className="text-muted-foreground">
|
||||
{t("withdrawAmount", "提现金额")}
|
||||
</div>
|
||||
<div className="font-semibold text-lg">
|
||||
<Display type="currency" value={item.amount} />
|
||||
</div>
|
||||
</div>
|
||||
<Badge className={status.className} variant="outline">
|
||||
{status.label}
|
||||
</Badge>
|
||||
</div>
|
||||
<ul className="grid gap-3 md:grid-cols-2">
|
||||
<li className="flex flex-col gap-1">
|
||||
<span className="text-muted-foreground">
|
||||
{t("accountInfo", "收款信息")}
|
||||
</span>
|
||||
<span className="break-all font-medium">
|
||||
{item.content || "--"}
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex flex-col gap-1">
|
||||
<span className="text-muted-foreground">
|
||||
{t("applyTime", "申请时间")}
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{formatDate(item.created_at)}
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex flex-col gap-1 md:col-span-2">
|
||||
<span className="text-muted-foreground">
|
||||
{t("rejectReason", "拒绝原因")}
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{item.reason || t("noReason", "无")}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}}
|
||||
request={async (pagination) => {
|
||||
const response = await queryWithdrawalLog({
|
||||
page: pagination.page,
|
||||
size: pagination.size,
|
||||
});
|
||||
return {
|
||||
list: response.data.data?.list || [],
|
||||
total: response.data.data?.total || 0,
|
||||
};
|
||||
}}
|
||||
/>
|
||||
<ProList<API.UserAffiliate, Record<string, unknown>>
|
||||
header={{
|
||||
title: t("inviteRecords", "Invite Records"),
|
||||
|
||||
@@ -49,7 +49,9 @@
|
||||
"motion": "^12.23.24",
|
||||
"qrcode.react": "^4.2.0",
|
||||
"radash": "^12.1.1",
|
||||
"react": "^19.2.0",
|
||||
"react-copy-to-clipboard": "^5.1.0",
|
||||
"react-dom": "^19.2.0",
|
||||
"react-helmet-async": "^2.0.5",
|
||||
"react-turnstile": "^1.1.4",
|
||||
"zustand": "^5.0.8",
|
||||
@@ -85,7 +87,9 @@
|
||||
"framer-motion": "^12.23.24",
|
||||
"js-yaml": "^4.1.1",
|
||||
"qrcode.react": "^4.2.0",
|
||||
"react": "^19.2.0",
|
||||
"react-copy-to-clipboard": "^5.1.0",
|
||||
"react-dom": "^19.2.0",
|
||||
"react-helmet-async": "^2.0.5",
|
||||
"react-turnstile": "^1.1.4",
|
||||
"zustand": "^5.0.8",
|
||||
|
||||
+32
@@ -106,6 +106,10 @@ declare namespace API {
|
||||
port: number;
|
||||
};
|
||||
|
||||
type ApproveWithdrawalRequest = {
|
||||
withdrawal_id: number;
|
||||
};
|
||||
|
||||
type AuthConfig = {
|
||||
mobile: MobileAuthenticateConfig;
|
||||
email: EmailAuthticateConfig;
|
||||
@@ -1154,6 +1158,18 @@ declare namespace API {
|
||||
list: User[];
|
||||
};
|
||||
|
||||
type GetWithdrawalListParams = {
|
||||
page: number;
|
||||
size: number;
|
||||
user_id?: number;
|
||||
status?: number;
|
||||
};
|
||||
|
||||
type GetWithdrawalListResponse = {
|
||||
total: number;
|
||||
list: WithdrawalLog[];
|
||||
};
|
||||
|
||||
type GetUserLoginLogsParams = {
|
||||
page: number;
|
||||
size: number;
|
||||
@@ -1756,6 +1772,11 @@ declare namespace API {
|
||||
total: number;
|
||||
};
|
||||
|
||||
type RejectWithdrawalRequest = {
|
||||
withdrawal_id: number;
|
||||
reason: string;
|
||||
};
|
||||
|
||||
type QuotaTask = {
|
||||
id: number;
|
||||
subscribers: number[];
|
||||
@@ -3064,4 +3085,15 @@ declare namespace API {
|
||||
}>;
|
||||
}>;
|
||||
};
|
||||
|
||||
type WithdrawalLog = {
|
||||
id: number;
|
||||
user_id: number;
|
||||
amount: number;
|
||||
content: string;
|
||||
status: number;
|
||||
reason?: string;
|
||||
created_at: number;
|
||||
updated_at: number;
|
||||
};
|
||||
}
|
||||
|
||||
@@ -0,0 +1,55 @@
|
||||
/* eslint-disable */
|
||||
import request from "@workspace/ui/lib/request";
|
||||
|
||||
/** Get withdrawal list GET /v1/admin/user/withdrawal/list */
|
||||
export async function getWithdrawalList(
|
||||
params: API.GetWithdrawalListParams,
|
||||
options?: { [key: string]: any }
|
||||
) {
|
||||
return request<API.Response & { data?: API.GetWithdrawalListResponse }>(
|
||||
`${import.meta.env.VITE_API_PREFIX || ""}/v1/admin/user/withdrawal/list`,
|
||||
{
|
||||
method: "GET",
|
||||
params: {
|
||||
...params,
|
||||
},
|
||||
...(options || {}),
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
/** Approve withdrawal POST /v1/admin/user/withdrawal/approve */
|
||||
export async function approveWithdrawal(
|
||||
body: API.ApproveWithdrawalRequest,
|
||||
options?: { [key: string]: any }
|
||||
) {
|
||||
return request<API.Response & { data?: any }>(
|
||||
`${import.meta.env.VITE_API_PREFIX || ""}/v1/admin/user/withdrawal/approve`,
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
data: body,
|
||||
...(options || {}),
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
/** Reject withdrawal POST /v1/admin/user/withdrawal/reject */
|
||||
export async function rejectWithdrawal(
|
||||
body: API.RejectWithdrawalRequest,
|
||||
options?: { [key: string]: any }
|
||||
) {
|
||||
return request<API.Response & { data?: any }>(
|
||||
`${import.meta.env.VITE_API_PREFIX || ""}/v1/admin/user/withdrawal/reject`,
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
data: body,
|
||||
...(options || {}),
|
||||
}
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user