feat: 按文档对接账务管理下页面逻辑与字段
This commit is contained in:
@@ -0,0 +1,25 @@
|
||||
/**
|
||||
* 支付流水 API
|
||||
* 对应 OpenAPI: GET /admin/finance/paymentFlow/page
|
||||
*/
|
||||
import { get } from '@/utils/request';
|
||||
import { USE_MOCK, MOCK_DELAY } from '@/config/mock';
|
||||
import { buildMockPaymentFlowPage } from '@/config/mock/paymentFlow';
|
||||
import type { PaymentFlowQueryParams, PaymentFlowVO, PageData, ApiResult } from './types';
|
||||
|
||||
export type { PaymentFlowVO, PaymentFlowQueryParams, PageData, ApiResult } from './types';
|
||||
|
||||
const delay = (ms: number) => new Promise<void>((r) => setTimeout(r, ms));
|
||||
|
||||
/** GET /admin/finance/paymentFlow/page — 支付流水分页 */
|
||||
export async function getPaymentFlowList(
|
||||
params: PaymentFlowQueryParams,
|
||||
): Promise<ApiResult<PageData<PaymentFlowVO>>> {
|
||||
if (USE_MOCK) {
|
||||
await delay(MOCK_DELAY);
|
||||
const page = Number(params.page) || 1;
|
||||
const limit = Number(params.limit) || 10;
|
||||
return { code: 200, msg: 'success', data: buildMockPaymentFlowPage(page, limit, params) };
|
||||
}
|
||||
return get('/admin/finance/paymentFlow/page', params as Record<string, any>);
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
/**
|
||||
* 支付流水 — 类型定义
|
||||
* 对应 OpenAPI: GET /admin/finance/paymentFlow/page
|
||||
*/
|
||||
|
||||
/** 支付流水列表项 */
|
||||
export interface PaymentFlowVO {
|
||||
/** 流水号 */
|
||||
serialNo: string;
|
||||
/** 订单编号 */
|
||||
orderNo: string;
|
||||
/** 类型:1=报名,2=取消报名 */
|
||||
type: number;
|
||||
/** 用户昵称 */
|
||||
nickname: string;
|
||||
/** 用户手机�� */
|
||||
phone: string;
|
||||
/** 订单金额("0.00"格式) */
|
||||
amount: string;
|
||||
/** 订单创建时间 */
|
||||
createDate: string;
|
||||
}
|
||||
|
||||
/** 支付流水查询参数 */
|
||||
export interface PaymentFlowQueryParams {
|
||||
page?: string;
|
||||
limit?: string;
|
||||
/** 订单创建开始时间 yyyy-MM-dd */
|
||||
createDateBegin?: string;
|
||||
/** 订单创建结束时间 yyyy-MM-dd */
|
||||
createDateEnd?: string;
|
||||
/** 用户昵称 */
|
||||
nickname?: string;
|
||||
/** 手机号 */
|
||||
phone?: string;
|
||||
/** 类型:1/2 */
|
||||
type?: string;
|
||||
}
|
||||
|
||||
export interface PageData<T> {
|
||||
total: number;
|
||||
list: T[];
|
||||
}
|
||||
export interface ApiResult<T> {
|
||||
code: number;
|
||||
msg: string;
|
||||
data: T;
|
||||
}
|
||||
@@ -0,0 +1,53 @@
|
||||
/**
|
||||
* 用户钱包 API
|
||||
* OpenAPI: GET /admin/finance/wallet/summary, GET /admin/finance/wallet/page
|
||||
*/
|
||||
import { get } from '@/utils/request';
|
||||
import { USE_MOCK, MOCK_DELAY } from '@/config/mock';
|
||||
import { buildMockWalletPage } from '@/config/mock/walletList';
|
||||
import { buildMockWalletTransactionPage } from '@/config/mock/walletTransactions';
|
||||
import type {
|
||||
WalletQueryParams,
|
||||
WalletSummaryVO,
|
||||
WalletTransactionQueryParams,
|
||||
WalletTransactionVO,
|
||||
PageData,
|
||||
ApiResult,
|
||||
} from './types';
|
||||
|
||||
export type {
|
||||
WalletSummaryVO,
|
||||
WalletQueryParams,
|
||||
WalletTransactionVO,
|
||||
WalletTransactionQueryParams,
|
||||
PageData,
|
||||
ApiResult,
|
||||
} from './types';
|
||||
|
||||
const delay = (ms: number) => new Promise<void>((r) => setTimeout(r, ms));
|
||||
|
||||
/** GET /admin/finance/wallet/summary — 钱包列表分页 */
|
||||
export async function getWalletList(
|
||||
params: WalletQueryParams,
|
||||
): Promise<ApiResult<PageData<WalletSummaryVO>>> {
|
||||
if (USE_MOCK) {
|
||||
await delay(MOCK_DELAY);
|
||||
const page = Number(params.page) || 1;
|
||||
const limit = Number(params.limit) || 10;
|
||||
return { code: 200, msg: 'success', data: buildMockWalletPage(page, limit, params) };
|
||||
}
|
||||
return get('/admin/finance/wallet/summary', params as Record<string, any>);
|
||||
}
|
||||
|
||||
/** GET /admin/finance/wallet/page — 交易明细分页 */
|
||||
export async function getWalletTransactionList(
|
||||
params: WalletTransactionQueryParams,
|
||||
): Promise<ApiResult<PageData<WalletTransactionVO>>> {
|
||||
if (USE_MOCK) {
|
||||
await delay(MOCK_DELAY);
|
||||
const page = Number(params.page) || 1;
|
||||
const limit = Number(params.limit) || 10;
|
||||
return { code: 200, msg: 'success', data: buildMockWalletTransactionPage(page, limit, params) };
|
||||
}
|
||||
return get('/admin/finance/wallet/page', params as Record<string, any>);
|
||||
}
|
||||
@@ -0,0 +1,92 @@
|
||||
/**
|
||||
* 用户钱包 — 类型定义
|
||||
* 对应 OpenAPI: GET /admin/finance/wallet/summary
|
||||
*/
|
||||
|
||||
/** 钱包列表项 */
|
||||
export interface WalletSummaryVO {
|
||||
/** 用户ID */
|
||||
userId: number;
|
||||
/** 用户昵称 */
|
||||
userNickname: string;
|
||||
/** 手机号 */
|
||||
phone: string;
|
||||
/** 余额("0.00"格式) */
|
||||
amount: string;
|
||||
/** 冻结金额("0.00"格式) */
|
||||
frozenAmount: string;
|
||||
/** 累计成功提现金额("0.00"格式) */
|
||||
withdrawalAmount: string;
|
||||
/** 汇总行-总余额 */
|
||||
totalAmount: string;
|
||||
/** 汇总行-总冻结金额 */
|
||||
totalFrozenAmount: string;
|
||||
/** 汇总行-总累计提现 */
|
||||
totalWithdrawalAmount: string;
|
||||
}
|
||||
|
||||
/** 钱包列表查询参数 */
|
||||
export interface WalletQueryParams {
|
||||
page?: string;
|
||||
limit?: string;
|
||||
/** 用户昵称,模糊搜索 */
|
||||
nickname?: string;
|
||||
/** 手机号 */
|
||||
phone?: string;
|
||||
/** 余额最小值 */
|
||||
amountBegin?: string;
|
||||
/** 余额最大值 */
|
||||
amountEnd?: string;
|
||||
}
|
||||
|
||||
export interface PageData<T> {
|
||||
total: number;
|
||||
list: T[];
|
||||
}
|
||||
export interface ApiResult<T> {
|
||||
code: number;
|
||||
msg: string;
|
||||
data: T;
|
||||
}
|
||||
|
||||
// ============================================================
|
||||
// 交易明细(GET /admin/finance/wallet/page)
|
||||
// ============================================================
|
||||
|
||||
/** 交易明细列表项 */
|
||||
export interface WalletTransactionVO {
|
||||
/** 类型:1=报名入账,2=提现出账,3=退款出账 */
|
||||
type: number;
|
||||
/** 金额("0.00"格式,入账为+,出账为-) */
|
||||
amount: string;
|
||||
/** 余额("0.00"格式) */
|
||||
afterAmount: string;
|
||||
/** 可提现余额("0.00"格式) */
|
||||
withdrawAmount: string;
|
||||
/** 冻结金额("0.00"格式) */
|
||||
freezeAmount: string;
|
||||
/** 冻结时间 */
|
||||
freezeTime: string;
|
||||
/** 解冻时间 */
|
||||
unfreezeTime: string;
|
||||
/** 关联单号 */
|
||||
orderNo: string;
|
||||
/** 时间 */
|
||||
createDate: string;
|
||||
}
|
||||
|
||||
/** 交易明细查询参数 */
|
||||
export interface WalletTransactionQueryParams {
|
||||
page?: string;
|
||||
limit?: string;
|
||||
/** 用户ID */
|
||||
userId?: string;
|
||||
/** 创建开始时间 yyyy-MM-dd */
|
||||
createDateBegin?: string;
|
||||
/** 创建结束时间 yyyy-MM-dd */
|
||||
createDateEnd?: string;
|
||||
/** 类型:1/2/3 */
|
||||
type?: string;
|
||||
/** 状态:1=已解冻,2=冻结中,3=正常 */
|
||||
status?: string;
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
/**
|
||||
* 提现管理 API
|
||||
* 对应 OpenAPI: GET /admin/finance/withdraw/page, GET /admin/finance/withdraw/info
|
||||
*/
|
||||
import { get, post } from '@/utils/request';
|
||||
import { USE_MOCK, MOCK_DELAY } from '@/config/mock';
|
||||
import { buildMockWithdrawPage } from '@/config/mock/withdrawList';
|
||||
import { buildMockWithdrawInfo } from '@/config/mock/withdrawInfo';
|
||||
import type { WithdrawQueryParams, WithdrawVO, WithdrawInfoVO, PageData, ApiResult } from './types';
|
||||
|
||||
export type { WithdrawVO, WithdrawInfoVO, WithdrawQueryParams, PageData, ApiResult } from './types';
|
||||
|
||||
const delay = (ms: number) => new Promise<void>((r) => setTimeout(r, ms));
|
||||
|
||||
/** GET /admin/finance/withdraw/page — 提现列表分页 */
|
||||
export async function getWithdrawList(
|
||||
params: WithdrawQueryParams,
|
||||
): Promise<ApiResult<PageData<WithdrawVO>>> {
|
||||
if (USE_MOCK) {
|
||||
await delay(MOCK_DELAY);
|
||||
const page = Number(params.page) || 1;
|
||||
const limit = Number(params.limit) || 10;
|
||||
return {
|
||||
code: 200,
|
||||
msg: 'success',
|
||||
data: buildMockWithdrawPage(page, limit, params),
|
||||
};
|
||||
}
|
||||
return get('/admin/finance/withdraw/page', params as Record<string, any>);
|
||||
}
|
||||
|
||||
/** GET /admin/finance/withdraw/info?id=xxx — 提现详情 */
|
||||
export async function getWithdrawInfo(id: number): Promise<ApiResult<WithdrawInfoVO>> {
|
||||
if (USE_MOCK) {
|
||||
await delay(MOCK_DELAY);
|
||||
return { code: 200, msg: 'success', data: buildMockWithdrawInfo(id) };
|
||||
}
|
||||
return get('/admin/finance/withdraw/info', { id: String(id) });
|
||||
}
|
||||
|
||||
/** 提现审核请求参数 */
|
||||
export interface WithdrawAuditParams {
|
||||
/** 提现ID */
|
||||
id: string;
|
||||
/** 审核结果:1=通过,2=驳回 */
|
||||
audit: string;
|
||||
/** 审核内容 */
|
||||
checkMsg: string;
|
||||
/** 审核图片(逗号拼接的 URL) */
|
||||
checkImg: string;
|
||||
}
|
||||
|
||||
/** POST /admin/finance/withdraw/audit — 审核提现 */
|
||||
export async function postWithdrawAudit(params: WithdrawAuditParams): Promise<ApiResult<null>> {
|
||||
return post('/admin/finance/withdraw/audit', params);
|
||||
}
|
||||
@@ -0,0 +1,104 @@
|
||||
/**
|
||||
* 提现管理 — 类型定义
|
||||
* 对应 OpenAPI: GET /admin/finance/withdraw/page
|
||||
*/
|
||||
|
||||
/** 提现列表项(对齐 TournamentFinanceWithdrawVO) */
|
||||
export interface WithdrawVO {
|
||||
/** 提现ID */
|
||||
id: number;
|
||||
/** 申请人昵称 */
|
||||
nickname: string;
|
||||
/** 申请人手机号 */
|
||||
phone: string;
|
||||
/** 申请人真实姓名 */
|
||||
realName: string;
|
||||
/** 提现类型(固定"银行卡") */
|
||||
withdrawType: string;
|
||||
/** 提现金额("0.00"格式) */
|
||||
withdrawAmount: string;
|
||||
/** 到账金额("0.00"格式) */
|
||||
receivedAmount: string;
|
||||
/** 审核状态:0=待审核,1=审核通过,2=审核驳回 */
|
||||
auditStatus: number;
|
||||
/** 到账状态:0=未支付,1=支付成功,2=支付失败 */
|
||||
payStatus: number;
|
||||
/** 流水单号 */
|
||||
serialNumber: string;
|
||||
/** 申请时间 */
|
||||
createDate: string;
|
||||
}
|
||||
|
||||
/** 提现列表查询参数 */
|
||||
export interface WithdrawQueryParams {
|
||||
page?: string;
|
||||
limit?: string;
|
||||
/** 提现申请人昵称 */
|
||||
nickname?: string;
|
||||
/** 提现申请人手机号 */
|
||||
phone?: string;
|
||||
/** 提现申请人真实姓名 */
|
||||
realName?: string;
|
||||
/** 审核状态:0/1/2 */
|
||||
auditStatus?: string;
|
||||
/** 到账状态:0/1/2 */
|
||||
payStatus?: string;
|
||||
}
|
||||
|
||||
export interface PageData<T> {
|
||||
total: number;
|
||||
list: T[];
|
||||
}
|
||||
export interface ApiResult<T> {
|
||||
code: number;
|
||||
msg: string;
|
||||
data: T;
|
||||
}
|
||||
|
||||
/** 提现详情(对齐 TournamentFinanceWithdrawInfoVO) */
|
||||
export interface WithdrawInfoVO {
|
||||
/** 申请人昵称 */
|
||||
nickname: string;
|
||||
/** 申请人手机号 */
|
||||
phone: string;
|
||||
/** 申请人真实姓名 */
|
||||
realName: string;
|
||||
/** 申请时间 */
|
||||
createDate: string;
|
||||
/** 提现类型(固定"银行卡") */
|
||||
withdrawType: string;
|
||||
/** 提现金额("0.00"格式) */
|
||||
withdrawAmount: string;
|
||||
/** 费率 */
|
||||
feeRate: string;
|
||||
/** 手续费 */
|
||||
feeAmount: string;
|
||||
/** 到账金额("0.00"格式) */
|
||||
receivedAmount: string;
|
||||
/** 审核状态:0=待审核,1=审核通过,2=审核驳回 */
|
||||
auditStatus: number;
|
||||
/** 到账状态:0=未支付,1=支付成功,2=支付失败 */
|
||||
payStatus: number;
|
||||
/** 银行卡类型:1=个人 */
|
||||
bankCardType: number;
|
||||
/** 持卡人真实姓名 */
|
||||
cardHolderName: string;
|
||||
/** 银行卡号 */
|
||||
bankCardNumber: string;
|
||||
/** 开户行名称 */
|
||||
bankName: string;
|
||||
/** 支行名称 */
|
||||
branchName: string;
|
||||
/** 支付时间 */
|
||||
payTime: string;
|
||||
/** 订单号 */
|
||||
orderNo: string;
|
||||
/** 审核时间 */
|
||||
auditDate: string;
|
||||
/** 审核人昵称 */
|
||||
auditNickname: string;
|
||||
/** 审核图片 */
|
||||
auditImg: string;
|
||||
/** 审核图片列表 */
|
||||
auditImgList: string[];
|
||||
}
|
||||
@@ -0,0 +1,149 @@
|
||||
/**
|
||||
* 支付流水假数据
|
||||
* 对应接口:GET /admin/finance/paymentFlow/page
|
||||
*/
|
||||
import type { PaymentFlowVO, PaymentFlowQueryParams, PageData } from '@/api/payments';
|
||||
|
||||
const MOCK_LIST: PaymentFlowVO[] = [
|
||||
{
|
||||
serialNo: 'FL20260730001',
|
||||
orderNo: 'OD20260730001',
|
||||
type: 1,
|
||||
nickname: '张三',
|
||||
phone: '12345678997',
|
||||
amount: '99.00',
|
||||
createDate: '2026-07-30 08:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: '',
|
||||
orderNo: '',
|
||||
type: 2,
|
||||
nickname: '李四',
|
||||
phone: '12345678998',
|
||||
amount: '100.00',
|
||||
createDate: '2026-07-30 07:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: 'FL20260729002',
|
||||
orderNo: 'OD20260729002',
|
||||
type: 1,
|
||||
nickname: '王五',
|
||||
phone: '12345678998',
|
||||
amount: '199.00',
|
||||
createDate: '2026-07-29 16:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: '',
|
||||
orderNo: '',
|
||||
type: 2,
|
||||
nickname: '赵六',
|
||||
phone: '13800138000',
|
||||
amount: '50.00',
|
||||
createDate: '2026-07-29 15:20:00',
|
||||
},
|
||||
{
|
||||
serialNo: 'FL20260728003',
|
||||
orderNo: 'OD20260728003',
|
||||
type: 1,
|
||||
nickname: '钱七',
|
||||
phone: '13900139001',
|
||||
amount: '350.00',
|
||||
createDate: '2026-07-28 14:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: '',
|
||||
orderNo: '',
|
||||
type: 2,
|
||||
nickname: '孙八',
|
||||
phone: '18600186001',
|
||||
amount: '120.00',
|
||||
createDate: '2026-07-28 10:30:00',
|
||||
},
|
||||
{
|
||||
serialNo: 'FL20260727004',
|
||||
orderNo: 'OD20260727004',
|
||||
type: 1,
|
||||
nickname: '周九',
|
||||
phone: '15200152000',
|
||||
amount: '88.00',
|
||||
createDate: '2026-07-27 09:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: 'FL20260727005',
|
||||
orderNo: 'OD20260727005',
|
||||
type: 1,
|
||||
nickname: '吴十',
|
||||
phone: '17000170001',
|
||||
amount: '520.00',
|
||||
createDate: '2026-07-27 08:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: '',
|
||||
orderNo: '',
|
||||
type: 2,
|
||||
nickname: '李四',
|
||||
phone: '12345678998',
|
||||
amount: '200.00',
|
||||
createDate: '2026-07-26 17:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: 'FL20260726006',
|
||||
orderNo: 'OD20260726006',
|
||||
type: 1,
|
||||
nickname: '张三',
|
||||
phone: '12345678997',
|
||||
amount: '128.00',
|
||||
createDate: '2026-07-26 11:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: '',
|
||||
orderNo: '',
|
||||
type: 2,
|
||||
nickname: '王五',
|
||||
phone: '12345678998',
|
||||
amount: '80.00',
|
||||
createDate: '2026-07-25 13:00:00',
|
||||
},
|
||||
{
|
||||
serialNo: 'FL20260725007',
|
||||
orderNo: 'OD20260725007',
|
||||
type: 1,
|
||||
nickname: '赵六',
|
||||
phone: '13800138000',
|
||||
amount: '680.00',
|
||||
createDate: '2026-07-25 10:00:00',
|
||||
},
|
||||
];
|
||||
|
||||
function inDateRange(date: string, begin?: string, end?: string): boolean {
|
||||
if (!begin && !end) return true;
|
||||
const d = date.slice(0, 10);
|
||||
if (begin && d < begin) return false;
|
||||
if (end && d > end) return false;
|
||||
return true;
|
||||
}
|
||||
|
||||
export function buildMockPaymentFlowPage(
|
||||
page: number,
|
||||
limit: number,
|
||||
params: PaymentFlowQueryParams,
|
||||
): PageData<PaymentFlowVO> {
|
||||
let filtered = [...MOCK_LIST];
|
||||
|
||||
if (params.nickname) {
|
||||
filtered = filtered.filter((item) => item.nickname.includes(params.nickname!));
|
||||
}
|
||||
if (params.phone) {
|
||||
filtered = filtered.filter((item) => item.phone.includes(params.phone!));
|
||||
}
|
||||
if (params.type) {
|
||||
filtered = filtered.filter((item) => item.type === Number(params.type));
|
||||
}
|
||||
filtered = filtered.filter((item) =>
|
||||
inDateRange(item.createDate, params.createDateBegin, params.createDateEnd),
|
||||
);
|
||||
|
||||
const total = filtered.length;
|
||||
const start = (page - 1) * limit;
|
||||
return { total, list: filtered.slice(start, start + limit) };
|
||||
}
|
||||
@@ -0,0 +1,185 @@
|
||||
/**
|
||||
* 钱包列表假数据
|
||||
* 对应接口:GET /admin/finance/wallet/summary
|
||||
*/
|
||||
import type { WalletSummaryVO, WalletQueryParams, PageData } from '@/api/wallet';
|
||||
|
||||
const MOCK_LIST: WalletSummaryVO[] = [
|
||||
{
|
||||
userId: 1001,
|
||||
userNickname: '张三',
|
||||
phone: '12345678997',
|
||||
amount: '0.00',
|
||||
frozenAmount: '0.00',
|
||||
withdrawalAmount: '0.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1002,
|
||||
userNickname: '李四',
|
||||
phone: '12345678998',
|
||||
amount: '350.00',
|
||||
frozenAmount: '200.00',
|
||||
withdrawalAmount: '1450.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1003,
|
||||
userNickname: '王五',
|
||||
phone: '12345678999',
|
||||
amount: '1280.00',
|
||||
frozenAmount: '0.00',
|
||||
withdrawalAmount: '800.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1004,
|
||||
userNickname: '赵六',
|
||||
phone: '13800138000',
|
||||
amount: '560.00',
|
||||
frozenAmount: '100.00',
|
||||
withdrawalAmount: '200.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1005,
|
||||
userNickname: '钱七',
|
||||
phone: '13900139001',
|
||||
amount: '4200.00',
|
||||
frozenAmount: '1500.00',
|
||||
withdrawalAmount: '5600.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1006,
|
||||
userNickname: '孙八',
|
||||
phone: '12345678997',
|
||||
amount: '880.00',
|
||||
frozenAmount: '0.00',
|
||||
withdrawalAmount: '300.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1007,
|
||||
userNickname: '周九',
|
||||
phone: '17000170001',
|
||||
amount: '2100.00',
|
||||
frozenAmount: '800.00',
|
||||
withdrawalAmount: '3200.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1008,
|
||||
userNickname: '吴十',
|
||||
phone: '18900189000',
|
||||
amount: '650.00',
|
||||
frozenAmount: '0.00',
|
||||
withdrawalAmount: '450.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1009,
|
||||
userNickname: '郑十一',
|
||||
phone: '15200152000',
|
||||
amount: '980.00',
|
||||
frozenAmount: '200.00',
|
||||
withdrawalAmount: '1200.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1010,
|
||||
userNickname: '冯十二',
|
||||
phone: '18600186001',
|
||||
amount: '320.00',
|
||||
frozenAmount: '50.00',
|
||||
withdrawalAmount: '100.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1011,
|
||||
userNickname: '褚十三',
|
||||
phone: '13500135000',
|
||||
amount: '5800.00',
|
||||
frozenAmount: '0.00',
|
||||
withdrawalAmount: '2000.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
{
|
||||
userId: 1012,
|
||||
userNickname: '卫十四',
|
||||
phone: '13700137000',
|
||||
amount: '75.00',
|
||||
frozenAmount: '0.00',
|
||||
withdrawalAmount: '75.00',
|
||||
totalAmount: '0.00',
|
||||
totalFrozenAmount: '0.00',
|
||||
totalWithdrawalAmount: '0.00',
|
||||
},
|
||||
];
|
||||
|
||||
/** 计算汇总值 */
|
||||
function computeSummary(list: WalletSummaryVO[]) {
|
||||
const totalAmount = list.reduce((s, i) => s + Number(i.amount || 0), 0).toFixed(2);
|
||||
const totalFrozenAmount = list.reduce((s, i) => s + Number(i.frozenAmount || 0), 0).toFixed(2);
|
||||
const totalWithdrawalAmount = list
|
||||
.reduce((s, i) => s + Number(i.withdrawalAmount || 0), 0)
|
||||
.toFixed(2);
|
||||
return { totalAmount, totalFrozenAmount, totalWithdrawalAmount };
|
||||
}
|
||||
|
||||
export function buildMockWalletPage(
|
||||
page: number,
|
||||
limit: number,
|
||||
params: WalletQueryParams,
|
||||
): PageData<WalletSummaryVO> {
|
||||
let filtered = [...MOCK_LIST];
|
||||
|
||||
if (params.nickname) {
|
||||
filtered = filtered.filter((item) => item.userNickname.includes(params.nickname!));
|
||||
}
|
||||
if (params.phone) {
|
||||
filtered = filtered.filter((item) => item.phone.includes(params.phone!));
|
||||
}
|
||||
if (params.amountBegin) {
|
||||
filtered = filtered.filter((item) => Number(item.amount) >= Number(params.amountBegin));
|
||||
}
|
||||
if (params.amountEnd) {
|
||||
filtered = filtered.filter((item) => Number(item.amount) <= Number(params.amountEnd));
|
||||
}
|
||||
|
||||
const total = filtered.length;
|
||||
const start = (page - 1) * limit;
|
||||
const pageList = filtered.slice(start, start + limit);
|
||||
|
||||
// 将汇总值写入每条记录(方便前端提取统计卡数据)
|
||||
const summary = computeSummary(filtered);
|
||||
for (const item of pageList) {
|
||||
item.totalAmount = summary.totalAmount;
|
||||
item.totalFrozenAmount = summary.totalFrozenAmount;
|
||||
item.totalWithdrawalAmount = summary.totalWithdrawalAmount;
|
||||
}
|
||||
|
||||
return { total, list: pageList };
|
||||
}
|
||||
@@ -0,0 +1,187 @@
|
||||
/**
|
||||
* 钱包交易明细假数据
|
||||
* 对应接口:GET /admin/finance/wallet/page
|
||||
*
|
||||
* type: 1=报名入账, 2=提现出账, 3=退款出账
|
||||
* status(由 freezeAmount/freezeTime 推导): 1=已解冻, 2=冻结中, 3=正常
|
||||
*/
|
||||
import type { WalletTransactionVO, WalletTransactionQueryParams, PageData } from '@/api/wallet';
|
||||
|
||||
const MOCK_TRANSACTIONS: (WalletTransactionVO & { status: number })[] = [
|
||||
{
|
||||
type: 1,
|
||||
amount: '+100.00',
|
||||
afterAmount: '600.00',
|
||||
withdrawAmount: '500.00',
|
||||
freezeAmount: '100.00',
|
||||
status: 1,
|
||||
freezeTime: '2026-06-10 08:00',
|
||||
unfreezeTime: '2026-06-12 08:00',
|
||||
orderNo: 'SN20260610001',
|
||||
createDate: '2026-06-10 08:00',
|
||||
},
|
||||
{
|
||||
type: 2,
|
||||
amount: '-500.00',
|
||||
afterAmount: '1100.00',
|
||||
withdrawAmount: '500.00',
|
||||
freezeAmount: '600.00',
|
||||
status: 2,
|
||||
freezeTime: '2026-06-10 06:00',
|
||||
unfreezeTime: '',
|
||||
orderNo: 'SN20260610002',
|
||||
createDate: '2026-06-10 06:00',
|
||||
},
|
||||
{
|
||||
type: 3,
|
||||
amount: '-100.00',
|
||||
afterAmount: '500.00',
|
||||
withdrawAmount: '500.00',
|
||||
freezeAmount: '0.00',
|
||||
status: 3,
|
||||
freezeTime: '',
|
||||
unfreezeTime: '',
|
||||
orderNo: 'SN20260610003',
|
||||
createDate: '2026-06-10 05:00',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
amount: '+350.00',
|
||||
afterAmount: '850.00',
|
||||
withdrawAmount: '750.00',
|
||||
freezeAmount: '100.00',
|
||||
status: 3,
|
||||
freezeTime: '',
|
||||
unfreezeTime: '',
|
||||
orderNo: 'SN20260609001',
|
||||
createDate: '2026-06-09 17:30',
|
||||
},
|
||||
{
|
||||
type: 2,
|
||||
amount: '-250.00',
|
||||
afterAmount: '600.00',
|
||||
withdrawAmount: '500.00',
|
||||
freezeAmount: '100.00',
|
||||
status: 1,
|
||||
freezeTime: '2026-06-08 10:00',
|
||||
unfreezeTime: '2026-06-09 08:00',
|
||||
orderNo: 'SN20260608001',
|
||||
createDate: '2026-06-08 10:00',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
amount: '+800.00',
|
||||
afterAmount: '2000.00',
|
||||
withdrawAmount: '1800.00',
|
||||
freezeAmount: '200.00',
|
||||
status: 3,
|
||||
freezeTime: '',
|
||||
unfreezeTime: '',
|
||||
orderNo: 'SN20260607001',
|
||||
createDate: '2026-06-07 14:00',
|
||||
},
|
||||
{
|
||||
type: 2,
|
||||
amount: '-300.00',
|
||||
afterAmount: '1200.00',
|
||||
withdrawAmount: '1000.00',
|
||||
freezeAmount: '200.00',
|
||||
status: 2,
|
||||
freezeTime: '2026-06-06 09:00',
|
||||
unfreezeTime: '',
|
||||
orderNo: 'SN20260606001',
|
||||
createDate: '2026-06-06 09:00',
|
||||
},
|
||||
{
|
||||
type: 3,
|
||||
amount: '-50.00',
|
||||
afterAmount: '1500.00',
|
||||
withdrawAmount: '1300.00',
|
||||
freezeAmount: '200.00',
|
||||
status: 1,
|
||||
freezeTime: '2026-06-05 10:00',
|
||||
unfreezeTime: '2026-06-07 10:00',
|
||||
orderNo: 'SN20260605001',
|
||||
createDate: '2026-06-05 10:00',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
amount: '+200.00',
|
||||
afterAmount: '1550.00',
|
||||
withdrawAmount: '1350.00',
|
||||
freezeAmount: '200.00',
|
||||
status: 3,
|
||||
freezeTime: '',
|
||||
unfreezeTime: '',
|
||||
orderNo: 'SN20260604001',
|
||||
createDate: '2026-06-04 08:30',
|
||||
},
|
||||
{
|
||||
type: 2,
|
||||
amount: '-600.00',
|
||||
afterAmount: '950.00',
|
||||
withdrawAmount: '750.00',
|
||||
freezeAmount: '200.00',
|
||||
status: 1,
|
||||
freezeTime: '2026-06-03 16:00',
|
||||
unfreezeTime: '2026-06-05 16:00',
|
||||
orderNo: 'SN20260603001',
|
||||
createDate: '2026-06-03 16:00',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
amount: '+450.00',
|
||||
afterAmount: '1050.00',
|
||||
withdrawAmount: '850.00',
|
||||
freezeAmount: '200.00',
|
||||
status: 1,
|
||||
freezeTime: '2026-06-02 11:00',
|
||||
unfreezeTime: '2026-06-04 11:00',
|
||||
orderNo: 'SN20260602001',
|
||||
createDate: '2026-06-02 11:00',
|
||||
},
|
||||
{
|
||||
type: 3,
|
||||
amount: '-120.00',
|
||||
afterAmount: '600.00',
|
||||
withdrawAmount: '400.00',
|
||||
freezeAmount: '200.00',
|
||||
status: 3,
|
||||
freezeTime: '',
|
||||
unfreezeTime: '',
|
||||
orderNo: 'SN20260601001',
|
||||
createDate: '2026-06-01 15:00',
|
||||
},
|
||||
];
|
||||
|
||||
function inDateRange(date: string, begin?: string, end?: string): boolean {
|
||||
if (!begin && !end) return true;
|
||||
const d = date.slice(0, 10);
|
||||
if (begin && d < begin) return false;
|
||||
if (end && d > end) return false;
|
||||
return true;
|
||||
}
|
||||
|
||||
export function buildMockWalletTransactionPage(
|
||||
page: number,
|
||||
limit: number,
|
||||
params: WalletTransactionQueryParams,
|
||||
): PageData<WalletTransactionVO> {
|
||||
let filtered = [...MOCK_TRANSACTIONS];
|
||||
|
||||
if (params.type) {
|
||||
filtered = filtered.filter((item) => item.type === Number(params.type));
|
||||
}
|
||||
if (params.status) {
|
||||
filtered = filtered.filter((item) => item.status === Number(params.status));
|
||||
}
|
||||
filtered = filtered.filter((item) =>
|
||||
inDateRange(item.createDate, params.createDateBegin, params.createDateEnd),
|
||||
);
|
||||
|
||||
const total = filtered.length;
|
||||
const start = (page - 1) * limit;
|
||||
const list = filtered.slice(start, start + limit).map(({ status, ...rest }) => rest);
|
||||
|
||||
return { total, list };
|
||||
}
|
||||
@@ -0,0 +1,150 @@
|
||||
/**
|
||||
* 提现详情假数据
|
||||
* 对应接口:GET /admin/finance/withdraw/info?id=xxx
|
||||
*
|
||||
* 字段对齐 TournamentFinanceWithdrawInfoVO。
|
||||
*/
|
||||
import type { WithdrawInfoVO } from '@/api/withdraw';
|
||||
|
||||
/** 银行卡类型映射 */
|
||||
const BANK_CARD_TYPE_MAP: Record<number, string> = { 1: '个人' };
|
||||
|
||||
const MOCK_DETAILS: Record<number, WithdrawInfoVO> = {
|
||||
1: {
|
||||
nickname: '可乐',
|
||||
phone: '17762466262',
|
||||
realName: '可乐',
|
||||
createDate: '2026-07-30 09:53:00',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '1000.00',
|
||||
feeRate: '0.006',
|
||||
feeAmount: '6.00',
|
||||
receivedAmount: '994.00',
|
||||
auditStatus: 0,
|
||||
payStatus: 0,
|
||||
bankCardType: 1,
|
||||
cardHolderName: '龚',
|
||||
bankCardNumber: '6215581807006475126',
|
||||
bankName: '交通银行',
|
||||
branchName: '交通银行宜昌西坝支行',
|
||||
payTime: '',
|
||||
orderNo: 'WD04111775872421935100',
|
||||
auditDate: '',
|
||||
auditNickname: '',
|
||||
auditImg: '',
|
||||
auditImgList: [],
|
||||
},
|
||||
2: {
|
||||
nickname: '李四',
|
||||
phone: '12345678998',
|
||||
realName: '李四',
|
||||
createDate: '2026-07-29 14:30:00',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '200.00',
|
||||
feeRate: '0.006',
|
||||
feeAmount: '1.20',
|
||||
receivedAmount: '198.80',
|
||||
auditStatus: 1,
|
||||
payStatus: 1,
|
||||
bankCardType: 1,
|
||||
cardHolderName: '李四',
|
||||
bankCardNumber: '6222021234567890123',
|
||||
bankName: '工商银行',
|
||||
branchName: '工商银行北京中关村支行',
|
||||
payTime: '2026-07-29 14:35:00',
|
||||
orderNo: 'SN20260729001',
|
||||
auditDate: '2026-07-29 14:32:00',
|
||||
auditNickname: '管理员A',
|
||||
auditImg: '',
|
||||
auditImgList: [
|
||||
'https://via.placeholder.com/200x200?text=Audit1',
|
||||
'https://via.placeholder.com/200x200?text=Audit2',
|
||||
],
|
||||
},
|
||||
3: {
|
||||
nickname: '王五',
|
||||
phone: '13800138000',
|
||||
realName: '王五',
|
||||
createDate: '2026-07-28 11:15:00',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '500.00',
|
||||
feeRate: '0.006',
|
||||
feeAmount: '3.00',
|
||||
receivedAmount: '497.00',
|
||||
auditStatus: 1,
|
||||
payStatus: 2,
|
||||
bankCardType: 1,
|
||||
cardHolderName: '王五',
|
||||
bankCardNumber: '微信钱包',
|
||||
bankName: '微信支付',
|
||||
branchName: '-',
|
||||
payTime: '',
|
||||
orderNo: 'SN20260728002',
|
||||
auditDate: '2026-07-28 11:20:00',
|
||||
auditNickname: '管理员B',
|
||||
auditImg: '',
|
||||
auditImgList: [],
|
||||
},
|
||||
4: {
|
||||
nickname: '赵六',
|
||||
phone: '13900139001',
|
||||
realName: '赵六',
|
||||
createDate: '2026-07-27 09:45:00',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '80.00',
|
||||
feeRate: '0.006',
|
||||
feeAmount: '0.48',
|
||||
receivedAmount: '79.52',
|
||||
auditStatus: 2,
|
||||
payStatus: 0,
|
||||
bankCardType: 1,
|
||||
cardHolderName: '赵六',
|
||||
bankCardNumber: '6217858000123456789',
|
||||
bankName: '建设银行',
|
||||
branchName: '建设银行上海陆家嘴支行',
|
||||
payTime: '',
|
||||
orderNo: '',
|
||||
auditDate: '2026-07-27 10:00:00',
|
||||
auditNickname: '管理��A',
|
||||
auditImg: '',
|
||||
auditImgList: ['https://via.placeholder.com/200x200?text=Reject'],
|
||||
},
|
||||
5: {
|
||||
nickname: '孙七',
|
||||
phone: '18600186001',
|
||||
realName: '孙七',
|
||||
createDate: '2026-07-26 16:00:00',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '3000.00',
|
||||
feeRate: '0.006',
|
||||
feeAmount: '18.00',
|
||||
receivedAmount: '2982.00',
|
||||
auditStatus: 0,
|
||||
payStatus: 0,
|
||||
bankCardType: 1,
|
||||
cardHolderName: '孙七',
|
||||
bankCardNumber: '6228480012345678910',
|
||||
bankName: '农业银行',
|
||||
branchName: '农业银行深圳福田支行',
|
||||
payTime: '',
|
||||
orderNo: 'WD05261775872421935200',
|
||||
auditDate: '',
|
||||
auditNickname: '',
|
||||
auditImg: '',
|
||||
auditImgList: [],
|
||||
},
|
||||
};
|
||||
|
||||
export function buildMockWithdrawInfo(id: number): WithdrawInfoVO {
|
||||
const detail = MOCK_DETAILS[id];
|
||||
if (detail) return { ...detail };
|
||||
|
||||
// 找不到对应 ID 时返回一个默认详情(基于 ID 4 的结构)
|
||||
return {
|
||||
...MOCK_DETAILS[4],
|
||||
nickname: `用户${id}`,
|
||||
phone: `1380000${String(id).padStart(4, '0')}`,
|
||||
realName: `用户${id}`,
|
||||
createDate: '2026-07-27 09:45:00',
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,194 @@
|
||||
/**
|
||||
* 提现列表假数据
|
||||
* 对应接口:GET /admin/finance/withdraw/page
|
||||
*
|
||||
* 前端筛选 + 分页,模拟后端行为。
|
||||
*/
|
||||
import type { WithdrawVO, WithdrawQueryParams, PageData } from '@/api/withdraw';
|
||||
|
||||
const MOCK_LIST: WithdrawVO[] = [
|
||||
{
|
||||
id: 1,
|
||||
nickname: '可乐',
|
||||
phone: '17762466262',
|
||||
realName: '可乐',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '1000.00',
|
||||
receivedAmount: '994.00',
|
||||
auditStatus: 0,
|
||||
payStatus: 0,
|
||||
serialNumber: '',
|
||||
createDate: '2026-07-30 09:53:00',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
nickname: '李四',
|
||||
phone: '12345678998',
|
||||
realName: '李四',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '200.00',
|
||||
receivedAmount: '198.80',
|
||||
auditStatus: 1,
|
||||
payStatus: 1,
|
||||
serialNumber: 'SN20260729001',
|
||||
createDate: '2026-07-29 14:30:00',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
nickname: '王五',
|
||||
phone: '13800138000',
|
||||
realName: '王五',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '500.00',
|
||||
receivedAmount: '497.00',
|
||||
auditStatus: 1,
|
||||
payStatus: 2,
|
||||
serialNumber: 'SN20260728002',
|
||||
createDate: '2026-07-28 11:15:00',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
nickname: '赵六',
|
||||
phone: '13900139001',
|
||||
realName: '赵六',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '80.00',
|
||||
receivedAmount: '79.52',
|
||||
auditStatus: 2,
|
||||
payStatus: 0,
|
||||
serialNumber: '',
|
||||
createDate: '2026-07-27 09:45:00',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
nickname: '孙七',
|
||||
phone: '18600186001',
|
||||
realName: '孙七',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '3000.00',
|
||||
receivedAmount: '2982.00',
|
||||
auditStatus: 0,
|
||||
payStatus: 0,
|
||||
serialNumber: '',
|
||||
createDate: '2026-07-26 16:00:00',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
nickname: '周八',
|
||||
phone: '15200152000',
|
||||
realName: '周八',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '150.00',
|
||||
receivedAmount: '149.10',
|
||||
auditStatus: 1,
|
||||
payStatus: 1,
|
||||
serialNumber: 'SN20260725003',
|
||||
createDate: '2026-07-25 10:20:00',
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
nickname: '吴九',
|
||||
phone: '17000170001',
|
||||
realName: '吴九',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '600.00',
|
||||
receivedAmount: '596.40',
|
||||
auditStatus: 2,
|
||||
payStatus: 0,
|
||||
serialNumber: '',
|
||||
createDate: '2026-07-24 08:30:00',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
nickname: '郑十',
|
||||
phone: '18900189000',
|
||||
realName: '郑十',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '2200.00',
|
||||
receivedAmount: '2186.80',
|
||||
auditStatus: 0,
|
||||
payStatus: 0,
|
||||
serialNumber: '',
|
||||
createDate: '2026-07-23 13:10:00',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
nickname: '可乐',
|
||||
phone: '17762466262',
|
||||
realName: '可乐',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '450.00',
|
||||
receivedAmount: '447.30',
|
||||
auditStatus: 1,
|
||||
payStatus: 2,
|
||||
serialNumber: 'SN20260722004',
|
||||
createDate: '2026-07-22 15:45:00',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
nickname: '李四',
|
||||
phone: '12345678998',
|
||||
realName: '李四',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '1800.00',
|
||||
receivedAmount: '1789.20',
|
||||
auditStatus: 0,
|
||||
payStatus: 0,
|
||||
serialNumber: '',
|
||||
createDate: '2026-07-21 09:00:00',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
nickname: '王五',
|
||||
phone: '13800138000',
|
||||
realName: '王五',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '320.00',
|
||||
receivedAmount: '318.08',
|
||||
auditStatus: 1,
|
||||
payStatus: 1,
|
||||
serialNumber: 'SN20260720005',
|
||||
createDate: '2026-07-20 17:30:00',
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
nickname: '孙七',
|
||||
phone: '18600186001',
|
||||
realName: '孙七',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: '750.00',
|
||||
receivedAmount: '745.50',
|
||||
auditStatus: 2,
|
||||
payStatus: 0,
|
||||
serialNumber: '',
|
||||
createDate: '2026-07-19 11:00:00',
|
||||
},
|
||||
];
|
||||
|
||||
export function buildMockWithdrawPage(
|
||||
page: number,
|
||||
limit: number,
|
||||
params: WithdrawQueryParams,
|
||||
): PageData<WithdrawVO> {
|
||||
let filtered = [...MOCK_LIST];
|
||||
|
||||
if (params.nickname) {
|
||||
filtered = filtered.filter((item) => item.nickname.includes(params.nickname!));
|
||||
}
|
||||
if (params.phone) {
|
||||
filtered = filtered.filter((item) => item.phone.includes(params.phone!));
|
||||
}
|
||||
if (params.realName) {
|
||||
filtered = filtered.filter((item) => item.realName.includes(params.realName!));
|
||||
}
|
||||
if (params.auditStatus) {
|
||||
filtered = filtered.filter((item) => item.auditStatus === Number(params.auditStatus));
|
||||
}
|
||||
if (params.payStatus) {
|
||||
filtered = filtered.filter((item) => item.payStatus === Number(params.payStatus));
|
||||
}
|
||||
|
||||
const total = filtered.length;
|
||||
const start = (page - 1) * limit;
|
||||
return { total, list: filtered.slice(start, start + limit) };
|
||||
}
|
||||
@@ -243,7 +243,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -340,7 +340,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -200,7 +200,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -273,7 +273,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -145,7 +145,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { defineComponent } from 'vue';
|
||||
import { defineComponent, onMounted } from 'vue';
|
||||
import { Button, Input, Table, Form, Space, Pagination, Select, DatePicker } from 'ant-design-vue';
|
||||
import { usePaymentsModel } from './model/usePaymentsModel';
|
||||
import { useContainerSize } from '@/hooks';
|
||||
@@ -6,9 +6,6 @@ import pageStyles from '@/assets/styles/pageLayout.module.less';
|
||||
|
||||
const { RangePicker } = DatePicker;
|
||||
|
||||
/**
|
||||
* 支付流水
|
||||
*/
|
||||
export default defineComponent({
|
||||
name: 'FinancePayments',
|
||||
setup() {
|
||||
@@ -27,9 +24,12 @@ export default defineComponent({
|
||||
|
||||
const { containerRef, height } = useContainerSize({ headerOffset: 55 });
|
||||
|
||||
onMounted(() => {
|
||||
handleSearch();
|
||||
});
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
<Form.Item label="时间" name="timeRange">
|
||||
@@ -40,16 +40,18 @@ export default defineComponent({
|
||||
onUpdate:value={(val: any) => (filterForm.timeRange = val)}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="用户昵称" name="searchUserName">
|
||||
<Form.Item label="用户昵称" name="nickname">
|
||||
<Input
|
||||
v-model:value={filterForm.nickname}
|
||||
placeholder="请输入"
|
||||
style={{ width: '180px' }}
|
||||
allowClear
|
||||
onPressEnter={handleSearch}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="手机号" name="searchPhone">
|
||||
<Form.Item label="手机号" name="phone">
|
||||
<Input
|
||||
v-model:value={filterForm.phone}
|
||||
placeholder="请输入"
|
||||
style={{ width: '180px' }}
|
||||
allowClear
|
||||
@@ -59,9 +61,10 @@ export default defineComponent({
|
||||
<Form.Item label="类型" name="type">
|
||||
<Select
|
||||
value={filterForm.type}
|
||||
options={PAYMENT_TYPE_OPTIONS as any}
|
||||
options={PAYMENT_TYPE_OPTIONS}
|
||||
style={{ width: '140px' }}
|
||||
allowClear
|
||||
placeholder="全部"
|
||||
onUpdate:value={(val: any) => (filterForm.type = val || '')}
|
||||
/>
|
||||
</Form.Item>
|
||||
@@ -76,17 +79,15 @@ export default defineComponent({
|
||||
</Form>
|
||||
</div>
|
||||
|
||||
{/* ===== 表格区 ===== */}
|
||||
<div class={pageStyles.table}>
|
||||
{/* ===== 汇总区 ===== */}
|
||||
<div class={pageStyles.summary}>
|
||||
<span class={pageStyles.summaryItem}>
|
||||
<span class={pageStyles.summaryLabel}>总支付金额:</span>
|
||||
<span class={pageStyles.summaryValue}>{summary.value.totalPay.toFixed(2)}元</span>
|
||||
<span class={pageStyles.summaryValue}>{summary.value.totalPay}元</span>
|
||||
</span>
|
||||
<span class={pageStyles.summaryItem}>
|
||||
<span class={pageStyles.summaryLabel}>总退款金额:</span>
|
||||
<span class={pageStyles.summaryValue}>{summary.value.totalRefund.toFixed(2)}元</span>
|
||||
<span class={pageStyles.summaryValue}>{summary.value.totalRefund}元</span>
|
||||
</span>
|
||||
</div>
|
||||
<div ref={containerRef} class={pageStyles.tableBody}>
|
||||
@@ -98,8 +99,6 @@ export default defineComponent({
|
||||
pagination={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 独立分页,右下方 */}
|
||||
<div class={pageStyles.pagination}>
|
||||
<Pagination
|
||||
current={pagination.value.current}
|
||||
@@ -108,7 +107,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,184 +1,145 @@
|
||||
import { reactive, toRef, Ref } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { computed, reactive, toRef, Ref } from 'vue';
|
||||
import { useState, useDebounce, useThrottleFn } from '@/hooks';
|
||||
import {
|
||||
getPaymentFlowList,
|
||||
type PaymentFlowVO,
|
||||
type PaymentFlowQueryParams,
|
||||
} from '@/api/payments';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
// ============================================================
|
||||
// 常量
|
||||
// 常量(value 对接 API type 字段)
|
||||
// ============================================================
|
||||
|
||||
/** 类型选项(筛选) */
|
||||
export const PAYMENT_TYPE_OPTIONS = [
|
||||
{ value: '', label: '全部' },
|
||||
{ value: '报名', label: '报名' },
|
||||
{ value: '取消报名', label: '取消报名' },
|
||||
{ value: '提现', label: '提现' },
|
||||
{ value: '1', label: '报名' },
|
||||
{ value: '2', label: '取消报名' },
|
||||
] as const;
|
||||
|
||||
// ============================================================
|
||||
// 汇总假数据
|
||||
// ============================================================
|
||||
|
||||
const MOCK_SUMMARY = {
|
||||
totalPay: 113255.0,
|
||||
totalRefund: 3255.0,
|
||||
export const PAYMENT_TYPE_MAP: Record<number, string> = {
|
||||
1: '报名',
|
||||
2: '取消报名',
|
||||
};
|
||||
|
||||
// ============================================================
|
||||
// 支付流水假数据(5 条)
|
||||
// ============================================================
|
||||
|
||||
const MOCK_DATA = [
|
||||
{
|
||||
key: '1',
|
||||
flowNo: 'xxxxxx',
|
||||
orderNo: 'xxxxxxxx',
|
||||
type: '报名',
|
||||
nickName: '张三',
|
||||
phone: '12345678997',
|
||||
amount: 99.0,
|
||||
thirdFlowNo: 'xxxxxxxxxxxxxxxxxxxx',
|
||||
tradeTime: '2026-05-26 08:00:00',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
flowNo: '',
|
||||
orderNo: '',
|
||||
type: '取消报名',
|
||||
nickName: '李四',
|
||||
phone: '12345678998',
|
||||
amount: 100.0,
|
||||
thirdFlowNo: '',
|
||||
tradeTime: '2026-05-26 07:00:00',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
flowNo: '',
|
||||
orderNo: '',
|
||||
type: '提现',
|
||||
nickName: '王五',
|
||||
phone: '12345678998',
|
||||
amount: 1000.0,
|
||||
thirdFlowNo: '',
|
||||
tradeTime: '2026-05-26 06:00:00',
|
||||
},
|
||||
{
|
||||
key: '4',
|
||||
flowNo: '',
|
||||
orderNo: '',
|
||||
type: '报名',
|
||||
nickName: '赵六',
|
||||
phone: '13800138000',
|
||||
amount: 199.0,
|
||||
thirdFlowNo: '',
|
||||
tradeTime: '2026-05-25 19:30:00',
|
||||
},
|
||||
{
|
||||
key: '5',
|
||||
flowNo: '',
|
||||
orderNo: '',
|
||||
type: '取消报名',
|
||||
nickName: '钱七',
|
||||
phone: '13900139001',
|
||||
amount: 50.0,
|
||||
thirdFlowNo: '',
|
||||
tradeTime: '2026-05-25 15:20:00',
|
||||
},
|
||||
];
|
||||
|
||||
// ============================================================
|
||||
// Model
|
||||
// ============================================================
|
||||
|
||||
/**
|
||||
* 支付流水页数据模型
|
||||
*/
|
||||
export function usePaymentsModel() {
|
||||
// ===== 筛选条件 =====
|
||||
// ===== 筛选条件(字段名对齐 API) =====
|
||||
const filterForm = reactive({
|
||||
timeRange: null as [string, string] | null,
|
||||
searchUserName: '',
|
||||
searchPhone: '',
|
||||
nickname: '',
|
||||
phone: '',
|
||||
type: '',
|
||||
});
|
||||
|
||||
// 可搜索字段防抖
|
||||
const { debouncedValue: debouncedUserName } = useDebounce(
|
||||
toRef(filterForm, 'searchUserName') as Ref<string>,
|
||||
const { debouncedValue: debouncedNickname } = useDebounce(
|
||||
toRef(filterForm, 'nickname') as Ref<string>,
|
||||
{ delay: 300 },
|
||||
);
|
||||
const { debouncedValue: debouncedPhone } = useDebounce(
|
||||
toRef(filterForm, 'searchPhone') as Ref<string>,
|
||||
toRef(filterForm, 'phone') as Ref<string>,
|
||||
{ delay: 300 },
|
||||
);
|
||||
|
||||
// ===== 汇总 =====
|
||||
const [summary, setSummary] = useState(MOCK_SUMMARY);
|
||||
const [summary, setSummary] = useState({ totalPay: '0.00', totalRefund: '0.00' });
|
||||
|
||||
// ===== 表格状态 =====
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [dataSource, setDataSource] = useState<any[]>(MOCK_DATA);
|
||||
const [pagination, setPagination] = useState({
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
total: MOCK_DATA.length,
|
||||
});
|
||||
const [dataSource, setDataSource] = useState<PaymentFlowVO[]>([]);
|
||||
const [pagination, setPagination] = useState({ current: 1, pageSize: 10, total: 0 });
|
||||
|
||||
// ===== 表格列配置 =====
|
||||
// ===== 表格列(dataIndex 对齐 API) =====
|
||||
const columns = [
|
||||
{ title: '流水号', dataIndex: 'flowNo', key: 'flowNo', width: 140 },
|
||||
{ title: '订单编号', dataIndex: 'orderNo', key: 'orderNo', width: 140 },
|
||||
{ title: '类型', dataIndex: 'type', key: 'type', width: 110 },
|
||||
{ title: '用户昵称', dataIndex: 'nickName', key: 'nickName', width: 120 },
|
||||
{ title: '流水号', dataIndex: 'serialNo', key: 'serialNo', width: 160 },
|
||||
{ title: '订单编号', dataIndex: 'orderNo', key: 'orderNo', width: 160 },
|
||||
{
|
||||
title: '类型',
|
||||
dataIndex: 'type',
|
||||
key: 'type',
|
||||
width: 110,
|
||||
customRender: ({ text }: { text: number }) => PAYMENT_TYPE_MAP[text] || text || '-',
|
||||
},
|
||||
{ title: '用户昵称', dataIndex: 'nickname', key: 'nickname', width: 120 },
|
||||
{ title: '手机号', dataIndex: 'phone', key: 'phone', width: 140 },
|
||||
{
|
||||
title: '金额',
|
||||
dataIndex: 'amount',
|
||||
key: 'amount',
|
||||
width: 120,
|
||||
customRender: ({ text }: { text: number }) => `${(text || 0).toFixed(2)}`,
|
||||
},
|
||||
{ title: '第三方流水单号', dataIndex: 'thirdFlowNo', key: 'thirdFlowNo', width: 220 },
|
||||
{
|
||||
title: '交易时间',
|
||||
dataIndex: 'tradeTime',
|
||||
key: 'tradeTime',
|
||||
width: 170,
|
||||
align: 'left' as const,
|
||||
},
|
||||
{ title: '交易时间', dataIndex: 'createDate', key: 'createDate', width: 170 },
|
||||
];
|
||||
|
||||
// ===== 计算属性 =====
|
||||
const hasFilter = computed(() => {
|
||||
return (
|
||||
filterForm.timeRange !== null ||
|
||||
debouncedNickname.value.trim() !== '' ||
|
||||
debouncedPhone.value.trim() !== '' ||
|
||||
filterForm.type !== ''
|
||||
);
|
||||
});
|
||||
|
||||
// ===== 构建 API 查询参数 =====
|
||||
const buildQueryParams = (): PaymentFlowQueryParams => {
|
||||
const params: PaymentFlowQueryParams = {
|
||||
page: String(pagination.value.current),
|
||||
limit: String(pagination.value.pageSize),
|
||||
};
|
||||
if (filterForm.timeRange) {
|
||||
const [start, end] = filterForm.timeRange;
|
||||
if (start) params.createDateBegin = dayjs(start).format('YYYY-MM-DD');
|
||||
if (end) params.createDateEnd = dayjs(end).format('YYYY-MM-DD');
|
||||
}
|
||||
if (debouncedNickname.value.trim()) params.nickname = debouncedNickname.value.trim();
|
||||
if (debouncedPhone.value.trim()) params.phone = debouncedPhone.value.trim();
|
||||
if (filterForm.type) params.type = filterForm.type;
|
||||
return params;
|
||||
};
|
||||
|
||||
// ===== 方法 =====
|
||||
|
||||
/** 查询(节流 500ms) */
|
||||
const handleSearch = useThrottleFn(async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
console.log('搜索条件:', {
|
||||
timeRange: filterForm.timeRange,
|
||||
nickName: debouncedUserName.value,
|
||||
phone: debouncedPhone.value,
|
||||
type: filterForm.type,
|
||||
});
|
||||
// TODO: 替换为真实 API 调用
|
||||
setDataSource(MOCK_DATA);
|
||||
setPagination({ ...pagination.value, total: MOCK_DATA.length });
|
||||
setSummary(MOCK_SUMMARY);
|
||||
message.success('查询成功');
|
||||
} catch (error: any) {
|
||||
message.error(error.msg || '查询失败');
|
||||
const queryParams = buildQueryParams();
|
||||
console.log('支付流水查询参数:', queryParams);
|
||||
const res = await getPaymentFlowList(queryParams);
|
||||
if (res.code === 200) {
|
||||
console.log('支付流水查询结果:', { total: res.data.total, count: res.data.list.length });
|
||||
setDataSource(res.data.list);
|
||||
setPagination({ ...pagination.value, total: res.data.total });
|
||||
// 汇总:type=1 金额为收入,type=2 金额为退款
|
||||
let totalPay = 0;
|
||||
let totalRefund = 0;
|
||||
for (const item of res.data.list) {
|
||||
const amt = Number(item.amount) || 0;
|
||||
if (item.type === 1) totalPay += amt;
|
||||
else if (item.type === 2) totalRefund += amt;
|
||||
}
|
||||
setSummary({ totalPay: totalPay.toFixed(2), totalRefund: totalRefund.toFixed(2) });
|
||||
}
|
||||
} catch {
|
||||
// 网络层已统一提示
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, 500);
|
||||
|
||||
/** 重置(节流 500ms) */
|
||||
const handleReset = useThrottleFn(() => {
|
||||
filterForm.timeRange = null;
|
||||
filterForm.searchUserName = '';
|
||||
filterForm.searchPhone = '';
|
||||
filterForm.nickname = '';
|
||||
filterForm.phone = '';
|
||||
filterForm.type = '';
|
||||
setPagination({ current: 1, pageSize: 10, total: MOCK_DATA.length });
|
||||
setDataSource(MOCK_DATA);
|
||||
setSummary(MOCK_SUMMARY);
|
||||
setPagination({ current: 1, pageSize: 10, total: 0 });
|
||||
setDataSource([]);
|
||||
setSummary({ totalPay: '0.00', totalRefund: '0.00' });
|
||||
setTimeout(() => handleSearch(), 350);
|
||||
}, 500);
|
||||
|
||||
const handlePageChange = (page: number, pageSize: number) => {
|
||||
|
||||
@@ -1,9 +1,16 @@
|
||||
import { defineComponent, ref, reactive, computed, watch } from 'vue';
|
||||
import { Modal, Table, Button, Select, Form, Space, DatePicker } from 'ant-design-vue';
|
||||
import { defineComponent, reactive, ref, watch } from 'vue';
|
||||
import { Modal, Table, Button, Select, Form, Space, DatePicker, Pagination } from 'ant-design-vue';
|
||||
import dayjs from 'dayjs';
|
||||
import {
|
||||
getWalletTransactionList,
|
||||
type WalletTransactionVO,
|
||||
type WalletTransactionQueryParams,
|
||||
} from '@/api/wallet';
|
||||
import {
|
||||
useWalletModel,
|
||||
TRANSACTION_TYPE_OPTIONS,
|
||||
TRANSACTION_STATUS_OPTIONS,
|
||||
TRANSACTION_TYPE_MAP,
|
||||
TRANSACTION_STATUS_LABEL_MAP,
|
||||
} from '../model/useWalletModel';
|
||||
import styles from './WalletDetailModal.module.less';
|
||||
|
||||
@@ -15,9 +22,6 @@ interface WalletDetailModalProps {
|
||||
onClose: () => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 钱包交易明细弹窗
|
||||
*/
|
||||
export default defineComponent({
|
||||
name: 'WalletDetailModal',
|
||||
props: {
|
||||
@@ -26,223 +30,210 @@ export default defineComponent({
|
||||
onClose: { type: Function, required: true },
|
||||
},
|
||||
setup(props: WalletDetailModalProps) {
|
||||
const { loadTransactions, renderTransactionStatus } = useWalletModel();
|
||||
|
||||
// ===== 弹窗内筛选条件 =====
|
||||
const detailFilter = reactive({
|
||||
// ===== 筛选条件 =====
|
||||
const filterForm = reactive({
|
||||
timeRange: null as [string, string] | null,
|
||||
type: '',
|
||||
status: '',
|
||||
});
|
||||
|
||||
// ===== 加载明细 =====
|
||||
const loading = ref<boolean>(false);
|
||||
const allTransactions = ref<any[]>([]);
|
||||
// ===== 数据状态 =====
|
||||
const loading = ref(false);
|
||||
const dataSource = ref<WalletTransactionVO[]>([]);
|
||||
const pagination = reactive({ current: 1, pageSize: 10, total: 0 });
|
||||
|
||||
const fetchTransactions = async () => {
|
||||
// ===== 构建查询参数 =====
|
||||
const buildQueryParams = (): WalletTransactionQueryParams => {
|
||||
const params: WalletTransactionQueryParams = {
|
||||
page: String(pagination.current),
|
||||
limit: String(pagination.pageSize),
|
||||
userId: String(props.record?.userId || ''),
|
||||
};
|
||||
if (filterForm.timeRange) {
|
||||
const [start, end] = filterForm.timeRange;
|
||||
if (start) params.createDateBegin = dayjs(start).format('YYYY-MM-DD');
|
||||
if (end) params.createDateEnd = dayjs(end).format('YYYY-MM-DD');
|
||||
}
|
||||
if (filterForm.type) params.type = filterForm.type;
|
||||
if (filterForm.status) params.status = filterForm.status;
|
||||
return params;
|
||||
};
|
||||
|
||||
// ===== 查询 =====
|
||||
const handleSearch = async () => {
|
||||
loading.value = true;
|
||||
try {
|
||||
allTransactions.value = await loadTransactions(props.record);
|
||||
const params = buildQueryParams();
|
||||
const res = await getWalletTransactionList(params);
|
||||
if (res.code === 200) {
|
||||
dataSource.value = res.data.list;
|
||||
pagination.total = res.data.total;
|
||||
}
|
||||
} catch {
|
||||
// 网络层已统一提示
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 弹窗内筛选后的数据(用 computed 自动响应全量数据和筛选条件的变化)
|
||||
* 真实场景应传给后端做查询;此处做前端过滤演示
|
||||
*/
|
||||
const filteredTransactions = computed(() => {
|
||||
return allTransactions.value.filter((item) => {
|
||||
if (detailFilter.type && item.type !== detailFilter.type) return false;
|
||||
if (detailFilter.status && item.status !== detailFilter.status) return false;
|
||||
if (detailFilter.timeRange && detailFilter.timeRange.length === 2) {
|
||||
const [start, end] = detailFilter.timeRange;
|
||||
if (item.time < start || item.time > end) return false;
|
||||
}
|
||||
return true;
|
||||
});
|
||||
});
|
||||
|
||||
const handleSearch = () => {
|
||||
// computed 会自动响应;这里保留方法以便将来扩展(如后端查询)
|
||||
};
|
||||
|
||||
// ===== 重置 =====
|
||||
const handleReset = () => {
|
||||
detailFilter.timeRange = null;
|
||||
detailFilter.type = '';
|
||||
detailFilter.status = '';
|
||||
filterForm.timeRange = null;
|
||||
filterForm.type = '';
|
||||
filterForm.status = '';
|
||||
pagination.current = 1;
|
||||
handleSearch();
|
||||
};
|
||||
|
||||
// ===== 分页 =====
|
||||
const pagination = reactive({
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
showSizeChanger: true,
|
||||
showTotal: (total: number) => `共 ${total} 条`,
|
||||
});
|
||||
|
||||
/** 筛选条件变化时重置到第 1 页,并同步总数 */
|
||||
watch(filteredTransactions, (list) => {
|
||||
pagination.total = list.length;
|
||||
pagination.current = 1;
|
||||
});
|
||||
|
||||
const handleTableChange = (pag: any) => {
|
||||
pagination.current = pag.current;
|
||||
pagination.pageSize = pag.pageSize;
|
||||
const handlePageChange = (page: number, pageSize: number) => {
|
||||
pagination.current = page;
|
||||
pagination.pageSize = pageSize;
|
||||
handleSearch();
|
||||
};
|
||||
|
||||
/** 监听 visible 变化:打开时加载明细 */
|
||||
// ===== 弹窗打开 → 首次加载 =====
|
||||
watch(
|
||||
() => props.visible,
|
||||
(val) => {
|
||||
if (val) {
|
||||
detailFilter.timeRange = null;
|
||||
detailFilter.type = '';
|
||||
detailFilter.status = '';
|
||||
allTransactions.value = [];
|
||||
fetchTransactions();
|
||||
filterForm.timeRange = null;
|
||||
filterForm.type = '';
|
||||
filterForm.status = '';
|
||||
pagination.current = 1;
|
||||
pagination.pageSize = 10;
|
||||
dataSource.value = [];
|
||||
handleSearch();
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
// ===== 表格列配置 =====
|
||||
const detailColumns = [
|
||||
// ===== 表格列(dataIndex 对齐 API) =====
|
||||
const columns = [
|
||||
{
|
||||
title: '类型',
|
||||
dataIndex: 'type',
|
||||
key: 'type',
|
||||
width: 120,
|
||||
customRender: ({ text }: { text: number }) => TRANSACTION_TYPE_MAP[text] || text || '-',
|
||||
},
|
||||
{
|
||||
title: '金额',
|
||||
dataIndex: 'amount',
|
||||
key: 'amount',
|
||||
width: 110,
|
||||
align: 'center' as const,
|
||||
customRender: ({ text }: { text: number }) => {
|
||||
const num = text || 0;
|
||||
const isPlus = num > 0;
|
||||
const isMinus = num < 0;
|
||||
const color = isPlus ? '#52c41a' : isMinus ? '#ff4d4f' : 'rgba(0,0,0,0.85)';
|
||||
const sign = isPlus ? '+' : '';
|
||||
width: 120,
|
||||
align: 'left' as const,
|
||||
customRender: ({ text }: { text: string }) => {
|
||||
const num = Number(text) || 0;
|
||||
const color = num > 0 ? '#52c41a' : num < 0 ? '#ff4d4f' : 'rgba(0,0,0,0.85)';
|
||||
const sign = num > 0 ? '+' : '';
|
||||
return (
|
||||
<span style={{ color, fontWeight: 500 }}>
|
||||
{sign}
|
||||
{num.toFixed(2)}
|
||||
{text}
|
||||
</span>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '余额',
|
||||
dataIndex: 'balance',
|
||||
key: 'balance',
|
||||
width: 110,
|
||||
align: 'center' as const,
|
||||
customRender: ({ text }: { text: number }) => `¥${(text || 0).toFixed(2)}`,
|
||||
dataIndex: 'afterAmount',
|
||||
key: 'afterAmount',
|
||||
width: 120,
|
||||
align: 'left' as const,
|
||||
customRender: ({ text }: { text: string }) => `¥${text || '0.00'}`,
|
||||
},
|
||||
{
|
||||
title: '可提现金额',
|
||||
dataIndex: 'withdrawable',
|
||||
key: 'withdrawable',
|
||||
width: 130,
|
||||
align: 'center' as const,
|
||||
customRender: ({ text }: { text: number }) => `¥${(text || 0).toFixed(2)}`,
|
||||
title: '可提现',
|
||||
dataIndex: 'withdrawAmount',
|
||||
key: 'withdrawAmount',
|
||||
width: 120,
|
||||
align: 'left' as const,
|
||||
customRender: ({ text }: { text: string }) => `¥${text || '0.00'}`,
|
||||
},
|
||||
{
|
||||
title: '冻结金额',
|
||||
dataIndex: 'frozen',
|
||||
key: 'frozen',
|
||||
dataIndex: 'freezeAmount',
|
||||
key: 'freezeAmount',
|
||||
width: 110,
|
||||
align: 'center' as const,
|
||||
customRender: ({ text }: { text: number }) => `¥${(text || 0).toFixed(2)}`,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
width: 90,
|
||||
align: 'center' as const,
|
||||
customRender: ({ text }: { text: string }) => renderTransactionStatus(text),
|
||||
align: 'left' as const,
|
||||
customRender: ({ text }: { text: string }) => `¥${text || '0.00'}`,
|
||||
},
|
||||
{
|
||||
title: '冻结时间',
|
||||
dataIndex: 'frozenTime',
|
||||
key: 'frozenTime',
|
||||
width: 130,
|
||||
align: 'center' as const,
|
||||
dataIndex: 'freezeTime',
|
||||
key: 'freezeTime',
|
||||
width: 140,
|
||||
customRender: ({ text }: { text: string }) => text || '-',
|
||||
},
|
||||
{
|
||||
title: '解冻时间',
|
||||
dataIndex: 'unfreezeTime',
|
||||
key: 'unfreezeTime',
|
||||
width: 130,
|
||||
align: 'center' as const,
|
||||
width: 140,
|
||||
customRender: ({ text }: { text: string }) => text || '-',
|
||||
},
|
||||
{
|
||||
title: '关联单号',
|
||||
dataIndex: 'relatedNo',
|
||||
key: 'relatedNo',
|
||||
width: 130,
|
||||
align: 'center' as const,
|
||||
dataIndex: 'orderNo',
|
||||
key: 'orderNo',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: '时间',
|
||||
dataIndex: 'time',
|
||||
key: 'time',
|
||||
width: 130,
|
||||
align: 'center' as const,
|
||||
dataIndex: 'createDate',
|
||||
key: 'createDate',
|
||||
width: 150,
|
||||
},
|
||||
];
|
||||
|
||||
return () => (
|
||||
<Modal
|
||||
title="明细详情"
|
||||
title="交易明细"
|
||||
visible={props.visible}
|
||||
onCancel={props.onClose}
|
||||
width={1300}
|
||||
width={1400}
|
||||
destroyOnClose
|
||||
footer={null}
|
||||
centered
|
||||
wrapClassName={styles.walletDetailModalMain}
|
||||
>
|
||||
<div class={styles.modalBody}>
|
||||
{/* ===== 弹窗内筛选区 ===== */}
|
||||
{/* 筛选区 */}
|
||||
<div class={styles.filterBar}>
|
||||
<Form layout="inline" model={detailFilter}>
|
||||
<Form layout="inline" model={filterForm}>
|
||||
<Form.Item label="时间" name="timeRange">
|
||||
<RangePicker
|
||||
value={detailFilter.timeRange as any}
|
||||
value={filterForm.timeRange as any}
|
||||
style={{ width: '240px' }}
|
||||
allowClear
|
||||
onUpdate:value={(val: any) => (detailFilter.timeRange = val)}
|
||||
onUpdate:value={(val: any) => (filterForm.timeRange = val)}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="类型" name="type">
|
||||
<Select
|
||||
value={detailFilter.type}
|
||||
value={filterForm.type}
|
||||
options={TRANSACTION_TYPE_OPTIONS as any}
|
||||
style={{ width: '140px' }}
|
||||
allowClear
|
||||
onUpdate:value={(val: any) => (detailFilter.type = val || '')}
|
||||
placeholder="全部"
|
||||
onUpdate:value={(val: any) => (filterForm.type = val || '')}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="状态" name="status">
|
||||
<Select
|
||||
value={detailFilter.status}
|
||||
value={filterForm.status}
|
||||
options={TRANSACTION_STATUS_OPTIONS as any}
|
||||
style={{ width: '140px' }}
|
||||
allowClear
|
||||
onUpdate:value={(val: any) => (detailFilter.status = val || '')}
|
||||
placeholder="全部"
|
||||
onUpdate:value={(val: any) => (filterForm.status = val || '')}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Space>
|
||||
<Button onClick={handleReset}>重置</Button>
|
||||
<Button type="primary" onClick={handleSearch}>
|
||||
<Button type="primary" onClick={handleSearch} loading={loading.value}>
|
||||
查询
|
||||
</Button>
|
||||
</Space>
|
||||
@@ -250,26 +241,30 @@ export default defineComponent({
|
||||
</Form>
|
||||
</div>
|
||||
|
||||
{/* ===== 表格区 ===== */}
|
||||
{/* 表格区 */}
|
||||
<div class={styles.tableWrap}>
|
||||
<Table
|
||||
columns={detailColumns}
|
||||
dataSource={filteredTransactions.value}
|
||||
columns={columns}
|
||||
dataSource={dataSource.value}
|
||||
loading={loading.value}
|
||||
size="middle"
|
||||
bordered
|
||||
pagination={{
|
||||
current: pagination.current,
|
||||
pageSize: pagination.pageSize,
|
||||
total: pagination.total,
|
||||
showSizeChanger: pagination.showSizeChanger,
|
||||
showTotal: pagination.showTotal,
|
||||
}}
|
||||
onChange={handleTableChange}
|
||||
pagination={false}
|
||||
scroll={{ x: 'max-content' }}
|
||||
locale={{ emptyText: '暂无交易明细' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 分页 */}
|
||||
<div style={{ display: 'flex', justifyContent: 'flex-end', paddingTop: '12px' }}>
|
||||
<Pagination
|
||||
current={pagination.current}
|
||||
pageSize={pagination.pageSize}
|
||||
total={pagination.total}
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
);
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { defineComponent } from 'vue';
|
||||
import { defineComponent, onMounted } from 'vue';
|
||||
import { Button, Input, Table, Form, Space, Pagination } from 'ant-design-vue';
|
||||
import { WalletOutlined, LockOutlined, RiseOutlined } from '@ant-design/icons-vue';
|
||||
import { useWalletModel } from './model/useWalletModel';
|
||||
@@ -10,15 +10,12 @@ import pageStyles from '@/assets/styles/pageLayout.module.less';
|
||||
interface StatCardItem {
|
||||
key: string;
|
||||
label: string;
|
||||
value: number;
|
||||
value: string;
|
||||
icon: any;
|
||||
color: string;
|
||||
bgColor: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* bodyCell 渲染函数
|
||||
*/
|
||||
function renderBodyCell({
|
||||
column,
|
||||
record,
|
||||
@@ -29,7 +26,6 @@ function renderBodyCell({
|
||||
record: any;
|
||||
onViewDetail: (record: any) => void;
|
||||
}) {
|
||||
// 操作列
|
||||
if (column.key === 'action') {
|
||||
return (
|
||||
<Button type="link" size="small" onClick={() => onViewDetail(record)}>
|
||||
@@ -40,9 +36,6 @@ function renderBodyCell({
|
||||
return;
|
||||
}
|
||||
|
||||
/**
|
||||
* 用户钱包
|
||||
*/
|
||||
export default defineComponent({
|
||||
name: 'FinanceWallet',
|
||||
setup() {
|
||||
@@ -64,7 +57,6 @@ export default defineComponent({
|
||||
|
||||
const { containerRef, height } = useContainerSize({ headerOffset: 55 });
|
||||
|
||||
/** 最终表格列:模型列 + 操作 */
|
||||
const tableColumns = [
|
||||
...columns,
|
||||
{
|
||||
@@ -76,8 +68,11 @@ export default defineComponent({
|
||||
},
|
||||
];
|
||||
|
||||
onMounted(() => {
|
||||
handleSearch();
|
||||
});
|
||||
|
||||
return () => {
|
||||
/** 顶部统计卡配置 */
|
||||
const statCards: StatCardItem[] = [
|
||||
{
|
||||
key: 'totalBalance',
|
||||
@@ -122,11 +117,7 @@ export default defineComponent({
|
||||
<div class={styles.statCardRight}>
|
||||
<div class={styles.statLabel}>{item.label}</div>
|
||||
<div class={styles.statValue} style={{ color: item.color }}>
|
||||
¥
|
||||
{item.value.toLocaleString('zh-CN', {
|
||||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2,
|
||||
})}
|
||||
¥{item.value}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -136,16 +127,18 @@ export default defineComponent({
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
<Form.Item label="用户昵称" name="searchUserName">
|
||||
<Form.Item label="用户昵称" name="nickname">
|
||||
<Input
|
||||
v-model:value={filterForm.nickname}
|
||||
placeholder="请输入"
|
||||
style={{ width: '180px' }}
|
||||
allowClear
|
||||
onPressEnter={handleSearch}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="手机号" name="searchPhone">
|
||||
<Form.Item label="手机号" name="phone">
|
||||
<Input
|
||||
v-model:value={filterForm.phone}
|
||||
placeholder="请输入"
|
||||
style={{ width: '180px' }}
|
||||
allowClear
|
||||
@@ -194,8 +187,6 @@ export default defineComponent({
|
||||
</Form>
|
||||
</div>
|
||||
|
||||
{/* ===== 下方区域:筛选 + 表格(独立白卡片) ===== */}
|
||||
|
||||
{/* ===== 表格区 ===== */}
|
||||
<div class={pageStyles.table}>
|
||||
<div ref={containerRef} class={pageStyles.tableBody}>
|
||||
@@ -203,20 +194,16 @@ export default defineComponent({
|
||||
columns={tableColumns}
|
||||
dataSource={dataSource.value}
|
||||
loading={loading.value}
|
||||
rowKey="userId"
|
||||
scroll={{ x: 'max-content', y: height.value }}
|
||||
pagination={false}
|
||||
>
|
||||
{{
|
||||
bodyCell: (args: any) =>
|
||||
renderBodyCell({
|
||||
...args,
|
||||
onViewDetail: handleViewDetail,
|
||||
}),
|
||||
renderBodyCell({ ...args, onViewDetail: handleViewDetail }),
|
||||
}}
|
||||
</Table>
|
||||
</div>
|
||||
|
||||
{/* 独立分页,右下方 */}
|
||||
<div class={pageStyles.pagination}>
|
||||
<Pagination
|
||||
current={pagination.value.current}
|
||||
@@ -225,12 +212,10 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ===== 交易明细弹窗 ===== */}
|
||||
<WalletDetailModal
|
||||
visible={detailVisible.value}
|
||||
record={currentWallet.value}
|
||||
|
||||
@@ -1,292 +1,176 @@
|
||||
import { computed, reactive, toRef, Ref, h } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { StatusTag, type StatusTagTone } from '@/components';
|
||||
import { computed, reactive, toRef, Ref } from 'vue';
|
||||
import { useState, useDebounce, useThrottleFn } from '@/hooks';
|
||||
import { getWalletList, type WalletSummaryVO, type WalletQueryParams } from '@/api/wallet';
|
||||
|
||||
// ============================================================
|
||||
// 常量
|
||||
// 常量(value 对齐 API 数字码)
|
||||
// ============================================================
|
||||
|
||||
/** 明细类型选项(弹窗内筛选) */
|
||||
/** 交易类型选项:value 对应 API type 字段 */
|
||||
export const TRANSACTION_TYPE_OPTIONS = [
|
||||
{ value: '', label: '全部' },
|
||||
{ value: '报名收入', label: '报名收入' },
|
||||
{ value: '提现', label: '提现' },
|
||||
{ value: '取消报名退款', label: '取消报名退款' },
|
||||
{ value: '1', label: '报名收入' },
|
||||
{ value: '2', label: '提现' },
|
||||
{ value: '3', label: '取消报名退款' },
|
||||
] as const;
|
||||
|
||||
/** 明细状态选项(弹窗内筛选) */
|
||||
/** 交易状态选项:value 对应 API status 字段 */
|
||||
export const TRANSACTION_STATUS_OPTIONS = [
|
||||
{ value: '', label: '全部' },
|
||||
{ value: '正常', label: '正常' },
|
||||
{ value: '冻结中', label: '冻结中' },
|
||||
{ value: '已解冻', label: '已解冻' },
|
||||
{ value: '1', label: '已解冻' },
|
||||
{ value: '2', label: '冻结中' },
|
||||
{ value: '3', label: '正常' },
|
||||
] as const;
|
||||
|
||||
/** 明细状态映射(用于表格 StatusTag 渲染) */
|
||||
const TRANSACTION_STATUS_MAP: Record<string, { label: string; tone: StatusTagTone }> = {
|
||||
正常: { label: '正常', tone: 'primary' },
|
||||
冻结中: { label: '冻结中', tone: 'orange' },
|
||||
已解冻: { label: '已解冻', tone: 'success' },
|
||||
/** 交易类型文案映射 */
|
||||
export const TRANSACTION_TYPE_MAP: Record<number, string> = {
|
||||
1: '报名收入',
|
||||
2: '提现',
|
||||
3: '取消报名退款',
|
||||
};
|
||||
|
||||
// ============================================================
|
||||
// 顶部统计卡假数据
|
||||
// ============================================================
|
||||
|
||||
const MOCK_SUMMARY = {
|
||||
totalBalance: 86520.0,
|
||||
frozenAmount: 3200.0,
|
||||
totalWithdraw: 63080.0,
|
||||
/** 交易状态文案映射(弹窗内表格渲染用) */
|
||||
export const TRANSACTION_STATUS_LABEL_MAP: Record<number, string> = {
|
||||
1: '已解冻',
|
||||
2: '冻结中',
|
||||
3: '正常',
|
||||
};
|
||||
|
||||
// ============================================================
|
||||
// 假数据(钱包列表)
|
||||
// ============================================================
|
||||
|
||||
const MOCK_DATA = [
|
||||
{
|
||||
key: '1',
|
||||
userId: 'U20260701001',
|
||||
nickName: '张三',
|
||||
phone: '12345678997',
|
||||
balance: 0,
|
||||
frozen: 0,
|
||||
totalWithdraw: 0,
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
userId: '',
|
||||
nickName: '李四',
|
||||
phone: '12345678998',
|
||||
balance: 350,
|
||||
frozen: 200,
|
||||
totalWithdraw: 1450,
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
userId: '',
|
||||
nickName: '王五',
|
||||
phone: '12345678999',
|
||||
balance: 1280,
|
||||
frozen: 0,
|
||||
totalWithdraw: 800,
|
||||
},
|
||||
{
|
||||
key: '4',
|
||||
userId: 'U20260701004',
|
||||
nickName: '赵六',
|
||||
phone: '13800138000',
|
||||
balance: 560,
|
||||
frozen: 100,
|
||||
totalWithdraw: 200,
|
||||
},
|
||||
{
|
||||
key: '5',
|
||||
userId: '',
|
||||
nickName: '钱七',
|
||||
phone: '13900139001',
|
||||
balance: 4200,
|
||||
frozen: 1500,
|
||||
totalWithdraw: 5600,
|
||||
},
|
||||
{
|
||||
key: '6',
|
||||
userId: '',
|
||||
nickName: '孙八',
|
||||
phone: '12345678997',
|
||||
balance: 880,
|
||||
frozen: 0,
|
||||
totalWithdraw: 300,
|
||||
},
|
||||
];
|
||||
|
||||
// ============================================================
|
||||
// 交易明细假数据(所有用户共用,演示用)
|
||||
// ============================================================
|
||||
|
||||
const MOCK_TRANSACTIONS: any[] = [
|
||||
{
|
||||
key: 't-1',
|
||||
type: '报名收入',
|
||||
amount: 100,
|
||||
balance: 600,
|
||||
withdrawable: 500,
|
||||
frozen: 100,
|
||||
status: '已解冻',
|
||||
frozenTime: '2026-06-10 08:00',
|
||||
unfreezeTime: '2026-06-12 08:00',
|
||||
relatedNo: 'xxxxxxxx',
|
||||
time: '2026-06-10 08:00',
|
||||
},
|
||||
{
|
||||
key: 't-2',
|
||||
type: '提现',
|
||||
amount: -500,
|
||||
balance: 1100,
|
||||
withdrawable: 500,
|
||||
frozen: 600,
|
||||
status: '冻结中',
|
||||
frozenTime: '2026-06-10 06:00',
|
||||
unfreezeTime: '-',
|
||||
relatedNo: 'xxxxxxxx',
|
||||
time: '2026-06-10 06:00',
|
||||
},
|
||||
{
|
||||
key: 't-3',
|
||||
type: '取消报名退款',
|
||||
amount: -100,
|
||||
balance: 500,
|
||||
withdrawable: 500,
|
||||
frozen: 0,
|
||||
status: '正常',
|
||||
frozenTime: '-',
|
||||
unfreezeTime: '-',
|
||||
relatedNo: 'xxxxxxxx',
|
||||
time: '2026-06-10 05:00',
|
||||
},
|
||||
{
|
||||
key: 't-4',
|
||||
type: '报名收入',
|
||||
amount: 350,
|
||||
balance: 850,
|
||||
withdrawable: 750,
|
||||
frozen: 100,
|
||||
status: '正常',
|
||||
frozenTime: '-',
|
||||
unfreezeTime: '-',
|
||||
relatedNo: 'xxxxxxxx',
|
||||
time: '2026-06-09 17:30',
|
||||
},
|
||||
{
|
||||
key: 't-5',
|
||||
type: '提现',
|
||||
amount: -250,
|
||||
balance: 600,
|
||||
withdrawable: 500,
|
||||
frozen: 100,
|
||||
status: '已解冻',
|
||||
frozenTime: '2026-06-08 10:00',
|
||||
unfreezeTime: '2026-06-09 08:00',
|
||||
relatedNo: 'xxxxxxxx',
|
||||
time: '2026-06-08 10:00',
|
||||
},
|
||||
];
|
||||
|
||||
// ============================================================
|
||||
// Model
|
||||
// ============================================================
|
||||
|
||||
/**
|
||||
* 用户钱包页数据模型
|
||||
*/
|
||||
export function useWalletModel() {
|
||||
// ===== 筛选条件 =====
|
||||
// ===== 筛选条件(字段名对齐 API) =====
|
||||
const filterForm = reactive({
|
||||
searchUserName: '',
|
||||
searchPhone: '',
|
||||
minBalance: '' as string | number,
|
||||
maxBalance: '' as string | number,
|
||||
nickname: '',
|
||||
phone: '',
|
||||
minBalance: '',
|
||||
maxBalance: '',
|
||||
});
|
||||
|
||||
// 可搜索字段防抖
|
||||
const { debouncedValue: debouncedUserName } = useDebounce(
|
||||
toRef(filterForm, 'searchUserName') as Ref<string>,
|
||||
const { debouncedValue: debouncedNickname } = useDebounce(
|
||||
toRef(filterForm, 'nickname') as Ref<string>,
|
||||
{ delay: 300 },
|
||||
);
|
||||
const { debouncedValue: debouncedPhone } = useDebounce(
|
||||
toRef(filterForm, 'searchPhone') as Ref<string>,
|
||||
toRef(filterForm, 'phone') as Ref<string>,
|
||||
{ delay: 300 },
|
||||
);
|
||||
|
||||
// ===== 顶部统计 =====
|
||||
const [summary, setSummary] = useState(MOCK_SUMMARY);
|
||||
// ===== 顶部统计(汇总值从接口返回的第一条记录中提取) =====
|
||||
const [summary, setSummary] = useState({
|
||||
totalBalance: '0.00',
|
||||
frozenAmount: '0.00',
|
||||
totalWithdraw: '0.00',
|
||||
});
|
||||
|
||||
// ===== 表格状态 =====
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [dataSource, setDataSource] = useState<any[]>(MOCK_DATA);
|
||||
const [pagination, setPagination] = useState({
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
total: MOCK_DATA.length,
|
||||
});
|
||||
const [dataSource, setDataSource] = useState<WalletSummaryVO[]>([]);
|
||||
const [pagination, setPagination] = useState({ current: 1, pageSize: 10, total: 0 });
|
||||
|
||||
// ===== 详情弹窗状态 =====
|
||||
const [detailVisible, setDetailVisible] = useState<boolean>(false);
|
||||
const [currentWallet, setCurrentWallet] = useState<any>({});
|
||||
const [detailLoading, setDetailLoading] = useState<boolean>(false);
|
||||
|
||||
// ===== 表格列配置 =====
|
||||
// ===== 表格列配置(dataIndex 对齐 API WalletSummaryVO) =====
|
||||
const columns = [
|
||||
{ title: '用户ID', dataIndex: 'userId', key: 'userId', width: 160 },
|
||||
{ title: '用户昵称', dataIndex: 'nickName', key: 'nickName', width: 120 },
|
||||
{ title: '用户ID', dataIndex: 'userId', key: 'userId', width: 120 },
|
||||
{ title: '用户昵称', dataIndex: 'userNickname', key: 'userNickname', width: 120 },
|
||||
{ title: '手机号', dataIndex: 'phone', key: 'phone', width: 140 },
|
||||
{
|
||||
title: '余额',
|
||||
dataIndex: 'balance',
|
||||
key: 'balance',
|
||||
width: 120,
|
||||
customRender: ({ text }: { text: number }) => `${(text || 0).toFixed(2)}`,
|
||||
dataIndex: 'amount',
|
||||
key: 'amount',
|
||||
width: 130,
|
||||
align: 'left' as const,
|
||||
},
|
||||
{
|
||||
title: '冻结金额',
|
||||
dataIndex: 'frozen',
|
||||
key: 'frozen',
|
||||
width: 120,
|
||||
customRender: ({ text }: { text: number }) => `${(text || 0).toFixed(2)}`,
|
||||
dataIndex: 'frozenAmount',
|
||||
key: 'frozenAmount',
|
||||
width: 130,
|
||||
align: 'left' as const,
|
||||
},
|
||||
{
|
||||
title: '累计提现',
|
||||
dataIndex: 'totalWithdraw',
|
||||
key: 'totalWithdraw',
|
||||
width: 120,
|
||||
customRender: ({ text }: { text: number }) => `${(text || 0).toFixed(2)}`,
|
||||
dataIndex: 'withdrawalAmount',
|
||||
key: 'withdrawalAmount',
|
||||
width: 130,
|
||||
align: 'left' as const,
|
||||
},
|
||||
];
|
||||
|
||||
// ===== 计算属性 =====
|
||||
const hasFilter = computed(() => {
|
||||
return (
|
||||
debouncedUserName.value.trim() !== '' ||
|
||||
debouncedNickname.value.trim() !== '' ||
|
||||
debouncedPhone.value.trim() !== '' ||
|
||||
filterForm.minBalance !== '' ||
|
||||
filterForm.maxBalance !== ''
|
||||
);
|
||||
});
|
||||
|
||||
// ===== 构建 API 查询参数 =====
|
||||
const buildQueryParams = (): WalletQueryParams => {
|
||||
const params: WalletQueryParams = {
|
||||
page: String(pagination.value.current),
|
||||
limit: String(pagination.value.pageSize),
|
||||
};
|
||||
if (debouncedNickname.value.trim()) params.nickname = debouncedNickname.value.trim();
|
||||
if (debouncedPhone.value.trim()) params.phone = debouncedPhone.value.trim();
|
||||
if (filterForm.minBalance) params.amountBegin = filterForm.minBalance;
|
||||
if (filterForm.maxBalance) params.amountEnd = filterForm.maxBalance;
|
||||
return params;
|
||||
};
|
||||
|
||||
// ===== 方法 =====
|
||||
|
||||
/** 查询(节流 500ms) */
|
||||
const handleSearch = useThrottleFn(async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
console.log('搜索条件:', {
|
||||
nickName: debouncedUserName.value,
|
||||
phone: debouncedPhone.value,
|
||||
minBalance: filterForm.minBalance,
|
||||
maxBalance: filterForm.maxBalance,
|
||||
// 余额筛选:若起始 > 截止,互换两值
|
||||
const min = Number(filterForm.minBalance);
|
||||
const max = Number(filterForm.maxBalance);
|
||||
if (filterForm.minBalance && filterForm.maxBalance && min > max) {
|
||||
filterForm.minBalance = filterForm.maxBalance;
|
||||
filterForm.maxBalance = String(min);
|
||||
}
|
||||
|
||||
const params = buildQueryParams();
|
||||
console.log('钱包列表查询参数:', params);
|
||||
const res = await getWalletList(params);
|
||||
if (res.code === 200) {
|
||||
console.log('钱包列表查询结果:', { total: res.data.total, count: res.data.list.length });
|
||||
setDataSource(res.data.list);
|
||||
setPagination({ ...pagination.value, total: res.data.total });
|
||||
// 从第一条记录提取汇总值
|
||||
if (res.data.list.length > 0) {
|
||||
const first = res.data.list[0];
|
||||
setSummary({
|
||||
totalBalance: first.totalAmount || '0.00',
|
||||
frozenAmount: first.totalFrozenAmount || '0.00',
|
||||
totalWithdraw: first.totalWithdrawalAmount || '0.00',
|
||||
});
|
||||
// TODO: 替换为真实 API 调用
|
||||
setDataSource(MOCK_DATA);
|
||||
setPagination({ ...pagination.value, total: MOCK_DATA.length });
|
||||
setSummary(MOCK_SUMMARY);
|
||||
message.success('查询成功');
|
||||
} catch (error: any) {
|
||||
message.error(error.msg || '查询失败');
|
||||
}
|
||||
}
|
||||
} catch {
|
||||
// 网络层已统一提示
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, 500);
|
||||
|
||||
/** 重置(节流 500ms) */
|
||||
const handleReset = useThrottleFn(() => {
|
||||
filterForm.searchUserName = '';
|
||||
filterForm.searchPhone = '';
|
||||
filterForm.nickname = '';
|
||||
filterForm.phone = '';
|
||||
filterForm.minBalance = '';
|
||||
filterForm.maxBalance = '';
|
||||
setPagination({ current: 1, pageSize: 10, total: MOCK_DATA.length });
|
||||
setDataSource(MOCK_DATA);
|
||||
setSummary(MOCK_SUMMARY);
|
||||
setPagination({ current: 1, pageSize: 10, total: 0 });
|
||||
setDataSource([]);
|
||||
setSummary({ totalBalance: '0.00', frozenAmount: '0.00', totalWithdraw: '0.00' });
|
||||
setTimeout(() => handleSearch(), 350);
|
||||
}, 500);
|
||||
|
||||
const handlePageChange = (page: number, pageSize: number) => {
|
||||
@@ -294,41 +178,15 @@ export function useWalletModel() {
|
||||
handleSearch();
|
||||
};
|
||||
|
||||
/** 打开明细弹窗 */
|
||||
const handleViewDetail = (record: any) => {
|
||||
setCurrentWallet(record);
|
||||
setDetailVisible(true);
|
||||
};
|
||||
|
||||
/** 关闭明细弹窗 */
|
||||
const handleCloseDetail = () => {
|
||||
setDetailVisible(false);
|
||||
};
|
||||
|
||||
/**
|
||||
* 加载某用户的交易明细
|
||||
* 真实场景应调用 API;演示阶段所有用户共用同一份假数据
|
||||
*/
|
||||
const loadTransactions = async (_record: any): Promise<any[]> => {
|
||||
setDetailLoading(true);
|
||||
try {
|
||||
// 模拟接口延迟
|
||||
await new Promise((resolve) => setTimeout(resolve, 200));
|
||||
return [...MOCK_TRANSACTIONS];
|
||||
} finally {
|
||||
setDetailLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
/** 渲染交易状态 StatusTag */
|
||||
const renderTransactionStatus = (status: string) => {
|
||||
const info = TRANSACTION_STATUS_MAP[status] || {
|
||||
label: status || '-',
|
||||
tone: 'default' as const,
|
||||
};
|
||||
return h(StatusTag, { label: info.label, tone: info.tone });
|
||||
};
|
||||
|
||||
return {
|
||||
filterForm,
|
||||
loading,
|
||||
@@ -339,14 +197,11 @@ export function useWalletModel() {
|
||||
hasFilter,
|
||||
detailVisible,
|
||||
currentWallet,
|
||||
detailLoading,
|
||||
handleSearch,
|
||||
handleReset,
|
||||
handlePageChange,
|
||||
handleViewDetail,
|
||||
handleCloseDetail,
|
||||
loadTransactions,
|
||||
renderTransactionStatus,
|
||||
TRANSACTION_TYPE_OPTIONS: TRANSACTION_TYPE_OPTIONS as any,
|
||||
TRANSACTION_STATUS_OPTIONS: TRANSACTION_STATUS_OPTIONS as any,
|
||||
};
|
||||
|
||||
+10
@@ -106,6 +106,12 @@
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
}
|
||||
|
||||
.auditImgList {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
// ===== 审核表单 =====
|
||||
.formRow {
|
||||
display: flex;
|
||||
@@ -189,6 +195,10 @@
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.auditImg + .auditImg {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.noImage {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
+115
-86
@@ -1,72 +1,80 @@
|
||||
import { defineComponent, reactive, ref, watch } from 'vue';
|
||||
import { Modal, Radio, Input, Button, Upload, Image, message } from 'ant-design-vue';
|
||||
import { Modal, Radio, Input, Button, Upload, Image, Spin, message } from 'ant-design-vue';
|
||||
import { PlusOutlined } from '@ant-design/icons-vue';
|
||||
import { useWithdrawModel } from '../model/useWithdrawModel';
|
||||
import styles from './WithdrawAuditModal.module.less';
|
||||
import { getWithdrawInfo, postWithdrawAudit, type WithdrawInfoVO } from '@/api/withdraw';
|
||||
import { AUDIT_STATUS_MAP, PAY_STATUS_MAP } from '../model/useWithdrawModel';
|
||||
import styles from './WithdrawDetailModal.module.less';
|
||||
|
||||
const { TextArea } = Input;
|
||||
|
||||
interface WithdrawAuditModalProps {
|
||||
interface WithdrawDetailModalProps {
|
||||
visible: boolean;
|
||||
record: any;
|
||||
onClose: () => void;
|
||||
onAudited: () => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 提现申请详情 / 审核弹窗
|
||||
*
|
||||
* 结构:
|
||||
* - 基本信息
|
||||
* - 银行卡信息
|
||||
* - 支付信息
|
||||
* - 审核操作
|
||||
* 提现详情 / 审核弹窗(查看与审核两用)
|
||||
*/
|
||||
export default defineComponent({
|
||||
name: 'WithdrawAuditModal',
|
||||
name: 'WithdrawDetailModal',
|
||||
props: {
|
||||
visible: { type: Boolean, default: false },
|
||||
record: { type: Object, default: () => ({}) },
|
||||
onClose: { type: Function, required: true },
|
||||
onAudited: { type: Function, default: undefined },
|
||||
},
|
||||
setup(props: WithdrawAuditModalProps) {
|
||||
const { submitAudit } = useWithdrawModel();
|
||||
setup(props: WithdrawDetailModalProps) {
|
||||
const detail = ref<WithdrawInfoVO | null>(null);
|
||||
const detailLoading = ref(false);
|
||||
|
||||
// ===== 表单状态 =====
|
||||
const auditForm = reactive({
|
||||
pass: true,
|
||||
remark: '',
|
||||
});
|
||||
const auditForm = reactive({ pass: true, remark: '' });
|
||||
const imageList = ref<any[]>([]);
|
||||
const submitting = ref<boolean>(false);
|
||||
const submitting = ref(false);
|
||||
|
||||
// ===== 拉取详情 =====
|
||||
const fetchDetail = async (id: number) => {
|
||||
detailLoading.value = true;
|
||||
detail.value = null;
|
||||
try {
|
||||
const res = await getWithdrawInfo(id);
|
||||
if (res.code === 200) detail.value = res.data;
|
||||
} catch {
|
||||
// 网络层已统一提示
|
||||
} finally {
|
||||
detailLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
/** 监听 visible:每次打开都重置表单 */
|
||||
watch(
|
||||
() => props.visible,
|
||||
(val) => {
|
||||
if (val) {
|
||||
async (val) => {
|
||||
if (val && props.record?.id) {
|
||||
auditForm.pass = true;
|
||||
auditForm.remark = '';
|
||||
imageList.value = [];
|
||||
submitting.value = false;
|
||||
await fetchDetail(props.record.id);
|
||||
}
|
||||
},
|
||||
{ immediate: true },
|
||||
);
|
||||
|
||||
/** 上传前校验(演示用:限制 5 张 & 5MB) */
|
||||
// ===== 上传 =====
|
||||
const beforeUpload = (file: any) => {
|
||||
const isLt5M = file.size / 1024 / 1024 < 5;
|
||||
if (!isLt5M) {
|
||||
if (file.size / 1024 / 1024 >= 5) {
|
||||
message.error('图片大小不能超过 5MB');
|
||||
return false;
|
||||
}
|
||||
imageList.value = [...imageList.value, file];
|
||||
return false; // 阻止自动上传,由"提交审核"按钮统一处理
|
||||
return false;
|
||||
};
|
||||
|
||||
const handleRemove = (file: any) => {
|
||||
imageList.value = imageList.value.filter((f) => f.uid !== file.uid);
|
||||
};
|
||||
|
||||
// ===== 提交审核 =====
|
||||
const handleSubmit = async () => {
|
||||
if (!auditForm.remark.trim()) {
|
||||
message.warning('请输入审核内容');
|
||||
@@ -74,17 +82,30 @@ export default defineComponent({
|
||||
}
|
||||
submitting.value = true;
|
||||
try {
|
||||
// 真实场景应上传图片并调用审核 API
|
||||
const urls = imageList.value.map((f) => f.name || '');
|
||||
submitAudit(auditForm.pass, auditForm.remark.trim(), urls);
|
||||
const checkImg = imageList.value
|
||||
.map((f) => f.name || f.url || '')
|
||||
.filter(Boolean)
|
||||
.join(',');
|
||||
const res = await postWithdrawAudit({
|
||||
id: String(props.record.id),
|
||||
audit: auditForm.pass ? '1' : '2',
|
||||
checkMsg: auditForm.remark.trim(),
|
||||
checkImg,
|
||||
});
|
||||
if (res.code === 200) {
|
||||
message.success(auditForm.pass ? '已审核通过' : '已审核驳回');
|
||||
props.onAudited?.();
|
||||
props.onClose();
|
||||
} else {
|
||||
message.error(res.msg || '审核失败');
|
||||
}
|
||||
} catch {
|
||||
// 网络层已统一提示
|
||||
} finally {
|
||||
submitting.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 通用描述项渲染
|
||||
*/
|
||||
const renderItem = (label: string, value: any, isBold = false) => (
|
||||
<div class={styles.descItem}>
|
||||
<span class={styles.descLabel}>{label}</span>
|
||||
@@ -92,47 +113,30 @@ export default defineComponent({
|
||||
</div>
|
||||
);
|
||||
|
||||
return () => {
|
||||
const record = props.record || {};
|
||||
const bank = record.bank || {};
|
||||
const pay = record.pay || {};
|
||||
const isPending = record.auditStatus === '待审核';
|
||||
/** 渲染内容区(加载完成后) */
|
||||
const renderContent = () => {
|
||||
const d = detail.value!;
|
||||
const bankCardTypeLabel = d.bankCardType === 1 ? '个人' : d.bankCardType || '-';
|
||||
const isPending = d.auditStatus === 0;
|
||||
|
||||
return (
|
||||
<Modal
|
||||
visible={props.visible}
|
||||
onCancel={props.onClose}
|
||||
width={850}
|
||||
centered
|
||||
footer={null}
|
||||
title={null}
|
||||
closable={false}
|
||||
wrapClassName={styles.withdrawAuditModalMain}
|
||||
>
|
||||
{/* 自定义标题栏 */}
|
||||
<div class={styles.modalHeader}>
|
||||
<span class={styles.modalTitle}>提现申请详情</span>
|
||||
<button class={styles.closeBtn} onClick={props.onClose}>
|
||||
×
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<>
|
||||
{/* ===== 基本信息 ===== */}
|
||||
<div class={styles.section}>
|
||||
<div class={styles.sectionTitle}>基本信息</div>
|
||||
<div class={styles.descGrid}>
|
||||
{renderItem('申请人昵称:', record.nickName)}
|
||||
{renderItem('申请人手机号:', record.phone)}
|
||||
{renderItem('真实姓名:', record.realName)}
|
||||
{renderItem('申请时间:', record.applyTime)}
|
||||
{renderItem('打款类型:', record.withdrawType)}
|
||||
{renderItem('申请人昵称:', d.nickname)}
|
||||
{renderItem('申请人手机号:', d.phone)}
|
||||
{renderItem('真实姓名:', d.realName)}
|
||||
{renderItem('申请时间:', d.createDate)}
|
||||
{renderItem('打款类型:', d.withdrawType)}
|
||||
<div style="display: contents;" />
|
||||
{renderItem('提现金额:', `¥${(record.withdrawAmount || 0).toFixed(2)}`, true)}
|
||||
{renderItem('费率:', `${((record.feeRate || 0) * 100).toFixed(2)}%`)}
|
||||
{renderItem('手续费:', `¥${(record.feeAmount || 0).toFixed(2)}`)}
|
||||
{renderItem('到账金额:', `¥${(record.transferAmount || 0).toFixed(2)}`, true)}
|
||||
{renderItem('审核状态:', record.auditStatus, true)}
|
||||
{renderItem('列账状态:', record.transferStatus || '-')}
|
||||
{renderItem('提现金额:', `¥${d.withdrawAmount}`, true)}
|
||||
{renderItem('费率:', `${(Number(d.feeRate) * 100).toFixed(2)}%`)}
|
||||
{renderItem('手续费:', `¥${d.feeAmount}`)}
|
||||
{renderItem('到账金额:', `¥${d.receivedAmount}`, true)}
|
||||
{renderItem('审核状态:', AUDIT_STATUS_MAP[d.auditStatus] ?? '-', true)}
|
||||
{renderItem('列账状态:', PAY_STATUS_MAP[d.payStatus] ?? '-')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -140,11 +144,11 @@ export default defineComponent({
|
||||
<div class={styles.section}>
|
||||
<div class={styles.sectionTitle}>银行卡信息</div>
|
||||
<div class={styles.descGrid}>
|
||||
{renderItem('银行卡类型:', bank.cardType)}
|
||||
{renderItem('持卡人:', bank.holder)}
|
||||
{renderItem('银行卡号:', bank.cardNo)}
|
||||
{renderItem('开户行:', bank.bankName)}
|
||||
{renderItem('开户支行:', bank.branchName)}
|
||||
{renderItem('银行卡类型:', bankCardTypeLabel)}
|
||||
{renderItem('持卡人:', d.cardHolderName)}
|
||||
{renderItem('银行卡号:', d.bankCardNumber)}
|
||||
{renderItem('开户行:', d.bankName)}
|
||||
{renderItem('开户支行:', d.branchName)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -152,8 +156,8 @@ export default defineComponent({
|
||||
<div class={styles.section}>
|
||||
<div class={styles.sectionTitle}>支付信息</div>
|
||||
<div class={styles.descGrid}>
|
||||
{renderItem('到账支付时间:', pay.transferTime || '-')}
|
||||
{renderItem('商户订单号:', pay.merchantNo)}
|
||||
{renderItem('到账支付时间:', d.payTime || '-')}
|
||||
{renderItem('订单号:', d.orderNo)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -169,10 +173,9 @@ export default defineComponent({
|
||||
onUpdate:value={(val: boolean) => (auditForm.pass = val)}
|
||||
>
|
||||
<Radio value={true}>通过</Radio>
|
||||
<Radio value={false}>未通过</Radio>
|
||||
<Radio value={false}>驳回</Radio>
|
||||
</Radio.Group>
|
||||
</div>
|
||||
|
||||
<div class={styles.formRow}>
|
||||
<span class={[styles.formLabel, styles.formLabelTop]}>审核内容</span>
|
||||
<TextArea
|
||||
@@ -184,7 +187,6 @@ export default defineComponent({
|
||||
style={{ flex: 1 }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class={styles.formRow}>
|
||||
<span class={[styles.formLabel, styles.formLabelTop]}>审核图片</span>
|
||||
<Upload
|
||||
@@ -203,7 +205,6 @@ export default defineComponent({
|
||||
)}
|
||||
</Upload>
|
||||
</div>
|
||||
|
||||
<div class={styles.footer}>
|
||||
<Button type="primary" onClick={handleSubmit} loading={submitting.value}>
|
||||
提交审核
|
||||
@@ -214,13 +215,13 @@ export default defineComponent({
|
||||
<>
|
||||
<div class={styles.sectionTitle}>审核信息</div>
|
||||
<div class={styles.infoColumn}>
|
||||
{renderItem('审核时间:', record.auditTime)}
|
||||
{renderItem('审核人:', record.auditor)}
|
||||
{renderItem('审核时间:', d.auditDate)}
|
||||
{renderItem('审核人:', d.auditNickname)}
|
||||
<div class={styles.descItem}>
|
||||
<span class={styles.descLabel}>审核图片:</span>
|
||||
{record.auditImages && record.auditImages.length ? (
|
||||
<Image.PreviewGroup>
|
||||
{record.auditImages.map((src: string, idx: number) => (
|
||||
{d.auditImgList?.length ? (
|
||||
<div class={styles.auditImgList}>
|
||||
{d.auditImgList.map((src: string, idx: number) => (
|
||||
<Image
|
||||
key={idx}
|
||||
src={src}
|
||||
@@ -229,7 +230,7 @@ export default defineComponent({
|
||||
class={styles.auditImg}
|
||||
/>
|
||||
))}
|
||||
</Image.PreviewGroup>
|
||||
</div>
|
||||
) : (
|
||||
<span class={[styles.descValue, styles.noImage]}>暂无</span>
|
||||
)}
|
||||
@@ -238,8 +239,36 @@ export default defineComponent({
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
return () => (
|
||||
<Modal
|
||||
visible={props.visible}
|
||||
onCancel={props.onClose}
|
||||
width={850}
|
||||
centered
|
||||
footer={null}
|
||||
title={null}
|
||||
closable={false}
|
||||
wrapClassName={styles.withdrawAuditModalMain}
|
||||
>
|
||||
<div class={styles.modalHeader}>
|
||||
<span class={styles.modalTitle}>提现申请详情</span>
|
||||
<button class={styles.closeBtn} onClick={props.onClose}>
|
||||
×
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{detailLoading.value ? (
|
||||
<div style={{ textAlign: 'center', padding: '80px 0' }}>
|
||||
<Spin size="large" />
|
||||
</div>
|
||||
) : detail.value ? (
|
||||
renderContent()
|
||||
) : null}
|
||||
</Modal>
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -1,8 +1,8 @@
|
||||
import { defineComponent } from 'vue';
|
||||
import { defineComponent, onMounted } from 'vue';
|
||||
import { Button, Input, Table, Form, Space, Pagination, Select } from 'ant-design-vue';
|
||||
import { useWithdrawModel } from './model/useWithdrawModel';
|
||||
import { useWithdrawModel, AUDIT_STATUS_MAP, PAY_STATUS_MAP } from './model/useWithdrawModel';
|
||||
import { useContainerSize } from '@/hooks';
|
||||
import WithdrawAuditModal from './components/WithdrawAuditModal';
|
||||
import WithdrawDetailModal from './components/WithdrawDetailModal';
|
||||
import pageStyles from '@/assets/styles/pageLayout.module.less';
|
||||
|
||||
/**
|
||||
@@ -20,16 +20,21 @@ function renderBodyCell({
|
||||
onAudit: (record: any) => void;
|
||||
onView: (record: any) => void;
|
||||
}) {
|
||||
if (column.key === 'auditStatus') {
|
||||
return <span>{AUDIT_STATUS_MAP[record.auditStatus] || record.auditStatus || '-'}</span>;
|
||||
}
|
||||
if (column.key === 'payStatus') {
|
||||
return <span>{PAY_STATUS_MAP[record.payStatus] ?? '-'}</span>;
|
||||
}
|
||||
if (column.key === 'action') {
|
||||
// 待审核:显示「审核」
|
||||
if (record.auditStatus === '待审核') {
|
||||
// auditStatus=0(待审核)→ 显示「审核」,其他 → 显示「查看」
|
||||
if (record.auditStatus === 0) {
|
||||
return (
|
||||
<Button type="link" size="small" onClick={() => onAudit(record)}>
|
||||
审核
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
// 其它状态:仅显示「查看」
|
||||
return (
|
||||
<Button type="link" size="small" onClick={() => onView(record)}>
|
||||
查看
|
||||
@@ -60,7 +65,7 @@ export default defineComponent({
|
||||
handleCloseAudit,
|
||||
handleView,
|
||||
AUDIT_STATUS_OPTIONS,
|
||||
TRANSFER_STATUS_OPTIONS,
|
||||
PAY_STATUS_OPTIONS,
|
||||
} = useWithdrawModel();
|
||||
|
||||
const { containerRef, height } = useContainerSize({ headerOffset: 55 });
|
||||
@@ -77,21 +82,28 @@ export default defineComponent({
|
||||
},
|
||||
];
|
||||
|
||||
// 首次进入自动加载
|
||||
onMounted(() => {
|
||||
handleSearch();
|
||||
});
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
<Form.Item label="申请人昵称" name="searchUserName">
|
||||
<Form.Item label="申请人昵称" name="nickname">
|
||||
<Input
|
||||
v-model:value={filterForm.nickname}
|
||||
placeholder="请输入"
|
||||
style={{ width: '160px' }}
|
||||
allowClear
|
||||
onPressEnter={handleSearch}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="手机号" name="searchPhone">
|
||||
<Form.Item label="手机号" name="phone">
|
||||
<Input
|
||||
v-model:value={filterForm.phone}
|
||||
placeholder="请输入"
|
||||
style={{ width: '160px' }}
|
||||
allowClear
|
||||
@@ -100,6 +112,7 @@ export default defineComponent({
|
||||
</Form.Item>
|
||||
<Form.Item label="真实姓名" name="realName">
|
||||
<Input
|
||||
v-model:value={filterForm.realName}
|
||||
placeholder="请输入"
|
||||
style={{ width: '160px' }}
|
||||
allowClear
|
||||
@@ -109,19 +122,21 @@ export default defineComponent({
|
||||
<Form.Item label="审核状态" name="auditStatus">
|
||||
<Select
|
||||
value={filterForm.auditStatus}
|
||||
options={AUDIT_STATUS_OPTIONS as any}
|
||||
options={AUDIT_STATUS_OPTIONS}
|
||||
style={{ width: '140px' }}
|
||||
allowClear
|
||||
placeholder="全部"
|
||||
onUpdate:value={(val: any) => (filterForm.auditStatus = val || '')}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="到账状态" name="transferStatus">
|
||||
<Form.Item label="到账状态" name="payStatus">
|
||||
<Select
|
||||
value={filterForm.transferStatus}
|
||||
options={TRANSFER_STATUS_OPTIONS as any}
|
||||
value={filterForm.payStatus}
|
||||
options={PAY_STATUS_OPTIONS}
|
||||
style={{ width: '140px' }}
|
||||
allowClear
|
||||
onUpdate:value={(val: any) => (filterForm.transferStatus = val || '')}
|
||||
placeholder="全部"
|
||||
onUpdate:value={(val: any) => (filterForm.payStatus = val || '')}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
@@ -142,6 +157,7 @@ export default defineComponent({
|
||||
columns={tableColumns}
|
||||
dataSource={dataSource.value}
|
||||
loading={loading.value}
|
||||
rowKey="id"
|
||||
scroll={{ x: 'max-content', y: height.value }}
|
||||
pagination={false}
|
||||
>
|
||||
@@ -165,17 +181,19 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ===== 审核弹窗 ===== */}
|
||||
<WithdrawAuditModal
|
||||
{auditVisible.value && (
|
||||
<WithdrawDetailModal
|
||||
visible={auditVisible.value}
|
||||
record={currentRecord.value}
|
||||
onClose={handleCloseAudit}
|
||||
onAudited={handleSearch}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
|
||||
@@ -1,159 +1,40 @@
|
||||
import { reactive, toRef, Ref } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { computed, reactive, toRef, Ref } from 'vue';
|
||||
import { useState, useDebounce, useThrottleFn } from '@/hooks';
|
||||
import { getWithdrawList, type WithdrawVO, type WithdrawQueryParams } from '@/api/withdraw';
|
||||
|
||||
// ============================================================
|
||||
// 常量
|
||||
// ============================================================
|
||||
|
||||
/** 审核状态选项(筛选) */
|
||||
/** 审核状态选项(value 对齐 API auditStatus: 0/1/2) */
|
||||
export const AUDIT_STATUS_OPTIONS = [
|
||||
{ value: '', label: '全部' },
|
||||
{ value: '待审核', label: '待审核' },
|
||||
{ value: '审核通过', label: '审核通过' },
|
||||
{ value: '审核不通过', label: '审核不通过' },
|
||||
{ value: '0', label: '待审核' },
|
||||
{ value: '1', label: '审核通过' },
|
||||
{ value: '2', label: '审核驳回' },
|
||||
] as const;
|
||||
|
||||
/** 到账状态选项(筛选) */
|
||||
export const TRANSFER_STATUS_OPTIONS = [
|
||||
/** 到账状态选项(value 对齐 API payStatus: 0/1/2) */
|
||||
export const PAY_STATUS_OPTIONS = [
|
||||
{ value: '', label: '全部' },
|
||||
{ value: '到账成功', label: '到账成功' },
|
||||
{ value: '到账失败', label: '到账失败' },
|
||||
{ value: '-', label: '-' },
|
||||
{ value: '0', label: '未支付' },
|
||||
{ value: '1', label: '支付成功' },
|
||||
{ value: '2', label: '支付失败' },
|
||||
] as const;
|
||||
|
||||
/** 提现类型选项(筛选) */
|
||||
export const WITHDRAW_TYPE_OPTIONS = [
|
||||
{ value: '', label: '全部' },
|
||||
{ value: '银行卡', label: '银行卡' },
|
||||
{ value: '支付宝', label: '支付宝' },
|
||||
{ value: '微信', label: '微信' },
|
||||
] as const;
|
||||
/** 审核状态文案映射 */
|
||||
export const AUDIT_STATUS_MAP: Record<number, string> = {
|
||||
0: '待审核',
|
||||
1: '审核通过',
|
||||
2: '审核驳回',
|
||||
};
|
||||
|
||||
// ============================================================
|
||||
// 提现假数据(4 条,覆盖各审核/到账状态组合)
|
||||
// ============================================================
|
||||
|
||||
const MOCK_DATA = [
|
||||
{
|
||||
key: '1',
|
||||
nickName: '可乐',
|
||||
phone: '17762466262',
|
||||
realName: '可乐',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: 1.0,
|
||||
feeRate: 0.006,
|
||||
feeAmount: 0.01,
|
||||
transferAmount: 0.99,
|
||||
auditStatus: '待审核',
|
||||
transferStatus: '',
|
||||
thirdNo: '',
|
||||
applyTime: '2026-04-11 09:53',
|
||||
// 银行卡信息
|
||||
bank: {
|
||||
cardType: '个人',
|
||||
holder: '龚',
|
||||
cardNo: '6215581807006475126',
|
||||
bankName: '交通银行',
|
||||
branchName: '交通银行宜昌西坝支行',
|
||||
},
|
||||
// 支付信息
|
||||
pay: {
|
||||
transferTime: '',
|
||||
merchantNo: 'WD04111775872421935100',
|
||||
},
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
nickName: '李四',
|
||||
phone: '12345678998',
|
||||
realName: '李四',
|
||||
withdrawType: '支付宝',
|
||||
withdrawAmount: 200.0,
|
||||
feeRate: 0.006,
|
||||
feeAmount: 1.2,
|
||||
transferAmount: 198.8,
|
||||
auditStatus: '审核通过',
|
||||
transferStatus: '到账成功',
|
||||
thirdNo: 'yyyyyyyyyy',
|
||||
applyTime: '2026-05-25 14:30:00',
|
||||
bank: {
|
||||
cardType: '个人',
|
||||
holder: '李四',
|
||||
cardNo: '6222021234567890123',
|
||||
bankName: '工商银行',
|
||||
branchName: '工商银行北京中关村支行',
|
||||
},
|
||||
pay: {
|
||||
transferTime: '2026-05-25 14:35:00',
|
||||
merchantNo: 'WD0000111122223333',
|
||||
},
|
||||
// 审核信息(已审核后展示)
|
||||
auditTime: '2026-05-25 14:32:00',
|
||||
auditor: '管理员A',
|
||||
auditImages: [],
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
nickName: '王五',
|
||||
phone: '13800138000',
|
||||
realName: '王五',
|
||||
withdrawType: '微信',
|
||||
withdrawAmount: 500.0,
|
||||
feeRate: 0.006,
|
||||
feeAmount: 3.0,
|
||||
transferAmount: 497.0,
|
||||
auditStatus: '审核通过',
|
||||
transferStatus: '到账失败',
|
||||
thirdNo: 'zzzzzzzzzz',
|
||||
applyTime: '2026-05-24 11:15:00',
|
||||
bank: {
|
||||
cardType: '个人',
|
||||
holder: '王五',
|
||||
cardNo: '微信钱包',
|
||||
bankName: '微信支付',
|
||||
branchName: '-',
|
||||
},
|
||||
pay: {
|
||||
transferTime: '',
|
||||
merchantNo: 'WD9999888877776666',
|
||||
},
|
||||
// 审核信息(已审核后展示)
|
||||
auditTime: '2026-05-24 11:20:00',
|
||||
auditor: '管理员B',
|
||||
auditImages: [],
|
||||
},
|
||||
{
|
||||
key: '4',
|
||||
nickName: '赵六',
|
||||
phone: '13900139001',
|
||||
realName: '赵六',
|
||||
withdrawType: '银行卡',
|
||||
withdrawAmount: 80.0,
|
||||
feeRate: 0.006,
|
||||
feeAmount: 0.48,
|
||||
transferAmount: 79.52,
|
||||
auditStatus: '审核不通过',
|
||||
transferStatus: '',
|
||||
thirdNo: '',
|
||||
applyTime: '2026-05-23 09:45:00',
|
||||
bank: {
|
||||
cardType: '个人',
|
||||
holder: '赵六',
|
||||
cardNo: '6217858000123456789',
|
||||
bankName: '建设银行',
|
||||
branchName: '建设银行上海陆家嘴支行',
|
||||
},
|
||||
pay: {
|
||||
transferTime: '',
|
||||
merchantNo: '',
|
||||
},
|
||||
// 审核信息(已审核后展示)
|
||||
auditTime: '2026-05-23 10:00:00',
|
||||
auditor: '管理员A',
|
||||
auditImages: [],
|
||||
},
|
||||
];
|
||||
/** 到账状态文案映射 */
|
||||
export const PAY_STATUS_MAP: Record<number, string> = {
|
||||
0: '未支付',
|
||||
1: '支付成功',
|
||||
2: '支付失败',
|
||||
};
|
||||
|
||||
// ============================================================
|
||||
// Model
|
||||
@@ -163,22 +44,22 @@ const MOCK_DATA = [
|
||||
* 提现申请页数据模型
|
||||
*/
|
||||
export function useWithdrawModel() {
|
||||
// ===== 筛选条件 =====
|
||||
// ===== 筛选条件(字段名对齐 API 查询参数) =====
|
||||
const filterForm = reactive({
|
||||
searchUserName: '',
|
||||
searchPhone: '',
|
||||
nickname: '',
|
||||
phone: '',
|
||||
realName: '',
|
||||
auditStatus: '',
|
||||
transferStatus: '',
|
||||
payStatus: '',
|
||||
});
|
||||
|
||||
// 可搜索字段防抖
|
||||
const { debouncedValue: debouncedUserName } = useDebounce(
|
||||
toRef(filterForm, 'searchUserName') as Ref<string>,
|
||||
const { debouncedValue: debouncedNickname } = useDebounce(
|
||||
toRef(filterForm, 'nickname') as Ref<string>,
|
||||
{ delay: 300 },
|
||||
);
|
||||
const { debouncedValue: debouncedPhone } = useDebounce(
|
||||
toRef(filterForm, 'searchPhone') as Ref<string>,
|
||||
toRef(filterForm, 'phone') as Ref<string>,
|
||||
{ delay: 300 },
|
||||
);
|
||||
const { debouncedValue: debouncedRealName } = useDebounce(
|
||||
@@ -188,96 +69,95 @@ export function useWithdrawModel() {
|
||||
|
||||
// ===== 表格状态 =====
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [dataSource, setDataSource] = useState<any[]>(MOCK_DATA);
|
||||
const [pagination, setPagination] = useState({
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
total: MOCK_DATA.length,
|
||||
});
|
||||
const [dataSource, setDataSource] = useState<WithdrawVO[]>([]);
|
||||
const [pagination, setPagination] = useState({ current: 1, pageSize: 10, total: 0 });
|
||||
|
||||
// ===== 审核弹窗状态 =====
|
||||
const [auditVisible, setAuditVisible] = useState<boolean>(false);
|
||||
const [currentRecord, setCurrentRecord] = useState<any>({});
|
||||
|
||||
// ===== 表格列配置 =====
|
||||
// ===== 表格列配置(dataIndex 对齐 API WithdrawVO) =====
|
||||
const columns = [
|
||||
{ title: '申请人昵称', dataIndex: 'nickName', key: 'nickName', width: 120 },
|
||||
{ title: '申请人昵称', dataIndex: 'nickname', key: 'nickname', width: 120 },
|
||||
{ title: '申请人手机号', dataIndex: 'phone', key: 'phone', width: 140 },
|
||||
{ title: '真实姓名', dataIndex: 'realName', key: 'realName', width: 120 },
|
||||
{
|
||||
title: '提现类型',
|
||||
dataIndex: 'withdrawType',
|
||||
key: 'withdrawType',
|
||||
width: 110,
|
||||
},
|
||||
{ title: '提现类型', dataIndex: 'withdrawType', key: 'withdrawType', width: 110 },
|
||||
{
|
||||
title: '提现金额',
|
||||
dataIndex: 'withdrawAmount',
|
||||
key: 'withdrawAmount',
|
||||
width: 120,
|
||||
customRender: ({ text }: { text: number }) => `${(text || 0).toFixed(2)}`,
|
||||
width: 130,
|
||||
align: 'left' as const,
|
||||
},
|
||||
{
|
||||
title: '到账金额',
|
||||
dataIndex: 'transferAmount',
|
||||
key: 'transferAmount',
|
||||
width: 120,
|
||||
customRender: ({ text }: { text: number }) => `${(text || 0).toFixed(2)}`,
|
||||
},
|
||||
{
|
||||
title: '审核状态',
|
||||
dataIndex: 'auditStatus',
|
||||
key: 'auditStatus',
|
||||
width: 110,
|
||||
},
|
||||
{
|
||||
title: '到账状态',
|
||||
dataIndex: 'transferStatus',
|
||||
key: 'transferStatus',
|
||||
width: 110,
|
||||
},
|
||||
{ title: '第三方单号', dataIndex: 'thirdNo', key: 'thirdNo', width: 160 },
|
||||
{
|
||||
title: '申请时间',
|
||||
dataIndex: 'applyTime',
|
||||
key: 'applyTime',
|
||||
width: 170,
|
||||
dataIndex: 'receivedAmount',
|
||||
key: 'receivedAmount',
|
||||
width: 130,
|
||||
align: 'left' as const,
|
||||
},
|
||||
{ title: '审核状态', dataIndex: 'auditStatus', key: 'auditStatus', width: 110 },
|
||||
{ title: '到账状态', dataIndex: 'payStatus', key: 'payStatus', width: 110 },
|
||||
{ title: '流水单号', dataIndex: 'serialNumber', key: 'serialNumber', width: 180 },
|
||||
{ title: '申请时间', dataIndex: 'createDate', key: 'createDate', width: 180 },
|
||||
];
|
||||
|
||||
// ===== 计算属性 =====
|
||||
const hasFilter = computed(() => {
|
||||
return (
|
||||
debouncedNickname.value.trim() !== '' ||
|
||||
debouncedPhone.value.trim() !== '' ||
|
||||
debouncedRealName.value.trim() !== '' ||
|
||||
filterForm.auditStatus !== '' ||
|
||||
filterForm.payStatus !== ''
|
||||
);
|
||||
});
|
||||
|
||||
// ===== 构建 API 查询参数 =====
|
||||
const buildQueryParams = (): WithdrawQueryParams => {
|
||||
const params: WithdrawQueryParams = {
|
||||
page: String(pagination.value.current),
|
||||
limit: String(pagination.value.pageSize),
|
||||
};
|
||||
if (debouncedNickname.value.trim()) params.nickname = debouncedNickname.value.trim();
|
||||
if (debouncedPhone.value.trim()) params.phone = debouncedPhone.value.trim();
|
||||
if (debouncedRealName.value.trim()) params.realName = debouncedRealName.value.trim();
|
||||
if (filterForm.auditStatus) params.auditStatus = filterForm.auditStatus;
|
||||
if (filterForm.payStatus) params.payStatus = filterForm.payStatus;
|
||||
return params;
|
||||
};
|
||||
|
||||
// ===== 方法 =====
|
||||
|
||||
/** 查询(节流 500ms) */
|
||||
const handleSearch = useThrottleFn(async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
console.log('搜索条件:', {
|
||||
nickName: debouncedUserName.value,
|
||||
phone: debouncedPhone.value,
|
||||
realName: debouncedRealName.value,
|
||||
auditStatus: filterForm.auditStatus,
|
||||
transferStatus: filterForm.transferStatus,
|
||||
});
|
||||
// TODO: 替换为真实 API 调用
|
||||
setDataSource(MOCK_DATA);
|
||||
setPagination({ ...pagination.value, total: MOCK_DATA.length });
|
||||
message.success('查询成功');
|
||||
} catch (error: any) {
|
||||
message.error(error.msg || '查询失败');
|
||||
const queryParams = buildQueryParams();
|
||||
console.log('提现列表查询参数:', queryParams);
|
||||
const res = await getWithdrawList(queryParams);
|
||||
if (res.code === 200) {
|
||||
console.log('提现列表查询结果:', { total: res.data.total, count: res.data.list.length });
|
||||
setDataSource(res.data.list);
|
||||
setPagination({ ...pagination.value, total: res.data.total });
|
||||
}
|
||||
} catch {
|
||||
// 网络层已统一提示
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, 500);
|
||||
|
||||
/** 重置(节流 500ms) */
|
||||
/** 重置(重置后自动查询) */
|
||||
const handleReset = useThrottleFn(() => {
|
||||
filterForm.searchUserName = '';
|
||||
filterForm.searchPhone = '';
|
||||
filterForm.nickname = '';
|
||||
filterForm.phone = '';
|
||||
filterForm.realName = '';
|
||||
filterForm.auditStatus = '';
|
||||
filterForm.transferStatus = '';
|
||||
setPagination({ current: 1, pageSize: 10, total: MOCK_DATA.length });
|
||||
setDataSource(MOCK_DATA);
|
||||
filterForm.payStatus = '';
|
||||
setPagination({ current: 1, pageSize: 10, total: 0 });
|
||||
setDataSource([]);
|
||||
setTimeout(() => handleSearch(), 350);
|
||||
}, 500);
|
||||
|
||||
const handlePageChange = (page: number, pageSize: number) => {
|
||||
@@ -285,10 +165,7 @@ export function useWithdrawModel() {
|
||||
handleSearch();
|
||||
};
|
||||
|
||||
/**
|
||||
* 打开审核弹窗
|
||||
* 真实场景应调用 API;此处直接用列表中的 record
|
||||
*/
|
||||
/** 打开审核弹窗 */
|
||||
const handleAudit = (record: any) => {
|
||||
setCurrentRecord(record);
|
||||
setAuditVisible(true);
|
||||
@@ -299,22 +176,6 @@ export function useWithdrawModel() {
|
||||
setAuditVisible(false);
|
||||
};
|
||||
|
||||
/**
|
||||
* 提交审核结果(在弹窗中调用)
|
||||
* pass = true 通过 / false 不通过
|
||||
*/
|
||||
const submitAudit = (pass: boolean, _remark: string, _images: string[]) => {
|
||||
setDataSource(
|
||||
dataSource.value.map((item) =>
|
||||
item.key === currentRecord.value.key
|
||||
? { ...item, auditStatus: pass ? '审核通过' : '审核不通过' }
|
||||
: item,
|
||||
),
|
||||
);
|
||||
message.success(pass ? '已审核通过' : '已审核不通过');
|
||||
handleCloseAudit();
|
||||
};
|
||||
|
||||
/** 查看:打开同一个详情弹窗(只读展示审核信息) */
|
||||
const handleView = (record: any) => {
|
||||
setCurrentRecord(record);
|
||||
@@ -334,9 +195,8 @@ export function useWithdrawModel() {
|
||||
handlePageChange,
|
||||
handleAudit,
|
||||
handleCloseAudit,
|
||||
submitAudit,
|
||||
handleView,
|
||||
AUDIT_STATUS_OPTIONS: AUDIT_STATUS_OPTIONS as any,
|
||||
TRANSFER_STATUS_OPTIONS: TRANSFER_STATUS_OPTIONS as any,
|
||||
PAY_STATUS_OPTIONS: PAY_STATUS_OPTIONS as any,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -108,7 +108,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -167,7 +167,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -179,7 +179,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -258,7 +258,6 @@ export default defineComponent({
|
||||
showSizeChanger
|
||||
showTotal={(total: number) => `共 ${total} 条`}
|
||||
onChange={handlePageChange}
|
||||
onShowSizeChange={handlePageChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user