fix: 待还款明细新增字段并优化。

This commit is contained in:
tianyongbao
2026-03-06 22:16:22 +08:00
parent 7baee5faff
commit a88b724f2f

View File

@@ -160,22 +160,31 @@
<template #default="scope">
<div v-if="scope.row.detailList && scope.row.detailList.length > 0">
<div
v-for="(item, index) in scope.row.detailList"
:key="index"
style="
display: flex;
align-items: center;
justify-content: space-between;
padding: 6px 8px;
margin-bottom: 4px;
background: #f5f7fa;
border-radius: 4px;
"
v-for="(group, groupIndex) in groupByRepaymentAccount(scope.row.detailList)"
:key="groupIndex"
style="padding: 6px 8px; margin-bottom: 4px; background: #f5f7fa; border-radius: 4px"
>
<span style="flex: 1"
>{{ item.bankCardLendName }}(本金:{{ item.principal }},利息:{{ item.interest }},合计:{{ item.currentAmount }})</span
<!-- 还款账户信息同一账户只显示一次 -->
<div v-if="group.repaymentAccountName" style="margin-bottom: 4px; color: #409eff; font-weight: 500">
还款账户:{{ group.repaymentAccountName }}(余额:{{ group.repaymentAccountBalance }})
</div>
<!-- 该账户下的所有明细 -->
<div
v-for="(item, itemIndex) in group.items"
:key="itemIndex"
:style="{
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
padding: '4px 0',
borderTop: itemIndex > 0 ? '1px dashed #dcdfe6' : 'none'
}"
>
<el-button size="small" type="primary" icon="Coin" @click="handleRepayment(item)">还款</el-button>
<span style="flex: 1"
>{{ item.bankCardLendName }}(本金:{{ item.principal }},利息:{{ item.interest }},合计:{{ item.currentAmount }})</span
>
<el-button size="small" type="primary" icon="Coin" @click="handleRepayment(item)">还款</el-button>
</div>
</div>
</div>
<span v-else v-html="formatMultiLineData(scope.row.detail)"></span>
@@ -392,6 +401,26 @@ const reversedTableData = computed(() => {
return []
})
// 按还款账户分组处理明细数据
const groupByRepaymentAccount = (detailList) => {
if (!detailList || detailList.length === 0) return []
const groups = {}
detailList.forEach((item) => {
const key = item.repaymentAccountName || '未指定账户'
if (!groups[key]) {
groups[key] = {
repaymentAccountName: item.repaymentAccountName,
repaymentAccountBalance: item.repaymentAccountBalance,
items: []
}
}
groups[key].items.push(item)
})
return Object.values(groups)
}
function getList() {
loading.value = true
chartData.value = { name: [], value1: [] }