= [
+ {
+ title: '订单',
+ key: 'order',
+ width: 230,
+ fixed: 'left',
+ render: (_, row) => (
+
+ {row.order_no}
+
+ {orderStatusMap[row.order_status]?.label ?? row.order_status}
+
+ {row.finance_status === 'settled' ? '已结算' : '待结算'}
+
+
+
+ ),
+ },
+ {
+ title: '租客',
+ key: 'renter',
+ width: 160,
+ render: (_, row) => (
+
+ {formatText(row.renter_nickname)}
+ {formatText(row.renter_phone)}
+
+ ),
+ },
+ {
+ title: '号主',
+ key: 'owner',
+ width: 160,
+ render: (_, row) => (
+
+ {formatText(row.owner_nickname)}
+ {formatText(row.owner_phone)}
+
+ ),
+ },
+ {
+ title: '实付 / 退款',
+ key: 'amount',
+ width: 160,
+ align: 'right',
+ render: (_, row) => (
+
+ {formatMoney(row.paid_amount_cent)}
+
+ 退款 {formatMoney(row.refunded_amount_cent)}
+
+
+ ),
+ },
+ {
+ title: '号主结算',
+ key: 'owner_settle',
+ width: 150,
+ align: 'right',
+ render: (_, row) => (
+
+ {formatMoney(row.owner_effective_settlement_amount_cent)}
+
+ 钱包 {formatMoney(row.owner_wallet_income_amount_cent)}
+
+
+ ),
+ },
+ {
+ title: '平台净额',
+ dataIndex: 'platform_net_amount_cent',
+ width: 130,
+ align: 'right',
+ render: value => formatMoney(value),
+ },
+ {
+ title: '结算模式',
+ key: 'mode',
+ width: 150,
+ render: (_, row) => (
+
+ {formatText(row.settlement_mode)}
+ {formatText(row.offline_settlement_status)}
+
+ ),
+ },
+ {
+ title: '创建时间',
+ dataIndex: 'created_at',
+ width: 170,
+ render: value => formatDateTime(value),
+ },
+ {
+ title: '结算时间',
+ dataIndex: 'settled_at',
+ width: 170,
+ render: value => (value ? formatDateTime(value) : '—'),
+ },
+]
+
+export function AdminFinanceDetailsPage() {
+ const [filters, setFilters] = useState(emptyFilters)
+ const [applied, setApplied] = useState(emptyFilters)
+ const [settlementStatus, setSettlementStatus] = useState()
+ const [page, setPage] = useState(1)
+ const [pageSize, setPageSize] = useState(20)
+ const permissions = useAdminSessionStore(state => state.admin?.permissions)
+ const canView = Boolean(permissions?.includes('*') || permissions?.includes('wallet:view'))
+
+ const query = useMemo(
+ () => ({
+ order_no: applied.order_no.trim() || undefined,
+ date_type: applied.date_type,
+ settlement_status: settlementStatus,
+ start_date: applied.range?.[0]?.format('YYYY-MM-DD'),
+ end_date: applied.range?.[1]?.format('YYYY-MM-DD'),
+ page,
+ page_size: pageSize,
+ }),
+ [applied, settlementStatus, page, pageSize]
+ )
+
+ const detailsQuery = useQuery({
+ queryKey: ['admin-finance-details', query],
+ queryFn: () => fetchFinanceDetails(query),
+ enabled: canView,
+ placeholderData: keepPreviousData,
+ })
+
+ if (!canView) {
+ return (
+
+ )
+ }
+
+ return (
+
+ )
+}
diff --git a/frontend/src/features/admin/AdminPaymentsPage.tsx b/frontend/src/features/admin/AdminPaymentsPage.tsx
new file mode 100644
index 0000000..c6ae0d8
--- /dev/null
+++ b/frontend/src/features/admin/AdminPaymentsPage.tsx
@@ -0,0 +1,269 @@
+import { useMemo, useState } from 'react'
+import { keepPreviousData, useQuery } from '@tanstack/react-query'
+import { Alert, Button, Input, Select, Space, Tag, Typography, type TableColumnsType } from 'antd'
+import { ReloadOutlined } from '@ant-design/icons'
+
+import { fetchAdminPayments } from '@/features/admin/api'
+import { AdminPageHeader } from '@/features/admin/components/AdminPageHeader'
+import { DataTable } from '@/features/admin/components/DataTable'
+import { FilterBar, FilterField } from '@/features/admin/components/FilterBar'
+import type { AdminPaymentQuery, AdminPaymentRow } from '@/features/admin/types'
+import { useAdminSessionStore } from '@/stores/adminSession'
+import { formatDateTime, formatMoney, formatText } from '@/shared/utils/format'
+
+type Filters = Pick
+
+const emptyFilters: Filters = { order_no: '', biz_type: undefined, status: undefined, provider: undefined }
+
+const statusOptions = [
+ { value: 'pending', label: '待支付' },
+ { value: 'paid', label: '已支付' },
+ { value: 'failed', label: '支付失败' },
+ { value: 'closed', label: '已关闭' },
+]
+
+const bizTypeOptions = [
+ { value: 'order_pay', label: '订单支付' },
+ { value: 'main_recharge', label: '充值' },
+]
+
+const providerOptions = [
+ { value: 'leshua', label: '拉卡拉' },
+ { value: 'shuncheng', label: '顺诚' },
+ { value: 'mock', label: '模拟支付' },
+]
+
+const statusMeta: Record = {
+ pending: { label: '待支付', color: 'gold' },
+ paid: { label: '已支付', color: 'green' },
+ failed: { label: '支付失败', color: 'red' },
+ closed: { label: '已关闭', color: 'default' },
+}
+
+function statusTag(value?: string | null) {
+ if (!value) return 未知
+ const meta = statusMeta[value] ?? { label: value, color: 'default' }
+ return (
+
+ {meta.label}
+
+ )
+}
+
+function errorText(error: unknown) {
+ const response = (error as { response?: { data?: { message?: string } } })?.response
+ if (response?.data?.message) return response.data.message
+ return error instanceof Error ? error.message : '请求失败，请稍后重试'
+}
+
+const columns: TableColumnsType = [
+ {
+ title: '支付单号',
+ key: 'payment',
+ width: 240,
+ fixed: 'left',
+ render: (_, row) => (
+
+ {row.payment_no}
+ {formatText(row.order_no)}
+
+ ),
+ },
+ {
+ title: '用户',
+ key: 'user',
+ width: 170,
+ render: (_, row) => (
+
+ {formatText(row.user_phone)}
+ UID {row.user_id}
+
+ ),
+ },
+ {
+ title: '渠道 / 支付方式',
+ key: 'channel',
+ width: 170,
+ render: (_, row) => (
+
+ {formatText(row.provider)}
+ {formatText(row.pay_way)}
+
+ ),
+ },
+ {
+ title: '金额',
+ dataIndex: 'amount_cent',
+ width: 130,
+ align: 'right',
+ render: value => {formatMoney(value)},
+ },
+ {
+ title: '状态',
+ dataIndex: 'status',
+ width: 110,
+ render: value => statusTag(value),
+ },
+ {
+ title: '支付时间',
+ dataIndex: 'paid_at',
+ width: 170,
+ render: value => (value ? formatDateTime(value) : '—'),
+ },
+ {
+ title: '失败原因',
+ key: 'error',
+ render: (_, row) =>
+ row.error_message ? (
+
+ {row.error_code ? `${row.error_code} · ` : ''}
+ {row.error_message}
+
+ ) : (
+ —
+ ),
+ },
+ {
+ title: '创建时间',
+ dataIndex: 'created_at',
+ width: 170,
+ render: value => formatDateTime(value),
+ },
+]
+
+export function AdminPaymentsPage() {
+ const [filters, setFilters] = useState(emptyFilters)
+ const [applied, setApplied] = useState(emptyFilters)
+ const [page, setPage] = useState(1)
+ const [pageSize, setPageSize] = useState(20)
+ const permissions = useAdminSessionStore(state => state.admin?.permissions)
+ const canView = Boolean(permissions?.includes('*') || permissions?.includes('wallet:view'))
+
+ const query = useMemo(
+ () => ({
+ order_no: applied.order_no?.trim() || undefined,
+ biz_type: applied.biz_type,
+ status: applied.status,
+ provider: applied.provider,
+ page,
+ page_size: pageSize,
+ }),
+ [applied, page, pageSize]
+ )
+
+ const paymentsQuery = useQuery({
+ queryKey: ['admin-payments', query],
+ queryFn: () => fetchAdminPayments(query),
+ enabled: canView,
+ placeholderData: keepPreviousData,
+ })
+
+ if (!canView) {
+ return (
+
+ )
+ }
+
+ return (
+
+ )
+}
diff --git a/frontend/src/features/admin/AdminWalletLedgerPage.tsx b/frontend/src/features/admin/AdminWalletLedgerPage.tsx
new file mode 100644
index 0000000..ec9eb99
--- /dev/null
+++ b/frontend/src/features/admin/AdminWalletLedgerPage.tsx
@@ -0,0 +1,221 @@
+import { useState } from 'react'
+import { keepPreviousData, useQuery } from '@tanstack/react-query'
+import { Alert, Button, InputNumber, Select, Space, Tag, type TableColumnsType } from 'antd'
+import { ReloadOutlined } from '@ant-design/icons'
+
+import { fetchAdminWalletLedger } from '@/features/admin/api'
+import { AdminPageHeader } from '@/features/admin/components/AdminPageHeader'
+import { DataTable } from '@/features/admin/components/DataTable'
+import { FilterBar, FilterField } from '@/features/admin/components/FilterBar'
+import type { AdminWalletLedgerQuery, AdminWalletLedgerRow } from '@/features/admin/types'
+import { useAdminSessionStore } from '@/stores/adminSession'
+import { formatDateTime, formatMoney, formatText } from '@/shared/utils/format'
+
+const bizTypeOptions = [
+ { value: 'order', label: '订单结算' },
+ { value: 'order_pay', label: '订单支付' },
+ { value: 'withdraw_apply', label: '提现申请' },
+ { value: 'withdraw_complete', label: '提现到账' },
+ { value: 'admin_pickup', label: '线下提号' },
+ { value: 'invite_rebate', label: '邀请返利' },
+]
+
+function errorText(error: unknown) {
+ const response = (error as { response?: { data?: { message?: string } } })?.response
+ if (response?.data?.message) return response.data.message
+ return error instanceof Error ? error.message : '请求失败，请稍后重试'
+}
+
+const columns: TableColumnsType = [
+ {
+ title: '流水号',
+ key: 'ledger',
+ width: 240,
+ fixed: 'left',
+ render: (_, row) => (
+
+ {row.ledger_no}
+ {formatText(row.order_no)}
+
+ ),
+ },
+ {
+ title: '用户',
+ key: 'user',
+ width: 180,
+ render: (_, row) => (
+
+ {row.user_nickname || formatText(row.user_phone)}
+ UID {row.user_id}
+
+ ),
+ },
+ {
+ title: '业务',
+ dataIndex: 'biz_type',
+ width: 140,
+ render: value => {formatText(value)},
+ },
+ {
+ title: '方向',
+ dataIndex: 'direction',
+ width: 90,
+ render: value => (
+
+ {value === 'income' ? '入账' : '出账'}
+
+ ),
+ },
+ {
+ title: '金额',
+ dataIndex: 'amount_cent',
+ width: 130,
+ align: 'right',
+ render: (value: number, row) => (
+
+ {row.direction === 'income' ? '+' : '-'}
+ {formatMoney(Math.abs(value))}
+
+ ),
+ },
+ {
+ title: '变化后余额',
+ dataIndex: 'balance_after_cent',
+ width: 140,
+ align: 'right',
+ render: value => formatMoney(value),
+ },
+ {
+ title: '备注',
+ dataIndex: 'remark',
+ ellipsis: true,
+ render: value => formatText(value),
+ },
+ {
+ title: '时间',
+ dataIndex: 'created_at',
+ width: 170,
+ render: value => formatDateTime(value),
+ },
+]
+
+export function AdminWalletLedgerPage() {
+ const [filters, setFilters] = useState<{ user_id?: number; order_id?: number; biz_type?: string }>({})
+ const [applied, setApplied] = useState(filters)
+ const [page, setPage] = useState(1)
+ const [pageSize, setPageSize] = useState(20)
+ const permissions = useAdminSessionStore(state => state.admin?.permissions)
+ const canView = Boolean(permissions?.includes('*') || permissions?.includes('wallet:view'))
+
+ const query: AdminWalletLedgerQuery = {
+ user_id: applied.user_id,
+ order_id: applied.order_id,
+ biz_type: applied.biz_type,
+ page,
+ page_size: pageSize,
+ }
+
+ const ledgerQuery = useQuery({
+ queryKey: ['admin-wallet-ledger', query],
+ queryFn: () => fetchAdminWalletLedger(query),
+ enabled: canView,
+ placeholderData: keepPreviousData,
+ })
+
+ if (!canView) {
+ return (
+
+ )
+ }
+
+ return (
+
+
+ 共 {ledgerQuery.data?.total ?? 0} 条
+
+ }
+ extra={
+ }
+ loading={ledgerQuery.isFetching}
+ onClick={() => void ledgerQuery.refetch()}
+ >
+ 刷新
+
+ }
+ />
+
+ {
+ setPage(1)
+ setApplied(filters)
+ }}
+ onReset={() => {
+ setFilters({})
+ setApplied({})
+ setPage(1)
+ }}
+ >
+
+ setFilters(current => ({ ...current, user_id: value ?? undefined }))}
+ />
+
+
+ setFilters(current => ({ ...current, order_id: value ?? undefined }))}
+ />
+
+
+
+
+
+ {ledgerQuery.isError ? (
+
+ ) : null}
+
+
+ columns={columns}
+ dataSource={ledgerQuery.data?.items ?? []}
+ rowKey="id"
+ loading={ledgerQuery.isFetching}
+ total={ledgerQuery.data?.total ?? 0}
+ page={ledgerQuery.data?.page ?? page}
+ pageSize={ledgerQuery.data?.page_size ?? pageSize}
+ onPageChange={(nextPage, nextSize) => {
+ setPage(nextPage)
+ setPageSize(nextSize)
+ }}
+ emptyDescription="还没有钱包流水"
+ />
+
+
navigate('/m/profile')}>提现
+
+
+ 可用余额
+ {balanceQuery.isPending ? (
+
+ ) : (
+ {formatMoney(available)}
+ )}
+
+
+
+ {accounts.length === 0 && !accountsQuery.isPending ? (
+
+ ) : (
+ <>
+
+ {accountsQuery.isPending ? (
+
+ ) : (
+ setAccountId(values[0] ? Number(values[0]) : undefined)}
+ options={accounts.map(account => ({
+ label: `${paymentAccountTypeLabel(account.account_type)} · ${account.account_name}`,
+ description: account.account_no,
+ value: String(account.id),
+ }))}
+ />
+ )}
+
+
+
+
+
+ 可提现 {formatMoney(available)}，当前手续费 0%，到账金额以审核结果为准。
+
+
+
+
+ )}
+
+
+ {withdrawalsQuery.isPending ? (
+
+ ) : withdrawals.length === 0 ? (
+
+ ) : (
+
+ {withdrawals.map(item => {
+ const meta = withdrawalStatusMeta(item.status)
+ return (
+
+ {meta.label}
+
+ }
+ clickable={item.status === 'pending'}
+ onClick={() => {
+ if (item.status === 'pending') void cancel(item.id, item.withdraw_no)
+ }}
+ >
+ {formatMoney(item.amount_cent)}
+
+ {item.withdraw_no} · 到账 {formatMoney(item.actual_amount_cent)}
+
+
+ )
+ })}
+
+ )}
+
+
+
+ 可用 {formatMoney(balanceQuery.data?.available_balance_cent ?? 0)}
+ 冻结 {formatMoney(balanceQuery.data?.frozen_balance_cent ?? 0)}
+
+ }
+ extra={
+
+
+
+ }
+ loading={ledgerQuery.isFetching}
+ onClick={() => {
+ void ledgerQuery.refetch()
+ void balanceQuery.refetch()
+ }}
+ >
+ 刷新
+
+
+ }
+ />
+
+ {ledgerQuery.isError ? (
+
+ ) : null}
+
+
+ rowKey="id"
+ size="middle"
+ columns={columns}
+ dataSource={ledgerQuery.data?.items ?? []}
+ loading={ledgerQuery.isFetching}
+ scroll={{ x: 'max-content' }}
+ locale={{ emptyText: '还没有收益流水' }}
+ pagination={{
+ current: ledgerQuery.data?.page ?? page,
+ pageSize: ledgerQuery.data?.page_size ?? pageSize,
+ total: ledgerQuery.data?.total ?? 0,
+ showSizeChanger: true,
+ pageSizeOptions: ['10', '20', '50'],
+ showTotal: (count, range) => `第 ${range[0]}-${range[1]} 条 / 共 ${count} 条`,
+ onChange: (nextPage, nextSize) => {
+ setPage(nextPage)
+ setPageSize(nextSize)
+ },
+ }}
+ />
+
+
+ {row.title}
+ {row.listing_no}
+
+ ),
+ },
+ {
+ title: '状态',
+ key: 'status',
+ width: 200,
+ render: (_, row) => (
+
+ {orderStatusMeta(row.status).label}
+
+ {handoffStatusMeta(row.handoff_status).label}
+
+
+ ),
+ },
+ {
+ title: '商品信息',
+ key: 'listing',
+ render: (_, row) => (
+
+ {formatText(row.server_region)}
+ {formatText(row.login_platform)}
+
+ ),
+ },
+ {
+ title: '金额',
+ key: 'amount',
+ width: 150,
+ align: 'right',
+ render: (_, row) => (
+
+ {formatMoney(row.display_amount_cent)}
+ 押金 {formatMoney(row.deposit_amount_cent)}
+
+ ),
+ },
+ {
+ title: '创建时间',
+ dataIndex: 'created_at',
+ width: 170,
+ render: value => formatDateTime(value),
+ },
+ {
+ title: '操作',
+ key: 'actions',
+ width: 100,
+ fixed: 'right',
+ render: (_, row) => (
+ }
+ onClick={() => navigate(`/orders/${row.id}`)}
+ >
+ 处理
+
+ ),
+ },
+ ]
+
+ return (
+
+
+
+ JIEYOU · 卖家中心
+
+ 号主待办
+
+
+ 处理待交接、待确认结账与异常订单；点击订单进入详情完成后续操作。
+
+
+
+
+
+
+
+
+
+
+ 待交接
+ {metrics?.pending_handoff ?? 0}
+ 需要尽快上号
+
+
+ 待确认结账
+ {metrics?.pending_checkout ?? 0}
+ 核对消耗后确认
+
+
+ 异常订单
+ {metrics?.abnormal ?? 0}
+ 需与客服协同处理
+
+
+
+ {handoffsQuery.isError ? (
+
+ ) : null}
+
+
+
+ columns={columns}
+ dataSource={handoffsQuery.data?.items ?? []}
+ rowKey="id"
+ loading={handoffsQuery.isFetching}
+ total={handoffsQuery.data?.total ?? 0}
+ page={handoffsQuery.data?.page ?? page}
+ pageSize={handoffsQuery.data?.page_size ?? pageSize}
+ onPageChange={(nextPage, nextSize) => {
+ setPage(nextPage)
+ setPageSize(nextSize)
+ }}
+ emptyDescription="当前没有需要处理的订单"
+ />
+
+
+ {row.pickup_no}
+ {formatText(row.listing_no)}
+
+ ),
+ },
+ {
+ title: '账号',
+ key: 'account',
+ render: (_, row) => (
+
+ {formatText(row.account_title)}
+
+ {formatText(row.server_region)} · {formatText(row.login_platform)}
+
+
+ ),
+ },
+ {
+ title: '操作人 / 平台',
+ key: 'operator',
+ width: 170,
+ render: (_, row) => (
+
+ {formatText(row.operator)}
+ {formatText(row.platform)}
+
+ ),
+ },
+ {
+ title: '订单金额',
+ dataIndex: 'order_amount_cent',
+ width: 130,
+ align: 'right',
+ render: value => formatMoney(value),
+ },
+ {
+ title: '应结算',
+ key: 'settle',
+ width: 150,
+ align: 'right',
+ render: (_, row) => (
+
+ {formatMoney(row.effective_settle_amount_cent)}
+ 原 {formatMoney(row.settle_amount_cent)}
+
+ ),
+ },
+ {
+ title: '状态',
+ key: 'status',
+ width: 190,
+ render: (_, row) => {
+ const status = statusMeta[row.status] ?? { label: row.status || '未知', color: 'default' }
+ const settlement =
+ settlementMeta[row.offline_settlement_status] ?? {
+ label: row.offline_settlement_status || '—',
+ color: 'default',
+ }
+ return (
+
+
+ {status.label}
+
+
+ {settlement.label}
+
+
+ )
+ },
+ },
+ {
+ title: '创建时间',
+ dataIndex: 'created_at',
+ width: 170,
+ render: value => formatDateTime(value),
+ },
+ {
+ title: '完成时间',
+ dataIndex: 'completed_at',
+ width: 170,
+ render: value => (value ? formatDateTime(value) : '—'),
+ },
+]
+
+export function SellerPickupsPage() {
+ const user = useSessionStore(state => state.user)
+ const [status, setStatus] = useState('')
+ const [page, setPage] = useState(1)
+ const [pageSize, setPageSize] = useState(20)
+
+ const pickupsQuery = useQuery({
+ queryKey: ['seller-pickups', status, page, pageSize],
+ queryFn: () => fetchSellerPickups(page, pageSize, status),
+ enabled: Boolean(user),
+ placeholderData: keepPreviousData,
+ })
+
+ return (
+
+
+ 共 {pickupsQuery.data?.total ?? 0} 条
+
+ }
+ extra={
+
+
+ }
+ />
+
+ {pickupsQuery.isError ? (
+
+ ) : null}
+
+
+ columns={columns}
+ dataSource={pickupsQuery.data?.items ?? []}
+ rowKey="id"
+ loading={pickupsQuery.isFetching}
+ total={pickupsQuery.data?.total ?? 0}
+ page={pickupsQuery.data?.page ?? page}
+ pageSize={pickupsQuery.data?.page_size ?? pageSize}
+ onPageChange={(nextPage, nextSize) => {
+ setPage(nextPage)
+ setPageSize(nextSize)
+ }}
+ emptyDescription="还没有线下提号记录"
+ />
+
+
+
+ JIEYOU · 资金
+
+ 收款账户
+
+
+ 提现前需维护至少一个收款账户；默认账户会在提现表单中自动选中。
+
+
+
+ 可用账户
+ {accounts.length}
+
+ } onClick={openCreate}>
+ 添加账户
+
+
+
+
+
+
+
}
+ loading={accountsQuery.isFetching}
+ onClick={() => void accountsQuery.refetch()}
+ >
+ 刷新
+
+ }
+ >
+ {accounts.length === 0 ? (
+
+ ) : (
+
+ {accounts.map(account => (
+
+
+
+
+ {paymentAccountTypeLabel(account.account_type)}
+
+ {account.is_default ? (
+
+ 默认
+
+ ) : null}
+
+ {account.account_no}
+
+
{account.account_name}
+ {account.bank_name ? (
+
+ {account.bank_name}
+ {account.bank_branch ? ` · ${account.bank_branch}` : ''}
+
+ ) : null}
+
+ 添加于 {formatDateTime(account.created_at)}
+
+ {account.certificate_urls?.length ? (
+
+ 凭证 {account.certificate_urls.length} 张
+
+ ) : null}
+
+ : }
+ disabled={account.is_default}
+ onClick={() => void setDefault(account)}
+ >
+ 设为默认
+
+ }
+ onClick={() => openEdit(account)}
+ >
+ 编辑
+
+ }
+ onClick={() => remove(account)}
+ >
+ 删除
+
+
+
+ ))}
+
+ )}
+
+
+
void save()}
+ onCancel={() => (submitting ? undefined : setEditorOpen(false))}
+ maskClosable={!submitting}
+ >
+
+
+
+
+ 当前共 {accounts.length} 个账户，其中默认账户 {accounts.filter(item => item.is_default).length} 个
+ {formatText('')}
+
+
+
+
+ JIEYOU · 资金
+
+ 资金账户
+
+
+ 查看卖家结算收入、冻结押金与每一笔资金变化；提现需先维护收款账户。
+
+
+
+ 当前可用
+ {formatMoney(account?.available_balance_cent ?? 0)}
+
+
+
+
+
+
+
+
+
+ 可用余额
+ {formatMoney(account?.available_balance_cent ?? 0)}
+ 可随时申请提现
+
+
+ 冻结余额
+ {formatMoney(account?.frozen_balance_cent ?? 0)}
+ 提现处理中或订单押金暂扣
+
+
+ 账户状态
+ {walletStatusLabel(account?.status)}
+ 异常时请联系客服核实
+
+
+
+ {balanceQuery.isError ? (
+
+ ) : null}
+
+
+
+ 资金流水
+
+
+ 共 {ledger?.total ?? 0} 条记录，最近变动优先展示。
+
+
+ {formatMoney(row.actual_amount_cent)}
+ 手续费 {formatMoney(row.fee_cent)}
+
+ ),
+ },
+ {
+ title: '收款方式',
+ key: 'account',
+ width: 190,
+ render: (_, row) => (
+
+ {paymentAccountTypeLabel(row.account_type)}
+
+ {formatText(row.account_name)} · {formatText(row.account_no)}
+
+
+ ),
+ },
+ {
+ title: '状态',
+ dataIndex: 'status',
+ width: 110,
+ render: value => {
+ const meta = withdrawalStatusMeta(value)
+ return (
+
+ {meta.label}
+
+ )
+ },
+ },
+ {
+ title: '备注',
+ dataIndex: 'review_remark',
+ ellipsis: true,
+ render: value => formatText(value),
+ },
+ {
+ title: '申请时间',
+ dataIndex: 'created_at',
+ width: 170,
+ render: value => formatDateTime(value),
+ },
+]
+
+export function WithdrawalPage() {
+ const navigate = useNavigate()
+ const { message, modal } = App.useApp()
+ const queryClient = useQueryClient()
+ const [form] = Form.useForm()
+ const [page, setPage] = useState(1)
+ const [pageSize, setPageSize] = useState(PAGE_SIZE)
+ const [submitting, setSubmitting] = useState(false)
+ const user = useSessionStore(state => state.user)
+ const amountYuan = Form.useWatch('amount_yuan', form)
+
+ const balanceQuery = useQuery({
+ queryKey: ['wallet-balance'],
+ queryFn: fetchWalletBalance,
+ enabled: Boolean(user),
+ })
+ const accountsQuery = useQuery({
+ queryKey: ['payment-accounts', 1],
+ queryFn: () => fetchPaymentAccounts(1, 50),
+ enabled: Boolean(user),
+ })
+ const withdrawalsQuery = useQuery({
+ queryKey: ['withdrawals', page, pageSize],
+ queryFn: () => fetchWithdrawals(page, pageSize),
+ enabled: Boolean(user),
+ placeholderData: keepPreviousData,
+ })
+
+ const available = balanceQuery.data?.available_balance_cent ?? 0
+ const accounts: PaymentAccount[] = accountsQuery.data?.items ?? []
+ const withdrawals = withdrawalsQuery.data
+
+ const accountOptions = useMemo(
+ () =>
+ accounts.map(account => ({
+ value: account.id,
+ label: `${paymentAccountTypeLabel(account.account_type)} · ${account.account_name} (${account.account_no})`,
+ })),
+ [accounts]
+ )
+
+ useEffect(() => {
+ if (form.getFieldValue('payment_account_id')) return
+ const preferred = accounts.find(item => item.is_default) ?? accounts[0]
+ if (preferred) form.setFieldValue('payment_account_id', preferred.id)
+ }, [accounts, form])
+
+ const submit = async () => {
+ const values = await form.validateFields()
+ const amountCent = Math.round(Number(values.amount_yuan) * 100)
+ if (amountCent <= 0) {
+ message.warning('提现金额必须大于 0')
+ return
+ }
+ if (amountCent > available) {
+ message.warning('提现金额不能超过可用余额')
+ return
+ }
+ setSubmitting(true)
+ try {
+ await createWithdrawal({
+ payment_account_id: values.payment_account_id,
+ amount_cent: amountCent,
+ })
+ message.success('提现申请已提交，等待审核')
+ form.setFieldValue('amount_yuan', undefined)
+ await Promise.all([
+ queryClient.invalidateQueries({ queryKey: ['withdrawals'] }),
+ queryClient.invalidateQueries({ queryKey: ['wallet-balance'] }),
+ queryClient.invalidateQueries({ queryKey: ['wallet-ledger'] }),
+ ])
+ } catch (error) {
+ message.error(errorText(error))
+ } finally {
+ setSubmitting(false)
+ }
+ }
+
+ const cancel = (record: WithdrawalRecord) => {
+ modal.confirm({
+ title: `确认取消提现「${record.withdraw_no}」？`,
+ content: '取消后冻结金额会退回可用余额，需重新提交提现申请。',
+ okText: '取消提现',
+ okButtonProps: { danger: true },
+ cancelText: '返回',
+ onOk: async () => {
+ try {
+ await cancelWithdrawal(record.id)
+ message.success('提现已取消')
+ await Promise.all([
+ queryClient.invalidateQueries({ queryKey: ['withdrawals'] }),
+ queryClient.invalidateQueries({ queryKey: ['wallet-balance'] }),
+ ])
+ } catch (error) {
+ message.error(errorText(error))
+ }
+ },
+ })
+ }
+
+ const rows: WithdrawalRecord[] = withdrawals?.items ?? []
+
+ return (
+
+
+
+ JIEYOU · 资金
+
+ 申请提现
+
+
+ 提现申请提交后进入人工审核，审核通过后由财务打款到所选收款账户。
+
+
+
+ 当前可用
+ {formatMoney(available)}
+
+
+
+
+
+
+
+ {accounts.length === 0 ? (
+
navigate('/wallet/payment-accounts')}>
+ 去添加
+
+ }
+ />
+ ) : null}
+
+
+
+
+
+ }
+ loading={withdrawalsQuery.isFetching}
+ onClick={() => void withdrawalsQuery.refetch()}
+ >
+ 刷新
+
+ }
+ >
+
+ rowKey="id"
+ size="middle"
+ columns={[
+ ...columns,
+ {
+ title: '操作',
+ key: 'actions',
+ width: 110,
+ fixed: 'right',
+ render: (_, row) =>
+ row.status === 'pending' ? (
+
+ ) : (
+ —
+ ),
+ },
+ ]}
+ dataSource={rows}
+ loading={withdrawalsQuery.isFetching}
+ scroll={{ x: 'max-content' }}
+ locale={{ emptyText: '还没有提现记录' }}
+ pagination={{
+ current: withdrawals?.page ?? page,
+ pageSize: withdrawals?.page_size ?? pageSize,
+ total: withdrawals?.total ?? 0,
+ showSizeChanger: true,
+ pageSizeOptions: ['10', '20', '50'],
+ showTotal: (count, range) => `第 ${range[0]}-${range[1]} 条 / 共 ${count} 条`,
+ onChange: (nextPage, nextSize) => {
+ setPage(nextPage)
+ setPageSize(nextSize)
+ },
+ }}
+ />
+
+