<template>
|
<div class="waitFunds">
|
<p class="title">
|
<span></span>
|
待认领资金
|
</p>
|
<el-form :model="form" ref="form" label-width="95px" size="small" inline>
|
<el-form-item label="对公结算户账号" prop="acctNo">
|
<el-input v-model="form.acctNo"></el-input>
|
</el-form-item>
|
<el-form-item label="客户结算虚拟号" prop="psbnbr">
|
<el-input v-model="form.psbnbr"></el-input>
|
</el-form-item>
|
<el-form-item label="收款日期" prop="etydat" v-show="isHide">
|
<el-date-picker
|
v-model="form.etydat"
|
type="daterange"
|
format="yyyy/MM/dd"
|
value-format="yyyy/MM/dd"
|
range-separator="-"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
></el-date-picker>
|
</el-form-item>
|
<el-form-item label="绑定客户名称" prop="customerName" v-show="isshow">
|
<el-input v-model="form.customerName"></el-input>
|
</el-form-item>
|
<el-form-item label="转账付方名称" prop="rpynam" v-show="isshow">
|
<el-input v-model="form.rpynam"></el-input>
|
</el-form-item>
|
<el-form-item label="转账付方银行账号" prop="rpyacc" v-show="isshow">
|
<el-input v-model="form.rpyacc"></el-input>
|
</el-form-item>
|
<el-form-item label="收付金额" v-show="isshow">
|
<div class="simulated_border">
|
<el-col :span="11">
|
<el-input v-model="form.startPaymentAmt" placeholder="开始金额"></el-input>
|
</el-col>
|
<el-col class="line" :span="2" style="text-align:center">-</el-col>
|
<el-col :span="11">
|
<el-input v-model="form.endPaymentAmt" placeholder="结束金额"></el-input>
|
</el-col>
|
</div>
|
</el-form-item>
|
<el-form-item label="转账备注" prop="trxtxt" v-show="isshow">
|
<el-input v-model="form.trxtxt"></el-input>
|
</el-form-item>
|
<el-form-item label="银行交易流水号" prop="trxnbr" v-show="isshow">
|
<el-input v-model="form.trxnbr"></el-input>
|
</el-form-item>
|
<el-form-item :class="[{'showSearch':clientWidth<=1600&&isshow},{'direction':isshow}]">
|
<el-button plain @click="resetForm('form')">重置</el-button>
|
<el-button type="primary" @click="handleSearch(form)">搜索</el-button>
|
<el-button type="text" v-show="!isshow" @click="show()">
|
展开
|
<i class="el-icon-arrow-down el-icon--right"></i>
|
</el-button>
|
<el-button type="text" v-show="isshow" @click="show()">
|
收起
|
<i class="el-icon-arrow-up el-icon--right"></i>
|
</el-button>
|
</el-form-item>
|
</el-form>
|
<el-button type="primary" size="small" style="margin:6px 0 30px" icon="iconfont icon-xitongfenpeirenwu" @click="claimBankRecords">认领</el-button>
|
<el-table
|
stripe
|
ref="multipleTable"
|
:data="bankRecords"
|
:header-cell-style="{background:'#f5f5f5',color:'#222222'}"
|
@selection-change="handleSelectionChange"
|
highlight-current-row
|
>
|
<el-table-column type="selection" width="55"></el-table-column>
|
<el-table-column label="银行交易流水号" width="176" prop="trxnbr">
|
<template slot-scope="{row}">
|
<span>{{row.trxnbr?row.trxnbr:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="收付金额" width="110">
|
<template slot-scope="{row}">
|
<span>{{row.crtamt!==''?row.crtamt=formatMoney(row.crtamt):'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="剩余待认领金额" width="130">
|
<template slot-scope="{row}">
|
<span>{{row.coreBalance!==''?row.coreBalance=formatMoney(row.coreBalance):'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="对公结算户账号" width="150">
|
<template slot-scope="{row}">
|
<span>{{row.acctNo?row.acctNo:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="对公结算户户名" width="230">
|
<template slot-scope="{row}">
|
<span>{{row.acctName?row.acctName:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="转账付方银行账号" width="170">
|
<template slot-scope="{row}">
|
<span>{{row.rpyacc?row.rpyacc:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="转账付方名称" width="170">
|
<template slot-scope="{row}">
|
<span>{{row.rpynam?row.rpynam:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="客户结算虚拟号" width="170">
|
<template slot-scope="{row}">
|
<span>{{row.psbnbr?row.psbnbr:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="绑定客户名称" width="120">
|
<template slot-scope="{row}">
|
<span>{{row.customerName?row.customerName:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="转账备注" width="200" show-overflow-tooltip>
|
<template slot-scope="{row}">
|
<span>{{row.trxtxt?row.trxtxt:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="收款日期" width="120">
|
<template slot-scope="{row}">
|
<span>{{row.etydat?row.etydat:'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="认领状态" width="120">
|
<template slot-scope="{row}">
|
<span>{{row.status==0?'未认领':row.status==1?'部分认领':row.status==2?'全额认领':'--'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="项目名称" width="180" v-if="operationType!=1">
|
<template slot-scope="{row}">
|
<span>{{row.projectName?row.projectName:'--'}}</span>
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-pagination
|
background
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page.sync="currentPage"
|
:page-sizes="[10, 20, 30, 40, 50]"
|
:page-size="10"
|
layout="prev, pager, next, sizes, jumper"
|
:total="total"
|
></el-pagination>
|
<Claim
|
v-if="isClaim"
|
:visible='isClaim'
|
:claim="trxnbrList"
|
:loan="loanInfo"
|
:surplusTotalAmt='surplusTotalAmt'
|
@closeClaim="closeClaim"
|
@sendClaimResult="sendClaimResult"
|
>
|
</Claim>
|
</div>
|
</template>
|
<script>
|
import {
|
queryBankRecords,
|
claimBankRecords,
|
countRepaymenData
|
} from '@api/product'
|
import '../public/loanApprovalApply/index.styl'
|
import Claim from './Claim'
|
export default {
|
props: [
|
'balancefictitiousaccount',
|
'collectionMethod',
|
'projectedLendersDay',
|
'operationType',
|
'isEntAdvanceMoney',
|
'entAdvanceMoneyStatus',
|
'surplusTotalAmt'
|
],
|
data () {
|
return {
|
applyInfo:this.$store.state.product.applyInfo,
|
bankRecords:[],
|
trxnbrList:[],
|
loanInfo:{},
|
form:{
|
applySerialno:this.$store.state.product.applyInfo.serialNo,
|
operationType:this.operationType,
|
psbnbr:this.operationType != 2?this.balancefictitiousaccount:'',
|
currentPage:1,
|
pageSize:10
|
},
|
clientWidth: window.parent.document.body.clientWidth,
|
isshow:false,
|
isHide:true,
|
isClaim:false,
|
total:0,
|
currentPage:1,
|
}
|
},
|
created () {
|
this.queryBankRecords()
|
},
|
components: {
|
Claim
|
},
|
mounted() {
|
var _this = this;
|
window.onresize = function() {
|
// 定义窗口大小变更通知事件
|
_this.clientWidth = window.parent.document.body.clientWidth;
|
_this.clientWidth <= 1750 && !_this.isshow
|
? (_this.isHide = false)
|
: (_this.isHide = true);
|
};
|
},
|
methods: {
|
// 接受子组件认领确认成功的回调在回传给父组件
|
sendClaimResult(){
|
// 清空列表选中状态
|
this.$refs.multipleTable.clearSelection();
|
// 刷新列表数据
|
this.queryBankRecords()
|
// 通知父组件结果
|
this.$emit('sendClaimResult',true)
|
},
|
// 查询流水
|
queryBankRecords(){
|
if(this.form.etydat){
|
this.form.startPaymentDate = this.form.etydat[0].replace(/\//g, "")
|
this.form.endPaymentDate = this.form.etydat[1].replace(/\//g, "")
|
}
|
for (const key in this.form) {
|
if (!this.form[key]) {
|
delete this.form[key]
|
}
|
}
|
queryBankRecords(this.form).then(res=>{
|
this.bankRecords = res.result.records
|
this.total = res.result.total
|
})
|
},
|
// 关闭认领弹窗确认
|
closeClaim(data){
|
this.isClaim = data
|
},
|
//设置每页多少条
|
handleSizeChange(val) {
|
this.form.pageSize = val;
|
this.queryBankRecords();
|
},
|
//查询当前页
|
handleCurrentChange(val) {
|
this.form.currentPage = val;
|
this.queryBankRecords();
|
},
|
// 银行流水认领
|
claimBankRecords(){
|
if(!this.trxnbrList.length){
|
this.$message.warning('请选择需要认领的银行交易流水号')
|
return
|
}
|
// 只有赎楼的本金回款信息和息费结算信息,招标贷的还款信息,保理的回款信息需要弹出确认框
|
if(
|
this.$route.path == '/ZBDCreditFlow/repayment' ||
|
this.$route.path == '/BuildingBusinessFlow/receivable' ||
|
this.$route.path == '/CreditFlowPublic/moneyBack' ||
|
this.$route.path == '/BuildingBusinessFlow/interestSettle'
|
){
|
this.isClaim = true
|
}else{
|
if(!this.collectionMethod){
|
this.$message.warning('收取方式不能空')
|
return
|
}
|
if(this.operationType != 2 && !this.projectedLendersDay){
|
this.$message.warning('预计放款日不能空')
|
return
|
}
|
const obj = {
|
operationType:this.operationType,
|
applySerialno:this.$store.state.product.applyInfo.serialNo,
|
collectionMethod:this.collectionMethod,
|
projectedLendersDay:this.projectedLendersDay,
|
trxnbrList:this.trxnbrList//这个字段待定
|
}
|
this.$parent.$parent._data.loading = true;
|
claimBankRecords(obj).then(res=>{
|
this.$parent.$parent._data.loading = false;
|
if(res.code == '00'){
|
// 认领成功后通知父组件刷新已认领资金列表
|
this.$message.success('银行流水认领成功')
|
// 刷新待认领资金列表
|
this.queryBankRecords()
|
this.$emit('sendClaim',true)
|
}
|
})
|
}
|
},
|
// 选中银行流水
|
handleSelectionChange(array){
|
this.trxnbrList = []
|
// 招标贷的还款信息,赎楼的本金回款信息和息费结算信息,保理的回款信息需要传选中一行的数据
|
if(this.$route.path == '/ZBDCreditFlow/repayment'){
|
// 根据勾选银行流水计算还款金额(招标贷)
|
if(array.length){
|
array.forEach(val => {
|
val.applySerialNo = this.applyInfo.serialNo
|
val.isEntAdvanceMoney = this.isEntAdvanceMoney
|
val.entAdvanceMoneyStatus = this.entAdvanceMoneyStatus
|
});
|
this.$parent.$parent._data.loading = true;
|
countRepaymenData(array).then(res=>{
|
this.$parent.$parent._data.loading = false;
|
if(res.code == '00'){
|
this.trxnbrList = array
|
this.loanInfo = res.result
|
this.$emit('sendLoanInfo',res.result)
|
}else{
|
this.$refs.multipleTable.clearSelection();
|
}
|
})
|
}
|
}else if(
|
this.$route.path == '/BuildingBusinessFlow/receivable' ||
|
this.$route.path == '/CreditFlowPublic/moneyBack' ||
|
this.$route.path == '/BuildingBusinessFlow/interestSettle'
|
){
|
this.trxnbrList = array
|
}else{
|
// 非招标贷的还款信息和赎楼的本金回款信息只需获取银行交易流水号
|
array.forEach(val => {
|
this.trxnbrList.push(val.trxnbr)
|
});
|
}
|
},
|
// 金额格式化
|
formatMoney(value) {
|
if (value) {
|
value =
|
parseFloat((value + "").replace(/[^\d\.-]/g, "")).toFixed(2) + "";
|
if (value == "NaN") return;
|
let l = value
|
.split(".")[0]
|
.split("")
|
.reverse();
|
let r = value.split(".")[1];
|
let t = "";
|
for (let i = 0; i < l.length; i++) {
|
t += l[i] + ((i + 1) % 3 === 0 && i + 1 !== l.length ? "," : "");
|
}
|
return (
|
t
|
.split("")
|
.reverse()
|
.join("") +
|
"." +
|
r
|
);
|
}
|
},
|
// 点击展开或收起
|
show() {
|
this.isshow = !this.isshow;
|
this.clientWidth <= 1750 && !this.isshow
|
? (this.isHide = false)
|
: (this.isHide = true);
|
},
|
// 搜索
|
handleSearch(form){
|
form.currentPage = '1';
|
this.queryBankRecords();
|
},
|
// 重置
|
resetForm(formName){
|
this.$refs[formName].resetFields();
|
// 重置清空收款起始和结束日期
|
delete this.form.etydat
|
delete this.form.startPaymentDate
|
delete this.form.endPaymentDate
|
// 清空收付金额
|
this.form.startPaymentAmt = ''
|
this.form.endPaymentAmt = ''
|
this.form.psbnbr = ''
|
delete this.form.startPaymentAmt
|
delete this.form.endPaymentAmt
|
}
|
}
|
}
|
</script>
|
<style lang="stylus">
|
.waitFunds
|
margin 0 0 60px 10px
|
.el-form
|
display: flex
|
justify-content: space-between
|
flex-wrap: wrap
|
.el-form-item
|
display: table
|
width: 25%
|
box-sizing border-box
|
padding-right 30px
|
margin: 0 0 20px 0
|
@media screen and (max-width:1600px){
|
&{
|
width: 33.33%
|
}
|
}
|
.el-form-item__label
|
display: table-cell
|
color: #888888
|
padding 0 10px 0 0
|
line-height 16px
|
.el-form-item__content
|
width 100%
|
.el-input__inner
|
border 1px solid #eee
|
color #222222
|
height 30px
|
.el-date-editor
|
width: auto
|
.el-range-input
|
color #222222
|
.el-select
|
display: block
|
.simulated_border
|
border: 1px solid #eee
|
color #222
|
height 30px
|
.el-input__inner
|
height 100%
|
border none
|
&:last-child
|
&.showSearch
|
width 100%
|
&.direction
|
.el-form-item__content
|
width auto
|
float right
|
</style>
|
