```
feat(split): 新增分账接收方明细功能 新增 SplitOrderHelper 类用于同步分账接收方明细数据,包括接收方角色、 姓名、账户和金额等信息。优化管理后台分账订单列表页面,显示详细的 接收方信息和失败原因,提升分账流程的可视化和可追溯性。 ```
这个提交包含在:
@@ -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>
|
||||
|
||||
在新工单中引用
屏蔽一个用户