pages/sub_mine/bindBankCard.vue

<template>
	<view class="bindBankCard">
		<view class="bindBankCard-list">
			<u-field v-model="name" label="姓名" placeholder="请输入您的真实姓名" placeholder-style="color:#999999;font-family:PingFang-SC-Regular"
			 clear-size="40"></u-field>
			<u-field @click="showPicker" v-model="cardtype" :disabled="true" label="证件类型" clear-size="40"></u-field>
			<u-field v-model="idno" label="证件号" placeholder="请输入您的证件号" placeholder-style="color:#999999" clear-size="40"></u-field>
			<u-field v-model="cardno" label="银行卡号" placeholder="请输入市民卡对应的银行卡号" placeholder-style="color:#999999" clear-size="40"></u-field>
		</view>
		<u-button :custom-style="bindBankCardBtn" @click="bindBackCard">下一步</u-button>
		<u-picker mode="selector" v-model="isShowPicker" :default-selector="[5]" :range="cardtypeList" @confirm="getCard"></u-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: "",
				idno: "",
				cardno: "",
				code: "",
				codeText: "获取验证码",
				cardtype: "请选择证件类型",
				cardtypeList: [],
				isShowPicker: false,
				checked: false,
				arr: [],
				idtype: "",
				disabled: false,
				signed: "",
				bindBankCardBtn: {
					width: '600rpx',
					backgroundColor: '#2FA8E1',
					color: '#FFFFFF',
					fontFamily: "PingFang-SC-Medium",
					fontSize: '30rpx',
					marginTop: '100rpx',
					padding: '50rpx 0'
				}
			}
		},
		computed: {

		},
		onLoad() {
			this.getType()
			let signed = wx.getStorageSync("signed")
			if (signed == "no") {
				this.signed = false
			} else {
				this.signed = true
			}
		},
		methods: {
			bindBackCard() {
				let that = this
				let {
					cardno,
					idtype,
					name,
					idno,
					checked,
					code
				} = that
				if (name == "") {
					uni.showToast({
						title: "请填写您的姓名",
						duration: 800,
						icon: "none"
					})
					return false
				}
				if (idno == "") {
					uni.showToast({
						title: "请输入您的证件号",
						duration: 800,
						icon: "none"
					})
					return false
				}
				if (cardno == "") {
					uni.showToast({
						title: "请输入您的市民卡号",
						duration: 800,
						icon: "none"
					})
					return false
				}
				if (idtype == "") {
					uni.showToast({
						title: "请选择您的证件类型",
						duration: 800,
						icon: "none"
					})
					return false
				}
				if (idtype == "") {
					uni.showToast({
						title: "请选择您的证件类型",
						duration: 800,
						icon: "none"
					})
					return false
				}
				var param = {
					"cardno": cardno.trim(),
					"idtype": idtype,
					"name": name,
					"idno": idno.trim()
				}
				that.$u.post("/v1/bindcard", param).then((res) => {
					let isBind = res.signed
					uni.setStorageSync("name", name)
					uni.setStorageSync("cardno", cardno.trim())
					uni.setStorageSync("idtype", idtype)
					uni.setStorageSync("idno", idno.trim())
					uni.setStorageSync("phoneX", res.phonex)
					uni.setStorageSync("personid", res.personid)
					uni.setStorageSync("userid", res.personid)
					uni.setStorageSync("signed", res.signed)
					uni.setStorageSync("paypwdset", res.paypwdset)
					if (isBind == 'yes') {
						uni.showToast({
							title: '账户已绑定',
							icon: 'none',
							duration: 800,
							success(res) {
								setTimeout(() => {
									uni.navigateBack({
										delta: 1
									})
								}, 1500)
							}
						})
					} else {
						uni.showToast({
							title: "绑定成功",
							icon: "none",
							duration: 800,
							complete(res) {
								setTimeout(() => {
									uni.navigateTo({
										url: "/pages/sub_mine/bindSxy"
									})
								}, 1500)
							}
						})
					}

				})
			},
			getType() {
				let that = this
				that.$u.post("/v1/idtypes", {}).then((res) => {
					let arr = []
					let arr1 = []
					for (let i in res.idtypes) {
						let obj = {
							name: i,
							value: res.idtypes[i]
						}
						arr.push(obj)
						arr1.push(res.idtypes[i])
					}
					that.cardtypeList = arr1
					that.cardtype = arr1[5]
					that.idtype = 'idcard'
					that.arr = arr
				})
			},
			showPicker() {
				this.isShowPicker = true
			},
			getCard(e) {
				let that = this
				that.cardtype = that.cardtypeList[e[0]]
				that.idtype = that.arr[e[0]].name
			},
		}
	}
</script>

<style lang="scss" scoped>
	.bindBankCard {
		width: 100vw;
		// height: 100vh;
		background-color: #F3F3F3;
		overflow: hidden;
		padding-bottom: 30rpx;

		&-toast {
			display: flex;
			padding: 20rpx 30rpx;
			font-family: "PingFang-SC-Medium";
			font-size: 26rpx;
			justify-content: space-between;
			color: #999999;
		}

		&-list {
			margin-top: 30rpx;
			background-color: #FFFFFF;
		}

		&-lay {
			font-family: "PingFang-SC-Regular";
			color: #666666;
			margin: 10rpx 30rpx;

			&-text {
				color: #2FA8E1;
			}
		}

		&-btn {
			width: 600rpx;
			background-color: #2FA8E1;
			color: #FFFFFF;
			font-family: "PingFang-SC-Medium";
			font-size: 30rpx;
			margin-top: 30rpx;
			padding: 50rpx 0;
		}
	}

	.btn {
		color: #2FA8E1;
		background-color: #FFFFFF;
		border-color: #2FA8E1;
		border-width: 1rpx;
		border-style: solid;
		font-family: "PingFang-SC-Regular";
	}
</style>