Compare commits

...

7 Commits

Author SHA1 Message Date
shanshanzhong147 9172107ea9 修复(#120): 补齐用户订阅限速配置前端实现 2026-05-28 22:00:53 -07:00
shanshanzhong147 100b641552 修复(#97): 区分邀请管理加载失败状态
PR Check / Lint, Check, Test and Build (push) Has been cancelled
Build and Release / Build (push) Has been cancelled
2026-05-27 20:24:22 -07:00
shanshanzhong147 aeca20ad1e 新功能(#93): 新增管理后台邀请管理页面
PR Check / Lint, Check, Test and Build (push) Has been cancelled
Build and Release / Build (push) Has been cancelled
新增 /dashboard/invite-management 页面,调用 GET /v1/admin/invite/list 接口展示全局邀请关系列表。
包含邀请人/被邀请人信息、状态、佣金、赠送天数等列,支持关键词和 ID 筛选、分页。
附带修复提现页收款码图片缺少 width/height 的 lint 问题。
2026-05-27 11:11:15 -07:00
shanshanzhong147 d1697bed75 新功能(#43): 提现前端优化 — 收款方式选择 + 收款码上传 + 取消按钮
PR Check / Lint, Check, Test and Build (push) Has been cancelled
Build and Release / Build (push) Has been cancelled
Issue Close Require / issue-close-require (push) Has been cancelled
2026-05-26 08:37:03 -07:00
shanshanzhong147 14d4c5f36f 配置(#54): 前端 PR 质量门禁与 auto-merge 安全加固
PR Check / Lint, Check, Test and Build (push) Has been cancelled
Build and Release / Build (push) Has been cancelled
2026-05-25 22:08:48 -07:00
shanshanzhong147 37ceb5adfc 修复(#55): 修复前端 lint/build 失败阻塞质量门禁
Build and Release / Build (push) Has been cancelled
2026-05-25 22:03:36 -07:00
shanshanzhong147 71aaa08230 fix(#HIF-37): 修复备注表单提交时未携带完整用户数据
Build and Release / Build (push) Has been cancelled
备注保存前获取完整用户详情构造请求体,TC03 清空备注场景不再丢失其他字段。
拆出 RemarkForm 组件,增加保存中禁用态和失败错误提示。
2026-05-25 21:36:44 -07:00
39 changed files with 1866 additions and 320 deletions
+20 -21
View File
@@ -1,30 +1,29 @@
name: Dependabot Auto Merge
on:
pull_request_target:
types: [labeled, edited]
types: [opened, reopened, synchronize, ready_for_review, labeled]
permissions:
contents: write
pull-requests: write
concurrency:
group: dependabot-auto-merge-${{ github.event.pull_request.number }}
cancel-in-progress: true
jobs:
merge:
if: contains(github.event.pull_request.labels.*.name, 'dependencies')
if: >
github.actor == 'dependabot[bot]' &&
github.event.pull_request.user.login == 'dependabot[bot]' &&
contains(github.event.pull_request.labels.*.name, 'dependencies')
name: Dependabot Auto Merge
runs-on: ubuntu-latest
timeout-minutes: 5
steps:
- uses: actions/checkout@v4
- name: Install pnpm
uses: pnpm/action-setup@v4
- name: Setup Node.js environment
uses: actions/setup-node@v4
with:
node-version: '20'
- name: Install deps
run: pnpm install
- name: Merge
uses: ahmadnassri/action-dependabot-auto-merge@v2
with:
command: merge
target: minor
github-token: ${{ secrets.GH_TOKEN }}
- name: Enable auto-merge
env:
GH_TOKEN: ${{ github.token }}
PR_URL: ${{ github.event.pull_request.html_url }}
run: gh pr merge "$PR_URL" --auto --merge
+48
View File
@@ -0,0 +1,48 @@
name: PR Check
on:
push:
branches:
- main
- internal
pull_request:
branches:
- main
- internal
permissions:
contents: read
concurrency:
group: pr-check-${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
cancel-in-progress: true
jobs:
validate:
name: Lint, Check, Test and Build
runs-on: ubuntu-latest
timeout-minutes: 20
steps:
- name: Checkout
uses: actions/checkout@v4
- name: Setup Bun
uses: oven-sh/setup-bun@v2
with:
bun-version: '1.3.1'
- name: Install dependencies
run: bun install --frozen-lockfile
- name: Lint
run: bun run lint
- name: Check
run: bun run check
- name: Test
run: bun run test
- name: Build
run: bun run build
+9 -4
View File
@@ -9,20 +9,25 @@ on:
permissions:
contents: write
concurrency:
group: release-${{ github.ref }}
cancel-in-progress: false
jobs:
release:
name: Build
runs-on: ubuntu-latest
timeout-minutes: 30
steps:
- uses: actions/checkout@v4
- name: Setup Bun
uses: oven-sh/setup-bun@v1
uses: oven-sh/setup-bun@v2
with:
bun-version: 'latest'
bun-version: '1.3.1'
- name: Cache Bun dependencies
uses: actions/cache@v3
uses: actions/cache@v4
with:
path: |
~/.bun
@@ -32,7 +37,7 @@ jobs:
${{ runner.os }}-bun-cache-
- name: Install deps
run: bun install
run: bun install --frozen-lockfile
- name: Build
run: bun run build
@@ -0,0 +1,23 @@
{
"commission": "Commission",
"days": "{{count}} days",
"disabled": "Disabled",
"empty": "No invite records",
"enabled": "Enabled",
"hasPurchased": "Purchased",
"invitee": "Invitee",
"inviteeGiftDays": "Invitee Gift Days",
"inviteeId": "Invitee ID",
"invitedAt": "Invited At",
"inviter": "Inviter",
"inviterGiftDays": "Inviter Gift Days",
"inviterId": "Inviter ID",
"loadErrorDescription": "Refresh the table or try again later.",
"loadErrorTitle": "Failed to load invites",
"no": "No",
"orderCount": "Orders",
"searchPlaceholder": "Email or phone",
"status": "Status",
"title": "Invite Management",
"yes": "Yes"
}
@@ -11,6 +11,7 @@
"Email": "Email",
"Gift": "Gift",
"Group Management": "Group Management",
"Invite Management": "Invite Management",
"Login": "Login",
"Logs & Analytics": "Logs & Analytics",
"Maintenance": "Maintenance",
@@ -0,0 +1,23 @@
{
"commission": "佣金",
"days": "{{count}} 天",
"disabled": "禁用",
"empty": "暂无邀请记录",
"enabled": "启用",
"hasPurchased": "已购买",
"invitee": "被邀请人",
"inviteeGiftDays": "被邀请人赠送天数",
"inviteeId": "被邀请人 ID",
"invitedAt": "邀请时间",
"inviter": "邀请人",
"inviterGiftDays": "邀请人赠送天数",
"inviterId": "邀请人 ID",
"loadErrorDescription": "刷新表格或稍后重试。",
"loadErrorTitle": "邀请记录加载失败",
"no": "否",
"orderCount": "订单数",
"searchPlaceholder": "邮箱/手机号关键词",
"status": "状态",
"title": "邀请管理",
"yes": "是"
}
@@ -11,6 +11,7 @@
"Email": "邮件",
"Gift": "赠送",
"Group Management": "分组管理",
"Invite Management": "邀请管理",
"Login": "登录",
"Logs & Analytics": "日志与分析",
"Maintenance": "维护",
+5
View File
@@ -98,6 +98,11 @@ export function useNavs() {
url: "/dashboard/withdrawal",
icon: "flat-color-icons:money-transfer",
},
{
title: t("Invite Management", "Invite Management"),
url: "/dashboard/invite-management",
icon: "flat-color-icons:add-user",
},
{
title: t("Device Group", "Device Group"),
url: "/dashboard/family",
+1
View File
@@ -35,6 +35,7 @@ initializeI18n({
"coupon",
"dashboard",
"document",
"invite",
"log",
"marketing",
"menu",
+55 -16
View File
@@ -45,6 +45,9 @@ const DashboardOrderIndexLazyRouteImport =
const DashboardMarketingIndexLazyRouteImport = createFileRoute(
'/dashboard/marketing/',
)()
const DashboardInviteManagementIndexLazyRouteImport = createFileRoute(
'/dashboard/invite-management/',
)()
const DashboardGroupIndexLazyRouteImport =
createFileRoute('/dashboard/group/')()
const DashboardFamilyIndexLazyRouteImport =
@@ -138,9 +141,9 @@ const DashboardNodesLazyRoute = DashboardNodesLazyRouteImport.update({
)
const DashboardWithdrawalIndexLazyRoute =
DashboardWithdrawalIndexLazyRouteImport.update({
id: '/withdrawal/',
path: '/withdrawal/',
getParentRoute: () => DashboardRouteLazyRoute,
id: '/',
path: '/',
getParentRoute: () => DashboardWithdrawalLazyRoute,
} as any).lazy(() =>
import('./routes/dashboard/withdrawal/index.lazy').then((d) => d.Route),
)
@@ -214,6 +217,16 @@ const DashboardMarketingIndexLazyRoute =
} as any).lazy(() =>
import('./routes/dashboard/marketing/index.lazy').then((d) => d.Route),
)
const DashboardInviteManagementIndexLazyRoute =
DashboardInviteManagementIndexLazyRouteImport.update({
id: '/invite-management/',
path: '/invite-management/',
getParentRoute: () => DashboardRouteLazyRoute,
} as any).lazy(() =>
import('./routes/dashboard/invite-management/index.lazy').then(
(d) => d.Route,
),
)
const DashboardGroupIndexLazyRoute = DashboardGroupIndexLazyRouteImport.update({
id: '/group/',
path: '/group/',
@@ -367,7 +380,7 @@ export interface FileRoutesByFullPath {
'/dashboard': typeof DashboardRouteLazyRouteWithChildren
'/dashboard/nodes': typeof DashboardNodesLazyRoute
'/dashboard/servers': typeof DashboardServersLazyRoute
'/dashboard/withdrawal': typeof DashboardWithdrawalLazyRoute
'/dashboard/withdrawal': typeof DashboardWithdrawalLazyRouteWithChildren
'/dashboard/': typeof DashboardIndexLazyRoute
'/dashboard/log/balance': typeof DashboardLogBalanceLazyRoute
'/dashboard/log/commission': typeof DashboardLogCommissionLazyRoute
@@ -388,6 +401,7 @@ export interface FileRoutesByFullPath {
'/dashboard/document': typeof DashboardDocumentIndexLazyRoute
'/dashboard/family': typeof DashboardFamilyIndexLazyRoute
'/dashboard/group': typeof DashboardGroupIndexLazyRoute
'/dashboard/invite-management': typeof DashboardInviteManagementIndexLazyRoute
'/dashboard/marketing': typeof DashboardMarketingIndexLazyRoute
'/dashboard/order': typeof DashboardOrderIndexLazyRoute
'/dashboard/payment': typeof DashboardPaymentIndexLazyRoute
@@ -397,13 +411,12 @@ export interface FileRoutesByFullPath {
'/dashboard/system': typeof DashboardSystemIndexLazyRoute
'/dashboard/ticket': typeof DashboardTicketIndexLazyRoute
'/dashboard/user': typeof DashboardUserIndexLazyRoute
'/dashboard/withdrawal': typeof DashboardWithdrawalIndexLazyRoute
'/dashboard/withdrawal/': typeof DashboardWithdrawalIndexLazyRoute
}
export interface FileRoutesByTo {
'/': typeof IndexLazyRoute
'/dashboard/nodes': typeof DashboardNodesLazyRoute
'/dashboard/servers': typeof DashboardServersLazyRoute
'/dashboard/withdrawal': typeof DashboardWithdrawalLazyRoute
'/dashboard': typeof DashboardIndexLazyRoute
'/dashboard/log/balance': typeof DashboardLogBalanceLazyRoute
'/dashboard/log/commission': typeof DashboardLogCommissionLazyRoute
@@ -424,6 +437,7 @@ export interface FileRoutesByTo {
'/dashboard/document': typeof DashboardDocumentIndexLazyRoute
'/dashboard/family': typeof DashboardFamilyIndexLazyRoute
'/dashboard/group': typeof DashboardGroupIndexLazyRoute
'/dashboard/invite-management': typeof DashboardInviteManagementIndexLazyRoute
'/dashboard/marketing': typeof DashboardMarketingIndexLazyRoute
'/dashboard/order': typeof DashboardOrderIndexLazyRoute
'/dashboard/payment': typeof DashboardPaymentIndexLazyRoute
@@ -441,7 +455,7 @@ export interface FileRoutesById {
'/dashboard': typeof DashboardRouteLazyRouteWithChildren
'/dashboard/nodes': typeof DashboardNodesLazyRoute
'/dashboard/servers': typeof DashboardServersLazyRoute
'/dashboard/withdrawal': typeof DashboardWithdrawalLazyRoute
'/dashboard/withdrawal': typeof DashboardWithdrawalLazyRouteWithChildren
'/dashboard/': typeof DashboardIndexLazyRoute
'/dashboard/log/balance': typeof DashboardLogBalanceLazyRoute
'/dashboard/log/commission': typeof DashboardLogCommissionLazyRoute
@@ -462,6 +476,7 @@ export interface FileRoutesById {
'/dashboard/document/': typeof DashboardDocumentIndexLazyRoute
'/dashboard/family/': typeof DashboardFamilyIndexLazyRoute
'/dashboard/group/': typeof DashboardGroupIndexLazyRoute
'/dashboard/invite-management/': typeof DashboardInviteManagementIndexLazyRoute
'/dashboard/marketing/': typeof DashboardMarketingIndexLazyRoute
'/dashboard/order/': typeof DashboardOrderIndexLazyRoute
'/dashboard/payment/': typeof DashboardPaymentIndexLazyRoute
@@ -501,6 +516,7 @@ export interface FileRouteTypes {
| '/dashboard/document'
| '/dashboard/family'
| '/dashboard/group'
| '/dashboard/invite-management'
| '/dashboard/marketing'
| '/dashboard/order'
| '/dashboard/payment'
@@ -510,13 +526,12 @@ export interface FileRouteTypes {
| '/dashboard/system'
| '/dashboard/ticket'
| '/dashboard/user'
| '/dashboard/withdrawal'
| '/dashboard/withdrawal/'
fileRoutesByTo: FileRoutesByTo
to:
| '/'
| '/dashboard/nodes'
| '/dashboard/servers'
| '/dashboard/withdrawal'
| '/dashboard'
| '/dashboard/log/balance'
| '/dashboard/log/commission'
@@ -537,6 +552,7 @@ export interface FileRouteTypes {
| '/dashboard/document'
| '/dashboard/family'
| '/dashboard/group'
| '/dashboard/invite-management'
| '/dashboard/marketing'
| '/dashboard/order'
| '/dashboard/payment'
@@ -574,6 +590,7 @@ export interface FileRouteTypes {
| '/dashboard/document/'
| '/dashboard/family/'
| '/dashboard/group/'
| '/dashboard/invite-management/'
| '/dashboard/marketing/'
| '/dashboard/order/'
| '/dashboard/payment/'
@@ -637,10 +654,10 @@ declare module '@tanstack/react-router' {
}
'/dashboard/withdrawal/': {
id: '/dashboard/withdrawal/'
path: '/withdrawal'
fullPath: '/dashboard/withdrawal'
path: '/'
fullPath: '/dashboard/withdrawal/'
preLoaderRoute: typeof DashboardWithdrawalIndexLazyRouteImport
parentRoute: typeof DashboardRouteLazyRoute
parentRoute: typeof DashboardWithdrawalLazyRoute
}
'/dashboard/user/': {
id: '/dashboard/user/'
@@ -705,6 +722,13 @@ declare module '@tanstack/react-router' {
preLoaderRoute: typeof DashboardMarketingIndexLazyRouteImport
parentRoute: typeof DashboardRouteLazyRoute
}
'/dashboard/invite-management/': {
id: '/dashboard/invite-management/'
path: '/invite-management'
fullPath: '/dashboard/invite-management'
preLoaderRoute: typeof DashboardInviteManagementIndexLazyRouteImport
parentRoute: typeof DashboardRouteLazyRoute
}
'/dashboard/group/': {
id: '/dashboard/group/'
path: '/group'
@@ -841,10 +865,24 @@ declare module '@tanstack/react-router' {
}
}
interface DashboardWithdrawalLazyRouteChildren {
DashboardWithdrawalIndexLazyRoute: typeof DashboardWithdrawalIndexLazyRoute
}
const DashboardWithdrawalLazyRouteChildren: DashboardWithdrawalLazyRouteChildren =
{
DashboardWithdrawalIndexLazyRoute: DashboardWithdrawalIndexLazyRoute,
}
const DashboardWithdrawalLazyRouteWithChildren =
DashboardWithdrawalLazyRoute._addFileChildren(
DashboardWithdrawalLazyRouteChildren,
)
interface DashboardRouteLazyRouteChildren {
DashboardNodesLazyRoute: typeof DashboardNodesLazyRoute
DashboardServersLazyRoute: typeof DashboardServersLazyRoute
DashboardWithdrawalLazyRoute: typeof DashboardWithdrawalLazyRoute
DashboardWithdrawalLazyRoute: typeof DashboardWithdrawalLazyRouteWithChildren
DashboardIndexLazyRoute: typeof DashboardIndexLazyRoute
DashboardLogBalanceLazyRoute: typeof DashboardLogBalanceLazyRoute
DashboardLogCommissionLazyRoute: typeof DashboardLogCommissionLazyRoute
@@ -865,6 +903,7 @@ interface DashboardRouteLazyRouteChildren {
DashboardDocumentIndexLazyRoute: typeof DashboardDocumentIndexLazyRoute
DashboardFamilyIndexLazyRoute: typeof DashboardFamilyIndexLazyRoute
DashboardGroupIndexLazyRoute: typeof DashboardGroupIndexLazyRoute
DashboardInviteManagementIndexLazyRoute: typeof DashboardInviteManagementIndexLazyRoute
DashboardMarketingIndexLazyRoute: typeof DashboardMarketingIndexLazyRoute
DashboardOrderIndexLazyRoute: typeof DashboardOrderIndexLazyRoute
DashboardPaymentIndexLazyRoute: typeof DashboardPaymentIndexLazyRoute
@@ -874,13 +913,12 @@ interface DashboardRouteLazyRouteChildren {
DashboardSystemIndexLazyRoute: typeof DashboardSystemIndexLazyRoute
DashboardTicketIndexLazyRoute: typeof DashboardTicketIndexLazyRoute
DashboardUserIndexLazyRoute: typeof DashboardUserIndexLazyRoute
DashboardWithdrawalIndexLazyRoute: typeof DashboardWithdrawalIndexLazyRoute
}
const DashboardRouteLazyRouteChildren: DashboardRouteLazyRouteChildren = {
DashboardNodesLazyRoute: DashboardNodesLazyRoute,
DashboardServersLazyRoute: DashboardServersLazyRoute,
DashboardWithdrawalLazyRoute: DashboardWithdrawalLazyRoute,
DashboardWithdrawalLazyRoute: DashboardWithdrawalLazyRouteWithChildren,
DashboardIndexLazyRoute: DashboardIndexLazyRoute,
DashboardLogBalanceLazyRoute: DashboardLogBalanceLazyRoute,
DashboardLogCommissionLazyRoute: DashboardLogCommissionLazyRoute,
@@ -901,6 +939,8 @@ const DashboardRouteLazyRouteChildren: DashboardRouteLazyRouteChildren = {
DashboardDocumentIndexLazyRoute: DashboardDocumentIndexLazyRoute,
DashboardFamilyIndexLazyRoute: DashboardFamilyIndexLazyRoute,
DashboardGroupIndexLazyRoute: DashboardGroupIndexLazyRoute,
DashboardInviteManagementIndexLazyRoute:
DashboardInviteManagementIndexLazyRoute,
DashboardMarketingIndexLazyRoute: DashboardMarketingIndexLazyRoute,
DashboardOrderIndexLazyRoute: DashboardOrderIndexLazyRoute,
DashboardPaymentIndexLazyRoute: DashboardPaymentIndexLazyRoute,
@@ -910,7 +950,6 @@ const DashboardRouteLazyRouteChildren: DashboardRouteLazyRouteChildren = {
DashboardSystemIndexLazyRoute: DashboardSystemIndexLazyRoute,
DashboardTicketIndexLazyRoute: DashboardTicketIndexLazyRoute,
DashboardUserIndexLazyRoute: DashboardUserIndexLazyRoute,
DashboardWithdrawalIndexLazyRoute: DashboardWithdrawalIndexLazyRoute,
}
const DashboardRouteLazyRouteWithChildren =
@@ -0,0 +1,6 @@
import { createLazyFileRoute } from "@tanstack/react-router";
import InviteManagement from "@/sections/invite";
export const Route = createLazyFileRoute("/dashboard/invite-management/")({
component: InviteManagement,
});
@@ -0,0 +1,159 @@
/**
* @vitest-environment jsdom
*/
import { cleanup, render, screen, waitFor } from "@testing-library/react";
import { getAdminInviteList } from "@workspace/ui/services/admin/invite";
import type { AxiosResponse } from "axios";
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
import InviteManagement from ".";
vi.mock("react-i18next", () => ({
useTranslation: () => ({
t: (
_key: string,
fallback: string,
options?: { count?: number }
): string => {
if (typeof options?.count === "number") {
return `${options.count} days`;
}
return fallback;
},
}),
}));
vi.mock("@/stores/global", () => ({
useGlobalStore: () => ({
common: {
currency: {
currency_symbol: "$",
},
},
}),
}));
vi.mock("@/utils/common", () => ({
formatDate: (timestamp: number) => `date-${timestamp}`,
}));
vi.mock("@workspace/ui/services/admin/invite", () => ({
getAdminInviteList: vi.fn(),
}));
const mockedGetAdminInviteList = vi.mocked(getAdminInviteList);
function createInviteListResponse(
data: API.GetAdminInviteListResponse
): AxiosResponse<API.Response & { data?: API.GetAdminInviteListResponse }> {
return {
data: {
code: 200,
data,
},
status: 200,
statusText: "OK",
headers: {},
config: {
headers: {} as AxiosResponse["config"]["headers"],
},
};
}
afterEach(() => {
cleanup();
vi.clearAllMocks();
});
beforeEach(() => {
localStorage.setItem("timezone", "UTC");
});
describe("InviteManagement", () => {
it("renders invite rows with status, purchase state, commission, and gift days", async () => {
mockedGetAdminInviteList.mockResolvedValue(
createInviteListResponse({
total: 1,
list: [
{
inviter_id: 10,
inviter_identifier: "agent@example.com",
invitee_id: 123,
invitee_identifier: "user@example.com",
invitee_avatar: "",
invitee_enable: true,
invited_at: 1_716_800_000,
order_count: 3,
has_purchased: true,
inviter_commission: 1500,
inviter_gift_days: 30,
invitee_gift_days: 7,
},
],
})
);
render(<InviteManagement />);
await waitFor(() =>
expect(mockedGetAdminInviteList).toHaveBeenCalledWith({
page: 1,
size: 200,
search: undefined,
inviter_id: undefined,
invitee_id: undefined,
})
);
expect(await screen.findByText("agent@example.com")).not.toBeNull();
expect(screen.getByText("user@example.com")).not.toBeNull();
expect(screen.getByText("Enabled")).not.toBeNull();
expect(screen.getByText("Yes")).not.toBeNull();
expect(screen.getByText("$15.00")).not.toBeNull();
expect(screen.getByText("30 days")).not.toBeNull();
expect(screen.getByText("7 days")).not.toBeNull();
expect(screen.getByText("date-1716800000")).not.toBeNull();
});
it("shows the empty state when the API returns no rows", async () => {
mockedGetAdminInviteList.mockResolvedValue(
createInviteListResponse({
total: 0,
list: [],
})
);
render(<InviteManagement />);
expect(await screen.findByText("No invite records")).not.toBeNull();
});
it("shows a loading state while invites are being fetched", () => {
let resolveRequest:
| ((
value: AxiosResponse<
API.Response & { data?: API.GetAdminInviteListResponse }
>
) => void)
| undefined;
mockedGetAdminInviteList.mockReturnValue(
new Promise((resolve) => {
resolveRequest = resolve;
})
);
render(<InviteManagement />);
expect(screen.getByRole("status", { name: "Loading data" })).not.toBeNull();
expect(resolveRequest).toBeTypeOf("function");
});
it("shows an error state when the request fails", async () => {
mockedGetAdminInviteList.mockRejectedValue(new Error("network failed"));
render(<InviteManagement />);
await waitFor(() => expect(mockedGetAdminInviteList).toHaveBeenCalled());
expect(await screen.findByText("Failed to load invites")).not.toBeNull();
expect(screen.queryByText("No invite records")).toBeNull();
});
});
+213
View File
@@ -0,0 +1,213 @@
"use client";
import {
Alert,
AlertDescription,
AlertTitle,
} from "@workspace/ui/components/alert";
import {
Avatar,
AvatarFallback,
AvatarImage,
} from "@workspace/ui/components/avatar";
import { Badge } from "@workspace/ui/components/badge";
import Empty from "@workspace/ui/composed/empty";
import {
ProTable,
type ProTableActions,
} from "@workspace/ui/composed/pro-table/pro-table";
import { getAdminInviteList } from "@workspace/ui/services/admin/invite";
import { CircleAlert } from "lucide-react";
import { useRef } from "react";
import { useTranslation } from "react-i18next";
import { Display } from "@/components/display";
import { formatDate } from "@/utils/common";
type InviteFilters = {
search?: string;
inviter_id?: string;
invitee_id?: string;
};
function toOptionalNumber(value?: string) {
if (!value) return;
const parsed = Number(value);
return Number.isFinite(parsed) ? parsed : undefined;
}
function InviteUserCell({
id,
identifier,
avatar,
}: {
id: number;
identifier: string;
avatar?: string;
}) {
const fallback = identifier?.charAt(0)?.toUpperCase() || "U";
return (
<div className="flex min-w-48 items-center gap-2">
<Avatar className="h-8 w-8">
<AvatarImage alt={identifier || `#${id}`} src={avatar} />
<AvatarFallback className="text-xs">{fallback}</AvatarFallback>
</Avatar>
<div className="min-w-0">
<div className="font-medium text-sm">#{id}</div>
<div className="max-w-52 truncate text-muted-foreground text-xs">
{identifier || "--"}
</div>
</div>
</div>
);
}
function InviteIdentifierCell({
id,
identifier,
}: {
id: number;
identifier: string;
}) {
return (
<div className="min-w-44">
<div className="font-medium text-sm">#{id}</div>
<div className="max-w-52 truncate text-muted-foreground text-xs">
{identifier || "--"}
</div>
</div>
);
}
export default function InviteManagement() {
const { t } = useTranslation("invite");
const ref = useRef<ProTableActions>(null);
return (
<ProTable<API.AdminInviteRelation, InviteFilters>
action={ref}
columns={[
{
accessorKey: "inviter_id",
header: t("inviter", "Inviter"),
cell: ({ row }) => (
<InviteIdentifierCell
id={row.original.inviter_id}
identifier={row.original.inviter_identifier}
/>
),
},
{
accessorKey: "invitee_id",
header: t("invitee", "Invitee"),
cell: ({ row }) => (
<InviteUserCell
avatar={row.original.invitee_avatar}
id={row.original.invitee_id}
identifier={row.original.invitee_identifier}
/>
),
},
{
accessorKey: "invitee_enable",
header: t("status", "Status"),
cell: ({ row }) => (
<Badge
variant={row.original.invitee_enable ? "default" : "secondary"}
>
{row.original.invitee_enable
? t("enabled", "Enabled")
: t("disabled", "Disabled")}
</Badge>
),
},
{
accessorKey: "invited_at",
header: t("invitedAt", "Invited At"),
cell: ({ row }) => formatDate(row.original.invited_at),
},
{
accessorKey: "order_count",
header: t("orderCount", "Orders"),
},
{
accessorKey: "has_purchased",
header: t("hasPurchased", "Purchased"),
cell: ({ row }) => (
<Badge variant={row.original.has_purchased ? "default" : "outline"}>
{row.original.has_purchased ? t("yes", "Yes") : t("no", "No")}
</Badge>
),
},
{
accessorKey: "inviter_commission",
header: t("commission", "Commission"),
cell: ({ row }) => (
<Display type="currency" value={row.original.inviter_commission} />
),
},
{
accessorKey: "inviter_gift_days",
header: t("inviterGiftDays", "Inviter Gift Days"),
cell: ({ row }) =>
t("days", "{{count}} days", {
count: row.original.inviter_gift_days,
}),
},
{
accessorKey: "invitee_gift_days",
header: t("inviteeGiftDays", "Invitee Gift Days"),
cell: ({ row }) =>
t("days", "{{count}} days", {
count: row.original.invitee_gift_days,
}),
},
]}
empty={<Empty description={t("empty", "No invite records")} />}
error={
<Alert className="mx-auto max-w-md" variant="destructive">
<CircleAlert aria-hidden="true" />
<AlertTitle>
{t("loadErrorTitle", "Failed to load invites")}
</AlertTitle>
<AlertDescription>
{t("loadErrorDescription", "Refresh the table or try again later.")}
</AlertDescription>
</Alert>
}
header={{ title: t("title", "Invite Management") }}
params={[
{
key: "search",
placeholder: t("searchPlaceholder", "Email or phone"),
},
{
key: "inviter_id",
placeholder: t("inviterId", "Inviter ID"),
},
{
key: "invitee_id",
placeholder: t("inviteeId", "Invitee ID"),
},
]}
request={async (pagination, filters) => {
const { data } = await getAdminInviteList({
page: pagination.page,
size: pagination.size,
search: filters.search?.trim() || undefined,
inviter_id: toOptionalNumber(filters.inviter_id),
invitee_id: toOptionalNumber(filters.invitee_id),
});
return {
list:
data.data?.list.map((item) => ({
...item,
id: `${item.inviter_id}-${item.invitee_id}-${item.invited_at}`,
})) || [],
total: data.data?.total || 0,
};
}}
/>
);
}
+43 -79
View File
@@ -16,6 +16,11 @@ import {
DropdownMenuTrigger,
} from "@workspace/ui/components/dropdown-menu";
import { Input } from "@workspace/ui/components/input";
import {
Popover,
PopoverContent,
PopoverTrigger,
} from "@workspace/ui/components/popover";
import { ScrollArea } from "@workspace/ui/components/scroll-area";
import {
Select,
@@ -31,13 +36,6 @@ import {
SheetTitle,
SheetTrigger,
} from "@workspace/ui/components/sheet";
import { FilePenLine } from 'lucide-react';
import {
Popover,
PopoverClose,
PopoverContent,
PopoverTrigger,
} from '@workspace/ui/components/popover';
import { Switch } from "@workspace/ui/components/switch";
import {
Tabs,
@@ -63,13 +61,16 @@ import {
updateUserBasicInfo,
} from "@workspace/ui/services/admin/user";
import { parseDeviceType } from "@workspace/ui/utils/device";
import React, { useRef, useState, useCallback } from 'react';
import { FilePenLine } from "lucide-react";
import { useCallback, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { toast } from "sonner";
import { Display } from "@/components/display";
import { useSubscribe } from "@/stores/subscribe";
import { formatDate } from "@/utils/common";
import FamilyManagement from "./family";
import { RemarkForm } from "./remark-form";
import { buildUserBasicInfoPayload } from "./user-basic-info-payload";
import { UserDetail } from "./user-detail";
import UserForm from "./user-form";
import { UserInviteStatsSheet } from "./user-invite-stats-sheet";
@@ -77,44 +78,11 @@ import { AuthMethodsForm } from "./user-profile/auth-methods-form";
import { BasicInfoForm } from "./user-profile/basic-info-form";
import { NotifySettingsForm } from "./user-profile/notify-settings-form";
import UserSubscription from "./user-subscription";
// import EditUserGroupDialog from "./edit-user-group-dialog";
// 为 RemarkForm 组件定义 props 类型
interface RemarkFormProps {
initialRemark?: string | null;
onSave: (remark: string) => void;
CloseComponent: React.ComponentType<{ asChild?: boolean; children: React.ReactNode }>;
}
// 新的子组件,在管理它自己的备注状态
const RemarkForm: React.FC<RemarkFormProps> = ({ onSave, initialRemark, CloseComponent }) => {
const [remark, setRemark] = useState<string>(initialRemark ?? '');
const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setRemark(event.target.value);
};
const handleSaveClick = () => {
onSave(remark);
};
return (
<>
<div className='mb-2 text-sm font-semibold'></div>
<Input
type='text'
value={remark}
onChange={handleInputChange}
placeholder='在此输入备注...'
className='w-full'
/>
<CloseComponent asChild>
<Button onClick={handleSaveClick} variant='default' size={'sm'} className={'mt-2'}>
</Button>
</CloseComponent>
</>
);
type UserDeviceWithDeviceNo = API.UserDevice & {
device_no?: string;
};
export default function User() {
@@ -184,7 +152,7 @@ export default function User() {
userId={row.id}
/>,
<PreviewNodesDialog key="preview-nodes" userId={row.id} />,
/* <ConfirmButton
/* <ConfirmButton
cancelText={t("cancel", "Cancel")}
confirmText={t("confirm", "Confirm")}
description={t(
@@ -293,61 +261,57 @@ export default function User() {
{
id: "auth_methods",
accessorKey: "auth_methods",
header: '设备码/邮箱',
header: "设备码/邮箱",
cell: ({ row }) => {
const method = row.original.auth_methods?.[0];
const identifier = method?.auth_identifier || "";
const isDevice = method?.auth_type === "device";
const firstDevice = row.original.user_devices?.[0] as any;
const firstDevice = row.original.user_devices?.[0] as
| UserDeviceWithDeviceNo
| undefined;
const deviceNo = firstDevice?.device_no;
const deviceType = parseDeviceType(firstDevice?.user_agent || "");
const display = isDevice ? deviceNo || identifier : identifier;
return (
<div className="flex items-center">
{/* <Badge
{/* <Badge
className="mr-1 uppercase"
title={method?.verified ? t("verified", "Verified") : ""}
>
{method?.auth_type}
</Badge>*/}
{deviceType && (
<Badge className="mr-1" variant="secondary">
{deviceType}
</Badge>
<Badge className="mr-1" variant="secondary">
{deviceType}
</Badge>
)}
<span title={isDevice ? display : undefined}>{display}</span>
<Popover>
<PopoverTrigger>
<div className={'flex items-center'}>
{row.original?.remark ? `${row.original.remark}` : ''}
<FilePenLine size={14} className={'text-primary ml-2'} />
<div className={"flex items-center"}>
{row.original?.remark ? `${row.original.remark}` : ""}
<FilePenLine className={"ml-2 text-primary"} size={14} />
</div>
</PopoverTrigger>
<PopoverContent className={'w-64'}>
<PopoverContent className={"w-64"}>
<RemarkForm
initialRemark={row.original.remark}
CloseComponent={PopoverClose}
onSave={async (remark) => {
const {
auth_methods: _auth_methods,
user_devices: _user_devices,
enable_balance_notify: _enable_balance_notify,
enable_login_notify: _enable_login_notify,
enable_subscribe_notify: _enable_subscribe_notify,
enable_trade_notify: _enable_trade_notify,
updated_at: _updated_at,
created_at: _created_at,
id,
...rest
} = row.original;
await updateUserBasicInfo({
user_id: id,
...rest,
remark,
} as unknown as API.UpdateUserBasiceInfoRequest);
toast.success(t('updateSuccess'));
ref.current?.refresh();
}}
initialRemark={row.original.remark}
onSave={async (remark) => {
const { data } = await getUserDetail({
id: row.original.id,
});
const user = data.data;
if (!user) {
throw new Error("User detail not found");
}
await updateUserBasicInfo(
buildUserBasicInfoPayload(user, remark)
);
toast.success(t("updateSuccess"));
ref.current?.refresh();
}}
/>
</PopoverContent>
</Popover>
@@ -355,7 +319,7 @@ export default function User() {
);
},
},
/* {
/* {
id: "balance",
accessorKey: "balance",
header: t("balance", "Balance"),
@@ -0,0 +1,85 @@
/**
* @vitest-environment jsdom
*/
import {
cleanup,
fireEvent,
render,
screen,
waitFor,
} from "@testing-library/react";
import { Popover } from "@workspace/ui/components/popover";
import { afterEach, describe, expect, it, vi } from "vitest";
import { RemarkForm } from "./remark-form";
afterEach(() => {
cleanup();
});
function renderRemarkForm(props: Parameters<typeof RemarkForm>[0]) {
return render(
<Popover open>
<RemarkForm {...props} />
</Popover>
);
}
describe("RemarkForm", () => {
it("submits an intentionally cleared remark", async () => {
const onSave = vi.fn<Parameters<typeof RemarkForm>[0]["onSave"]>();
renderRemarkForm({ initialRemark: "old remark", onSave });
fireEvent.change(screen.getByPlaceholderText("在此输入备注..."), {
target: { value: "" },
});
fireEvent.click(screen.getByRole("button", { name: "保存" }));
await waitFor(() => expect(onSave).toHaveBeenCalledWith(""));
});
it("shows loading and keeps the input disabled while saving", async () => {
let resolveSave: (() => void) | undefined;
const onSave = vi.fn(
() =>
new Promise<void>((resolve) => {
resolveSave = resolve;
})
);
renderRemarkForm({ initialRemark: "old remark", onSave });
fireEvent.click(screen.getByRole("button", { name: "保存" }));
expect(
screen.getByRole("button", { name: "保存中..." }).hasAttribute("disabled")
).toBe(true);
expect(
screen.getByPlaceholderText("在此输入备注...").hasAttribute("disabled")
).toBe(true);
resolveSave?.();
await waitFor(() =>
expect(
screen.getByRole("button", { name: "保存" }).hasAttribute("disabled")
).toBe(false)
);
});
it("shows an error state and preserves input after save failure", async () => {
const onSave = vi.fn<Parameters<typeof RemarkForm>[0]["onSave"]>();
onSave.mockRejectedValue(new Error("failed"));
renderRemarkForm({ initialRemark: "old remark", onSave });
fireEvent.change(screen.getByPlaceholderText("在此输入备注..."), {
target: { value: "kept remark" },
});
fireEvent.click(screen.getByRole("button", { name: "保存" }));
expect((await screen.findByRole("alert")).textContent).toBe(
"备注保存失败,请重试"
);
expect(screen.getByDisplayValue("kept remark")).not.toBeNull();
});
});
@@ -0,0 +1,69 @@
import { Button } from "@workspace/ui/components/button";
import { Input } from "@workspace/ui/components/input";
import { PopoverClose } from "@workspace/ui/components/popover";
import { useRef, useState } from "react";
interface RemarkFormProps {
initialRemark?: string | null;
onSave: (remark: string) => Promise<void> | void;
}
export function RemarkForm({ onSave, initialRemark }: RemarkFormProps) {
const [remark, setRemark] = useState<string>(initialRemark ?? "");
const [saving, setSaving] = useState(false);
const [error, setError] = useState<string | null>(null);
const closeRef = useRef<HTMLButtonElement>(null);
const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setRemark(event.target.value);
};
const handleSave = async (event: React.FormEvent<HTMLFormElement>) => {
event.preventDefault();
setError(null);
setSaving(true);
try {
await onSave(remark);
closeRef.current?.click();
} catch {
setError("备注保存失败,请重试");
} finally {
setSaving(false);
}
};
return (
<form onSubmit={handleSave}>
<div className="mb-2 font-semibold text-sm"></div>
<Input
aria-invalid={Boolean(error)}
className="w-full"
disabled={saving}
onChange={handleInputChange}
placeholder="在此输入备注..."
type="text"
value={remark}
/>
{error ? (
<p className="mt-2 text-destructive text-sm" role="alert">
{error}
</p>
) : null}
<Button
className="mt-2"
disabled={saving}
size="sm"
type="submit"
variant="default"
>
{saving ? "保存中..." : "保存"}
</Button>
<PopoverClose asChild>
<button className="sr-only" ref={closeRef} type="button">
</button>
</PopoverClose>
</form>
);
}
@@ -0,0 +1,53 @@
import { describe, expect, it } from "vitest";
import { buildUserBasicInfoPayload } from "./user-basic-info-payload";
const user = {
id: 37,
avatar: "https://example.com/avatar.png",
balance: 1200,
commission: 300,
referral_percentage: 10,
only_first_purchase: true,
gift_amount: 500,
telegram: 123_456,
refer_code: "INVITE37",
referer_id: 7,
enable: true,
is_admin: false,
enable_balance_notify: true,
enable_login_notify: true,
enable_subscribe_notify: false,
enable_trade_notify: false,
user_group_id: 2,
group_locked: false,
auth_methods: [],
user_devices: [],
remark: "old remark",
rules: [],
created_at: 1_700_000_000,
updated_at: 1_700_000_100,
} satisfies API.User;
describe("buildUserBasicInfoPayload", () => {
it("keeps the full basic user fields when updating a remark", () => {
expect(buildUserBasicInfoPayload(user, "new remark")).toEqual({
user_id: 37,
avatar: "https://example.com/avatar.png",
balance: 1200,
commission: 300,
referral_percentage: 10,
only_first_purchase: true,
gift_amount: 500,
telegram: 123_456,
refer_code: "INVITE37",
referer_id: 7,
enable: true,
is_admin: false,
remark: "new remark",
});
});
it("preserves an intentionally cleared remark", () => {
expect(buildUserBasicInfoPayload(user, "").remark).toBe("");
});
});
@@ -0,0 +1,26 @@
import type { UpdateUserBasicInfoBody } from "@workspace/ui/services/admin/user";
export type UserBasicInfoPayload = Omit<UpdateUserBasicInfoBody, "remark"> & {
remark: string;
};
export function buildUserBasicInfoPayload(
user: API.User,
remark: string
): UserBasicInfoPayload {
return {
user_id: user.id,
avatar: user.avatar,
balance: user.balance,
commission: user.commission,
referral_percentage: user.referral_percentage,
only_first_purchase: user.only_first_purchase,
gift_amount: user.gift_amount,
telegram: user.telegram,
refer_code: user.refer_code,
referer_id: user.referer_id,
enable: user.enable,
is_admin: user.is_admin ?? false,
remark,
};
}
@@ -32,11 +32,27 @@ import { formatDate } from "@/utils/common";
import { SubscriptionDetail } from "./subscription-detail";
import { SubscriptionForm } from "./subscription-form";
type SubscriptionFormPayload = Parameters<
React.ComponentProps<typeof SubscriptionForm>["onSubmit"]
>[0];
interface SharedInfo {
ownerUserId: number;
familyId: number;
}
function toUserSubscribePayload(values: SubscriptionFormPayload) {
return {
subscribe_id: values.subscribe_id ?? 0,
traffic: values.traffic ?? 0,
expired_at: values.expired_at ?? 0,
upload: values.upload ?? 0,
download: values.download ?? 0,
speed_limit: values.speed_limit ?? 0,
traffic_limit: values.traffic_limit ?? [],
};
}
export default function UserSubscription({ userId }: { userId: number }) {
const { t } = useTranslation("user");
const [loading, setLoading] = useState(false);
@@ -164,9 +180,8 @@ export default function UserSubscription({ userId }: { userId: number }) {
onSubmit={async (values) => {
setLoading(true);
await updateUserSubscribe({
user_id: Number(userId),
user_subscribe_id: row.id,
...values,
...toUserSubscribePayload(values),
});
toast.success(t("updateSuccess", "Updated successfully"));
ref.current?.refresh();
@@ -352,7 +367,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();
@@ -20,83 +20,189 @@ import { 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 formatRules(rules?: API.TrafficLimitRule[]) {
return rules && rules.length > 0 ? rules : [];
}
function SpeedLimitCard({ subscriptionId }: { subscriptionId: number }) {
const { t } = useTranslation("user");
const [detail, setDetail] = useState<API.UserSubscribeDetail | null>(null);
const [loading, setLoading] = useState(false);
const [error, setError] = useState(false);
useEffect(() => {
getUserSubscribeById({ id: subscriptionId }).then(({ data }) => {
if (data.data) setDetail(data.data);
});
setLoading(true);
setError(false);
getUserSubscribeById({ id: subscriptionId })
.then(({ data }) => {
setDetail(data.data || null);
})
.catch(() => {
setError(true);
setDetail(null);
})
.finally(() => {
setLoading(false);
});
}, [subscriptionId]);
if (!detail || detail.status !== 1) return null;
if (loading) {
return (
<div className="mb-4 rounded-lg border bg-muted/30 p-3 text-muted-foreground text-sm">
{t("loading", "Loading")}...
</div>
);
}
if (error) {
return (
<div className="mb-4 rounded-lg border border-destructive/40 bg-destructive/5 p-3 text-destructive text-sm">
{t("loadFailed", "Failed to load data")}
</div>
);
}
if (!detail) {
return (
<div className="mb-4 rounded-lg border bg-muted/30 p-3 text-muted-foreground text-sm">
{t("noSubscriptionDetail", "No subscription detail")}
</div>
);
}
const baseSpeed = detail.subscribe?.speed_limit ?? 0;
const userSpeed = detail.speed_limit ?? 0;
const effectiveSpeed = detail.effective_speed ?? 0;
const isThrottled = detail.is_throttled;
if (baseSpeed === 0 && !isThrottled) return null;
const packageRules = formatRules(detail.subscribe?.traffic_limit);
const userRules = formatRules(detail.traffic_limit);
return (
<div
className={`mb-4 flex items-start gap-3 rounded-lg border p-3 text-sm ${
className={`mb-4 space-y-4 rounded-lg border p-3 text-sm ${
isThrottled
? "border-destructive/40 bg-destructive/5 text-destructive"
: "border-border bg-muted/40 text-foreground"
}`}
>
{isThrottled ? (
<AlertTriangle className="mt-0.5 h-4 w-4 shrink-0" />
) : (
<Gauge className="mt-0.5 h-4 w-4 shrink-0 text-muted-foreground" />
)}
<div className="space-y-1">
<div className="flex flex-wrap items-center gap-2 font-medium">
{isThrottled ? (
<>
<span>{t("throttled", "Speed Throttled")}</span>
<Badge className="text-xs" variant="destructive">
{effectiveSpeed} Mbps
</Badge>
{baseSpeed > 0 && (
<span className="text-muted-foreground text-xs line-through">
{baseSpeed} Mbps
</span>
)}
</>
) : (
<>
<span className="text-muted-foreground">
{t("speedLimit", "Speed Limit")}
</span>
<Badge className="text-xs" variant="secondary">
{effectiveSpeed > 0
? `${effectiveSpeed} Mbps`
: t("unlimited", "Unlimited")}
</Badge>
</>
<div className="flex items-start gap-3">
{isThrottled ? (
<AlertTriangle className="mt-0.5 h-4 w-4 shrink-0" />
) : (
<Gauge className="mt-0.5 h-4 w-4 shrink-0 text-muted-foreground" />
)}
<div className="min-w-0 space-y-1">
<div className="flex flex-wrap items-center gap-2 font-medium">
<span>
{isThrottled
? t("throttled", "Speed Throttled")
: t("speedLimitOverview", "Speed Limit Overview")}
</span>
<Badge
className="text-xs"
variant={isThrottled ? "destructive" : "secondary"}
>
{effectiveSpeed > 0
? `${effectiveSpeed} Mbps`
: t("unlimited", "Unlimited")}
</Badge>
</div>
{isThrottled && detail.throttle_rule && (
<p className="text-muted-foreground text-xs">
{detail.throttle_rule}
</p>
)}
{isThrottled && detail.throttle_start && detail.throttle_end && (
<p className="text-muted-foreground text-xs">
{formatDate(detail.throttle_start)} ~{" "}
{formatDate(detail.throttle_end)}
</p>
)}
</div>
{isThrottled && detail.throttle_rule && (
<p className="text-muted-foreground text-xs">
{detail.throttle_rule}
</p>
)}
{isThrottled && detail.throttle_start && detail.throttle_end && (
<p className="text-muted-foreground text-xs">
{formatDate(detail.throttle_start)} ~{" "}
{formatDate(detail.throttle_end)}
</p>
)}
</div>
<div className="grid gap-2 md:grid-cols-3">
{[
{
label: t("packageSpeedLimit", "Package Speed Limit"),
value: <Display type="trafficSpeed" unlimited value={baseSpeed} />,
},
{
label: t("userSpeedOverride", "User Speed Override"),
value: <Display type="trafficSpeed" unlimited value={userSpeed} />,
},
{
label: t("effectiveSpeedLimit", "Effective Speed Limit"),
value: (
<Display type="trafficSpeed" unlimited value={effectiveSpeed} />
),
},
].map((item) => (
<div
className="rounded-md border bg-background/70 p-2"
key={item.label}
>
<div className="text-muted-foreground text-xs">{item.label}</div>
<div className="mt-1 font-medium">{item.value}</div>
</div>
))}
</div>
<div className="grid gap-3 md:grid-cols-2">
<TrafficRulesBlock
emptyText={t("noPackageTrafficRules", "No package traffic rules")}
rules={packageRules}
title={t("packageTrafficRules", "Package Traffic Rules")}
/>
<TrafficRulesBlock
emptyText={t("noUserTrafficRules", "No user traffic rules")}
rules={userRules}
title={t("userTrafficRules", "User Traffic Rules")}
/>
</div>
</div>
);
}
function TrafficRulesBlock({
title,
rules,
emptyText,
}: {
title: string;
rules: API.TrafficLimitRule[];
emptyText: string;
}) {
return (
<div className="rounded-md border bg-background/70 p-2">
<div className="font-medium text-muted-foreground text-xs">{title}</div>
{rules.length === 0 ? (
<div className="mt-2 text-muted-foreground text-xs">{emptyText}</div>
) : (
<div className="mt-2 space-y-2">
{rules.map((rule, index) => (
<div
className="rounded border bg-muted/30 px-2 py-1.5 text-xs"
key={`${rule.stat_type}-${rule.stat_value}-${index}`}
>
<div className="flex flex-wrap gap-x-2 gap-y-1">
<span>
{rule.stat_value} {rule.stat_type}
</span>
<span>{rule.traffic_usage} GB</span>
<span>{rule.speed_limit} Mbps</span>
</div>
</div>
))}
</div>
)}
</div>
);
}
export function SubscriptionDetail({
trigger,
userId,
@@ -157,9 +263,8 @@ export function SubscriptionDetail({
cell: ({ row }) => (
<Switch
checked={row.getValue("enabled")}
onChange={(checked) => {
console.log("Switch:", checked);
}}
disabled
title={t("readOnly", "Read only")}
/>
),
},
@@ -3,6 +3,7 @@ import { Button } from "@workspace/ui/components/button";
import {
Form,
FormControl,
FormDescription,
FormField,
FormItem,
FormLabel,
@@ -17,8 +18,10 @@ import {
SheetTitle,
SheetTrigger,
} from "@workspace/ui/components/sheet";
import { Textarea } from "@workspace/ui/components/textarea";
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";
@@ -33,20 +36,67 @@ interface Props {
title: string;
loading?: boolean;
initialData?: API.UserSubscribe;
onSubmit: (values: any) => Promise<boolean>;
onSubmit: (values: SubscriptionFormValues) => Promise<boolean>;
}
const trafficLimitRuleSchema = z.object({
stat_type: z.enum(["hour", "day"]),
stat_value: z.number().int().min(1),
traffic_usage: z.number().int().min(0),
speed_limit: z.number().int().min(0),
});
const formSchema = z.object({
subscribe_id: z.number().optional(),
traffic: z.number().optional(),
speed_limit: z.number().optional(),
device_limit: z.number().optional(),
traffic_limit: z.array(trafficLimitRuleSchema).optional(),
traffic_limit_json: z.string().superRefine((value, ctx) => {
if (!value.trim()) return;
try {
const parsed: unknown = JSON.parse(value);
const result = z.array(trafficLimitRuleSchema).safeParse(parsed);
if (!result.success) {
ctx.addIssue({
code: z.ZodIssueCode.custom,
message: "Invalid traffic limit JSON",
});
}
} catch {
ctx.addIssue({
code: z.ZodIssueCode.custom,
message: "Invalid JSON",
});
}
}),
expired_at: z.number().nullish().optional(),
upload: z.number().optional(),
download: z.number().optional(),
id: z.number().optional(),
});
type SubscriptionFormValues = z.infer<typeof formSchema>;
type TrafficLimitFormRule = z.infer<typeof trafficLimitRuleSchema>;
function parseTrafficLimitJson(value: string): API.TrafficLimitRule[] {
if (!value.trim()) return [];
const parsed: unknown = JSON.parse(value);
const result = z.array(trafficLimitRuleSchema).safeParse(parsed);
return result.success ? normalizeTrafficLimitRules(result.data) : [];
}
function normalizeTrafficLimitRules(
rules?: TrafficLimitFormRule[]
): API.TrafficLimitRule[] {
return (rules || []).map((item) => ({
stat_type: item.stat_type === "hour" ? "hour" : "day",
stat_value: Number(item.stat_value) || 1,
traffic_usage: Number(item.traffic_usage) || 0,
speed_limit: Number(item.speed_limit) || 0,
}));
}
export function SubscriptionForm({
trigger,
title,
@@ -57,11 +107,18 @@ 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,
speed_limit: initialData?.speed_limit || 0,
traffic_limit: normalizeTrafficLimitRules(initialData?.traffic_limit),
traffic_limit_json: JSON.stringify(
normalizeTrafficLimitRules(initialData?.traffic_limit),
null,
2
),
upload: initialData?.upload || 0,
download: initialData?.download || 0,
expired_at: initialData?.expire_time || 0,
@@ -69,8 +126,18 @@ export function SubscriptionForm({
},
});
const handleSubmit = async (values: any) => {
const success = await onSubmit(values);
const handleSubmit = async (values: SubscriptionFormValues) => {
const trafficLimitFromJson = parseTrafficLimitJson(
values.traffic_limit_json
);
const success = await onSubmit({
...values,
traffic_limit: normalizeTrafficLimitRules(
trafficLimitFromJson.length > 0
? trafficLimitFromJson
: values.traffic_limit
),
});
if (success) {
setOpen(false);
form.reset();
@@ -154,6 +221,33 @@ export function SubscriptionForm({
</FormItem>
)}
/>
<FormField
control={form.control}
name="speed_limit"
render={({ field }) => (
<FormItem>
<FormLabel>{t("speedLimit", "Speed Limit")}</FormLabel>
<FormControl>
<EnhancedInput
placeholder={t("unlimited", "Unlimited")}
type="number"
{...field}
onValueChange={(value) => {
form.setValue(field.name, value as number);
}}
suffix="Mbps"
/>
</FormControl>
<FormDescription>
{t(
"userSpeedLimitDescription",
"Set a user-level speed override. Use 0 to inherit the subscription limit."
)}
</FormDescription>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="upload"
@@ -183,6 +277,114 @@ export function SubscriptionForm({
</FormItem>
)}
/>
<FormField
control={form.control}
name="traffic_limit"
render={({ field }) => (
<FormItem>
<FormLabel>
{t("trafficLimitRules", "Traffic Limit Rules")}
</FormLabel>
<FormControl>
<ArrayInput<API.TrafficLimitRule>
className="grid grid-cols-1 gap-3 md:grid-cols-4"
fields={[
{
name: "stat_type",
type: "select",
placeholder: t("statType", "Statistics Type"),
options: [
{ label: t("hour", "Hour"), value: "hour" },
{ label: t("day", "Day"), value: "day" },
],
},
{
name: "stat_value",
type: "number",
placeholder: t("statValue", "Time Value"),
min: 1,
},
{
name: "traffic_usage",
type: "number",
placeholder: t(
"trafficUsageGb",
"Traffic Usage (GB)"
),
min: 0,
},
{
name: "speed_limit",
type: "number",
placeholder: t(
"speedLimitMbps",
"Speed Limit (Mbps)"
),
min: 0,
},
]}
onChange={(items) => {
const normalized =
normalizeTrafficLimitRules(items);
field.onChange(normalized);
form.setValue(
"traffic_limit_json",
JSON.stringify(normalized, null, 2),
{ shouldValidate: true }
);
}}
value={field.value}
/>
</FormControl>
<FormDescription>
{t(
"userTrafficLimitDescription",
"Optional user-level traffic throttle rules. Traffic usage is stored in GB for each rule."
)}
</FormDescription>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="traffic_limit_json"
render={({ field }) => (
<FormItem>
<FormLabel>
{t("trafficLimitJson", "Traffic Limit JSON")}
</FormLabel>
<FormControl>
<Textarea
className="min-h-32 font-mono text-xs"
placeholder='[{"stat_type":"day","stat_value":1,"traffic_usage":10,"speed_limit":5}]'
{...field}
onChange={(event) => {
field.onChange(event.target.value);
try {
const parsed = JSON.parse(event.target.value);
const result = z
.array(trafficLimitRuleSchema)
.safeParse(parsed);
if (result.success) {
form.setValue("traffic_limit", result.data);
}
} catch {
// Validation message is handled by zod.
}
}}
/>
</FormControl>
<FormDescription>
{t(
"trafficLimitJsonDescription",
"Use JSON when pasting existing rules or clearing all rules with []."
)}
</FormDescription>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="download"
+90 -5
View File
@@ -40,6 +40,13 @@ import { Display } from "@/components/display";
import { UserDetail } from "@/sections/user/user-detail";
import { formatDate } from "@/utils/common";
const WITHDRAWAL_METHOD_MAP: Record<number, string> = {
0: "其他",
1: "支付宝",
2: "微信",
3: "银行卡",
};
const rejectSchema = z.object({
reason: z
.string()
@@ -48,11 +55,48 @@ const rejectSchema = z.object({
.max(500, "拒绝原因不能超过 500 个字符"),
});
function QrCodeCell({ url }: { url?: string }) {
const [zoomOpen, setZoomOpen] = useState(false);
if (!url) return <span>--</span>;
return (
<>
<button
className="block overflow-hidden rounded border"
onClick={() => setZoomOpen(true)}
type="button"
>
<img
alt="收款码"
className="h-12 w-12 cursor-zoom-in object-cover"
height={48}
src={url}
width={48}
/>
</button>
{zoomOpen && (
<Dialog onOpenChange={setZoomOpen} open={zoomOpen}>
<DialogContent className="max-w-sm">
<img
alt="收款码"
className="w-full"
height={320}
src={url}
width={320}
/>
</DialogContent>
</Dialog>
)}
</>
);
}
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 [currentRow, setCurrentRow] = useState<API.AdminWithdrawalLog | null>(
null
);
const form = useForm<z.infer<typeof rejectSchema>>({
resolver: zodResolver(rejectSchema),
defaultValues: {
@@ -93,6 +137,14 @@ export default function WithdrawalPage() {
{ value: "0", label: "审核中" },
{ value: "1", label: "已通过" },
{ value: "2", label: "已拒绝" },
{ value: "3", label: "已取消" },
];
const methodOptions = [
{ value: "1", label: "支付宝" },
{ value: "2", label: "微信" },
{ value: "3", label: "银行卡" },
{ value: "0", label: "其他" },
];
const statusMap: Record<number, { label: string; className: string }> = {
@@ -108,11 +160,18 @@ export default function WithdrawalPage() {
label: "已拒绝",
className: "bg-rose-100 text-rose-700 border-rose-200",
},
3: {
label: "已取消",
className: "bg-gray-100 text-gray-500 border-gray-200",
},
};
return (
<>
<ProTable<API.WithdrawalLog, { status?: string; user_id?: string }>
<ProTable<
API.AdminWithdrawalLog,
{ status?: string; user_id?: string; method?: string }
>
action={ref}
actions={{
render: (row) => {
@@ -170,10 +229,30 @@ export default function WithdrawalPage() {
),
},
{
accessorKey: "content",
header: "收款信息",
accessorKey: "method",
header: "收款方式",
cell: ({ row }) =>
WITHDRAWAL_METHOD_MAP[row.original.method] ?? "--",
},
{
accessorKey: "account",
header: "收款账号",
cell: ({ row }) => (
<div className="max-w-[360px] break-all text-sm">
<div className="max-w-[200px] break-all text-sm">
{row.original.account || "--"}
</div>
),
},
{
accessorKey: "qr_code_url",
header: "收款码",
cell: ({ row }) => <QrCodeCell url={row.original.qr_code_url} />,
},
{
accessorKey: "content",
header: "备注",
cell: ({ row }) => (
<div className="max-w-[200px] break-all text-sm">
{row.original.content || "--"}
</div>
),
@@ -216,6 +295,11 @@ export default function WithdrawalPage() {
options: statusOptions,
placeholder: "状态",
},
{
key: "method",
options: methodOptions,
placeholder: "收款方式",
},
{
key: "user_id",
placeholder: "用户 ID",
@@ -226,6 +310,7 @@ export default function WithdrawalPage() {
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,
});
@@ -2,7 +2,12 @@ import { Button } from "@workspace/ui/components/button";
import { Input } from "@workspace/ui/components/input";
import { Icon } from "@workspace/ui/composed/icon";
import { generateCaptcha } from "@workspace/ui/services/common/auth";
import { useEffect, useImperativeHandle, useState } from "react";
import {
type RefObject,
useEffect,
useImperativeHandle,
useState,
} from "react";
import { useTranslation } from "react-i18next";
export interface LocalCaptchaRef {
@@ -10,7 +10,13 @@ import {
generateCaptcha,
verifyCaptchaSlider,
} from "@workspace/ui/services/common/auth";
import { useCallback, useImperativeHandle, useRef, useState } from "react";
import {
type RefObject,
useCallback,
useImperativeHandle,
useRef,
useState,
} from "react";
import { useTranslation } from "react-i18next";
export interface SliderCaptchaRef {
+333 -60
View File
@@ -1,7 +1,7 @@
"use client";
import { zodResolver } from "@hookform/resolvers/zod";
import { useQuery } from "@tanstack/react-query";
import { useMutation, useQuery } from "@tanstack/react-query";
import { Button } from "@workspace/ui/components/button";
import {
Card,
@@ -28,18 +28,29 @@ import {
FormMessage,
} from "@workspace/ui/components/form";
import { Input } from "@workspace/ui/components/input";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@workspace/ui/components/select";
import { Textarea } from "@workspace/ui/components/textarea";
import { ConfirmButton } from "@workspace/ui/composed/confirm-button";
import type { ProListActions } from "@workspace/ui/composed/pro-list/pro-list";
import { ProList } from "@workspace/ui/composed/pro-list/pro-list";
import { UploadImage } from "@workspace/ui/composed/upload-image";
import {
commissionWithdraw,
queryUserAffiliate,
queryUserAffiliateList,
queryWithdrawalLog,
uploadFile,
withdrawalCancel,
} from "@workspace/ui/services/user/user";
import { formatDate } from "@workspace/ui/utils/formatting";
import { unitConversion } from "@workspace/ui/utils/unit-conversions";
import { Copy } from "lucide-react";
import { Copy, X } from "lucide-react";
import { useRef, useState, useTransition } from "react";
import { CopyToClipboard } from "react-copy-to-clipboard";
import { useForm } from "react-hook-form";
@@ -49,6 +60,17 @@ import { z } from "zod";
import { Display } from "@/components/display";
import { useGlobalStore } from "@/stores/global";
const WITHDRAWAL_METHODS = [
{ value: 1, label: "支付宝" },
{ value: 2, label: "微信" },
{ value: 3, label: "银行卡" },
{ value: 0, label: "其他" },
] as const;
function getWithdrawalMethodLabel(method: number): string {
return WITHDRAWAL_METHODS.find((m) => m.value === method)?.label ?? "未知";
}
function getWithdrawalStatusMeta(
status: number,
t: ReturnType<typeof useTranslation<"affiliate">>["t"]
@@ -64,6 +86,11 @@ function getWithdrawalStatusMeta(
label: t("withdrawal.status.rejected", "Rejected"),
className: "bg-destructive/10 text-destructive",
};
case 3:
return {
label: t("withdrawal.status.cancelled", "Cancelled"),
className: "bg-muted text-muted-foreground",
};
default:
return {
label: t("withdrawal.status.pending", "Pending"),
@@ -72,11 +99,83 @@ function getWithdrawalStatusMeta(
}
}
function QrCodeView({ url }: { url: string }) {
const [zoomOpen, setZoomOpen] = useState(false);
return (
<>
<button
className="block overflow-hidden rounded border"
onClick={() => setZoomOpen(true)}
type="button"
>
<img
alt="收款码"
className="h-16 w-16 cursor-zoom-in object-cover"
src={url}
/>
</button>
{zoomOpen && (
<Dialog onOpenChange={setZoomOpen} open={zoomOpen}>
<DialogContent className="max-w-sm">
<img alt="收款码" className="w-full" src={url} />
</DialogContent>
</Dialog>
)}
</>
);
}
const withdrawalFormSchema = z
.object({
amount: z.number(),
method: z.number(),
account: z.string().trim().max(200).optional(),
qr_code_url: z.string().optional(),
content: z.string().trim().max(1000).optional(),
})
.superRefine((data, ctx) => {
if (!data.amount || data.amount <= 0) {
ctx.addIssue({
code: z.ZodIssueCode.custom,
message: "提现金额必须大于 0",
path: ["amount"],
});
}
if (data.method === 1 || data.method === 2) {
if (!data.qr_code_url) {
ctx.addIssue({
code: z.ZodIssueCode.custom,
message: "请上传收款码",
path: ["qr_code_url"],
});
}
} else if (data.method === 3) {
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: "收款账号和备注至少填一项",
path: ["account"],
});
}
}
});
type WithdrawalFormValues = z.infer<typeof withdrawalFormSchema>;
export default function Affiliate() {
const { t } = useTranslation("affiliate");
const { user, common, getUserInfo } = useGlobalStore();
const [withdrawalOpen, setWithdrawalOpen] = useState(false);
const [submitting, startTransition] = useTransition();
const [qrUploading, setQrUploading] = useState(false);
const withdrawalListActionRef = useRef<ProListActions | undefined>(undefined);
const affiliateQuery = useQuery({
@@ -89,51 +188,69 @@ export default function Affiliate() {
const availableCommission = Number(
user?.commission ?? affiliateQuery.data?.total_commission ?? 0
);
const withdrawalFormSchema = z.object({
amount: z
.number()
.int(t("withdrawal.validation.amountInvalid", "Amount is invalid"))
.positive(
t(
"withdrawal.validation.amountPositive",
"Amount must be greater than 0"
)
)
.max(
availableCommission,
t(
"withdrawal.validation.amountExceeded",
"Amount cannot exceed available commission"
)
),
content: z
.string()
.trim()
.min(
1,
t(
"withdrawal.validation.contentRequired",
"Withdrawal info is required"
)
)
.max(
1000,
t("withdrawal.validation.contentTooLong", "Withdrawal info is too long")
),
});
const withdrawalForm = useForm<z.infer<typeof withdrawalFormSchema>>({
const withdrawalForm = useForm<WithdrawalFormValues>({
resolver: zodResolver(withdrawalFormSchema),
defaultValues: {
amount: 0,
method: 1,
account: "",
qr_code_url: "",
content: "",
},
});
const submitWithdrawal = (values: z.infer<typeof withdrawalFormSchema>) => {
const watchedMethod = withdrawalForm.watch("method");
const watchedQrCodeUrl = withdrawalForm.watch("qr_code_url");
const handleQrUpload = async (file: string | File) => {
if (!(file instanceof File)) return;
setQrUploading(true);
try {
const formData = new FormData();
formData.append("file", file);
formData.append("biz_type", "withdrawal_qrcode");
const response = await uploadFile(formData);
const uploadedUrl =
response.data.data?.url || response.data.data?.key || "";
withdrawalForm.setValue("qr_code_url", uploadedUrl);
withdrawalForm.clearErrors("qr_code_url");
} catch {
toast.error("收款码上传失败,请重试");
} finally {
setQrUploading(false);
}
};
const cancelMutation = useMutation({
mutationFn: async (withdrawalId: number) =>
withdrawalCancel({ withdrawal_id: withdrawalId }),
onSuccess: () => {
toast.success("提现申请已取消");
withdrawalListActionRef.current?.refresh();
},
onError: () => {
toast.error("取消失败,请重试");
},
});
const submitWithdrawal = (values: WithdrawalFormValues) => {
if (values.amount > availableCommission) {
withdrawalForm.setError("amount", {
message: t(
"withdrawal.validation.amountExceeded",
"Amount cannot exceed available commission"
),
});
return;
}
startTransition(async () => {
await commissionWithdraw({
amount: values.amount,
content: values.content.trim(),
method: values.method,
account: values.account || undefined,
qr_code_url: values.qr_code_url || undefined,
content: values.content || undefined,
});
toast.success(
t("withdrawal.submitSuccess", "Withdrawal request submitted")
@@ -146,6 +263,9 @@ export default function Affiliate() {
setWithdrawalOpen(false);
withdrawalForm.reset({
amount: 0,
method: 1,
account: "",
qr_code_url: "",
content: "",
});
});
@@ -192,7 +312,7 @@ export default function Affiliate() {
{t("withdrawal.apply", "Apply for Withdrawal")}
</Button>
</DialogTrigger>
<DialogContent>
<DialogContent className="max-h-[90vh] overflow-y-auto">
<DialogHeader>
<DialogTitle>
{t("withdrawal.applyTitle", "Apply for Withdrawal")}
@@ -256,21 +376,130 @@ export default function Affiliate() {
</FormItem>
)}
/>
<FormField
control={withdrawalForm.control}
name="method"
render={({ field }) => (
<FormItem>
<FormLabel></FormLabel>
<Select
onValueChange={(val) => {
field.onChange(Number(val));
withdrawalForm.setValue("qr_code_url", "");
withdrawalForm.setValue("account", "");
withdrawalForm.clearErrors();
}}
value={String(field.value)}
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder="请选择收款方式" />
</SelectTrigger>
</FormControl>
<SelectContent>
{WITHDRAWAL_METHODS.map((m) => (
<SelectItem
key={m.value}
value={String(m.value)}
>
{m.label}
</SelectItem>
))}
</SelectContent>
</Select>
<FormMessage />
</FormItem>
)}
/>
{(watchedMethod === 1 || watchedMethod === 2) && (
<FormField
control={withdrawalForm.control}
name="qr_code_url"
render={() => (
<FormItem>
<FormLabel>
<span className="ml-1 text-destructive">
*
</span>
</FormLabel>
{watchedQrCodeUrl ? (
<div className="relative inline-block">
<QrCodeView url={watchedQrCodeUrl} />
<button
className="-top-2 -right-2 absolute flex h-5 w-5 items-center justify-center rounded-full bg-destructive text-destructive-foreground"
onClick={() =>
withdrawalForm.setValue("qr_code_url", "")
}
type="button"
>
<X className="h-3 w-3" />
</button>
</div>
) : (
<UploadImage
className="h-24 w-24"
id="qr-code-upload"
onChange={handleQrUpload}
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收款码"}
</div>
</UploadImage>
)}
<FormMessage />
</FormItem>
)}
/>
)}
{(watchedMethod === 3 || watchedMethod === 0) && (
<FormField
control={withdrawalForm.control}
name="account"
render={({ field }) => (
<FormItem>
<FormLabel>
{watchedMethod === 3 && (
<span className="ml-1 text-destructive">
*
</span>
)}
</FormLabel>
<FormControl>
<Input
placeholder={
watchedMethod === 3
? "请输入银行卡号或账户信息"
: "请输入收款账号(与备注至少填一项)"
}
{...field}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
)}
<FormField
control={withdrawalForm.control}
name="content"
render={({ field }) => (
<FormItem>
<FormLabel>
{t("withdrawal.content", "Payout Information")}
</FormLabel>
<FormLabel></FormLabel>
<FormControl>
<Textarea
placeholder={t(
"withdrawal.contentPlaceholder",
"Bank account, wallet address, recipient name, or other payout details"
)}
rows={4}
placeholder={
watchedMethod === 0
? "备注(与账号至少填一项)"
: "备注(可选)"
}
rows={3}
{...field}
/>
</FormControl>
@@ -289,7 +518,11 @@ export default function Affiliate() {
{t("withdrawal.cancel", "Cancel")}
</Button>
<Button
disabled={submitting || availableCommission <= 0}
disabled={
submitting ||
qrUploading ||
availableCommission <= 0
}
form="withdrawal-form"
type="submit"
>
@@ -345,28 +578,68 @@ export default function Affiliate() {
<div className="font-semibold text-lg">
<Display type="currency" value={item.amount} />
</div>
<span
className={`inline-flex rounded-full px-3 py-1 font-medium text-xs ${statusMeta.className}`}
>
{statusMeta.label}
</span>
<div className="flex items-center gap-2">
<span
className={`inline-flex rounded-full px-3 py-1 font-medium text-xs ${statusMeta.className}`}
>
{statusMeta.label}
</span>
{item.status === 0 && (
<ConfirmButton
cancelText="取消"
confirmText="确认取消"
description="取消后该提现申请将关闭,佣金不会退还。确定取消吗?"
onConfirm={async () => {
await cancelMutation.mutateAsync(item.id);
}}
title="取消提现申请"
trigger={
<Button
disabled={cancelMutation.isPending}
size="sm"
variant="outline"
>
</Button>
}
/>
)}
</div>
</div>
<ul className="grid gap-3 md:grid-cols-2">
<li className="flex flex-col gap-1">
<span className="text-muted-foreground">
{t("withdrawal.record.content", "Payout Information")}
</span>
<span className="whitespace-pre-wrap break-words">
{item.content}
</span>
<span className="text-muted-foreground"></span>
<span>{getWithdrawalMethodLabel(item.method)}</span>
</li>
{item.account && (
<li className="flex flex-col gap-1">
<span className="text-muted-foreground"></span>
<span className="break-all">{item.account}</span>
</li>
)}
{item.qr_code_url && (
<li className="flex flex-col gap-1">
<span className="text-muted-foreground"></span>
<QrCodeView url={item.qr_code_url} />
</li>
)}
{item.content && (
<li className="flex flex-col gap-1">
<span className="text-muted-foreground">
{t("withdrawal.record.content", "Payout Information")}
</span>
<span className="whitespace-pre-wrap break-words">
{item.content}
</span>
</li>
)}
<li className="flex flex-col gap-1">
<span className="text-muted-foreground">
{t("withdrawal.record.createdAt", "Created At")}
</span>
<time>{formatDate(item.created_at)}</time>
</li>
{item.reason ? (
{item.reason && (
<li className="flex flex-col gap-1 md:col-span-2">
<span className="text-muted-foreground">
{t("withdrawal.record.reason", "Reject Reason")}
@@ -375,7 +648,7 @@ export default function Affiliate() {
{item.reason}
</span>
</li>
) : null}
)}
</ul>
</CardContent>
</Card>
@@ -27,23 +27,52 @@ const FormSchema = z.object({
enable_balance_notify: z.boolean(),
enable_login_notify: z.boolean(),
enable_subscribe_notify: z.boolean(),
// enable_trade_notify: z.boolean(),
enable_trade_notify: z.boolean(),
});
type NotifyFormValues = z.infer<typeof FormSchema>;
const notificationFields = [
{
name: "enable_balance_notify",
labelKey: "notify.balanceChange",
fallbackLabel: "Balance Change",
},
{
name: "enable_login_notify",
labelKey: "notify.login",
fallbackLabel: "Login",
},
{
name: "enable_subscribe_notify",
labelKey: "notify.subscribe",
fallbackLabel: "Subscribe",
},
{
name: "enable_trade_notify",
labelKey: "notify.finance",
fallbackLabel: "Finance",
},
] satisfies Array<{
name: keyof NotifyFormValues;
labelKey: string;
fallbackLabel: string;
}>;
export default function NotifySettings() {
const { t } = useTranslation("profile");
const { user, getUserInfo } = useGlobalStore();
const form = useForm<z.infer<typeof FormSchema>>({
const form = useForm<NotifyFormValues>({
resolver: zodResolver(FormSchema),
defaultValues: {
enable_balance_notify: user?.enable_balance_notify ?? false,
enable_login_notify: user?.enable_login_notify ?? false,
enable_subscribe_notify: user?.enable_subscribe_notify ?? false,
// enable_trade_notify: user?.enable_trade_notify ?? false,
enable_trade_notify: user?.enable_trade_notify ?? false,
},
});
async function onSubmit(data: z.infer<typeof FormSchema>) {
async function onSubmit(data: NotifyFormValues) {
await updateUserNotify(data);
toast.success(t("notify.updateSuccess", "Update Successful"));
await getUserInfo();
@@ -67,32 +96,15 @@ export default function NotifySettings() {
onSubmit={form.handleSubmit(onSubmit)}
>
<div className="space-y-4">
{[
{
name: "enable_balance_notify",
label: t("notify.balanceChange", "Balance Change"),
},
{
name: "enable_login_notify",
label: t("notify.login", "Login"),
},
{
name: "enable_subscribe_notify",
label: t("notify.subscribe", "Subscribe"),
},
// {
// name: "enable_trade_notify",
// label: t("notify.finance", "Finance"),
// },
].map(({ name, label }) => (
{notificationFields.map(({ fallbackLabel, labelKey, name }) => (
<FormField
control={form.control}
key={name}
name={name as any}
name={name}
render={({ field }) => (
<FormItem className="flex items-center justify-between space-x-4">
<FormLabel className="text-muted-foreground">
{label}
{t(labelKey, fallbackLabel)}
</FormLabel>
<FormControl>
<Switch
@@ -39,7 +39,13 @@ import { SortableRow } from "@workspace/ui/composed/pro-table/sortable-row";
import { ProTableWrapper } from "@workspace/ui/composed/pro-table/wrapper";
import { cn } from "@workspace/ui/lib/utils";
import { useSize } from "ahooks";
import { GripVertical, ListRestart, Loader, RefreshCcw } from "lucide-react";
import {
CircleAlert,
GripVertical,
ListRestart,
Loader,
RefreshCcw,
} from "lucide-react";
import type React from "react";
import {
Fragment,
@@ -79,6 +85,7 @@ export interface ProTableProps<TData, TValue> {
selectedRowsText: (total: number) => string;
}>;
empty?: React.ReactNode;
error?: React.ReactNode;
onSort?: (
sourceId: string | number,
targetId: string | number | null,
@@ -104,6 +111,7 @@ export function ProTable<
action,
texts,
empty,
error,
onSort,
initialFilters,
}: ProTableProps<TData, TValue>) {
@@ -121,6 +129,8 @@ export function ProTable<
const [rowSelection, setRowSelection] = useState({});
const [data, setData] = useState<TData[]>([]);
const [rowCount, setRowCount] = useState<number>(0);
const [isLoading, setIsLoading] = useState(false);
const [requestError, setRequestError] = useState(false);
const [pagination, setPagination] = useState({
pageIndex: 0,
pageSize: 200,
@@ -193,6 +203,8 @@ export function ProTable<
const fetchData = async () => {
if (loading.current) return;
loading.current = true;
setIsLoading(true);
setRequestError(false);
try {
const response = await request(
{
@@ -205,10 +217,13 @@ export function ProTable<
);
setData(response.list);
setRowCount(response.total);
} catch (error) {
console.log("Fetch data error:", error);
} catch (_error) {
setData([]);
setRowCount(0);
setRequestError(true);
} finally {
loading.current = false;
setIsLoading(false);
}
};
const reset = async () => {
@@ -316,7 +331,16 @@ export function ProTable<
))}
</TableHeader>
<TableBody>
{table.getRowModel()?.rows?.length ? (
{requestError ? (
<TableRow>
<TableCell
className="py-12"
colSpan={table.getAllLeafColumns().length}
>
{error || <ProTableErrorState />}
</TableCell>
</TableRow>
) : table.getRowModel()?.rows?.length ? (
onSort ? (
table.getRowModel().rows.map((row) => (
<SortableRow
@@ -371,7 +395,10 @@ export function ProTable<
)
) : (
<TableRow>
<TableCell className="py-24" colSpan={columns.length + 2}>
<TableCell
className="py-24"
colSpan={table.getAllLeafColumns().length}
>
{empty || <Empty />}
</TableCell>
</TableRow>
@@ -380,8 +407,12 @@ export function ProTable<
</Table>
</ProTableWrapper>
{loading.current && (
<div className="absolute top-0 z-20 flex h-full w-full items-center justify-center bg-muted/80">
{isLoading && (
<div
aria-label="Loading data"
className="absolute top-0 z-20 flex h-full w-full items-center justify-center bg-muted/80"
role="status"
>
<Loader className="h-4 w-4 animate-spin" />
</div>
)}
@@ -391,6 +422,16 @@ export function ProTable<
);
}
function ProTableErrorState() {
return (
<Alert className="mx-auto max-w-md" variant="destructive">
<CircleAlert aria-hidden="true" />
<AlertTitle>Failed to load data</AlertTitle>
<AlertDescription>Refresh the table or try again later.</AlertDescription>
</Alert>
);
}
function createSelectColumn<TData, TValue>(): ColumnDef<TData, TValue> {
return {
id: "selected",
+19
View File
@@ -0,0 +1,19 @@
/* eslint-disable */
import request from "@workspace/ui/lib/request";
/** Get global invite list GET /v1/admin/invite/list */
export async function getAdminInviteList(
params: API.GetAdminInviteListParams,
options?: Record<string, unknown>
) {
return request<API.Response & { data?: API.GetAdminInviteListResponse }>(
`${import.meta.env.VITE_API_PREFIX || ""}/v1/admin/invite/list`,
{
method: "GET",
params: {
...params,
},
...(options || {}),
}
);
}
+52 -33
View File
@@ -28,21 +28,6 @@ declare namespace API {
updated_at: number;
};
type AdminWithdrawalLog = {
id: number;
user_id: number;
amount: number;
content: string;
status: number;
reason?: string;
created_at: number;
updated_at: number;
};
type ApproveWithdrawalRequest = {
withdrawal_id: number;
};
type AnyTLS = {
port: number;
security_config: SecurityConfig;
@@ -86,18 +71,6 @@ declare namespace API {
is_default: boolean;
};
type GetWithdrawalListParams = {
page: number;
size: number;
user_id?: number;
status?: number;
};
type GetWithdrawalListResponse = {
list: AdminWithdrawalLog[];
total: number;
};
type AppUserSubcbribe = {
id: number;
name: string;
@@ -425,6 +398,8 @@ declare namespace API {
expired_at: number;
traffic: number;
subscribe_id: number;
speed_limit?: number;
traffic_limit?: TrafficLimitRule[];
};
type CurrencyConfig = {
@@ -1190,6 +1165,7 @@ declare namespace API {
size: number;
user_id?: number;
status?: number;
method?: number;
};
type GetWithdrawalListResponse = {
@@ -1801,11 +1777,6 @@ declare namespace API {
total: number;
};
type RejectWithdrawalRequest = {
withdrawal_id: number;
reason: string;
};
type QuotaTask = {
id: number;
subscribers: number[];
@@ -2082,6 +2053,7 @@ declare namespace API {
replacement: number;
inventory: number;
traffic: number;
traffic_limit?: TrafficLimitRule[];
speed_limit: number;
device_limit: number;
quota: number;
@@ -2465,6 +2437,8 @@ declare namespace API {
expired_at: number;
upload: number;
download: number;
speed_limit?: number;
traffic_limit?: TrafficLimitRule[];
};
type User = {
@@ -2553,6 +2527,8 @@ declare namespace API {
finished_at: number;
reset_time: number;
traffic: number;
traffic_limit?: TrafficLimitRule[];
speed_limit?: number;
download: number;
upload: number;
token: string;
@@ -2575,6 +2551,8 @@ declare namespace API {
expire_time: number;
reset_time: number;
traffic: number;
traffic_limit?: TrafficLimitRule[];
speed_limit?: number;
download: number;
upload: number;
token: string;
@@ -2590,6 +2568,13 @@ declare namespace API {
updated_at: number;
};
type TrafficLimitRule = {
stat_type: "hour" | "day";
stat_value: number;
traffic_usage: number;
speed_limit: number;
};
type UserSubscribeLog = {
id: number;
user_id: number;
@@ -2773,6 +2758,35 @@ declare namespace API {
list: AdminInvitedUser[];
};
type GetAdminInviteListParams = {
page: number;
size: number;
search?: string;
inviter_id?: number;
invitee_id?: number;
};
type AdminInviteRelation = {
id?: string;
inviter_id: number;
inviter_identifier: string;
invitee_id: number;
invitee_identifier: string;
invitee_avatar: string;
invitee_enable: boolean;
invited_at: number;
order_count: number;
has_purchased: boolean;
inviter_commission: number;
inviter_gift_days: number;
invitee_gift_days: number;
};
type GetAdminInviteListResponse = {
total: number;
list: AdminInviteRelation[];
};
type ActivateOrderRequest = {
order_no: string;
};
@@ -3129,10 +3143,15 @@ declare namespace API {
id: number;
user_id: number;
amount: number;
content: string;
method: number;
account?: string;
qr_code_url?: string;
content?: string;
status: number;
reason?: string;
created_at: number;
updated_at: number;
};
type AdminWithdrawalLog = WithdrawalLog;
}
+9 -1
View File
@@ -1,6 +1,14 @@
/* eslint-disable */
import request from "@workspace/ui/lib/request";
export type UpdateUserBasicInfoBody = Omit<
API.UpdateUserBasiceInfoRequest,
"password"
> & {
password?: string;
remark?: string;
};
/** Create user POST /v1/admin/user/ */
export async function createUser(
body: API.CreateUserRequest,
@@ -104,7 +112,7 @@ export async function deleteUserAuthMethod(
/** Update user basic info PUT /v1/admin/user/basic */
export async function updateUserBasicInfo(
body: API.UpdateUserBasiceInfoRequest,
body: UpdateUserBasicInfoBody,
options?: { [key: string]: any }
) {
return request<API.Response & { data?: any }>(
-1
View File
@@ -1,4 +1,3 @@
// @ts-expect-error
/* eslint-disable */
import request from "@workspace/ui/lib/request";
@@ -1,4 +1,3 @@
// @ts-expect-error
/* eslint-disable */
import request from "@workspace/ui/lib/request";
@@ -1,4 +1,3 @@
// @ts-expect-error
/* eslint-disable */
import request from "@workspace/ui/lib/request";
-1
View File
@@ -1,4 +1,3 @@
// @ts-expect-error
/* eslint-disable */
import request from "@workspace/ui/lib/request";
-1
View File
@@ -1,4 +1,3 @@
// @ts-expect-error
/* eslint-disable */
import request from "@workspace/ui/lib/request";
@@ -1,4 +1,3 @@
// @ts-expect-error
/* eslint-disable */
import request from "@workspace/ui/lib/request";
-1
View File
@@ -1,4 +1,3 @@
// @ts-expect-error
/* eslint-disable */
import request from "@workspace/ui/lib/request";
+12 -2
View File
@@ -172,7 +172,14 @@ declare namespace API {
type CommissionWithdrawRequest = {
amount: number;
content: string;
method: number;
account?: string;
qr_code_url?: string;
content?: string;
};
type WithdrawalCancelRequest = {
withdrawal_id: number;
};
type Coupon = {
@@ -1296,7 +1303,10 @@ declare namespace API {
id: number;
user_id: number;
amount: number;
content: string;
method: number;
account?: string;
qr_code_url?: string;
content?: string;
status: number;
reason?: string;
created_at: number;
+33
View File
@@ -470,3 +470,36 @@ export async function queryWithdrawalLog(
}
);
}
/** Cancel Withdrawal POST /v1/public/user/withdrawal_cancel */
export async function withdrawalCancel(
body: API.WithdrawalCancelRequest,
options?: { [key: string]: any }
) {
return request<API.Response & { data?: any }>(
`${import.meta.env.VITE_API_PREFIX || ""}/v1/public/user/withdrawal_cancel`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
data: body,
...(options || {}),
}
);
}
/** Upload File POST /v1/public/file/upload */
export async function uploadFile(
formData: FormData,
options?: { [key: string]: any }
) {
return request<API.Response & { data?: { url: string; key: string } }>(
`${import.meta.env.VITE_API_PREFIX || ""}/v1/public/file/upload`,
{
method: "POST",
data: formData,
...(options || {}),
}
);
}