fix: 贷款账单功能优化。

This commit is contained in:
tianyongbao
2025-10-19 12:37:57 +08:00
parent 71cf7d34e6
commit 36f7ae47cc

View File

@@ -38,6 +38,7 @@
<span>{{ parseTime(scope.row.installmentDate, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.installmentDate, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="收款账户" align="center" width="150" prop="receivingAccountNameCode" />
<el-table-column label="借款期数" align="center" width="80" prop="period" /> <el-table-column label="借款期数" align="center" width="80" prop="period" />
<el-table-column label="已还期数" align="center" width="80" prop="repaidPeriod" /> <el-table-column label="已还期数" align="center" width="80" prop="repaidPeriod" />
<el-table-column label="总利息" align="center" prop="totalInterest" /> <el-table-column label="总利息" align="center" prop="totalInterest" />
@@ -101,6 +102,11 @@
<el-form-item label="借款金额" prop="installmentAmount"> <el-form-item label="借款金额" prop="installmentAmount">
<el-input v-model="form.installmentAmount" type="number" placeholder="请输入借款金额" /> <el-input v-model="form.installmentAmount" type="number" placeholder="请输入借款金额" />
</el-form-item> </el-form-item>
<el-form-item label="收款账户" prop="receivingAccountId">
<el-select v-model="form.receivingAccountId" placeholder="请选择收款账户" clearable>
<el-option v-for="debitCard in debitCardList" :key="debitCard.id" :label="debitCard.nameCode" :value="debitCard.id" />
</el-select>
</el-form-item>
<el-form-item label="总利息" prop="totalInterest"> <el-form-item label="总利息" prop="totalInterest">
<el-input v-model="form.totalInterest" type="number" placeholder="请输入总利息" /> <el-input v-model="form.totalInterest" type="number" placeholder="请输入总利息" />
</el-form-item> </el-form-item>
@@ -139,7 +145,12 @@
<!-- 添加或修改分期历史明细对话框 --> <!-- 添加或修改分期历史明细对话框 -->
<el-dialog :title="titleDetail" v-model="openDetail" width="500px" append-to-body> <el-dialog :title="titleDetail" v-model="openDetail" width="500px" append-to-body>
<el-form ref="installmentDetailRef" :model="formDetail" :rules="rulesDetail" label-width="120px"> <el-form ref="installmentDetailRef" :model="formDetail" :rules="rulesDetail" label-width="120px" :disabled="titleDetail === '查看贷款明细'">
<el-form-item label="还款账户" prop="repaymentAccountId">
<el-select v-model="formDetail.repaymentAccountId" placeholder="请选择还款账户" clearable>
<el-option v-for="debitCard in debitCardList" :key="debitCard.id" :label="debitCard.nameCode" :value="debitCard.id" />
</el-select>
</el-form-item>
<el-form-item label="还款日期" prop="repaymentDate"> <el-form-item label="还款日期" prop="repaymentDate">
<el-date-picker clearable v-model="formDetail.repaymentDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择还款日期"> </el-date-picker> <el-date-picker clearable v-model="formDetail.repaymentDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择还款日期"> </el-date-picker>
</el-form-item> </el-form-item>
@@ -157,14 +168,14 @@
</el-form-item> </el-form-item>
<el-form-item label="入账状态" prop="postingState"> <el-form-item label="入账状态" prop="postingState">
<el-select v-model="formDetail.postingState" placeholder="请选择入账状态"> <el-select v-model="formDetail.postingState" placeholder="请选择入账状态">
<el-option v-for="dict in posting_state" :key="dict.value" :label="dict.label" :value="dict.value"></el-option> <el-option v-for="dict in repayment_state" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="remark"> <el-form-item label="备注" prop="remark">
<el-input v-model="formDetail.remark" type="textarea" placeholder="请输入备注" /> <el-input v-model="formDetail.remark" type="textarea" placeholder="请输入备注" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template v-if="titleDetail !== '查看贷款明细'" #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button type="primary" @click="submitFormDetail"> </el-button> <el-button type="primary" @click="submitFormDetail"> </el-button>
<el-button @click="cancelDetail"> </el-button> <el-button @click="cancelDetail"> </el-button>
@@ -185,28 +196,49 @@
</div> </div>
<div class="content-con"> <div class="content-con">
<el-table v-loading="loading" :data="installmentDetailList"> <el-table v-loading="loading" :data="installmentDetailList">
<el-table-column label="还款日期" align="center" prop="repaymentDate" width="180"> <el-table-column label="还款账户" align="center" prop="repaymentAccountName" />
<el-table-column label="还款日期" align="center" prop="repaymentDate" width="120">
<template #default="scope"> <template #default="scope">
<span>{{ parseTime(scope.row.repaymentDate, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.repaymentDate, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="还款期数" align="center" prop="periods" /> <el-table-column label="还款期数" align="center" prop="periods" width="100" />
<el-table-column label="还款金额" align="center" prop="currentAmount" /> <el-table-column label="还款金额" align="center" prop="currentAmount" />
<el-table-column label="应还本金" align="center" prop="principal" /> <el-table-column label="应还本金" align="center" prop="principal" />
<el-table-column label="利息" align="center" prop="interest" /> <el-table-column label="利息" align="center" prop="interest" />
<el-table-column label="入账状态" align="center" prop="postingState"> <el-table-column label="入账状态" align="center" prop="postingState" width="100">
<template #default="scope"> <template #default="scope">
<dict-tag :options="posting_state" :value="scope.row.postingState" /> <dict-tag :options="repayment_state" :value="scope.row.postingState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template v-slot="scope"> <template v-slot="scope">
<div class="ctrl-btn d-flex"> <div class="ctrl-btn d-flex">
<el-tooltip v-for="item in operateDetailList" :key="item.id" class="item" effect="dark" :content="item.title" placement="top"> <template v-if="scope.row.postingState === '1'">
<el-button :icon="item.icon" v-hasPermi="item.hasPermi" circle @click="handleDetailOperate(item.id, scope.row)"></el-button> <el-tooltip class="item" effect="dark" content="查看" placement="top">
</el-tooltip> <el-button
icon="View"
v-hasPermi="['invest:installmentHistory:query']"
circle
@click="handleDetailOperate('view', scope.row)"
></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<el-button
icon="Delete"
v-hasPermi="['invest:installmentHistory:remove']"
circle
@click="handleDetailOperate('delete', scope.row)"
></el-button>
</el-tooltip>
</template>
<template v-else>
<el-tooltip v-for="item in operateDetailList" :key="item.id" class="item" effect="dark" :content="item.title" placement="top">
<el-button :icon="item.icon" v-hasPermi="item.hasPermi" circle @click="handleDetailOperate(item.id, scope.row)"></el-button>
</el-tooltip>
</template>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@@ -239,7 +271,7 @@ import { listBankcardLend } from '@/api/invest/bankcardlend'
import { require } from '@/utils/require' import { require } from '@/utils/require'
import dayjs from 'dayjs' import dayjs from 'dayjs'
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
const { settle_state, bank_card_type, posting_state } = proxy.useDict('settle_state', 'bank_card_type', 'posting_state') const { settle_state, repayment_state } = proxy.useDict('settle_state', 'repayment_state')
const installmentHistoryList = ref([]) const installmentHistoryList = ref([])
const installmentDetailList = ref([]) const installmentDetailList = ref([])
@@ -256,6 +288,7 @@ const title = ref('')
const titleDetail = ref('') const titleDetail = ref('')
const currentInstallmentHistoryId = ref('') const currentInstallmentHistoryId = ref('')
const creditCardList = ref([]) const creditCardList = ref([])
const debitCardList = ref([])
const operateList = ref([ const operateList = ref([
{ id: 'detail', icon: 'Grid', title: '查看添加明细', hasPermi: ['invest:installmentHistory:query'] }, { id: 'detail', icon: 'Grid', title: '查看添加明细', hasPermi: ['invest:installmentHistory:query'] },
{ id: 'view', icon: 'View', title: '查看', hasPermi: ['invest:installmentHistory:query'] }, { id: 'view', icon: 'View', title: '查看', hasPermi: ['invest:installmentHistory:query'] },
@@ -284,8 +317,16 @@ const data = reactive({
lendType: '1', lendType: '1',
pageSize: 1000 pageSize: 1000
}, },
queryDebitCardParams: {
pageNum: 1,
type: '1',
status: '1',
// lendType: '1',
pageSize: 1000
},
rules: { rules: {
bankCardLendId: [{ required: true, message: '贷款机构不能为空', trigger: 'blur' }], bankCardLendId: [{ required: true, message: '贷款机构不能为空', trigger: 'blur' }],
receivingAccountId: [{ required: true, message: '收款账户不能为空', trigger: 'blur' }],
installmentAmount: [{ required: true, message: '借款金额不能为空', trigger: 'blur' }], installmentAmount: [{ required: true, message: '借款金额不能为空', trigger: 'blur' }],
installmentDate: [{ required: true, message: '借款日期不能为空', trigger: 'blur' }], installmentDate: [{ required: true, message: '借款日期不能为空', trigger: 'blur' }],
period: [{ required: true, message: '借款期数不能为空', trigger: 'blur' }], period: [{ required: true, message: '借款期数不能为空', trigger: 'blur' }],
@@ -295,6 +336,7 @@ const data = reactive({
balance: [{ required: true, message: '余额不能为空', trigger: 'blur' }] balance: [{ required: true, message: '余额不能为空', trigger: 'blur' }]
}, },
rulesDetail: { rulesDetail: {
repaymentAccountId: [{ required: true, message: '还款账户不能为空', trigger: 'blur' }],
installmentHistoryId: [{ required: true, message: '分期历史id不能为空', trigger: 'blur' }], installmentHistoryId: [{ required: true, message: '分期历史id不能为空', trigger: 'blur' }],
bankCardLendId: [{ required: true, message: '信用卡贷款不能为空', trigger: 'blur' }], bankCardLendId: [{ required: true, message: '信用卡贷款不能为空', trigger: 'blur' }],
repaymentDate: [{ required: true, message: '还款日期不能为空', trigger: 'blur' }], repaymentDate: [{ required: true, message: '还款日期不能为空', trigger: 'blur' }],
@@ -326,6 +368,9 @@ const handleOperate = (operate, row) => {
const handleDetailOperate = (operate, row) => { const handleDetailOperate = (operate, row) => {
switch (operate) { switch (operate) {
case 'view':
handleViewDetail(row)
break
case 'edit': case 'edit':
handleUpdateDetail(row) handleUpdateDetail(row)
break break
@@ -337,7 +382,7 @@ const handleDetailOperate = (operate, row) => {
} }
} }
const { queryParams, queryCreditCardParams, form, rules, formDetail, rulesDetail } = toRefs(data) const { queryParams, queryCreditCardParams, form, rules, formDetail, rulesDetail, queryDebitCardParams } = toRefs(data)
/** 查询贷款机构卡管理列表 */ /** 查询贷款机构卡管理列表 */
function getCreditCardList() { function getCreditCardList() {
@@ -346,6 +391,13 @@ function getCreditCardList() {
}) })
} }
/** 查询储蓄卡卡管理列表 */
function getDebitCardList() {
listBankcardLend(queryDebitCardParams.value).then((response) => {
debitCardList.value = response.rows
})
}
/** 查询贷款账单列表 */ /** 查询贷款账单列表 */
function getList() { function getList() {
loading.value = true loading.value = true
@@ -380,12 +432,12 @@ function reset() {
installmentAmount: null, installmentAmount: null,
installmentDate: null, installmentDate: null,
period: null, period: null,
repaidPeriod: null, repaidPeriod: 0,
totalInterest: null, totalInterest: null,
interestRate: null, interestRate: null,
dueDate: null, dueDate: null,
closeDate: null, closeDate: null,
state: null, state: '0',
createBy: null, createBy: null,
createTime: null, createTime: null,
updateBy: null, updateBy: null,
@@ -523,6 +575,16 @@ function handleUpdate(row) {
}) })
} }
/** 查看按钮操作 */
function handleViewDetail(row) {
resetDetail()
getInstallmentDetail(row.id).then((response) => {
formDetail.value = response.data
openDetail.value = true
titleDetail.value = '查看贷款明细'
})
}
/** 修改按钮操作 */ /** 修改按钮操作 */
function handleUpdateDetail(row) { function handleUpdateDetail(row) {
resetDetail() resetDetail()
@@ -558,27 +620,42 @@ function submitForm() {
function submitFormDetail() { function submitFormDetail() {
proxy.$refs.installmentDetailRef.validate((valid) => { proxy.$refs.installmentDetailRef.validate((valid) => {
if (valid) { if (valid) {
if (formDetail.value.id != null) { // 判断入账状态是否为1如果是则弹出确认框
updateInstallmentDetail(formDetail.value).then((response) => { if (formDetail.value.postingState === '1') {
proxy.$modal.msgSuccess('修改明细成功') proxy.$modal
openDetail.value = false .confirm('是否确认已还款?')
listInstallmentDetail({ installmentHistoryId: currentInstallmentHistoryId.value, pageNum: 1, pageSize: 1000 }).then((response) => { .then(function () {
installmentDetailList.value = response.rows executeSubmitDetail()
}) })
}) .catch(() => {})
} else { } else {
addInstallmentDetail(formDetail.value).then((response) => { executeSubmitDetail()
proxy.$modal.msgSuccess('新增明细成功')
openDetail.value = false
listInstallmentDetail({ installmentHistoryId: currentInstallmentHistoryId.value, pageNum: 1, pageSize: 1000 }).then((response) => {
installmentDetailList.value = response.rows
})
})
} }
} }
}) })
} }
/** 执行提交明细操作 */
function executeSubmitDetail() {
if (formDetail.value.id != null) {
updateInstallmentDetail(formDetail.value).then((response) => {
proxy.$modal.msgSuccess('修改明细成功')
openDetail.value = false
listInstallmentDetail({ installmentHistoryId: currentInstallmentHistoryId.value, pageNum: 1, pageSize: 1000 }).then((response) => {
installmentDetailList.value = response.rows
})
})
} else {
addInstallmentDetail(formDetail.value).then((response) => {
proxy.$modal.msgSuccess('新增明细成功')
openDetail.value = false
listInstallmentDetail({ installmentHistoryId: currentInstallmentHistoryId.value, pageNum: 1, pageSize: 1000 }).then((response) => {
installmentDetailList.value = response.rows
})
})
}
}
/** 删除按钮操作 */ /** 删除按钮操作 */
function handleDelete(row) { function handleDelete(row) {
const _ids = row.id || ids.value const _ids = row.id || ids.value
@@ -622,5 +699,6 @@ function handleExport() {
} }
getCreditCardList() getCreditCardList()
getDebitCardList()
getList() getList()
</script> </script>