<template>
	<view class="content">
		<view class="box" style="margin-top: 70rpx;">
			<view class="left">姓名</view>
			<view class="right"><input type="text" placeholder="请输入真实姓名" v-model="name"></view>
		</view>
		<view class="box">
			<view class="left">身份证号</view>
			<view class="right"><input type="idcard" placeholder="请输入身份证号" v-model="idcard"></view>
		</view>
		<view class="box">
			<view class="left">手机号</view>
			<view class="right"><input type="number" placeholder="请输入手机号" v-model="phone"></view>
		</view>
		<view class="box">
			<view class="left">银行卡号</view>
			<view class="right"><input type="number" placeholder="请输入银行卡号" v-model="card"></view>
		</view>
		<button @click="button" class="button">提交认证</button>
	</view>
</template>

<script>
	import {realname} from '@/api/index.js'
	export default {
		data() {
			return {
				idcard: '',
				name: '',
				phone: '',
				card:''

			};
		},
		methods: {
			button(){
				if(this.name==''){
					this.$api.msg('请输入姓名')
					return
				}
				if(this.idcard==''){
					this.$api.msg('请输入身份证号')
					return
				}
				if(this.idcard.length!=18){
					this.$api.msg('请输入正确身份证号')
					return
				}
				if(this.phone==''){
					this.$api.msg('请输入手机号')
					return
				}
				if(this.phone.length!=11){
					this.$api.msg('请输入正确手机号')
					return
				}
				if(this.card==''){
					this.$api.msg('请输入银行卡号')
					return
				}
				realname(
				{
					real_name:this.name,
					phone:this.phone,
					idcard:this.idcard,
					bank_code:this.card
					
				}).then(res=>{
					console.log(res,'res');
					this.$api.msg('已提交,请等待审核')
					if(res.status==400){
						return
					}
					
				})
			},
			navTo(url) {
				uni.navigateTo({
					url
				})
			}
		}
	}
</script>

<style lang="scss">
	page,
	.content {
		background: #111111;
		height: 100%;
		width: 750rpx;

		.box {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin: 0 30rpx;
			border-bottom: 2rpx solid #AEAEAE;
			padding: 30rpx 40rpx;

			.left {
				font-size: 26rpx;
				font-weight: 500;
				color: #FFFFFF;
			}

			.right {
				font-size: 26rpx;
				font-weight: 400;
				color: #FFFFFF;

				.img {
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
					overflow: hidden;
				}
			}
		}

		.button {
			margin-top: 100rpx;
			width: 690rpx;
			height: 80rpx;
			background: linear-gradient(270deg, #6E8DF7, #9977F6);
			border-radius: 10rpx;
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 80rpx;
		}
	}
</style>
