fix: 待还款明细新增字段并优化。
This commit is contained in:
@@ -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: [] }
|
||||
|
||||
Reference in New Issue
Block a user