<script>
|
import offIcon from '@/static/img/off.png'
|
import leftIcon from '@/static/img/left.png'
|
import kkIcon from '@/static/img/kk.png'
|
import addAddress from "@/pages/quanyi/components/addAddress";
|
import agreement from "@/pages/quanyi/components/agreement";
|
|
import textBox from "@/components/textBox/index.vue";
|
export default {
|
name: "add",
|
components: {
|
addAddress,agreement,textBox
|
},
|
data() {
|
return {
|
getPlatformProtocolNewList:[],
|
showTextBox: false,
|
loginAct: false,
|
$webHost:'https://rbb98765.zrgy-bbg.com',
|
protocolChecked: [0],
|
offIcon,leftIcon,kkIcon,
|
callbackData:{},
|
addressDetail: {
|
consignee: '',
|
contactPhone: '',
|
detailAddr: '',
|
provinceCode: '',
|
provinceName: '',
|
cityName: '',
|
cityCode: '',
|
areaCode: '',
|
areaName: '',
|
},
|
show:true,
|
isCounting:false,
|
isCounting_A:false,
|
isCounting_B:false,
|
countText:'',
|
countText_A:'',
|
countText_B:'',
|
checked:true,
|
idCardNo: '',
|
verificationCode: '',
|
verificationCodeT: '',
|
verificationCodeS: '',
|
// 银行卡号
|
cardNumber: '',
|
// 银行名称
|
bankName: '',
|
// 手机
|
cardPhone: '',
|
bankList:[],
|
cardIdNo:'',
|
cardName:'',
|
bindCardId:'',
|
windowHeight: 0,
|
interval: null,
|
bankCode:"",
|
getPayBindCardInfo:[],
|
lstyle: {
|
color: "#333333",
|
fontSize: "30rpx",
|
fontWeight: "bold",
|
},
|
bindStatus:false
|
|
|
};
|
},
|
|
computed: {
|
addressStr() {
|
if(this.addressDetail.provinceName || this.addressDetail.cityName || this.addressDetail.areaName) {
|
return `${this.addressDetail.provinceName}${this.addressDetail.cityName}${this.addressDetail.areaName}${this.addressDetail.detailAddr}`
|
} else {
|
return ''
|
}
|
},
|
customStyle() {
|
return {
|
height: "100rpx",
|
background: "#4766FE",
|
color: "#fff",
|
borderRadius: "50rpx",
|
fontSize: "34rpx",
|
};
|
},
|
inputStyle() {
|
return {
|
fontWeight: "400",
|
fontSize: "30rpx",
|
};
|
},
|
},
|
created() {
|
const _this = this
|
|
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/customer/getCstAddress',
|
data:{
|
customerId: uni.getStorageSync('ygxLogin').customerId,
|
sourceId: uni.getStorageSync('ygxLogin').appId
|
},
|
success: function (res) {
|
_this.addressDetail = res.data.data;
|
}
|
})
|
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/xinheyuan/bank/list/fake/'+uni.getStorageSync('ygxLogin').customerId,
|
success(res){
|
console.log(res.data.data);
|
this.bankList = res.data.data;
|
uni.setStorageSync('bankList', res.data.data)
|
}
|
})
|
|
uni.setStorageSync('windowHeight',uni.getSystemInfoSync().windowHeight)
|
|
uni.request({
|
url:_this.$webHost+`/api/v2/pay/getPayBindCardInfo/${uni.getStorageSync('ygxLogin').customerId}`,
|
method:'get',
|
success:function(res){
|
const dy = res.data.data[0];
|
_this.queryBind = dy;
|
_this.getPayBindCardInfo = res.data.data;
|
|
if(dy.bindStatus){
|
_this.bindStatus = true;
|
_this.cardNumber = dy.cardNumber;
|
_this.bankName = dy.bankName;
|
_this.cardPhone = dy.cardPhone;
|
}
|
|
|
}
|
|
})
|
|
|
uni.request( {
|
url: _this.$webHost + "/api/v2/renpin/H5/getPlatformProtocolNew",
|
data: {
|
customerId: uni.getStorageSync('ygxLogin').customerId,
|
appId: uni.getStorageSync('ygxLogin').appId
|
},
|
method: 'GET',
|
success(res) {
|
uni.showLoading({})
|
_this.getPlatformProtocolNewList = res.data.data;
|
_this.showTextBox = true;
|
|
_this.$nextTick(() => {
|
if(_this.$refs.textBox){
|
uni.hideLoading();
|
_this.$refs.textBox.open()
|
} else {
|
setTimeout(() => {
|
console.log('setTimeout');
|
uni.hideLoading();
|
_this.$refs.textBox && _this.$refs.textBox.open()
|
}, 400);
|
}
|
})
|
}
|
})
|
|
|
},
|
mounted(){
|
// this.$refs.codeUi.open()
|
this.windowHeight = uni.getSystemInfoSync().windowHeight;
|
// this.interval = setInterval(() => {
|
// let newHeight = window.innerHeight;
|
// if (this.windowHeight !== newHeight) {
|
// this.windowHeight = newHeight;
|
// this.handleResize();
|
// }
|
// }, 200);
|
},
|
methods: {
|
kk(){
|
|
const _this = this;
|
|
if(this.addressStr.length < 8){
|
|
uni.showToast({
|
title: '请输入详细地址',
|
icon: 'none'
|
});
|
return
|
}
|
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/sign/signed/'+uni.getStorageSync('ygxLogin').customerId,
|
method:'POST',
|
})
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/pay/memberPurchaseBenefitsPays',
|
method:'POST',
|
data:{
|
customerId: uni.getStorageSync('ygxLogin').customerId,
|
memberPeriodConfigId: uni.getStorageSync('memberPeriodConfigInfo').id
|
},
|
success(){
|
_this.getUserInfo()
|
}
|
})
|
|
},
|
|
handleResize() {
|
this.show = this.windowHeight > uni.getStorageSync('windowHeight') - 100;
|
// 在这里处理高度变化后的逻辑
|
},
|
setbankName(e){
|
this.bankName = e;
|
this.$refs.popup.close()
|
},
|
open(){
|
// 通过组件定义的ref调用uni-popup方法 ,如果传入参数 ，type 属性将失效 ，仅支持 ['top','left','bottom','right','center']
|
this.$refs.popup.open()
|
},
|
|
validateAndCacheCardInfo() {
|
const _this = this;
|
if(!_this.cardNumber.length || _this.cardNumber.length<14 ){
|
return
|
}
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/pay/getBankCardArea/'+_this.cardNumber,
|
method:'POST',
|
|
success(res){
|
if(res.data.code==200){
|
_this.bankCode = res.data.data.bankCode;
|
_this.bankName = res.data.data.bankName;
|
} else {
|
uni.showToast({
|
title: res.data.data,
|
icon: "none",
|
});
|
}
|
|
}
|
})
|
|
/* uni.request({
|
url: "https://ccdcapi.alipay.com/validateAndCacheCardInfo.json?_input_charset=utf-8&cardBinCheck=true", // 阿里接口
|
data: {
|
cardNo: _this.cardNumber,
|
},
|
success: function (res) {
|
console.log(res.data.validated);
|
if (res.data.validated) {
|
|
for (let i of uni.getStorageSync("bankList")) {
|
console.log(i);
|
if (res.data.bank === i.bankCode) {
|
_this.bankCode = i.bankCode;
|
_this.bankName = i.bankName;
|
|
break;
|
}
|
}
|
if(!_this.bankName){
|
uni.showToast({
|
title: "暂不支持该银行或银行卡号有误",
|
icon: "none",
|
});
|
}
|
}
|
|
else {
|
uni.showToast({
|
title: "暂不支持该银行或银行卡号有误",
|
icon: "none",
|
});
|
}
|
},
|
});*/
|
},
|
submit() {
|
const _this = this;
|
if(!this.protocolChecked[0]){uni.showToast({title: '请阅读并同意相关协议', icon: 'none'});return;}
|
if(!_this.cardName){
|
uni.showToast({
|
title: "请填写真实姓名",
|
icon: "none",
|
});
|
return;
|
}
|
if(!_this.idCardNo){
|
uni.showToast({
|
title: "请输入身份证号",
|
icon: "none",
|
});
|
return;
|
}
|
if(!_this.cardNumber){
|
uni.showToast({
|
title: "请输入银行卡号",
|
icon: "none",
|
});
|
return;
|
}
|
if(!_this.cardPhone){
|
uni.showToast({
|
title: "请输入手机号码",
|
icon: "none",
|
});
|
return;
|
}
|
|
if(!_this.verificationCode && !_this.getPayBindCardInfo[0].bindStatus){
|
uni.showToast({
|
title: "请输入验证码",
|
icon: "none",
|
});
|
return
|
}
|
if(!_this.addressStr){
|
uni.showToast({
|
title: "请填写详细地址",
|
icon: "none",
|
});
|
return;
|
}
|
|
|
if(_this.getPayBindCardInfo[0].bindStatus) {
|
if (!_this.getPayBindCardInfo[1].bindStatus) {
|
_this.$refs.codeUi.open()
|
return;
|
}
|
|
if (!_this.getPayBindCardInfo[2].bindStatus) {
|
_this.$refs.setUi.open()
|
return;
|
|
|
}
|
return;
|
}
|
|
|
uni.request({
|
url:_this.$webHost+`/api/v2/pay/getPayBindCardInfo/${uni.getStorageSync('ygxLogin').customerId}`,
|
method:'get',
|
success:function(res){
|
_this.getPayBindCardInfo = res.data.data;
|
}
|
})
|
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/pay/verifySMSCodes',
|
method:'POST',
|
data:{
|
..._this.bindCardId,
|
|
"customerId": uni.getStorageSync('ygxLogin').customerId,
|
"cardPhone" : _this.cardPhone, //手机号
|
|
"cardNumber": _this.cardNumber, //卡号
|
|
"cardName" : _this.cardName, // 名字
|
"cardIdNo" : _this.cardIdNo,
|
"bankName" : _this.bankName,
|
"cardNo" : _this.cardNumber,
|
|
"verificationCode": _this.verificationCode,
|
},
|
success(e){
|
if(e.data.code!==200){
|
// _this.$util.Tips({
|
// title: e.data.data
|
// });
|
uni.showToast({
|
title: e.data.data,
|
icon: 'none'
|
});
|
return;
|
}
|
uni.request({
|
url:_this.$webHost+`/api/v2/pay/getPayBindCardInfo/${uni.getStorageSync('ygxLogin').customerId}`,
|
method:'get',
|
success:function(res){
|
const ls = res.data.data;
|
_this.getPayBindCardInfo = res.data.data;
|
if(!ls || !ls.some(item => item.bindStatus == 0)) {_this.kk();return;}
|
|
|
|
if(ls.length && !ls[1].bindStatus){
|
_this.$refs.codeUi.open()
|
_this.isCounting = false;
|
_this.countText = '';
|
return;
|
}
|
if(ls.length && !ls[2].bindStatus){
|
_this.$refs.setUi.open();
|
_this.isCounting = false;
|
_this.countText = '';
|
return;
|
}
|
if(!ls || !ls.some(item => item.bindStatus == 0)) {_this.kk();return;}
|
|
|
|
_this.kk()
|
|
|
|
}
|
|
})
|
}
|
})
|
|
|
},
|
getSmsCode(){
|
const that = this;
|
console.log(that.getPayBindCardInfo[0].paymentMethod);
|
if(this.isCounting){
|
return
|
}
|
if(that.getPayBindCardInfo[0].bindStatus){
|
if(!that.getPayBindCardInfo[1].bindStatus){
|
that.$refs.codeUi.open();
|
return
|
}
|
if(!that.getPayBindCardInfo[2].bindStatus){
|
that.$refs.setUi.open();
|
}
|
return
|
}
|
|
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.cardPhone)) return uni.showToast({
|
title: '请输入正确的手机号码',
|
icon: 'none'
|
});
|
|
|
// that.isCounting = true;
|
|
|
|
uni.request({
|
url: that.$webHost+'/api/v2/xinheyuan/bankcard/save',
|
method:'POST',
|
data:{
|
"customerId": uni.getStorageSync('ygxLogin').customerId,
|
"nameReal": that.cardName, // 名字
|
"cardNo":that.cardNumber,
|
"idCard": that.idCardNo,
|
|
"bankPhoneNo":that.cardPhone,
|
"bankCode": that.bankCode,
|
"bankName": that.bankName,
|
"phone": that.cardPhone, //手机号
|
"paymentMethod": that.getPayBindCardInfo[0].paymentMethod ,
|
|
|
"preBindType": "prebc",
|
"bankId": "1",
|
|
},
|
success(response){
|
if(response.data.code != 200) {
|
uni.showToast({
|
title: response.data.data,
|
icon: 'none'
|
});
|
return;
|
}
|
|
uni.request({
|
url: that.$webHost+'/api/v2/pay/bindCardToCodes',
|
method:'POST',
|
data:{
|
"customerId": uni.getStorageSync('ygxLogin').customerId,
|
"cardName": that.cardName, // 名字
|
"cardIdNo": that.idCardNo,
|
|
"cardNumber":that.cardNumber,
|
"bankPhoneNo":that.cardPhone,
|
"bankCode": that.bankCode,
|
"bankName": that.bankName,
|
"cardPhone": that.cardPhone, //手机号
|
"paymentMethod": that.getPayBindCardInfo[0].paymentMethod ,
|
|
|
"preBindType": "prebc",
|
"bankId": "1",
|
|
},
|
success(res){
|
if(res.data.code === 401){
|
that.getUserInfo()
|
return;
|
}
|
|
if(res.data.code !==200){
|
uni.showToast({
|
title: res.data.data,
|
icon: 'none'
|
})
|
return;
|
}
|
that.isCounting = true;
|
if(res.data.code === 200){
|
that.bindCardId = res.data.data;
|
} else {
|
that.isCounting = false;
|
that.countText = '';
|
uni.showToast({
|
title: res.data.data,
|
icon: 'none'
|
});
|
|
if(!that.getPayBindCardInfo[0].bindStatus){
|
|
return;
|
}
|
|
|
if(!that.getPayBindCardInfo[1].bindStatus){
|
that.$refs.codeUi.open()
|
that.isCounting = false;
|
that.countText = '';
|
return
|
} if(!that.getPayBindCardInfo[2].bindStatus){
|
that.isCounting = false;
|
that.countText = '';
|
that.$refs.setUi.open()
|
return
|
}
|
}
|
|
}
|
})
|
|
let count = 60;
|
that.countText = `${count}s秒后重新获取`;
|
|
|
const timer = setInterval(() => {
|
count--;
|
that.countText = `${count}s秒后重新获取`;
|
if (count <= 0) {
|
clearInterval(timer);
|
that.isCounting = false;
|
that.countText = '';
|
}
|
},1000)
|
},
|
fail(err){
|
that.isCounting = false;
|
that.countText = '';
|
uni.showToast({
|
title: err,
|
icon: 'none'
|
})
|
}
|
})
|
|
|
|
|
|
|
|
|
|
|
},
|
// 二次获取
|
getCode(){
|
if (this.isCounting_A) {
|
return;
|
}
|
const paymentMethod = this.getPayBindCardInfo[1]['paymentMethod'];
|
const _this = this;
|
const pro = uni.getStorageSync('ygxLogin')
|
pro['userName'] = _this.cardName;
|
uni.request({
|
url: _this.$webHost+'/api/v2/pay/bindCardToCodes',
|
method:'POST',
|
data:{
|
cardIdNo: _this.idCardNo,
|
customerId: pro.customerId,
|
cardName: _this.cardName,
|
cardNo: _this.cardIdNo,
|
cardPhone: _this.cardPhone,
|
cardNumber: _this.cardNumber,
|
bankName: _this.bankName,
|
preBindType: "prebc",
|
paymentMethod:paymentMethod,
|
againType : true
|
},
|
success(dt){
|
if(dt.data.code === 401){
|
_this.getUserInfo()
|
return;
|
}
|
const res = dt.data.data;
|
if(!res){
|
return;
|
}
|
_this.callbackData = res;
|
_this.bindCardId = res;
|
uni.showToast({
|
title: "验证码已发送",
|
icon: "none",
|
});
|
// 设置倒计时功能
|
let count = 60;
|
|
const timer = setInterval(() => {
|
count--;
|
if (count <= 0) {
|
clearInterval(timer);
|
_this.$set(_this, "isCounting_A", false);
|
} else {
|
_this.$set(_this, "isCounting_A", true);
|
_this.$set(_this, "countText_A", `${count}秒后重新获取`);
|
}
|
}, 1000);
|
}
|
})
|
},
|
|
submitPlan(){
|
|
const _this = this;
|
|
if (!this.verificationCodeT) {
|
uni.showToast({
|
title: "请输入验证码",
|
icon: "none",
|
});
|
return;
|
}
|
|
const callbackData = _this.callbackData;
|
const paymentMethod = _this.getPayBindCardInfo[1]['paymentMethod'];
|
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/pay/verifySMSCodes',
|
method:'POST',
|
data:{
|
...callbackData,
|
|
"customerId": uni.getStorageSync('ygxLogin').customerId,
|
"cardPhone" : _this.cardPhone, //手机号
|
|
"cardNumber": _this.cardNumber, //卡号
|
paymentMethod:paymentMethod,
|
"cardName" : _this.cardName, // 名字
|
"cardIdNo" : _this.cardIdNo,
|
"bankName" : _this.bankName,
|
"cardNo" : _this.cardNumber,
|
|
"verificationCode": _this.verificationCodeT,
|
},
|
success(dts){
|
if(dts.data.code!==200){
|
// _this.$util.Tips({
|
// title: dts.data.data
|
// });
|
uni.showToast({
|
title: dts.data.data,
|
icon: 'none'
|
});
|
return
|
}
|
|
uni.request({
|
url:_this.$webHost+`/api/v2/pay/getPayBindCardInfo/${uni.getStorageSync('ygxLogin').customerId}`,
|
method:'get',
|
success:function(res){
|
const ls = res.data.data;
|
_this.getPayBindCardInfo = res.data.data;
|
if(ls.length>2 && !ls[2].bindStatus){
|
_this.isCounting_A = false;
|
_this.countText_A = '';
|
_this.$refs.codeUi.close()
|
_this.$refs.setUi.open()
|
}
|
|
if(!ls || !ls.some(item => item.bindStatus == 0)) {_this.kk();return;}
|
|
|
|
|
|
}
|
|
})
|
}
|
})
|
|
},
|
// 三次
|
getCode_san(){
|
if (this.isCounting_B) {
|
return;
|
}
|
const paymentMethod = this.getPayBindCardInfo[2]['paymentMethod'];
|
const _this = this;
|
const pro = uni.getStorageSync('ygxLogin')
|
pro['userName'] = _this.cardName;
|
uni.request({
|
url: _this.$webHost+'/api/v2/pay/bindCardToCodes',
|
method:'POST',
|
data:{
|
cardIdNo: _this.idCardNo,
|
customerId: pro.customerId,
|
cardName: _this.cardName,
|
cardNo: _this.cardIdNo,
|
cardPhone: _this.cardPhone,
|
cardNumber: _this.cardNumber,
|
bankName: _this.bankName,
|
preBindType: "prebc",
|
paymentMethod:paymentMethod,
|
againType : true
|
},
|
success(dt){
|
if(dt.data.code ==401){
|
_this.getUserInfo()
|
return;
|
}
|
|
if(dt.data.code !==200){
|
uni.showToast({
|
title: dt.data.data,
|
icon: 'none'
|
})
|
return;
|
}
|
|
const res = dt.data.data;
|
if(!res){
|
return;
|
}
|
_this.callbackData = res;
|
_this.bindCardId = res;
|
uni.showToast({
|
title: "验证码已发送",
|
icon: "none",
|
});
|
// 设置倒计时功能
|
let count = 60;
|
|
const timer = setInterval(() => {
|
count--;
|
if (count <= 0) {
|
clearInterval(timer);
|
_this.$set(_this, "isCounting_B", false);
|
} else {
|
_this.$set(_this, "isCounting_B", true);
|
_this.$set(_this, "countText_B", `${count}秒后重新获取`);
|
}
|
}, 1000);
|
}
|
})
|
},
|
submitPlan_san(){
|
|
const _this = this;
|
|
|
if (!this.verificationCodeS) {
|
uni.showToast({
|
title: "请输入验证码",
|
icon: "none",
|
});
|
return;
|
}
|
|
const callbackData = _this.callbackData;
|
const paymentMethod = _this.getPayBindCardInfo[2]['paymentMethod'];
|
|
|
uni.request({
|
url: _this.$webHost+'/api/v2/pay/verifySMSCodes',
|
method:'POST',
|
data:{
|
...callbackData,
|
|
"customerId": uni.getStorageSync('ygxLogin').customerId,
|
"cardPhone" : _this.cardPhone, //手机号
|
|
"cardNumber": _this.cardNumber, //卡号
|
paymentMethod:paymentMethod,
|
"cardName" : _this.cardName, // 名字
|
"cardIdNo" : _this.cardIdNo,
|
"bankName" : _this.bankName,
|
"cardNo" : _this.cardNumber,
|
|
"verificationCode": _this.verificationCodeS,
|
},
|
success(dts){
|
if(dts.data.code!==200){
|
// _this.$util.Tips({
|
// title: dts.data.data
|
// });
|
uni.showToast({
|
title: dts.data.data,
|
icon: 'none'
|
});
|
}
|
|
uni.request({
|
url:_this.$webHost+`/api/v2/pay/getPayBindCardInfo/${uni.getStorageSync('ygxLogin').customerId}`,
|
method:'get',
|
success:function(res){
|
const ls = res.data.data;
|
_this.getPayBindCardInfo = res.data.data;
|
_this.isCounting_B = false;
|
_this.countText_B = '';
|
_this.$refs.setUi.close()
|
_this.$refs.codeUi.close()
|
if(!ls || !ls.some(item => item.bindStatus == 0)) {_this.kk();return;}
|
|
|
}
|
|
})
|
}
|
})
|
|
},
|
|
|
|
getUserInfo() {
|
|
// const data = uni.getStorageSync('LOGING_DATA')
|
// console.log(data);
|
// this.$store.commit("LOGIN", {
|
// 'token': data.token
|
// });
|
// this.$store.commit('UPDATE_USERINFO', {
|
// avatar: data.avatar,
|
// nickname: data.nickname,
|
// phone: data.phone
|
// });
|
// this.$store.commit("SETUID", data.id)
|
|
uni.reLaunch({
|
url: '/pages/index/index'
|
});
|
},
|
},
|
onUnload() {
|
clearInterval(this.interval);
|
},
|
}
|
</script>
|
|
<template>
|
<view style="background: #F7F7F7;padding-bottom: 40rpx;">
|
<view >
|
<view class="top">为向您提供更好的安全保障，您需要提供银行卡号以完成信息核验</view>
|
</view>
|
<view style="background: white;height: 20rpx;"></view>
|
|
<view class="form">
|
<view class="clo">
|
<view class="label">
|
<text>真实姓名</text>
|
</view>
|
<view class="inp_box">
|
<input maxlength="8" v-model="cardName" class="inp" placeholder="请填写真实姓名" />
|
</view>
|
|
</view>
|
<view class="clo">
|
<view class="label">
|
<text>身份证号</text>
|
</view>
|
<view class="inp_box">
|
<input maxlength="18" v-model="idCardNo" class="inp" placeholder="请填写身份证号" />
|
</view>
|
|
</view>
|
|
<!-- <view style="background: #F7F7F7;height: 20rpx;"></view>-->
|
|
<view class="clo">
|
<view class="label">
|
<text>银行卡号</text>
|
</view>
|
<view class="inp_box">
|
<input maxlength="30" @blur="validateAndCacheCardInfo" v-model="cardNumber" class="inp" placeholder="请输入银行卡号" />
|
<image @click="cardNumber=''" v-show="!bindStatus && cardNumber" :src="offIcon" style="width: 40rpx;height: 40rpx;position: absolute;right: 0rpx;top: 30rpx;"></image>
|
</view>
|
|
</view>
|
<view class="clo">
|
<view class="label">
|
<text>所属银行</text>
|
</view>
|
<view class="inp_box" style="z-index: 1" >
|
<view style="width: 670rpx;height: 100rpx;border: 1px solid #EEEEEE;border-radius: 20rpx;padding-left: 20rpx;line-height: 100rpx;" :class="bankName?'':'a3'">{{bankName?bankName:'请输入所属银行'}}</view>
|
|
</view>
|
|
</view>
|
<view class="clo">
|
<view class="label">
|
<view>银行预留手机号</view>
|
</view>
|
<view class="inp_box" style="position: relative;">
|
<input maxlength="11" v-model="cardPhone" class="inp" placeholder="请填写手机号" />
|
<!-- <view class="code" style="position: absolute;top: 30rpx;right: 0;" @click="getSmsCode">-->
|
<!-- <text :class="isCounting?'code_k':'code_a'">{{ isCounting ? countText : '获取验证码' }}</text>-->
|
<!-- </view>-->
|
</view>
|
|
</view>
|
<view class="clo" v-if="getPayBindCardInfo.length && !getPayBindCardInfo[0].bindStatus">
|
<view class="label">
|
<text>验证码</text>
|
</view>
|
<view class="inp_box" style="position: relative;">
|
<input maxlength="6" v-model="verificationCode" class="inp" type="number" placeholder="请填写验证码" />
|
|
<view class="code" style="position: absolute;top: 30rpx;right: 0;" @click="getSmsCode">
|
<text :class="isCounting?'code_k':'code_a'">{{ isCounting ? countText : '获取验证码' }}</text>
|
</view>
|
</view>
|
|
</view>
|
|
<view class="clo" @click="$refs.address.open()">
|
<view class="label" >
|
<text>收货地址</text>
|
</view>
|
<view class="inp_box">
|
<view style="font-size: 28rpx;width: 670rpx;height: 100rpx;border: 1px solid #EEEEEE;border-radius: 20rpx;padding-left: 20rpx;line-height: 100rpx;" v-if="addressStr">{{addressStr}}</view>
|
<view style="font-size: 28rpx;color: #BDBDBE;width: 670rpx;height: 100rpx;border: 1px solid #EEEEEE;border-radius: 20rpx;padding-left: 20rpx;line-height: 100rpx;" v-else>请填写收货地址</view>
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="xieyi">
|
<view style="display: flex">
|
<checkbox-group @change="checkboxChange">
|
|
<checkbox value="1" activeBorderColor="none" activeBackgroundColor="red" style="border-radius: 0" color="#ffffff"/>
|
</checkbox-group>
|
<view style="margin-top: 2rpx;"> <text>我已同意</text>
|
</view>
|
</view>
|
</view>-->
|
|
<view style=" padding: 0 30rpx;margin-top: 30rpx;">
|
<view style="display: flex;font-size: 28rpx;align-items: center;">
|
<uv-checkbox-group
|
style="align-items: center;"
|
activeColor="#4766FE"
|
shape="circle"
|
v-model="protocolChecked">
|
<uv-checkbox size="22" :name="1" >
|
我已阅读并同意
|
</uv-checkbox>
|
<text class="protocol-text" >
|
<text style="font-size: 28rpx;" class="link-text" @click="$refs.agreement.open()">《相关协议》</text>
|
</text>
|
</uv-checkbox-group>
|
|
</view>
|
|
</view>
|
<view class="sub" v-if="show">
|
<button :class="protocolChecked[0]?'':'nots'" class="sub_btn" @click="submit">提交</button>
|
</view>
|
|
<agreement ref="agreement"></agreement>
|
<uni-popup ref="popup" type="bottom" >
|
<view style="background: white;border-radius: 40rpx 40rpx 0 0 ;padding: 0 40rpx;padding-top: 48rpx;position: relative;z-index: 99">
|
<view style="text-align: center;color: #252938;font-weight: 600;font-size: 36rpx;margin-bottom: 20rpx;">选择银行</view>
|
<view class="ul" style="max-height: 800rpx;overflow: scroll" v-if="bankList">
|
<view v-for="(i,k) in bankList" :key="i.bankName" class="li" style="padding: 20rpx;border-bottom: 1rpx solid #E7E9ED" @click="setbankName(i.bankName)">
|
<image :src="i.bankLogo" style="width: 50rpx;height: 30rpx;position: relative;top: 10rpx;"></image>
|
<text style="color: #333333;font-size: 28rpx;margin-left: 22rpx;">{{ i.bankName }}</text>
|
</view>
|
|
</view>
|
</view>
|
|
|
</uni-popup>
|
|
<uv-popup mode="center" round="20" ref="codeUi" :closeOnClickOverlay="false" >
|
|
<view style="padding: 40rpx;width: 690rpx;background: url('/static/img/smsBg.png') no-repeat top center; background-size: 100%;height: 650rpx;position: relative;">
|
<image
|
@click="$refs.codeUi.close()"
|
src="@/static/img/off.png"
|
style="
|
width: 50rpx;
|
height: 50rpx;
|
position: absolute;
|
left: 320rpx;
|
bottom: -70rpx;
|
z-index: 6;
|
"
|
></image>
|
<view class="head">
|
<view
|
style="
|
text-align: center;
|
font-weight: bold;
|
font-size: 36rpx;
|
position: relative;
|
height: 30rpx;
|
"
|
>
|
</view>
|
</view>
|
<view style="
|
font-weight: bold;
|
font-size: 36rpx;
|
position: relative;
|
margin-bottom: 12rpx;
|
text-align: left;
|
|
">短信确认</view>
|
<view style="font-size: 28rpx;color: #252938;text-align: left;">为确保安全到账，需再次对您的收款账户进行短信验证</view>
|
|
<view class="content">
|
<uv-form
|
:labelStyle="lstyle"
|
labelPosition="left"
|
|
ref="form"
|
labelWidth="100"
|
>
|
|
<uv-form-item
|
class="item"
|
label=""
|
prop="repayTermStr"
|
style="position: relative;"
|
>
|
<uv-input
|
:adjustPosition="true"
|
readonly
|
v-model="cardPhone"
|
maxlength="11"
|
:customStyle="inputStyle"
|
disabledColor="none"
|
|
border="none"
|
placeholder="请输入手机号"
|
style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 50rpx;"
|
></uv-input>
|
<image src="/static/img/phoneIcon.png" style="width: 44rpx;height: 44rpx;position: absolute;left: 10rpx;"></image>
|
</uv-form-item>
|
|
<uv-form-item
|
class="item"
|
label=""
|
prop="needVerify"
|
style="position: relative;"
|
>
|
<uv-input
|
:adjustPosition="true"
|
maxlength="6"
|
v-model="verificationCodeT"
|
border="none"
|
placeholder="请输入验证码"
|
style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 50rpx;"
|
>
|
<template #suffix>
|
<text
|
class="code"
|
style="color: #4766FE;"
|
:class="isCounting_A ? 'ks' : ''"
|
@click="getCode"
|
>{{ isCounting_A ? countText_A : "获取验证码" }}</text
|
>
|
</template>
|
</uv-input>
|
<image src="/static/img/codeIcon.png" style="width: 44rpx;height: 44rpx;position: absolute;left: 10rpx;"></image>
|
</uv-form-item>
|
<uv-form-item >
|
<view class="but" style="width: 100%;">
|
<uv-button
|
:customStyle="customStyle"
|
shape="circle"
|
@click="submitPlan"
|
>确认</uv-button
|
>
|
</view>
|
</uv-form-item>
|
</uv-form>
|
</view>
|
</view>
|
</uv-popup>
|
<uv-popup mode="center" round="20" ref="setUi" :closeOnClickOverlay="false" >
|
|
<view style="padding: 40rpx;width: 690rpx;background: url('/static/img/smsBg.png') no-repeat top center; background-size: 100%;height: 650rpx;position: relative;">
|
<image
|
@click="$refs.setUi.close()"
|
src="@/static/img/off.png"
|
style="
|
width: 50rpx;
|
height: 50rpx;
|
position: absolute;
|
left: 320rpx;
|
bottom: -70rpx;
|
z-index: 6;
|
"
|
></image>
|
<view class="head">
|
<view
|
style="
|
text-align: center;
|
font-weight: bold;
|
font-size: 36rpx;
|
position: relative;
|
height: 30rpx;
|
"
|
>
|
</view>
|
</view>
|
<view style="
|
font-weight: bold;
|
font-size: 36rpx;
|
position: relative;
|
margin-bottom: 12rpx;
|
text-align: left;
|
|
">本人提交确认</view>
|
<view style="font-size: 28rpx;color: #252938;text-align: left;">根据合规要求我们将进行本人提交意愿确认的短信校验，请注意查看短信验证码</view>
|
|
<view class="content">
|
<uv-form
|
:labelStyle="lstyle"
|
labelPosition="left"
|
|
ref="form"
|
labelWidth="100"
|
>
|
|
<uv-form-item
|
class="item"
|
label=""
|
prop="repayTermStr"
|
style="position: relative;"
|
>
|
<uv-input
|
:adjustPosition="true"
|
readonly
|
v-model="cardPhone"
|
maxlength="11"
|
:customStyle="inputStyle"
|
disabledColor="none"
|
|
border="none"
|
placeholder="请输入手机号"
|
style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 50rpx;"
|
></uv-input>
|
<image src="/static/img/phoneIcon.png" style="width: 44rpx;height: 44rpx;position: absolute;left: 10rpx;"></image>
|
</uv-form-item>
|
|
<uv-form-item
|
class="item"
|
label=""
|
prop="needVerify"
|
style="position: relative;"
|
>
|
<uv-input
|
:adjustPosition="true"
|
maxlength="6"
|
v-model="verificationCodeS"
|
border="none"
|
placeholder="请输入验证码"
|
style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 50rpx;"
|
>
|
<template #suffix>
|
<text
|
class="code"
|
style="color: #4766FE;"
|
:class="isCounting_B ? 'ks' : ''"
|
@click="getCode_san"
|
>{{ isCounting_B ? countText_B : "获取验证码" }}</text
|
>
|
</template>
|
</uv-input>
|
<image src="/static/img/codeIcon.png" style="width: 44rpx;height: 44rpx;position: absolute;left: 10rpx;"></image>
|
</uv-form-item>
|
<uv-form-item >
|
<view class="but" style="width: 100%;">
|
<uv-button
|
:customStyle="customStyle"
|
shape="circle"
|
@click="submitPlan_san"
|
>确认</uv-button
|
>
|
</view>
|
</uv-form-item>
|
</uv-form>
|
</view>
|
</view>
|
</uv-popup>
|
|
<uv-popup mode="bottom" round="20" ref="address" >
|
<addAddress :addressDetail="addressDetail" @off="$refs.address.close()" @submit="e => addressDetail = e"></addAddress>
|
</uv-popup>
|
|
<!-- <text-box v-if="showTextBox" ref="textBox" :getPlatformProtocolNewList="getPlatformProtocolNewList"></text-box> -->
|
</view>
|
</template>
|
|
<style scoped lang="scss">
|
::v-deep .uv-popup .uv-popup__content {
|
overflow: visible;
|
}
|
.a3{
|
color: #BDBDBE;
|
font-size: 30rpx;
|
}
|
.top{
|
background: #FFEBEB;
|
font-size: 24rpx;
|
color: #C21818;
|
text-align: center ;
|
padding: 20rpx 26rpx;
|
|
}
|
.form{
|
background: #FFFFFF;
|
.clo{
|
//display: flex;
|
//padding: 30rpx 0rpx;
|
padding-bottom: 30rpx;
|
margin: 0 40rpx;
|
//border-bottom: 1rpx solid #E7E9ED;
|
background: #FFFFFF;
|
.label{
|
width: 460rpx;
|
height: 40rpx;
|
|
font-weight: 600;
|
font-size: 28rpx;
|
color: #252938;
|
|
}
|
|
.inp_box{
|
position: relative;
|
margin-top: 30rpx;
|
.inp{
|
&::placeholder{
|
color: #999999;
|
font-size: 30rpx;
|
}
|
width: 670rpx;
|
height: 100rpx;
|
border: 1px solid #EEEEEE;
|
border-radius: 20rpx;
|
padding-left: 20rpx;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #333333;
|
|
}
|
}
|
}
|
}
|
.code_a{
|
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #4766FE;
|
padding: 16rpx 20rpx;
|
//border: 1rpx solid #EE2626;
|
//border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
}
|
.code_k{
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #999999;
|
}
|
|
.xieyi{
|
color: #8B8D96;
|
padding-left: 40rpx;
|
height: 34rpx;
|
margin-top: 50rpx;
|
font-size: 24rpx;
|
color: #8B8D96;
|
|
}
|
|
|
.sub{
|
|
width: 100%;
|
bottom: 50rpx;
|
padding: 0 30rpx;
|
margin-top: 40rpx;
|
.sub_btn{
|
background: #4766FE;
|
border-radius: 50rpx 50rpx 50rpx 50rpx;
|
padding: 10rpx;
|
|
font-weight: 600;
|
font-size: 34rpx;
|
color: #FFFFFF;
|
|
}
|
}
|
|
::v-deep .uni-checkbox-input{
|
border-radius: 0;
|
transform: scale(0.7);
|
&:before{
|
top: 45% !important;
|
|
}
|
}
|
::v-deep .uni-input-placeholder{
|
color: #BDBDBE;
|
}
|
.protocol-text {
|
// width: calc( 100% - 44rpx);
|
font-size: 24rpx;
|
color: #8B8D96;
|
line-height: 28rpx;
|
}
|
.link-text {
|
color: #207ef5;
|
display: inline;
|
}
|
.nots{
|
opacity: 0.5;
|
}
|
</style>
|
