```
feat(split-order): 添加分账订单失败原因详情展示功能 - 新增 fail_reason_full 字段用于存储完整的失败原因信息 - 实现 formatFailReasonFull 方法解析微信分账失败的详细信息 - 优化前端表格展示,增加查看完整失败原因的弹窗功能 - 调整表格列宽度和样式,提升买家信息展示效果 - 修复昵称和角色ID显示逻辑,避免重复显示问题 ```
这个提交包含在:
@@ -7,14 +7,13 @@
|
||||
min-height: 100%;
|
||||
}
|
||||
#splitOrderIndex .el-table .cell {
|
||||
overflow: hidden;
|
||||
line-height: 1.5;
|
||||
vertical-align: middle;
|
||||
vertical-align: top;
|
||||
word-break: keep-all;
|
||||
}
|
||||
#splitOrderIndex .el-table .col-money .cell,
|
||||
#splitOrderIndex .el-table .col-source .cell {
|
||||
overflow: visible;
|
||||
#splitOrderIndex .el-table .col-source .cell,
|
||||
#splitOrderIndex .el-table .col-buyer .cell {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.page-card {
|
||||
@@ -122,12 +121,12 @@
|
||||
border-bottom: 1px dashed #ebeef5;
|
||||
}
|
||||
.recv-block:last-child { border-bottom: none; padding-bottom: 0; }
|
||||
.recv-line1 {
|
||||
.recv-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
font-size: 12px;
|
||||
min-width: 0;
|
||||
}
|
||||
.recv-role {
|
||||
flex-shrink: 0;
|
||||
@@ -138,33 +137,45 @@
|
||||
font-size: 11px;
|
||||
line-height: 18px;
|
||||
}
|
||||
.recv-name {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #303133;
|
||||
}
|
||||
.recv-amt {
|
||||
flex-shrink: 0;
|
||||
color: #e1212b;
|
||||
font-weight: 600;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.recv-name-line {
|
||||
margin-top: 4px;
|
||||
font-size: 12px;
|
||||
color: #303133;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.recv-line2 {
|
||||
margin-top: 3px;
|
||||
font-size: 11px;
|
||||
color: #909399;
|
||||
}
|
||||
.fail-text {
|
||||
font-size: 12px;
|
||||
.fail-cell { font-size: 12px; line-height: 1.55; }
|
||||
.fail-brief {
|
||||
color: #f56c6c;
|
||||
line-height: 1.5;
|
||||
word-break: break-all;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
word-break: break-word;
|
||||
white-space: normal;
|
||||
}
|
||||
.fail-more {
|
||||
display: inline-block;
|
||||
margin-top: 4px;
|
||||
font-size: 11px;
|
||||
color: #7438D5;
|
||||
cursor: pointer;
|
||||
}
|
||||
.fail-pop-full {
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
line-height: 1.65;
|
||||
color: #606266;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
max-height: 280px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.diag-pop {
|
||||
font-size: 12px;
|
||||
@@ -209,12 +220,12 @@
|
||||
<el-table :data="listData" border stripe v-loading="loading"
|
||||
empty-text="暂无分账记录">
|
||||
<el-table-column label="时间" prop="createtime_text" width="152"></el-table-column>
|
||||
<el-table-column label="买家" width="128" show-overflow-tooltip>
|
||||
<el-table-column label="买家" class-name="col-buyer" min-width="148" show-overflow-tooltip>
|
||||
<template slot-scope="s">
|
||||
<span>{{ s.row.buyer_display || '—' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="订单号" min-width="168">
|
||||
<el-table-column label="订单号" min-width="176">
|
||||
<template slot-scope="s">
|
||||
<div class="scroll-cell" @wheel="scrollCellWheel">
|
||||
<div class="scroll-cell-inner">
|
||||
@@ -237,7 +248,7 @@
|
||||
<span class="money-num highlight">¥{{ formatMoney(s.row.split_amount) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="分账来源" class-name="col-source" width="112" align="center">
|
||||
<el-table-column label="分账来源" class-name="col-source" width="118" align="center">
|
||||
<template slot-scope="s">
|
||||
<div class="source-cell" v-if="s.row.split_source">
|
||||
<span :class="'source-tag ' + (s.row.split_source === 'commission' ? 'commission' : 'rule')">
|
||||
@@ -257,15 +268,17 @@
|
||||
<span v-else style="color:#909399;">—</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="分账给谁" min-width="168">
|
||||
<el-table-column label="分账给谁" min-width="180">
|
||||
<template slot-scope="s">
|
||||
<template v-if="s.row.receiver_details && s.row.receiver_details.length">
|
||||
<div v-for="(r, idx) in s.row.receiver_details" :key="idx" class="recv-block">
|
||||
<div class="recv-line1">
|
||||
<div class="recv-head">
|
||||
<span class="recv-role">{{ r.role_label }}</span>
|
||||
<span class="recv-name" :title="r.display_name">{{ r.display_name }}</span>
|
||||
<span class="recv-amt">¥{{ formatMoney(r.amount) }}</span>
|
||||
</div>
|
||||
<div class="scroll-cell recv-name-line" @wheel="scrollCellWheel">
|
||||
<span class="scroll-cell-inner">{{ r.display_name }}</span>
|
||||
</div>
|
||||
<div class="recv-line2 scroll-cell" @wheel="scrollCellWheel" v-if="r.account">
|
||||
<span class="scroll-cell-inner mono-text">{{ r.account }}</span>
|
||||
</div>
|
||||
@@ -280,9 +293,19 @@
|
||||
<span :class="'status-tag s' + s.row.status">{{ s.row.status_text }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="失败原因" min-width="120">
|
||||
<el-table-column label="失败原因" min-width="168">
|
||||
<template slot-scope="s">
|
||||
<div v-if="s.row.fail_reason" class="fail-text" :title="s.row.fail_reason">{{ s.row.fail_reason }}</div>
|
||||
<div v-if="s.row.fail_reason_full || s.row.fail_reason" class="fail-cell">
|
||||
<div class="fail-brief">{{ s.row.fail_reason || s.row.fail_reason_full }}</div>
|
||||
<el-popover
|
||||
v-if="s.row.fail_reason_full"
|
||||
placement="left"
|
||||
width="380"
|
||||
trigger="click">
|
||||
<pre class="fail-pop-full">{{ s.row.fail_reason_full }}</pre>
|
||||
<span slot="reference" class="fail-more">查看完整原因</span>
|
||||
</el-popover>
|
||||
</div>
|
||||
<span v-else style="color:#909399;">—</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
在新工单中引用
屏蔽一个用户