qdintc/intc-vue-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 待还款明细增加字段，完善功能。

Browse Source
This commit is contained in:
tianyongbao
2026-03-06 22:29:17 +08:00
parent 1b93c2df12
commit 8a4fe17213
1 changed files with 109 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

130
src/pages/statistic/bill/onlineLendAnalysis/index.vue
View File

@@ -261,31 +261,45 @@
<!-- 详细还款明细列表 -->
<view class="item-body" v-if="item.detailList && item.detailList.length > 0">
<view class="detail-item" v-for="(detail, dIndex) in item.detailList" :key="dIndex">
<view class="detail-header">
<view class="bank-name">
<uni-icons type="wallet-filled" size="14" color="#667eea"></uni-icons>
<text>{{ detail.bankCardLendName }}</text>
<!-- 按还款账户分组显示 -->
<view class="repayment-account-group" v-for="(group, gIndex) in groupByRepaymentAccount(item.detailList)" :key="gIndex">
<!-- 该账户下的贷款明细 -->
<view class="detail-item" v-for="(detail, dIndex) in group.items" :key="dIndex" :class="{ 'last-item': dIndex === group.items.length - 1 }">
<view class="detail-header">
<view class="bank-name">
<uni-icons type="wallet-filled" size="14" color="#667eea"></uni-icons>
<text>{{ detail.bankCardLendName }}</text>
</view>
<view class="header-right-section">
<text class="current-amount">{{ detail.currentAmount }}元</text>
<button class="repay-btn-small" @click="handleRepayment(detail)">
<uni-icons type="checkmarkempty" size="14" color="#ffffff"></uni-icons>
<text>还款</text>
</button>
</view>
</view>
<view class="header-right-section">
<text class="current-amount">{{ detail.currentAmount }}元</text>
<button class="repay-btn-small" @click="handleRepayment(detail)">
<uni-icons type="checkmarkempty" size="14" color="#ffffff"></uni-icons>
<text>还款</text>
</button>
<view class="detail-info">
<view class="info-row">
<view class="info-item">
<text class="info-label">本金</text>
<text class="info-value">{{ detail.principal }}元</text>
</view>
<view class="info-item">
<text class="info-label">利息</text>
<text class="info-value">{{ detail.interest }}元</text>
</view>
</view>
</view>
</view>
<view class="detail-info">
<view class="info-row">
<view class="info-item">
<text class="info-label">本金</text>
<text class="info-value">{{ detail.principal }}元</text>
</view>
<view class="info-item">
<text class="info-label">利息</text>
<text class="info-value">{{ detail.interest }}元</text>
</view>
<!-- 还款账户信息（放在该账户最后一笔明细后面） -->
<view class="repayment-account-footer" v-if="group.repaymentAccountName">
<view class="account-info">
<uni-icons type="wallet-filled" size="12" color="#10b981"></uni-icons>
<text class="account-label">还款账户：</text>
<text class="account-name">{{ group.repaymentAccountName }}</text>
<text class="account-balance">余额 {{ group.repaymentAccountBalance }}元</text>
</view>
</view>
</view>
@@ -676,6 +690,29 @@ function searchSubmit() {
})
}
// 按还款账户分组
function groupByRepaymentAccount(detailList) {
if (!detailList || detailList.length === 0) return []
const groups = {}
detailList.forEach(detail => {
const accountKey = detail.repaymentAccountName || '其他账户'
if (!groups[accountKey]) {
groups[accountKey] = {
repaymentAccountName: detail.repaymentAccountName,
repaymentAccountBalance: detail.repaymentAccountBalance || '0.00',
items: []
}
}
groups[accountKey].items.push(detail)
})
return Object.values(groups)
}
function settingConfirm(e) {
queryParams.value.settingId = e.value[0].settingId
queryParams.value.settingName = e.value[0].settingName
@@ -1161,6 +1198,57 @@ page {
.item-body {
padding: 24rpx;
.repayment-account-group {
margin-bottom: 16rpx;
&:last-child {
margin-bottom: 0;
}
.detail-item {
margin-bottom: 12rpx;
&:last-child {
margin-bottom: 0;
}
}
.repayment-account-footer {
margin-top: 8rpx;
padding: 12rpx 20rpx;
background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
border-radius: 0 0 12rpx 12rpx;
border-left: 4rpx solid #10b981;
.account-info {
display: flex;
align-items: center;
gap: 8rpx;
.account-label {
font-size: 22rpx;
color: #065f46;
}
.account-name {
font-size: 26rpx;
color: #065f46;
font-weight: 600;
flex: 1;
}
.account-balance {
font-size: 22rpx;
color: #059669;
font-weight: 500;
background: rgba(255, 255, 255, 0.6);
padding: 4rpx 10rpx;
border-radius: 6rpx;
}
}
}
}
.detail-item {
padding: 20rpx;
margin-bottom: 16rpx;