<template>
	<view class="content">
		<view class="formModel">
			<view class="evaluationTitle" style="margin-top: 30rpx;">
				银行卡号
			</view>
			<view class="evaluationInitModel">
				<u--input placeholder="请输入" v-model="form.card_id" border="none"></u--input>

			</view>
			<view class="evaluationTitle" style="margin-top: 30rpx;">
				姓名
			</view>
			<view class="evaluationInitModel">
				<u--input placeholder="请输入" v-model="form.card_name" border="none"></u--input>
			</view>
			<view class="evaluationTitle" style="margin-top: 30rpx;">
				身份证号
			</view>
			<view class="evaluationInitModel">
				<u--input placeholder="请输入" v-model="form.cert_id" border="none"></u--input>
			</view>
			<view class="evaluationTitle" style="margin-top: 30rpx;">
				银行卡预留手机号
			</view>
			<view class="evaluationInitModel">
				<u--input placeholder="请输入" v-model="form.tel_no" border="none"></u--input>
			</view>
		</view>
		<view style="width: 100%;height: 200rpx;">

		</view>
		<view class="bottomModel">
			<view class="addBankCard" @click="addBank">
				添加
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					card_id: "",
					card_name: "",
					tel_no: "",
					bank_code: "",
					bank_name: ""
				},
				bankshow: false,
				bankList: [],
			}
		},
		onShow() {},
		methods: {
			isValidPhoneNumber(phoneNumber) {
				const regex = /^1\d{10}$/;
				return regex.test(phoneNumber);
			},
			isValidCardNumber(cardNumber) {
				let sum = 0;
				let digit;
				let shouldDouble = false;

				// 移除非数字字符
				cardNumber = cardNumber.replace(/\D/g, '');

				// 从右到左遍历数字
				for (let i = cardNumber.length - 1; i >= 0; i--) {
					digit = parseInt(cardNumber.charAt(i), 10);
					if (shouldDouble) {
						digit *= 2;
						if (digit > 9) {
							digit -= 9;
						}
					}
					sum += digit;
					shouldDouble = !shouldDouble;
				}

				// 如果和能被10整除,卡号有效
				return (sum % 10) === 0;
			},
			isValidID(id) {
				const pattern = /^[1-9]\d{5}(18|19|20|21|22)?\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}(\d|[Xx])$/;
				return pattern.test(id);
			},
			addBank() {
				let _this = this
				if (!this.form.card_name || !this.form.cert_id || !this.form.card_id || !this.form.tel_no) {
					uni.showToast({
						icon: 'error',
						title: '请输入完整信息'
					})
					return
				}
				if (!this.isValidPhoneNumber(_this.form.tel_no)) {
					uni.showToast({
						icon: 'error',
						title: '手机号有误!'
					})
					return
				}
				if (!this.isValidCardNumber(_this.form.card_id)) {
					uni.showToast({
						icon: 'error',
						title: '银行卡号有误!'
					})
					return
				}
				if (!this.isValidID(_this.form.cert_id)) {
					uni.showToast({
						icon: 'error',
						title: '身份证有误!'
					})
					return
				}
				this.$request('/hf-settle-account-member', 'POST', this.form).then(res => {
					uni.showToast({
						icon: 'success',
						title: '添加成功'
					})
					uni.navigateBack({
						delta: 1 // 默认值是1,表示返回的页面层数
					});
				}).catch(err => {
					uni.showToast({
						icon: 'error',
						title: '' + err.message
					})
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		width: 100vw;
		height: 100vh;
		padding-top: 50rpx;
		background: linear-gradient(to bottom, #f3d4d7, #f8f8f8, #f8f8f8);
	}

	.formModel {
		width: calc(100% - 120rpx);
		margin: 30rpx;
		padding: 30rpx;
		background-color: #ffffff;
		border-radius: 10rpx;

		.evaluationTitle {
			font-size: 28rpx;
			color: #333333;
			height: 60rpx;
		}

		.evaluationInitModel {
			width: calc(100% - 60rpx);
			padding: 15rpx 30rpx;
			background-color: #F6F7F8;
			border-radius: 20rpx;
			margin-bottom: 20rpx;
			min-height: 60rpx;
			line-height: 40rpx;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
		}
	}

	.bottomModel {
		width: 100%;
		height: 170rpx;
		background-color: #ffffff;
		position: fixed;
		bottom: 0;
		left: 0;

		.addBankCard {
			width: calc(100% - 100rpx);
			margin: 30rpx 50rpx;
			margin-bottom: 50rpx;
			height: 90rpx;
			color: #ffffff;
			text-align: center;
			letter-spacing: 5rpx;
			line-height: 90rpx;
			font-size: 33rpx;
			background-color: #D3195E;
			border-radius: 90rpx;
		}
	}
</style>