<template>
|
<div>
|
<el-button size="small"
|
type="primary"
|
icon="el-icon-download"
|
:loading="excelLoading"
|
@click="exportBtn">导出Excel</el-button>
|
<el-button size="small"
|
type="primary"
|
icon="el-icon-search"
|
@click="openDialog">计提明细查询</el-button>
|
|
<TableList
|
@handleCurrentChange="handleCurrentChange"
|
@handleSizeChange="handleSizeChange"
|
:pageInfo="pageInfo"
|
:list="records"
|
:header="tableHeader"
|
:loading="loading"
|
title="还款计划"
|
:isShowPages="true"
|
:isShowSummary="true"
|
></TableList>
|
|
<!-- 对资还款计划 -->
|
<!-- <AcctLoanPlanList
|
:serialNo="serialNo"
|
:objectType="objectType"
|
:customerID="customerID"></AcctLoanPlanList> -->
|
<DetailQuery :applySerialno="serialNo" :showDialog="showDialog" @showDialogfn="showDialogfn"/>
|
</div>
|
</template>
|
<script>
|
// 还款计划
|
import { queryAcctPaymentScheduleList, queryPaymentScheduleList } from '@comprehensive/serve/public'
|
import TableList from '../TableList'
|
import AcctLoanPlanList from './AcctLoanPlanList';
|
import { queryAcctPaymentScheduleHeader, AcctPaymentScheduleFields } from '@comprehensive/utils/tableHeaders'
|
import { acctPaymentScheduleSearch } from '@comprehensive/utils/formItems'
|
import XLSX from "xlsx";
|
import DetailQuery from '../base/detailQuery.vue'
|
export default {
|
props: {
|
// 申请编号
|
serialNo: {
|
type: String,
|
required: true
|
},
|
objectType: {
|
type: String,
|
default: ''
|
},
|
customerID: {
|
type: String,
|
default: ''
|
}
|
},
|
components: {
|
TableList,
|
DetailQuery,
|
AcctLoanPlanList
|
},
|
data() {
|
return {
|
records: [],
|
loading: false,
|
excelLoading: false,
|
showDialog:false,
|
flowModel: [],
|
valueInfo: {},
|
pageInfo: {
|
currentPage: 1,
|
pageSize: 50,
|
total: 0
|
},
|
tableHeader: [...queryAcctPaymentScheduleHeader],
|
// 搜索表单字段及描述
|
formInfo: [...acctPaymentScheduleSearch],
|
}
|
},
|
created() {
|
this.init()
|
},
|
methods: {
|
openDialog(){
|
this.showDialog = true
|
},
|
showDialogfn(val){
|
console.log('showDialogfn',val)
|
this.showDialog = val
|
},
|
exportBtn() {
|
this.excelLoading = true
|
const tableHeader = Object.keys(AcctPaymentScheduleFields)
|
const tableKey = Object.values(AcctPaymentScheduleFields)
|
|
this.queryPaymentScheduleList({ currentPage: 1, pageSize: this.pageInfo.total }, (records) => {
|
let tableData = [];
|
records.map(item => {
|
let rowData = []
|
tableKey.map(i => {
|
console.log(item[i])
|
rowData.push(item[i])
|
})
|
tableData.push(rowData)
|
})
|
tableData = [tableHeader, ...tableData];
|
let WorkSheet = XLSX.utils.aoa_to_sheet(tableData);
|
let workbook = XLSX.utils.book_new();
|
XLSX.utils.book_append_sheet(workbook, WorkSheet, '');
|
XLSX.writeFile(workbook, `${this.serialNo}还款计划.xls`)
|
this.excelLoading = false;
|
})
|
},
|
init() {
|
this.flowModel = []
|
this.valueInfo = {}
|
this.pageInfo = {
|
currentPage: 1,
|
pageSize: 50,
|
total: 0
|
}
|
this.queryPaymentScheduleList()
|
},
|
|
async queryPaymentScheduleList(params={}, fun) {
|
this.loading = true
|
const { serialNo, pageInfo } = this
|
const res = await queryPaymentScheduleList({
|
applySerialno: serialNo,
|
includedZerothPeriod: true,
|
...pageInfo,
|
...params
|
})
|
this.loading = false
|
let { records, total } = res.result
|
// records = records.filter(item => {
|
// return item.periodNo != 0
|
// })
|
if(typeof fun === "function") {
|
fun(records)
|
return
|
}
|
this.records = records
|
this.pageInfo.total = parseInt(total)
|
},
|
|
// 修改翻页条数
|
handleSizeChange(val) {
|
this.pageInfo.pageSize = val
|
this.queryPaymentScheduleList()
|
},
|
|
// 修改翻页数
|
handleCurrentChange(val) {
|
this.pageInfo.currentPage = val
|
this.queryPaymentScheduleList()
|
}
|
},
|
watch: {
|
serialNo() {
|
this.init()
|
}
|
}
|
}
|
</script>
|
|
<style lang="postcss" scoped>
|
.form-section {
|
display: flex;
|
align-items: baseline;
|
& .search {
|
margin: 10px 0 0 50px;
|
padding: 0;
|
}
|
}
|
</style>
|
