feat(split): 新增分账接收方明细功能

新增 SplitOrderHelper 类用于同步分账接收方明细数据,包括接收方角色、
姓名、账户和金额等信息。优化管理后台分账订单列表页面,显示详细的
接收方信息和失败原因,提升分账流程的可视化和可追溯性。
```
这个提交包含在:
可乐加冰
2026-10-05 12:43:27 +08:00
父节点 4b537410e0
当前提交 0fdb813c16
共有 6 个文件被更改,包括 324 次插入 和 37 次删除

查看文件

@@ -26,17 +26,28 @@
gap: 10px;
align-items: center;
}
.source-main {
.cell-main {
font-size: 13px;
color: #333;
font-weight: 500;
color: #303133;
line-height: 1.5;
word-break: keep-all;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.source-sub {
.cell-sub {
font-size: 12px;
color: #909399;
line-height: 1.6;
margin-top: 2px;
line-height: 1.5;
margin-top: 4px;
word-break: keep-all;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mono-text {
font-family: Consolas, Monaco, "Courier New", monospace;
letter-spacing: 0.2px;
}
.link-text {
color: #7438D5;
@@ -44,22 +55,76 @@
}
.link-text:hover { opacity: 0.85; }
.money-text { color: #e1212b; font-weight: 600; }
.channel-tag {
display: inline-block;
margin-left: 6px;
padding: 0 6px;
font-size: 11px;
line-height: 18px;
border-radius: 4px;
background: #f4f4f5;
color: #606266;
vertical-align: middle;
}
.status-tag {
display: inline-block;
padding: 2px 10px;
border-radius: 12px;
font-size: 12px;
white-space: nowrap;
}
.status-tag.s0 { background: #f4f4f5; color: #909399; }
.status-tag.s1 { background: #ecf5ff; color: #409eff; }
.status-tag.s2 { background: #f0f9eb; color: #67c23a; }
.status-tag.s3 { background: #fdf6ec; color: #e6a23c; }
.status-tag.s4 { background: #fef0f0; color: #f56c6c; }
.recv-list { display: flex; flex-direction: column; gap: 6px; }
.recv-row {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 6px;
font-size: 12px;
line-height: 1.5;
}
.recv-role {
display: inline-block;
padding: 0 6px;
border-radius: 4px;
background: #f0ebfa;
color: #7438D5;
white-space: nowrap;
}
.recv-name { color: #303133; }
.recv-account {
color: #909399;
font-family: Consolas, Monaco, "Courier New", monospace;
font-size: 11px;
}
.recv-amt { color: #e1212b; font-weight: 600; margin-left: auto; white-space: nowrap; }
.recv-preview-hint {
font-size: 11px;
color: #c0c4cc;
margin-top: 2px;
}
.fail-reason {
font-size: 12px;
color: #f56c6c;
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
word-break: break-all;
}
.op-hint {
font-size: 12px;
color: #909399;
margin-left: 4px;
}
#splitOrderIndex .el-table .cell {
line-height: 1.5;
}
</style>
<div id="splitOrderIndex" v-cloak>
<div class="page-card">
@@ -92,44 +157,57 @@
<div class="page-card" style="padding-bottom: 8px;">
<el-table :data="listData" border stripe v-loading="loading"
empty-text="暂无分账记录。请确认已开启分账,并完成支付/确认收货后再查看。">
<el-table-column label="记录时间" prop="createtime_text" width="158"></el-table-column>
<el-table-column label="买家" min-width="140">
<el-table-column label="记录时间" prop="createtime_text" width="156"></el-table-column>
<el-table-column label="买家" min-width="130" show-overflow-tooltip>
<template slot-scope="s">
<div class="source-main">{{ s.row.buyer_display || '—' }}</div>
<div class="source-sub" v-if="s.row.buyer_nickname && s.row.buyer_mobile">手机 {{ s.row.buyer_mobile }}</div>
<div class="cell-main">{{ s.row.buyer_display || '—' }}</div>
</template>
</el-table-column>
<el-table-column label="订单 / 分账" min-width="220">
<el-table-column label="订单号" min-width="200" show-overflow-tooltip>
<template slot-scope="s">
<div class="source-main">
<span class="link-text" @click="openOrder(s.row.order_id)">{{ s.row.order_sn || '—' }}</span>
<span class="source-sub" style="display:inline;margin-left:6px;">{{ s.row.channel_text }}</span>
<div class="cell-main">
<span class="link-text mono-text" @click="openOrder(s.row.order_id)">{{ s.row.order_sn || '—' }}</span>
<span class="channel-tag">{{ s.row.channel_text }}</span>
</div>
<div class="source-sub">分账单号 {{ s.row.out_order_no || '—' }}</div>
<div class="source-sub" v-if="s.row.order_paytime_text !== '-'">支付 {{ s.row.order_paytime_text }}</div>
<div class="cell-sub mono-text" v-if="s.row.out_order_no">分账 {{ s.row.out_order_no }}</div>
</template>
</el-table-column>
<el-table-column label="金额" width="118" align="right">
<el-table-column label="金额" width="112" align="right">
<template slot-scope="s">
<div>订单 <span class="money-text">¥{{ formatMoney(s.row.total_amount) }}</span></div>
<div class="source-sub">分账 ¥{{ formatMoney(s.row.split_amount) }}</div>
<div class="cell-main">订单 <span class="money-text">¥{{ formatMoney(s.row.total_amount) }}</span></div>
<div class="cell-sub">分账 ¥{{ formatMoney(s.row.split_amount) }}</div>
</template>
</el-table-column>
<el-table-column label="接收方明细" min-width="160" show-overflow-tooltip>
<el-table-column label="分账接收方" min-width="260">
<template slot-scope="s">
<span class="source-sub">{{ s.row.receiver_summary || '—' }}</span>
<div v-if="s.row.receiver_details && s.row.receiver_details.length" class="recv-list">
<div v-for="(r, idx) in s.row.receiver_details" :key="idx" class="recv-row">
<span class="recv-role">{{ r.role_label }}</span>
<span class="recv-name">{{ r.display_name }}</span>
<span class="recv-account" v-if="r.account">{{ r.account }}</span>
<span class="recv-amt">¥{{ formatMoney(r.amount) }}</span>
</div>
<div v-if="s.row.receiver_preview" class="recv-preview-hint">按当前规则预估(历史失败单未落库明细)</div>
</div>
<span v-else class="cell-sub">—</span>
</template>
</el-table-column>
<el-table-column label="状态" width="96" align="center">
<el-table-column label="状态" width="88" align="center">
<template slot-scope="s">
<span :class="'status-tag s' + s.row.status">{{ s.row.status_text }}</span>
</template>
</el-table-column>
<el-table-column label="重试" width="64" align="center" prop="retry_count"></el-table-column>
<el-table-column label="操作" width="168" fixed="right">
<el-table-column label="失败原因" min-width="140" show-overflow-tooltip>
<template slot-scope="s">
<div v-if="s.row.fail_reason" class="fail-reason" :title="s.row.fail_reason">{{ s.row.fail_reason }}</div>
<span v-else class="cell-sub">—</span>
</template>
</el-table-column>
<el-table-column label="重试" width="56" align="center" prop="retry_count"></el-table-column>
<el-table-column label="操作" width="156" fixed="right">
<template slot-scope="s">
<el-button type="text" v-if="s.row.status == 4" @click="retry(s.row)">重试分账</el-button>
<el-button type="text" @click="query(s.row.id)">同步通道状态</el-button>
<el-button type="text" @click="query(s.row.id)">同步状态</el-button>
</template>
</el-table-column>
</el-table>
@@ -146,7 +224,7 @@
</el-pagination>
</div>
<p class="op-hint" style="margin-top:10px;">
「重试分账」仅对<strong>失败</strong>记录有效,会向通道重新发起分账;「同步通道状态」只拉取最新结果并更新本页,不会重复扣款。
「重试分账」仅对<strong>失败</strong>记录有效,会向通道重新发起分账;「同步状态」只拉取最新结果并更新本页,不会重复扣款。
</p>
</div>
</div>