<template>
	<view>
		<titlenav></titlenav>
		<view class="authentication">
			<view class="title">实名认证</view>
			<view class="text">
				账户实名认证后不能修改，
				<span>请使用本人身份信息完成认证</span>
			</view>
			<view class="text1">提现金额</view>
			<view class="inpt"><input type="number" value="" placeholder="请输入提现金额" v-model="money" /></view>
			<view class="text1">身份证号</view>
			<view class="inpt"><input type="number" value="" placeholder="请输入" v-model="idNo" /></view>
			<view class="text2">
				已同意并阅读，
				<span class="text3">支付服务相关协议</span>
			</view>
			<u-button type="primary" :disabled="!canSubmit" @click="submit">同意协议并继续</u-button>
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex';
import Titlenav from '../components/Titlenav.vue';
export default {
	components: {
		Titlenav
	},
	data() {
		return {
			idNo: '',
			money: ''
		};
	},
	computed: {
		...mapState(['systemInfo']),
		canSubmit() {
			if (this.idNo && this.money) {
				return true;
			} else {
				return false;
			}
		}
	},
	methods: {
		submit(){
			if (!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(this.idNo)) {
				this.toast('请输入正确身份证');
				return;
			}
			uni.navigateTo({
				url: '/pages/Walletdetails'
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.authentication {
	/deep/ .uni-input-placeholder {
		font-size: 13px;
		font-weight: 400;
		color: #aaabad;
		line-height: 24px;
	}
	/deep/ .u-btn {
		height: 48px;
		font-size: 16px;
		text-align: center;
		margin: 0 23px;
	}
	margin: 10px 20px 0;
	.title {
		font-size: 24px;
		font-weight: bold;
		color: #000000;
		line-height: 33px;
	}
	.text {
		font-size: 13px;
		font-weight: 400;
		color: #c8c9cc;
		line-height: 22px;
		margin-bottom: 20px;
	}
	span {
		color: #000000;
		font-weight: bold;
		font-size: 13px;
	}
	.text1 {
		font-size: 14px;
		font-weight: bold;
		color: #000000;
		line-height: 20px;
	}
	.inpt {
		background: #f5f7fa;
		border-radius: 8px;
		padding: 12px 16px;
		margin: 10px 0 16px;
	}
	.text2 {
		font-size: 13px;
		font-weight: 400;
		color: #c8c9cc;
		line-height: 22px;
		text-align: center;
		margin: 30px 0 10px;
	}
	.text3 {
		color: #214bbe;
	}
}
</style>
