<script>
|
import {
|
payBindCardToCodes,
|
payVerifySMSCodes,
|
xinheyuanBankcardSave,
|
} from "@/api/modules/user";
|
export default {
|
props: {
|
bankDetail: {
|
type: Object,
|
default() {
|
return {};
|
},
|
},
|
queryBind: {
|
type: Object,
|
default() {
|
return {};
|
},
|
},
|
},
|
computed: {
|
customStyle() {
|
return {
|
height: "100rpx",
|
background: "#EE2626",
|
color: "#fff",
|
borderRadius: "50rpx",
|
fontSize: "34rpx",
|
};
|
},
|
inputStyle() {
|
return {
|
fontWeight: "400",
|
fontSize: "30rpx",
|
};
|
},
|
},
|
|
created() {
|
this.detail = this.bankDetail;
|
this.detail.verificationCode = "";
|
this.detail.bankName = this.queryBind.bankName;
|
this.detail.bankId = this.queryBind.cardNumber;
|
this.detail.bankPhoneNo = this.queryBind.cardPhone;
|
},
|
|
data() {
|
return {
|
lstyle: {
|
color: "#333333",
|
fontSize: "30rpx",
|
fontWeight: "bold",
|
},
|
|
isCounting: false,
|
countText: "",
|
detail: {
|
bankName: "",
|
verificationCode: "",
|
},
|
bankList: [],
|
bankCode: "",
|
callbackData: "",
|
};
|
},
|
methods: {
|
|
submitPlan() {
|
const _this = this;
|
const pro = uni.getStorageSync("params");
|
|
if (!this.detail.bankPhoneNo) {
|
uni.showToast({
|
title: "请输入手机号",
|
icon: "none",
|
});
|
return;
|
}
|
if (!this.detail.verificationCode) {
|
uni.showToast({
|
title: "请输入验证码",
|
icon: "none",
|
});
|
return;
|
}
|
|
const callbackData = uni.getStorageSync("callbackData");
|
const paymentMethod = uni.getStorageSync("payBindCardInf")[2]['paymentMethod'];
|
payVerifySMSCodes({
|
...callbackData,
|
customerId: pro.customerId,
|
cardName: uni.getStorageSync("userName"), // 真实姓名
|
bankName: _this.detail.bankName,
|
cardIdNo: uni.getStorageSync("idCardNo"),
|
|
cardPhone: _this.detail.bankPhoneNo,
|
paymentMethod:paymentMethod,
|
cardNumber: _this.detail.bankId,
|
verificationCode: _this.detail.verificationCode, //短信
|
}).then((res) => {
|
if(res){
|
this.$emit("submit", this.detail);
|
}
|
});
|
},
|
off() {
|
this.$emit("off");
|
},
|
getCode() {
|
if (this.isCounting) {
|
return;
|
}
|
const paymentMethod = uni.getStorageSync("payBindCardInf")[2]['paymentMethod'];
|
const _this = this;
|
const pro = uni.getStorageSync("params");
|
xinheyuanBankcardSave({
|
customerId: pro.customerId,
|
nameReal: uni.getStorageSync("userName"),
|
cardNo: _this.detail.bankId,
|
idCard: uni.getStorageSync("idCardNo"),
|
bankId: "1",
|
bankPhoneNo: _this.detail.bankPhoneNo,
|
bankCode: _this.bankCode,
|
bankName: _this.detail.bankName,
|
phone: _this.detail.bankPhoneNo,
|
preBindType: "prebc",
|
}).then((res) => {
|
payBindCardToCodes({
|
cardIdNo: uni.getStorageSync("idCardNo"),
|
customerId: pro.customerId,
|
cardName: uni.getStorageSync("userName"),
|
cardNo: _this.detail.bankId,
|
cardPhone: _this.detail.bankPhoneNo,
|
cardNumber: _this.detail.bankId,
|
bankName: _this.detail.bankName,
|
preBindType: "prebc",
|
paymentMethod:paymentMethod,
|
againType : true
|
}).then((res) => {
|
if(!res){
|
return
|
}
|
_this.callbackData = res;
|
uni.setStorageSync("callbackData", res);
|
|
uni.showToast({
|
title: "验证码已发送",
|
icon: "none",
|
});
|
uni.setStorageSync("YF", 1);
|
|
// 设置倒计时功能
|
let count = 60;
|
const timer = setInterval(() => {
|
count--;
|
if (count <= 0) {
|
clearInterval(timer);
|
_this.$set(_this, "isCounting", false);
|
} else {
|
_this.$set(_this, "isCounting", true);
|
_this.$set(_this, "countText", `${count}秒后重新获取`);
|
}
|
}, 1000);
|
});
|
});
|
},
|
},
|
};
|
</script>
|
|
<template>
|
<view>
|
<view class="head">
|
<view
|
style="
|
text-align: center;
|
font-weight: bold;
|
font-size: 36rpx;
|
position: relative;
|
height: 50rpx;
|
"
|
>
|
|
<image
|
@click="off"
|
src="@/static/img/close.png"
|
style="
|
width: 50rpx;
|
height: 50rpx;
|
position: absolute;
|
right: 0;
|
top: -2rpx;
|
"
|
></image>
|
</view>
|
</view>
|
<view style="
|
font-weight: bold;
|
font-size: 36rpx;
|
position: relative;
|
margin-bottom: 12rpx;
|
padding-left: 38rpx;
|
">本人提交确认</view>
|
<view style="font-size: 28rpx;color: #252938; padding-left: 38rpx;padding-right: 30rpx;">根据合规要求我们将进行本人提交意愿确认的短信校验，请注意查看短信验证码</view>
|
<view class="con">
|
<u-form
|
:labelStyle="lstyle"
|
labelPosition="left"
|
:model="detail"
|
ref="form"
|
labelWidth="100"
|
>
|
|
<u-form-item
|
class="item"
|
label="手机号"
|
prop="repayTermStr"
|
borderBottom
|
>
|
<u-input
|
:adjustPosition="true"
|
maxlength="11"
|
:customStyle="inputStyle"
|
disabledColor="none"
|
inputAlign="right"
|
v-model="detail.bankPhoneNo"
|
border="none"
|
placeholder="请输入手机号"
|
></u-input>
|
</u-form-item>
|
|
<u-form-item
|
class="item"
|
label="短信验证码"
|
prop="needVerify"
|
>
|
<u-input
|
:adjustPosition="true"
|
maxlength="6"
|
inputAlign="right"
|
v-model="detail.verificationCode"
|
border="none"
|
placeholder="请输入验证码"
|
>
|
<template #suffix>
|
<text
|
class="code"
|
:class="isCounting ? 'ks' : ''"
|
@click="getCode"
|
>{{ isCounting ? countText : "获取验证码" }}</text
|
>
|
</template>
|
</u-input>
|
</u-form-item>
|
<u-form-item >
|
<view class="but">
|
<u-button
|
:customStyle="customStyle"
|
shape="circle"
|
@click="submitPlan"
|
>确认提交</u-button
|
>
|
</view>
|
</u-form-item>
|
</u-form>
|
</view>
|
</view>
|
</template>
|
|
<style scoped lang="scss">
|
.ks {
|
color: #999999 !important;
|
}
|
.but {
|
width: 100%;
|
margin-top: 46rpx;
|
.pack {
|
text-align: center;
|
margin-top: 20rpx;
|
font-size: 30rpx;
|
display: flex;
|
flex-direction: row;
|
justify-content: center;
|
}
|
}
|
.head {
|
margin-top: 40rpx;
|
padding: 0 40rpx;
|
|
font-size: 32rpx;
|
color: #252938;
|
.title {
|
display: flex;
|
flex-direction: row;
|
text-align: center;
|
color: #252938;
|
font-size: 32rpx;
|
font-weight: bold;
|
.num {
|
color: #4766fe;
|
display: contents;
|
}
|
}
|
}
|
|
.con {
|
padding: 0 38rpx;
|
.pt40 {
|
padding-top: 40rpx;
|
}
|
.mr {
|
margin-right: 20rpx;
|
}
|
.code {
|
margin-left: 40rpx;
|
font-size: 24rpx;
|
color: #4766fe;
|
background: none;
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
}
|
}
|
</style>
|
