<template>
|
<div class="branch">
|
<el-dialog :visible.sync="branchVisible" :close-on-click-modal='false' @close="closeDialog" center>
|
<el-form ref="form" :model="form" label-width="95px" inline size="small">
|
<el-form-item label="银行名称" style="margin-right:30px">
|
<el-input v-model="form.bankname" onkeypress="if(event.keyCode == 13) return false;" placeholder="支持模糊检索,点击支行选中"></el-input>
|
</el-form-item>
|
<el-form-item label="">
|
<el-button type="primary" @click="handleSearch(form)">查询</el-button>
|
</el-form-item>
|
</el-form>
|
<el-table
|
stripe
|
:data="branchData"
|
highlight-current-row
|
@current-change="getCurrentRow"
|
:header-cell-style="{background:'#f5f5f5',color:'#222222'}"
|
empty-text='暂无该支行,请仅使用城市名进行模糊检索如“深圳”,如支行仍不全请就近选择'
|
>
|
<el-table-column prop="bankno" label="银行代码" width="180"></el-table-column>
|
<el-table-column prop="bankname" label="银行名称"></el-table-column>
|
<el-table-column prop="banacode" label="总行代码" width="120"></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>
|
<span slot="footer" class="dialog-footer">
|
<el-button plain @click="closeDialog">返回</el-button>
|
<el-button type="primary" @click="submit">确定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
<script>
|
import {
|
qryBankBranchList
|
} from "@/api/product";
|
export default {
|
props:['visible','bank'],
|
data () {
|
return {
|
branchData:[],
|
bankData:'',
|
currentPage:1,
|
total:0,
|
form:{
|
currentPage:1,
|
pageSize:10,
|
bankcode:this.bank,
|
bankname:''
|
},
|
}
|
},
|
computed: {
|
branchVisible:{
|
get(){
|
return this.visible
|
},
|
set(){}
|
}
|
},
|
created () {
|
this.getBankBranchList()
|
},
|
methods: {
|
closeDialog(){
|
this.$emit('closeBranch',false)
|
},
|
//设置每页多少条
|
handleSizeChange(val) {
|
this.form.pageSize = val;
|
this.getBankBranchList(this.form);
|
},
|
//查询当前页
|
handleCurrentChange(val) {
|
this.form.currentPage = val;
|
this.getBankBranchList(this.form);
|
},
|
// 获取当前选中行
|
getCurrentRow(row){
|
this.bankData = row
|
},
|
// 搜索
|
handleSearch(form){
|
form.currentPage = 1
|
this.getBankBranchList()
|
},
|
// 查询银行分支行
|
getBankBranchList(){
|
qryBankBranchList(this.form).then(res=>{
|
this.branchData = res.result.records
|
this.total = res.result.total
|
})
|
},
|
// 点击确定将参数回传给父组件并关闭弹窗
|
submit(){
|
this.$emit('sendBranch',this.bankData)
|
this.$emit('closeBranch',false)
|
}
|
}
|
}
|
</script>
|
<style lang="stylus">
|
.branch
|
.el-dialog
|
width auto
|
max-width calc(100% - 180px)
|
min-width 850px
|
max-height 100%
|
overflow hidden
|
margin 0 !important
|
position absolute
|
left 50%
|
top 50%
|
transform translate(-50%,-50%)
|
.el-dialog__header
|
padding 0
|
.el-dialog__body
|
padding 20px
|
.el-dialog__footer
|
padding 0 20px 20px
|
.el-button
|
width: 120px
|
font-size: 14px
|
line-height: 20px
|
padding: 5px 0
|
&+.el-button
|
margin-left 40px
|
</style>
|