增加提现相关的与打款相关逻辑
This commit is contained in:
yml
@@ -0,0 +1,75 @@
|
||||
import { apiClient } from '@/shared/api/client'
|
||||
|
||||
import type { ApiResponse, PaginatedResult } from '@/shared/types/types'
|
||||
|
||||
// 管理员端提现详情接口
|
||||
export interface WithdrawalDetail {
|
||||
id: number
|
||||
withdraw_no: string
|
||||
user_id: number
|
||||
user_nickname: string
|
||||
user_phone: string
|
||||
amount: number
|
||||
fee: number
|
||||
actual_amount: number
|
||||
payment_account_id: number | null
|
||||
account_type: string
|
||||
account_name: string
|
||||
account_no: string // 管理员可见完整账号
|
||||
bank_name: string
|
||||
bank_branch: string
|
||||
certificate_urls: string[] // 收款二维码图片
|
||||
status: string
|
||||
reviewed_by: number | null
|
||||
reviewed_by_name: string
|
||||
reviewed_at: string | null
|
||||
review_remark: string
|
||||
paid_by: number | null
|
||||
paid_by_name: string
|
||||
paid_at: string | null
|
||||
payment_proof_url: string
|
||||
payment_remark: string
|
||||
created_at: string
|
||||
updated_at: string
|
||||
}
|
||||
|
||||
// 审核请求
|
||||
export interface ReviewWithdrawalRequest {
|
||||
approved: boolean
|
||||
remark: string
|
||||
}
|
||||
|
||||
// 确认打款请求
|
||||
export interface ConfirmPaymentRequest {
|
||||
payment_proof_url?: string
|
||||
remark: string
|
||||
}
|
||||
|
||||
// ========== 管理员端提现管理 API ==========
|
||||
|
||||
export async function fetchAdminWithdrawals(params: {
|
||||
status?: string
|
||||
user_id?: number
|
||||
page?: number
|
||||
page_size?: number
|
||||
}) {
|
||||
const { data } = await apiClient.get<ApiResponse<PaginatedResult<WithdrawalDetail>>>('/admin/withdrawals', {
|
||||
params,
|
||||
})
|
||||
return data.data
|
||||
}
|
||||
|
||||
export async function fetchAdminWithdrawal(id: number) {
|
||||
const { data } = await apiClient.get<ApiResponse<WithdrawalDetail>>(`/admin/withdrawals/${id}`)
|
||||
return data.data
|
||||
}
|
||||
|
||||
export async function reviewWithdrawal(id: number, req: ReviewWithdrawalRequest) {
|
||||
const { data } = await apiClient.post<ApiResponse<WithdrawalDetail>>(`/admin/withdrawals/${id}/review`, req)
|
||||
return data.data
|
||||
}
|
||||
|
||||
export async function confirmPayment(id: number, req: ConfirmPaymentRequest) {
|
||||
const { data } = await apiClient.post<ApiResponse<WithdrawalDetail>>(`/admin/withdrawals/${id}/confirm-payment`, req)
|
||||
return data.data
|
||||
}
|
||||
@@ -0,0 +1,321 @@
|
||||
<script setup lang="ts">
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { ref } from 'vue'
|
||||
|
||||
import type { WithdrawalDetail } from '@/features/admin/api/adminWithdrawal'
|
||||
import { reviewWithdrawal, confirmPayment } from '@/features/admin/api/adminWithdrawal'
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: boolean
|
||||
withdrawal: WithdrawalDetail | null
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:modelValue', val: boolean): void
|
||||
(e: 'saved'): void
|
||||
}>()
|
||||
|
||||
const submitting = ref(false)
|
||||
|
||||
async function handleReview(approved: boolean) {
|
||||
if (!props.withdrawal) return
|
||||
|
||||
const action = approved ? '通过' : '拒绝'
|
||||
try {
|
||||
const { value: remark } = await ElMessageBox.prompt(
|
||||
`请输入${action}原因（可选）`,
|
||||
`${action}审核`,
|
||||
{
|
||||
confirmButtonText: `确认${action}`,
|
||||
cancelButtonText: '取消',
|
||||
inputType: 'textarea',
|
||||
inputPlaceholder: '输入备注信息...',
|
||||
}
|
||||
)
|
||||
|
||||
submitting.value = true
|
||||
await reviewWithdrawal(props.withdrawal.id, {
|
||||
approved,
|
||||
remark: remark || '',
|
||||
})
|
||||
|
||||
ElMessage.success(`审核${action}`)
|
||||
emit('saved')
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel') {
|
||||
ElMessage.error(error.response?.data?.message || '操作失败')
|
||||
}
|
||||
} finally {
|
||||
submitting.value = false
|
||||
}
|
||||
}
|
||||
|
||||
async function handleConfirmPayment() {
|
||||
if (!props.withdrawal) return
|
||||
|
||||
try {
|
||||
const { value: remark } = await ElMessageBox.prompt(
|
||||
'请输入打款备注（如：已通过支付宝转账）',
|
||||
'确认打款',
|
||||
{
|
||||
confirmButtonText: '确认完成',
|
||||
cancelButtonText: '取消',
|
||||
inputType: 'textarea',
|
||||
inputPlaceholder: '输入打款备注...',
|
||||
inputValidator: (value) => {
|
||||
return value && value.trim().length > 0
|
||||
},
|
||||
inputErrorMessage: '请输入打款备注',
|
||||
}
|
||||
)
|
||||
|
||||
submitting.value = true
|
||||
await confirmPayment(props.withdrawal.id, {
|
||||
remark: remark || '',
|
||||
})
|
||||
|
||||
ElMessage.success('打款完成')
|
||||
emit('saved')
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel') {
|
||||
ElMessage.error(error.response?.data?.message || '操作失败')
|
||||
}
|
||||
} finally {
|
||||
submitting.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function statusLabel(status: string) {
|
||||
const labels: Record<string, string> = {
|
||||
pending: '待审核',
|
||||
processing: '处理中',
|
||||
completed: '已完成',
|
||||
rejected: '已拒绝',
|
||||
cancelled: '已取消',
|
||||
}
|
||||
return labels[status] || status
|
||||
}
|
||||
|
||||
function statusType(status: string) {
|
||||
return status === 'completed' ? 'success' :
|
||||
status === 'pending' ? 'warning' :
|
||||
status === 'processing' ? 'primary' :
|
||||
status === 'rejected' ? 'danger' : 'info'
|
||||
}
|
||||
|
||||
function accountTypeLabel(type: string) {
|
||||
const labels: Record<string, string> = {
|
||||
alipay: '支付宝',
|
||||
wechat: '微信',
|
||||
bank: '银行卡',
|
||||
}
|
||||
return labels[type] || type
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-dialog
|
||||
:model-value="modelValue"
|
||||
title="提现详情"
|
||||
width="700px"
|
||||
@update:model-value="emit('update:modelValue', $event)"
|
||||
>
|
||||
<div v-if="withdrawal" class="withdrawal-detail">
|
||||
<!-- 基本信息 -->
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="提现单号" :span="2">
|
||||
{{ withdrawal.withdraw_no }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="状态">
|
||||
<el-tag :type="statusType(withdrawal.status)">
|
||||
{{ statusLabel(withdrawal.status) }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="申请时间">
|
||||
{{ new Date(withdrawal.created_at).toLocaleString('zh-CN') }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<!-- 用户信息 -->
|
||||
<h3 style="margin-top: 20px">用户信息</h3>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="用户ID">
|
||||
{{ withdrawal.user_id }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="昵称">
|
||||
{{ withdrawal.user_nickname }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="手机号" :span="2">
|
||||
{{ withdrawal.user_phone }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<!-- 金额信息 -->
|
||||
<h3 style="margin-top: 20px">金额信息</h3>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="提现金额">
|
||||
<span style="color: #f56c6c; font-weight: 600; font-size: 16px">
|
||||
¥{{ withdrawal.amount.toFixed(2) }}
|
||||
</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="手续费">
|
||||
¥{{ withdrawal.fee.toFixed(2) }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="实际到账" :span="2">
|
||||
<span style="color: #67c23a; font-weight: 600; font-size: 16px">
|
||||
¥{{ withdrawal.actual_amount.toFixed(2) }}
|
||||
</span>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<!-- 收款账号信息 -->
|
||||
<h3 style="margin-top: 20px">收款账号信息</h3>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="账号类型">
|
||||
<el-tag>{{ accountTypeLabel(withdrawal.account_type) }}</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="账户名">
|
||||
{{ withdrawal.account_name }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="账号" :span="2">
|
||||
<span style="font-family: monospace; font-weight: 600">
|
||||
{{ withdrawal.account_no }}
|
||||
</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="withdrawal.bank_name" label="银行名称">
|
||||
{{ withdrawal.bank_name }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="withdrawal.bank_branch" label="开户支行">
|
||||
{{ withdrawal.bank_branch }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="withdrawal.certificate_urls && withdrawal.certificate_urls.length > 0" label="收款二维码" :span="2">
|
||||
<div style="display: flex; gap: 8px; flex-wrap: wrap">
|
||||
<el-image
|
||||
v-for="(url, idx) in withdrawal.certificate_urls"
|
||||
:key="idx"
|
||||
:src="url"
|
||||
:preview-src-list="withdrawal.certificate_urls"
|
||||
:initial-index="idx"
|
||||
fit="cover"
|
||||
style="width: 100px; height: 100px; border-radius: 4px; cursor: pointer"
|
||||
/>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<!-- 审核信息 -->
|
||||
<div v-if="withdrawal.reviewed_at">
|
||||
<h3 style="margin-top: 20px">审核信息</h3>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="审核人">
|
||||
{{ withdrawal.reviewed_by_name }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="审核时间">
|
||||
{{ new Date(withdrawal.reviewed_at).toLocaleString('zh-CN') }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="withdrawal.review_remark" label="审核备注" :span="2">
|
||||
{{ withdrawal.review_remark }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<!-- 打款信息 -->
|
||||
<div v-if="withdrawal.paid_at">
|
||||
<h3 style="margin-top: 20px">打款信息</h3>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="打款人">
|
||||
{{ withdrawal.paid_by_name }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="打款时间">
|
||||
{{ new Date(withdrawal.paid_at).toLocaleString('zh-CN') }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="withdrawal.payment_remark" label="打款备注" :span="2">
|
||||
{{ withdrawal.payment_remark }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="withdrawal.payment_proof_url" label="打款凭证" :span="2">
|
||||
<el-link :href="withdrawal.payment_proof_url" target="_blank" type="primary">
|
||||
查看凭证
|
||||
</el-link>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<!-- 操作提示 -->
|
||||
<el-alert
|
||||
v-if="withdrawal.status === 'pending'"
|
||||
type="warning"
|
||||
:closable="false"
|
||||
show-icon
|
||||
style="margin-top: 20px"
|
||||
>
|
||||
<template #title>
|
||||
<div style="font-size: 13px">
|
||||
请仔细核对账号信息后进行审核。审核通过后，需要手动转账到用户账号，并确认打款完成。
|
||||
</div>
|
||||
</template>
|
||||
</el-alert>
|
||||
|
||||
<el-alert
|
||||
v-if="withdrawal.status === 'processing'"
|
||||
type="info"
|
||||
:closable="false"
|
||||
show-icon
|
||||
style="margin-top: 20px"
|
||||
>
|
||||
<template #title>
|
||||
<div style="font-size: 13px">
|
||||
请手动转账 <strong>¥{{ withdrawal.actual_amount.toFixed(2) }}</strong> 到用户收款账号，
|
||||
完成后点击"确认打款"按钮。
|
||||
</div>
|
||||
</template>
|
||||
</el-alert>
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
<div style="display: flex; justify-content: space-between; width: 100%">
|
||||
<div>
|
||||
<el-button
|
||||
v-if="withdrawal?.status === 'pending'"
|
||||
type="success"
|
||||
:loading="submitting"
|
||||
@click="handleReview(true)"
|
||||
>
|
||||
通过审核
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="withdrawal?.status === 'pending'"
|
||||
type="danger"
|
||||
:loading="submitting"
|
||||
@click="handleReview(false)"
|
||||
>
|
||||
拒绝
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="withdrawal?.status === 'processing'"
|
||||
type="primary"
|
||||
:loading="submitting"
|
||||
@click="handleConfirmPayment"
|
||||
>
|
||||
确认打款
|
||||
</el-button>
|
||||
</div>
|
||||
<el-button @click="emit('update:modelValue', false)">
|
||||
关闭
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.withdrawal-detail h3 {
|
||||
margin: 20px 0 12px;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
:deep(.el-descriptions__label) {
|
||||
width: 120px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,357 @@
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
|
||||
import {
|
||||
fetchAdminWithdrawals,
|
||||
reviewWithdrawal,
|
||||
confirmPayment,
|
||||
type WithdrawalDetail,
|
||||
} from '@/features/admin/api/adminWithdrawal'
|
||||
|
||||
import WithdrawalDetailDialog from '../components/WithdrawalDetailDialog.vue'
|
||||
|
||||
const loading = ref(false)
|
||||
const withdrawals = ref<WithdrawalDetail[]>([])
|
||||
const total = ref(0)
|
||||
const currentPage = ref(1)
|
||||
const pageSize = ref(20)
|
||||
|
||||
const filters = ref({
|
||||
status: '',
|
||||
user_id: undefined as number | undefined,
|
||||
})
|
||||
|
||||
const showDetailDialog = ref(false)
|
||||
const selectedWithdrawal = ref<WithdrawalDetail | null>(null)
|
||||
|
||||
const statusOptions = [
|
||||
{ label: '全部', value: '' },
|
||||
{ label: '待审核', value: 'pending' },
|
||||
{ label: '处理中', value: 'processing' },
|
||||
{ label: '已完成', value: 'completed' },
|
||||
{ label: '已拒绝', value: 'rejected' },
|
||||
{ label: '已取消', value: 'cancelled' },
|
||||
]
|
||||
|
||||
onMounted(() => {
|
||||
loadWithdrawals()
|
||||
})
|
||||
|
||||
async function loadWithdrawals() {
|
||||
loading.value = true
|
||||
try {
|
||||
const result = await fetchAdminWithdrawals({
|
||||
status: filters.value.status || undefined,
|
||||
user_id: filters.value.user_id,
|
||||
page: currentPage.value,
|
||||
page_size: pageSize.value,
|
||||
})
|
||||
withdrawals.value = result.items
|
||||
total.value = result.total
|
||||
} catch (error: any) {
|
||||
ElMessage.error(error.response?.data?.message || '加载失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function handleFilter() {
|
||||
currentPage.value = 1
|
||||
loadWithdrawals()
|
||||
}
|
||||
|
||||
function openDetail(withdrawal: WithdrawalDetail) {
|
||||
selectedWithdrawal.value = withdrawal
|
||||
showDetailDialog.value = true
|
||||
}
|
||||
|
||||
async function handleReview(withdrawal: WithdrawalDetail, approved: boolean) {
|
||||
const action = approved ? '通过' : '拒绝'
|
||||
try {
|
||||
const { value: remark } = await ElMessageBox.prompt(
|
||||
`请输入${action}原因（可选）`,
|
||||
`${action}审核`,
|
||||
{
|
||||
confirmButtonText: `确认${action}`,
|
||||
cancelButtonText: '取消',
|
||||
inputType: 'textarea',
|
||||
inputPlaceholder: '输入备注信息...',
|
||||
}
|
||||
)
|
||||
|
||||
await reviewWithdrawal(withdrawal.id, {
|
||||
approved,
|
||||
remark: remark || '',
|
||||
})
|
||||
|
||||
ElMessage.success(`审核${action}`)
|
||||
await loadWithdrawals()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel') {
|
||||
ElMessage.error(error.response?.data?.message || '操作失败')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function handleConfirmPayment(withdrawal: WithdrawalDetail) {
|
||||
try {
|
||||
const { value: remark } = await ElMessageBox.prompt(
|
||||
'请输入打款备注（如：已通过支付宝转账）',
|
||||
'确认打款',
|
||||
{
|
||||
confirmButtonText: '确认完成',
|
||||
cancelButtonText: '取消',
|
||||
inputType: 'textarea',
|
||||
inputPlaceholder: '输入打款备注...',
|
||||
inputValidator: (value) => {
|
||||
return value && value.trim().length > 0
|
||||
},
|
||||
inputErrorMessage: '请输入打款备注',
|
||||
}
|
||||
)
|
||||
|
||||
await confirmPayment(withdrawal.id, {
|
||||
remark: remark || '',
|
||||
})
|
||||
|
||||
ElMessage.success('打款完成')
|
||||
await loadWithdrawals()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel') {
|
||||
ElMessage.error(error.response?.data?.message || '操作失败')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function statusLabel(status: string) {
|
||||
const labels: Record<string, string> = {
|
||||
pending: '待审核',
|
||||
processing: '处理中',
|
||||
completed: '已完成',
|
||||
rejected: '已拒绝',
|
||||
cancelled: '已取消',
|
||||
}
|
||||
return labels[status] || status
|
||||
}
|
||||
|
||||
function statusType(status: string) {
|
||||
const types: Record<string, 'success' | 'warning' | 'danger' | 'info' | 'primary'> = {
|
||||
pending: 'warning',
|
||||
processing: 'primary',
|
||||
completed: 'success',
|
||||
rejected: 'danger',
|
||||
cancelled: 'info',
|
||||
}
|
||||
return types[status] || 'info'
|
||||
}
|
||||
|
||||
function accountTypeLabel(type: string) {
|
||||
const labels: Record<string, string> = {
|
||||
alipay: '支付宝',
|
||||
wechat: '微信',
|
||||
bank: '银行卡',
|
||||
}
|
||||
return labels[type] || type
|
||||
}
|
||||
|
||||
function onDetailDialogSaved() {
|
||||
showDetailDialog.value = false
|
||||
loadWithdrawals()
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section class="page">
|
||||
<div class="page-header-row">
|
||||
<div class="page-header">
|
||||
<p class="eyebrow">Withdrawals</p>
|
||||
<h1>提现管理</h1>
|
||||
<p>审核用户提现申请并确认打款</p>
|
||||
</div>
|
||||
<div class="toolbar-actions">
|
||||
<el-button @click="loadWithdrawals">刷新</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 筛选器 -->
|
||||
<el-card shadow="never" style="margin-bottom: 16px">
|
||||
<el-form :model="filters" inline>
|
||||
<el-form-item label="状态">
|
||||
<el-select
|
||||
v-model="filters.status"
|
||||
placeholder="全部"
|
||||
style="width: 150px"
|
||||
@change="handleFilter"
|
||||
>
|
||||
<el-option
|
||||
v-for="opt in statusOptions"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户ID">
|
||||
<el-input
|
||||
v-model.number="filters.user_id"
|
||||
placeholder="输入用户ID"
|
||||
style="width: 150px"
|
||||
clearable
|
||||
@clear="handleFilter"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleFilter">
|
||||
查询
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- 提现列表 -->
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
class="table-panel"
|
||||
:data="withdrawals"
|
||||
>
|
||||
<el-table-column prop="id" label="ID" width="70" />
|
||||
<el-table-column prop="withdraw_no" label="提现单号" min-width="180" />
|
||||
<el-table-column label="用户" min-width="140">
|
||||
<template #default="{ row }">
|
||||
<div>{{ row.user_nickname }}</div>
|
||||
<div style="font-size: 12px; color: #999">{{ row.user_phone }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="提现金额" width="120" align="right">
|
||||
<template #default="{ row }">
|
||||
<span style="color: #f56c6c; font-weight: 600">
|
||||
¥{{ row.amount.toFixed(2) }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="收款方式" min-width="180">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<el-tag size="small" style="margin-right: 4px">
|
||||
{{ accountTypeLabel(row.account_type) }}
|
||||
</el-tag>
|
||||
{{ row.account_name }}
|
||||
</div>
|
||||
<div style="font-size: 12px; color: #666; margin-top: 4px">
|
||||
{{ row.account_no }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" width="100">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="statusType(row.status)">
|
||||
{{ statusLabel(row.status) }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="申请时间" width="160">
|
||||
<template #default="{ row }">
|
||||
{{ new Date(row.created_at).toLocaleString('zh-CN') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="240" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button size="small" @click="openDetail(row)">
|
||||
详情
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="row.status === 'pending'"
|
||||
size="small"
|
||||
type="success"
|
||||
@click="handleReview(row, true)"
|
||||
>
|
||||
通过
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="row.status === 'pending'"
|
||||
size="small"
|
||||
type="danger"
|
||||
@click="handleReview(row, false)"
|
||||
>
|
||||
拒绝
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="row.status === 'processing'"
|
||||
size="small"
|
||||
type="primary"
|
||||
@click="handleConfirmPayment(row)"
|
||||
>
|
||||
确认打款
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
v-if="total > pageSize"
|
||||
v-model:current-page="currentPage"
|
||||
v-model:page-size="pageSize"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
style="margin-top: 16px; justify-content: center"
|
||||
@size-change="loadWithdrawals"
|
||||
@current-change="loadWithdrawals"
|
||||
/>
|
||||
|
||||
<!-- 详情对话框 -->
|
||||
<WithdrawalDetailDialog
|
||||
v-model="showDetailDialog"
|
||||
:withdrawal="selectedWithdrawal"
|
||||
@saved="onDetailDialogSaved"
|
||||
/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.page {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.page-header-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.eyebrow {
|
||||
margin: 0 0 8px;
|
||||
color: #909399;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
margin: 0 0 8px;
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.page-header p {
|
||||
margin: 0;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.toolbar-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.table-panel {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user