233 行
8.8 KiB
HTML
可执行文件
233 行
8.8 KiB
HTML
可执行文件
<!--[1.5.37]-->
|
|
<style>
|
|
#accountSetting{
|
|
padding-top: 40px;
|
|
}
|
|
</style>
|
|
<div id="accountSetting">
|
|
<el-form label-width="136px" id="form">
|
|
<div style="padding: 15px 30px 30px;width: 745px;">
|
|
<el-form-item label="结算账户" size="small" required>
|
|
<el-radio v-model="clearing_form" label="1">银行卡</el-radio>
|
|
<el-radio v-model="clearing_form" label="2">支付宝</el-radio>
|
|
</el-form-item>
|
|
<!-- 选择银行卡-->
|
|
<el-form-item label="账号" size="small">
|
|
<el-input type="text" v-model="account_number" auto-complete="off"
|
|
placeholder="请输入银行卡号" maxlength="19"
|
|
onkeyup="this.value=this.value.replace(/\D/g,'')"></el-input>
|
|
</el-form-item>
|
|
<div v-if="clearing_form==1">
|
|
<el-form-item label="开户行信息:" prop="wc_lbnk_name">
|
|
<el-select
|
|
style="width: 100%;"
|
|
:value="bankInfoForm.wc_lbnk_name"
|
|
filterable
|
|
remote
|
|
clearable
|
|
v-load-more="getMoreWcLbnkNo"
|
|
reserve-keyword
|
|
placeholder="请输入开户行关键词"
|
|
:remote-method="getWcLbnkNo"
|
|
@change="selectWcLbnkNo">
|
|
<el-option
|
|
v-for="item in WcLbnkList"
|
|
:key="item.lbnk_no"
|
|
:label="item.lbnk_nm"
|
|
:value="item">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</div>
|
|
<el-form-item label="姓名" size="small">
|
|
<el-input style="width: 200px" type="text" v-model="name" auto-complete="off"
|
|
maxlength="8"></el-input>
|
|
</el-form-item>
|
|
</div>
|
|
<div style="margin-top: 30px;margin-left: 200px">
|
|
<el-button type="primary" size="medium" @click="settlement">确定</el-button>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
<script type="text/javascript">
|
|
Vue.directive('load-more', {
|
|
bind(el, binding) {
|
|
// 获取element-ui定义好的scroll盒子
|
|
const SELECTWRAP_DOM = el.querySelector('.el-select-dropdown .el-select-dropdown__wrap');
|
|
SELECTWRAP_DOM.addEventListener('scroll', function () {
|
|
const CONDITION = this.scrollHeight - this.scrollTop <= this.clientHeight;
|
|
if (CONDITION) {
|
|
binding.value();
|
|
}
|
|
})
|
|
}
|
|
});
|
|
var accountSetting = new Vue({
|
|
el: '#accountSetting',
|
|
data: function () {
|
|
return {
|
|
clearing_form: "",
|
|
account_number: "",
|
|
name: "",
|
|
wc_lbnk_loading: false, // 银行卡
|
|
bank_info: [], // 银行信息
|
|
bankInfoForm: {
|
|
wc_lbnk_name: '',
|
|
wc_lbnk_no: '',
|
|
},
|
|
bank_keyword: '',//开户行搜索关键词
|
|
WcLbnkList: [],//联行号列表
|
|
}
|
|
},
|
|
methods: {
|
|
//查询银行信息
|
|
getWcLbnkNo: function (keyword) {
|
|
this.bank_keyword = keyword;
|
|
this.bank_page = 0;
|
|
this.getMoreWcLbnkNo();
|
|
},
|
|
|
|
getMoreWcLbnkNo: function () {
|
|
var that = this;
|
|
if (this.wc_lbnk_loading) {
|
|
return;
|
|
}
|
|
this.wc_lbnk_loading = true;
|
|
var page = that.bank_page + 1;
|
|
$.ajax({
|
|
url: "{:U('Payset/getWcLbnkNo')}",
|
|
type: 'post',
|
|
data: {
|
|
keyword: that.bank_keyword,
|
|
page: page,
|
|
},
|
|
success: function (res) {
|
|
if (page == 1) {
|
|
that.WcLbnkList = res.data;
|
|
} else {
|
|
that.WcLbnkList.push.apply(that.WcLbnkList, res.data);
|
|
}
|
|
that.bank_page = page;
|
|
that.$nextTick(function () {
|
|
that.wc_lbnk_loading = false;
|
|
})
|
|
},
|
|
error: res => {
|
|
that.wc_lbnk_loading = false;
|
|
this.requestError(res);
|
|
},
|
|
})
|
|
},
|
|
//选择开户行信息
|
|
selectWcLbnkNo: function (item) {
|
|
this.bankInfoForm.wc_lbnk_no = item.lbnk_no;
|
|
this.bankInfoForm.wc_lbnk_name = item.lbnk_nm;
|
|
},
|
|
//提交信息修改
|
|
settlement() {
|
|
if (!this.clearing_form) {
|
|
this.$message({
|
|
type: 'warning',
|
|
message: '请选择账户类型',
|
|
});
|
|
return;
|
|
}
|
|
if (!this.name) {
|
|
this.$message({
|
|
type: 'warning',
|
|
message: '请填写姓名',
|
|
});
|
|
return;
|
|
}
|
|
if (!this.account_number) {
|
|
this.$message({
|
|
type: 'warning',
|
|
message: '请填写账号',
|
|
});
|
|
return;
|
|
}
|
|
if (!this.bankInfoForm.wc_lbnk_name && this.clearing_form == 1) {
|
|
this.$message({
|
|
type: 'warning',
|
|
message: '请选择开户行',
|
|
});
|
|
return;
|
|
}
|
|
$.ajax({
|
|
url: "{:U('accountSet')}",
|
|
type: 'post',
|
|
data: {
|
|
clearing_form: this.clearing_form,//银行选择结算方式
|
|
account_number: this.account_number,//账户
|
|
opening_bank: this.bankInfoForm.wc_lbnk_name,//开户名
|
|
name: this.name//开户行
|
|
},
|
|
dataType: 'json',
|
|
success: res => {
|
|
if (res.status == 1) {
|
|
this.$message({
|
|
type: 'success',
|
|
message: res.msg,
|
|
duration: 1000,
|
|
onClose: function () {
|
|
MenuApp.backPreview();
|
|
},
|
|
});
|
|
} else {
|
|
this.$message({
|
|
type: 'error',
|
|
message: res.msg,
|
|
duration: 3000,
|
|
});
|
|
}
|
|
},
|
|
error: res => {
|
|
this.requestError(res);
|
|
},
|
|
})
|
|
},
|
|
//获取商户结算账户设置
|
|
account() {
|
|
$.ajax({
|
|
url: "{:U('accountSet')}",
|
|
type: 'post',
|
|
data: {
|
|
isset: 1,
|
|
},
|
|
dataType: 'json',
|
|
success: res => {
|
|
if (res.status == 1) {
|
|
this.clearing_form = res.list.clearing_form;
|
|
this.account_number = res.list.account_number;
|
|
this.bankInfoForm.wc_lbnk_name = res.list.opening_bank;
|
|
this.name = res.list.name;
|
|
}
|
|
},
|
|
error: res => {
|
|
that.wc_lbnk_loading = false;
|
|
this.requestError(res);
|
|
},
|
|
});
|
|
},
|
|
//错误提示
|
|
requestError(res) {
|
|
console.log(res);
|
|
this.$confirm("请求发生错误", "错误提示", {
|
|
confirmButtonText: '确定',
|
|
showCancelButton: false,
|
|
type: 'error'
|
|
}).then(() => {
|
|
}).catch(() => {
|
|
})
|
|
},
|
|
},
|
|
created: function () {
|
|
this.getMoreWcLbnkNo()
|
|
},
|
|
mounted() {
|
|
this.account();
|
|
}
|
|
});
|
|
|
|
</script>
|