<template>
	<view class="leader">
		<view class="tips">
			提示：请输入您申报复工时同样的信息（名字，手机号，身份证）！
		</view>
		<view class="cu-form-group">
			<view class="title"><span style="color:red;display: inline-block; vertical-align:inherit;margin-right:4upx">*</span>姓名：</view>
			<input placeholder="注意简繁体，与复工申请时一致" :value="form.name" @input="updateInputVal($event,'name')"></input>
		</view>
		<view class="cu-form-group">
			<view class="title"><span style="color:red;display: inline-block; vertical-align:inherit;margin-right:4upx">*</span>手机号码：</view>
			<input placeholder="请输入手机号码" type="number" :value="form.phone" name="input" @input="updateInputVal($event,'phone')"></input>
		</view>
		<view class="cu-form-group">
			<view class="title"><span style="color:red;display: inline-block; vertical-align:inherit;margin-right:4upx">*</span>身份证/护照号：</view>
			<input placeholder="请输入身份证号码/护照号" :value="form.idCard" name="input" @input="updateInputVal($event,'idCard')"></input>
		</view>
		
		<view class="cu-form-group" v-show="!isRead">
			<view class="uni-padding-wrap uni-common-mt">
				<view class="padding-top padding-bottom">
					<checkbox-group @click="openModal">
						<label>
							<checkbox value="A" :checked="form.agree == 1" class="fl" style="margin-top:4upx" />
							<view style="padding-left:60upx;padding-top:6upx">
								我已阅读并认可<span style="color:#0081FF" @click.stop="modalName = true">《软件使用协议》</span>，承诺如实填报。
							</view>
						</label>
					</checkbox-group>
				</view>
			</view>
			</checkbox-group>
		</view>
		
		<view class="cu-modal" :class="modalName?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end text-bold">
					<view class="content">软件使用协议</view>
					<view class="action" @tap="modalName = ''">
						<text class="cuIcon-close text-black"></text>
					</view>
				</view>
				<view class="padding-xl green-word">
					<div class="text-left">
						<p class="content">根据《中华人民共和国传染病防治法》、《中华人民共和国突发事件应对法》、《突发公共卫生事件应急条例》、国家卫生健康委员会公告（2020年第1号），并按照国务院常务会议提出的“分类有序复工复产”和上海疫情防控办及市政府《关于进一步落实各项疫情防控措施的通告》的相关要求，为做好新型冠状病毒感染的肺炎疫情防控工作，保障广大人民群众生命健康，现面向使用本系统的所有用户，特告知如下：所填信息须真实、有效，如若有任何瞒报情况，将依法追究法律责任，并被有关部门列为失信人员。本系统采集的用户信息，主要用于园区和企业的防控管理，必要时将与有关政府部门进行信息对接，或在去除个人隐私信息后用于疫情相关的科学研究。：</p>
						<p>&nbsp;</p>
		
						<p class="content">用户本人承诺：我已经认真阅读过，或者已经有人详细读给我听了。我理解其中的信息，我愿意接受检查，保证填报信息真实、有效，同意相关人员按照这份知情同意书的描述使用本人信息。</p>
					</div>
					<button @click="modalName = ''" class="cu-btn block bg-blue margin-tb-sm lg">我知道了</button>
				</view>
			</view>
		</view>
		
		<view class="padding">
			<button @click="formSubmit" class="cu-btn block bg-blue margin-tb-sm lg">提交</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isRead: false,
				modalName:'',
				form:{
					name:'',
					phone:'',
					idCard:'',
					agree:''
				}
			}
		},
		methods: {
			openModal() {
				if (!this.form.agree) {
					this.form.agree = 1
				} else {
					this.form.agree = 0
				}
			},
			// 更新输入框绑定的表单内容
			updateInputVal(event, props) {
				this.form[props] = event.target.value
			},
			formSubmit(){
				if(this.form.agree == 1){
					if(this.form.name && this.form.phone.length == 11&& this.form.idCard.length > 5){
						this.$http.post(`/sict-ncov/user/vip/register?name=${this.form.name}&phone=${this.form.phone}&idCard=${this.form.idCard}&agree=${this.form.agree}`).then(res => {
							const d = res.data
							if(d.code == 1){
								uni.showToast({
									icon: 'success',
									title: '注册成功！'
								})
								uni.reLaunch({
									url: '/pages/index/index',
								});
							}else{
								uni.showToast({
									icon: 'none',
									title: d.message
								})
								uni.reLaunch({
									url: '/pages/index/index',
								});
							}
						}).catch(err => {
							console.log(err)
						})
					}else{
						uni.showToast({
							icon: 'none',
							title: '请填写完整真实资料！'
						})
					}
				}else{
					uni.showToast({
						icon: 'none',
						title: '请勾选软件使用协议！'
					})
				}
			}
		}
	}
</script>

<style scoped>
.tips{
	font-size: 32upx;
	padding:40upx;
}
</style>