优化订单支付

This commit is contained in:
yml
2026-06-08 23:56:25 +08:00
parent 870ea72996
commit a2a0489158
20 changed files with 884 additions and 5 deletions
@@ -0,0 +1,56 @@
import { apiClient } from '@/shared/api/client'
import type { ApiResponse, PaginatedResult } from '@/shared/types/types'
export interface AdminPayment {
id: number
payment_no: string
order_id: number
order_no: string
user_id: number
user_phone: string
provider: string
merchant_id: string
third_order_id: string
provider_order_id: string
pay_way: string
amount_cent: number
biz_type: string
status: string
error_code: string
error_message: string
raw_request?: Record<string, unknown>
raw_response?: Record<string, unknown>
paid_at?: string
notified_at?: string
created_at: string
updated_at: string
}
export interface AdminPaymentQuery {
user_id?: string
order_id?: string
order_no?: string
biz_type?: string
status?: string
provider?: string
page?: number
page_size?: number
}
export async function fetchAdminPayments(query: AdminPaymentQuery = {}) {
const params = Object.fromEntries(
Object.entries(query).filter(([, value]) => value !== '' && value !== undefined)
)
const { data } = await apiClient.get<ApiResponse<PaginatedResult<AdminPayment>>>(
'/admin/payments',
{ params }
)
const result = data.data
return {
items: Array.isArray(result?.items) ? result.items : [],
total: Number(result?.total ?? 0),
page: Number(result?.page ?? query.page ?? 1),
page_size: Number(result?.page_size ?? query.page_size ?? 20),
}
}
+1
View File
@@ -3,6 +3,7 @@ export * from './api/adminDashboard'
export * from './api/adminUsers'
export * from './api/adminMgr'
export * from './api/adminWallet'
export * from './api/adminPayments'
export * from './api/adminAudit'
export * from './api/systemConfigs'
export * from './composables/useAdminTable'
@@ -14,6 +14,7 @@ import {
type Order,
type RefundStatus,
} from '@/features/orders'
import { fetchAdminPayments, type AdminPayment } from '@/features/admin/api/adminPayments'
import { handoffStatusLabel, orderStatusLabel } from '@/utils/statusLabels'
import { formatDateTime } from '@/utils/time'
import { formatListingNo } from '@/utils/listingDisplay'
@@ -23,6 +24,7 @@ const loading = ref(false)
const submitting = ref(false)
const order = ref<Order | null>(null)
const handoffRecords = ref<HandoffRecord[]>([])
const paymentRecords = ref<AdminPayment[]>([])
const actionType = ref<'close' | 'abnormal' | ''>('')
const reason = ref('')
const refundStatus = ref<RefundStatus | null>(null)
@@ -44,6 +46,7 @@ async function loadOrder() {
try {
order.value = await fetchAdminOrder(String(route.params.id))
handoffRecords.value = await fetchAdminHandoffRecords(String(route.params.id))
paymentRecords.value = (await fetchAdminPayments({ order_id: String(route.params.id) })).items
await loadRefundStatus()
} finally {
loading.value = false
@@ -124,12 +127,49 @@ async function handleRefund() {
function refundStatusLabel(status: string) {
const map: Record<string, string> = {
pending: '待退款',
refunding: '退款中',
refunded: '已退款',
failed: '退款失败',
}
return map[status] || status || '未退款'
}
function paymentStatusLabel(status: string) {
const map: Record<string, string> = {
created: '已创建',
paying: '支付中',
paid: '已支付',
refunding: '退款中',
refunded: '已退款',
failed: '失败',
}
return map[status] || status
}
function paymentStatusType(status: string) {
if (['paid', 'refunded'].includes(status)) return 'success'
if (status === 'failed') return 'danger'
if (['paying', 'refunding'].includes(status)) return 'warning'
return 'info'
}
function paymentBizTypeLabel(type: string) {
const map: Record<string, string> = {
order_pay: '订单支付',
checkout_refund: '结账退款',
arbitration_refund: '仲裁退款',
admin_refund: '人工退款',
cancel_refund: '取消退款',
admin_close_refund: '客服关闭退款',
wallet_recharge: '钱包充值',
}
return map[type] || type
}
function moneyCent(value: number) {
return `¥${(Number(value || 0) / 100).toFixed(2)}`
}
function formatHandoffRecordType(type: string) {
const typeMap: Record<string, string> = {
owner_handoff: '卖家交接',
@@ -137,6 +177,7 @@ function formatHandoffRecordType(type: string) {
owner_counter_checkout: '卖家反驳结账',
renter_confirm_checkout: '买家确认结账',
owner_accept_checkout: '卖家接受结账',
admin_arbitration: '客服仲裁',
}
return typeMap[type] || type
}
@@ -214,6 +255,27 @@ function formatHandoffRecordType(type: string) {
<p>预计截止{{ formatDateTime(orderEstimatedEndAt(), '未设置') }}</p>
</div>
<div class="order-panel dashboard-panel">
<h2>支付与退款</h2>
<el-empty v-if="paymentRecords.length === 0" description="暂无支付流水" />
<div v-for="record in paymentRecords" :key="record.id" class="timeline-item">
<strong>
{{ paymentBizTypeLabel(record.biz_type) }} · {{ moneyCent(record.amount_cent) }}
</strong>
<p>
{{ record.provider || '-' }} · {{ record.third_order_id }}
<span v-if="record.provider_order_id"> / {{ record.provider_order_id }}</span>
</p>
<p v-if="record.error_message" class="danger-text">
{{ record.error_code }} {{ record.error_message }}
</p>
<el-tag :type="paymentStatusType(record.status)">
{{ paymentStatusLabel(record.status) }}
</el-tag>
<span>{{ formatDateTime(record.created_at) }}</span>
</div>
</div>
<div class="order-panel dashboard-panel">
<h2>交接记录</h2>
<el-empty v-if="handoffRecords.length === 0" description="暂无交接记录" />
@@ -0,0 +1,311 @@
<script setup lang="ts">
import { Document, Search } from '@element-plus/icons-vue'
import { computed, onMounted, reactive, ref } from 'vue'
import { fetchAdminPayments, type AdminPayment } from '@/features/admin/api/adminPayments'
import { formatDateTime } from '@/utils/time'
import AdminTablePagination from '../components/AdminTablePagination.vue'
const loading = ref(false)
const payments = ref<AdminPayment[]>([])
const currentPage = ref(1)
const currentPageSize = ref(20)
const total = ref(0)
const detailVisible = ref(false)
const activePayment = ref<AdminPayment | null>(null)
const filters = reactive({
user_id: '',
order_id: '',
order_no: '',
biz_type: '',
status: '',
provider: '',
})
const payAmount = computed(() =>
payments.value
.filter(item => item.biz_type === 'order_pay' || item.biz_type === 'wallet_recharge')
.reduce((sum, item) => sum + Number(item.amount_cent || 0), 0)
)
const refundAmount = computed(() =>
payments.value
.filter(item => item.biz_type.includes('refund'))
.reduce((sum, item) => sum + Number(item.amount_cent || 0), 0)
)
onMounted(loadPayments)
async function loadPayments() {
loading.value = true
try {
const result = await fetchAdminPayments({
...filters,
page: currentPage.value,
page_size: currentPageSize.value,
})
payments.value = result.items
total.value = result.total
} catch {
payments.value = []
total.value = 0
} finally {
loading.value = false
}
}
function resetFilters() {
filters.user_id = ''
filters.order_id = ''
filters.order_no = ''
filters.biz_type = ''
filters.status = ''
filters.provider = ''
currentPage.value = 1
void loadPayments()
}
async function handlePageChange() {
await loadPayments()
}
function moneyCent(value: number) {
return `¥${(Number(value || 0) / 100).toFixed(2)}`
}
function paymentStatusType(status: string) {
if (['paid', 'refunded'].includes(status)) return 'success'
if (status === 'failed') return 'danger'
if (['paying', 'refunding'].includes(status)) return 'warning'
return 'info'
}
function paymentStatusLabel(status: string) {
const map: Record<string, string> = {
created: '已创建',
paying: '支付中',
paid: '已支付',
refunding: '退款中',
refunded: '已退款',
failed: '失败',
closed: '已关闭',
}
return map[status] || status
}
function bizTypeLabel(type: string) {
const map: Record<string, string> = {
order_pay: '订单支付',
wallet_recharge: '钱包充值',
cancel_refund: '取消退款',
admin_close_refund: '客服关闭退款',
admin_refund: '人工退款',
checkout_refund: '结账退款',
deposit_refund: '押金退款',
rent_refund: '租金退款',
arbitration_refund: '仲裁退款',
}
return map[type] || type
}
function openDetail(row: AdminPayment) {
activePayment.value = row
detailVisible.value = true
}
function jsonText(value: unknown) {
if (!value) return '{}'
try {
return JSON.stringify(value, null, 2)
} catch {
return String(value)
}
}
</script>
<template>
<section class="page">
<div class="page-header-row">
<div class="page-header">
<p class="eyebrow">Payment Ledger</p>
<h1>支付流水</h1>
<p>查看第三方支付退款请求渠道单号状态和失败原因</p>
</div>
<div class="toolbar-actions">
<el-button @click="resetFilters">重置</el-button>
<el-button type="primary" :icon="Search" :loading="loading" @click="loadPayments"
>查询</el-button
>
</div>
</div>
<div class="metric-grid">
<div class="metric-card">
<span>总条数</span>
<strong>{{ total }} </strong>
</div>
<div class="metric-card">
<span>本页支付额</span>
<strong>{{ moneyCent(payAmount) }}</strong>
</div>
<div class="metric-card">
<span>本页退款额</span>
<strong>{{ moneyCent(refundAmount) }}</strong>
</div>
</div>
<el-form class="filter-panel" label-position="top">
<el-form-item label="用户 ID">
<el-input v-model="filters.user_id" clearable placeholder="按用户筛选" />
</el-form-item>
<el-form-item label="订单 ID">
<el-input v-model="filters.order_id" clearable placeholder="按订单筛选" />
</el-form-item>
<el-form-item label="订单号">
<el-input v-model="filters.order_no" clearable placeholder="按订单号筛选" />
</el-form-item>
<el-form-item label="业务类型">
<el-select v-model="filters.biz_type" clearable placeholder="全部业务" class="full-control">
<el-option label="订单支付" value="order_pay" />
<el-option label="结账退款" value="checkout_refund" />
<el-option label="仲裁退款" value="arbitration_refund" />
<el-option label="人工退款" value="admin_refund" />
<el-option label="取消退款" value="cancel_refund" />
<el-option label="钱包充值" value="wallet_recharge" />
</el-select>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="filters.status" clearable placeholder="全部状态" class="full-control">
<el-option label="已支付" value="paid" />
<el-option label="支付中" value="paying" />
<el-option label="退款中" value="refunding" />
<el-option label="已退款" value="refunded" />
<el-option label="失败" value="failed" />
</el-select>
</el-form-item>
<el-form-item label="渠道">
<el-select v-model="filters.provider" clearable placeholder="全部渠道" class="full-control">
<el-option label="拉卡拉" value="lakala" />
<el-option label="乐刷" value="leshua" />
<el-option label="Mock" value="mock" />
</el-select>
</el-form-item>
</el-form>
<el-table v-loading="loading" class="table-panel" :data="payments">
<el-table-column prop="payment_no" label="支付单号" min-width="220" />
<el-table-column label="订单" min-width="180">
<template #default="{ row }">
<RouterLink v-if="row.order_id" :to="`/admin/orders/${row.order_id}`">{{
row.order_no || row.order_id
}}</RouterLink>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column label="用户" min-width="130">
<template #default="{ row }">{{ row.user_phone || `用户 ${row.user_id}` }}</template>
</el-table-column>
<el-table-column label="业务" width="120">
<template #default="{ row }">{{ bizTypeLabel(row.biz_type) }}</template>
</el-table-column>
<el-table-column label="渠道" width="90">
<template #default="{ row }">{{ row.provider || '-' }}</template>
</el-table-column>
<el-table-column label="金额" width="110">
<template #default="{ row }">{{ moneyCent(row.amount_cent) }}</template>
</el-table-column>
<el-table-column label="状态" width="110">
<template #default="{ row }">
<el-tag :type="paymentStatusType(row.status)">{{
paymentStatusLabel(row.status)
}}</el-tag>
</template>
</el-table-column>
<el-table-column label="失败原因" min-width="180">
<template #default="{ row }">
<span v-if="row.status === 'failed' && row.error_message"
>{{ row.error_code }} {{ row.error_message }}</span
>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column prop="third_order_id" label="平台单号" min-width="230" />
<el-table-column prop="provider_order_id" label="渠道单号" min-width="220" />
<el-table-column label="创建时间" min-width="180">
<template #default="{ row }">{{ formatDateTime(row.created_at) }}</template>
</el-table-column>
<el-table-column label="操作" width="90" fixed="right">
<template #default="{ row }">
<el-button size="small" :icon="Document" @click="openDetail(row)">详情</el-button>
</template>
</el-table-column>
</el-table>
<AdminTablePagination
v-if="total > 0"
v-model:current-page="currentPage"
v-model:page-size="currentPageSize"
:total="total"
:loading="loading"
@page-change="handlePageChange"
/>
<el-dialog v-model="detailVisible" title="支付流水详情" width="820px">
<div v-if="activePayment" class="payment-detail">
<div class="detail-grid">
<p><span>业务类型</span><strong>{{ bizTypeLabel(activePayment.biz_type) }}</strong></p>
<p><span>状态</span><strong>{{ paymentStatusLabel(activePayment.status) }}</strong></p>
<p><span>金额</span><strong>{{ moneyCent(activePayment.amount_cent) }}</strong></p>
<p><span>渠道</span><strong>{{ activePayment.provider || '-' }}</strong></p>
</div>
<h3>请求参数</h3>
<pre>{{ jsonText(activePayment.raw_request) }}</pre>
<h3>响应结果</h3>
<pre>{{ jsonText(activePayment.raw_response) }}</pre>
</div>
</el-dialog>
</section>
</template>
<style scoped>
.payment-detail h3 {
margin: 18px 0 8px;
font-size: 15px;
}
.detail-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 10px;
}
.detail-grid p {
margin: 0;
padding: 10px 12px;
background: #f8fafc;
border: 1px solid #e5e7eb;
border-radius: 8px;
}
.detail-grid span {
display: block;
color: #64748b;
font-size: 12px;
}
.detail-grid strong {
display: block;
margin-top: 4px;
}
pre {
max-height: 260px;
overflow: auto;
margin: 0;
padding: 12px;
background: #0f172a;
color: #e2e8f0;
border-radius: 8px;
white-space: pre-wrap;
word-break: break-word;
}
</style>
@@ -540,6 +540,18 @@ function money(value: unknown) {
return `${roundMoney(readNumber(value))}`
}
function formatHandoffRecordType(type: string) {
const typeMap: Record<string, string> = {
owner_handoff: '卖家交接',
renter_checkout: '买家结账',
owner_counter_checkout: '卖家反驳结账',
renter_confirm_checkout: '买家确认结账',
owner_accept_checkout: '卖家接受结账',
admin_arbitration: '客服仲裁',
}
return typeMap[type] || type
}
function orderRentAmount(item: Order) {
if (item.owner_id === session.userId)
return Number(item.owner_rent_amount ?? item.display_amount ?? 0)
@@ -792,7 +804,7 @@ async function copyListingCode() {
<div v-for="record in handoffRecords" :key="record.id" class="log-item">
<div class="log-dot"></div>
<div class="log-content-wrap">
<strong class="log-type">{{ record.type }}</strong>
<strong class="log-type">{{ formatHandoffRecordType(record.type) }}</strong>
<p class="log-desc">{{ record.content }}</p>
<span class="log-time">{{ formatDateTime(record.created_at) }}</span>
</div>
@@ -677,6 +677,7 @@ function formatHandoffRecordType(type: string) {
owner_counter_checkout: '卖家反驳结账',
renter_confirm_checkout: '买家确认结账',
owner_accept_checkout: '卖家接受结账',
admin_arbitration: '客服仲裁',
}
return typeMap[type] || type
}
+1
View File
@@ -98,6 +98,7 @@ const allNavGroups: NavGroup[] = [
icon: Coin,
children: [
{ label: '资金流水', to: '/admin/wallet-ledger', icon: Wallet, permission: 'wallet:view' },
{ label: '支付流水', to: '/admin/payments', icon: CreditCard, permission: 'wallet:view' },
{ label: '提现审核', to: '/admin/withdrawals', icon: Money, permission: 'withdrawal:list' },
{
label: '支付配置',
+6
View File
@@ -70,6 +70,12 @@ export const adminRoutes: RouteRecordRaw[] = [
component: () => import('@/features/admin/views/AdminWalletLedgerView.vue'),
meta: adminMeta,
},
{
path: '/admin/payments',
name: 'admin-payments',
component: () => import('@/features/admin/views/AdminPaymentsView.vue'),
meta: adminMeta,
},
{
path: '/admin/withdrawals',
name: 'admin-withdrawals',