<template>
	<view class="personal">
		<u-form
			labelPosition="top"
			:model="userInfo"
			:rules="rules"
			ref="uForm"
			labelWidth="120"
		>
			<u-form-item label="姓名" prop="name" borderBottom>
				<u-input v-model="userInfo.name" border="none" />
			</u-form-item>
			<u-form-item label="性别" prop="sex" borderBottom>
				<u-radio-group v-model="userInfo.sex">
					<u-radio label="男" :name="true" :customStyle="{marginRight: '30px'}"/>
					<u-radio label="女" :name="false"/>
				</u-radio-group>
			</u-form-item>
			<u-form-item label="年龄" prop="age" borderBottom>
				<u-input v-model="userInfo.age" border="none" />
			</u-form-item>
			<u-form-item label="手机号码" prop="phoneNumber" borderBottom>
				<u-input v-model="userInfo.phoneNumber" border="none" />
			</u-form-item>
			<u-form-item label="身份证号" prop="idNo" borderBottom>
				<u-input v-model="userInfo.idNo" border="none" />
			</u-form-item>
		</u-form>
		<view class="br"></view>
		<view class="footer">
			<u-button @click="submit" type="primary">保存</u-button>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:{}
			}
		},
		onLoad() {
			this.$http.get('/person/person/details', {}).then(res => {
				this.userInfo = res.data
			})
		},
		methods: {
			submit(){
				if (!this.userInfo.name) {
					return uni.showToast({
						title: '请输入姓名',
						icon: 'none'
					})
				}
				if (!this.userInfo.sex) {
					return uni.showToast({
						title: '请选择性别',
						icon: 'none'
					})
				}
				if (!this.userInfo.age) {
					return uni.showToast({
						title: '请输入年龄',
						icon: 'none'
					})
				}
				if (!this.userInfo.phoneNumber) {
					return uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					})
				}
				const reg = /^1[3-9]\d{9}$/;
				if (!reg.test(this.userInfo.phoneNumber)) {
					return uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					})
				}
				if (!this.userInfo.idNo) {
					return uni.showToast({
						title: '请输入身份证号',
						icon: 'none'
					})
				}
				const reg2 = /^[1-9]\d{5}(19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
				  if (!reg2.test(this.userInfo.idNo)) {
					return uni.showToast({
						title: '请输入正确的身份证号',
						icon: 'none'
					})
				  }
				this.$http.post('/person/u', this.userInfo).then(res => {
					uni.showToast({
					  title: `修改成功`,
					  icon: 'none',
					});
					setTimeout(()=>{
						uni.navigateBack()
					},500)
				})
			}
		}
	}
</script>

<style lang="scss">
.personal{
	background: #fff;
	min-height:100vh;
	padding:0 30rpx;
	.br{
		height: calc(200rpx + env(safe-area-inset-bottom));
	}
	.footer{
		position: fixed;
		bottom: calc(env(safe-area-inset-bottom) + 40rpx);
		width: 690rpx;
	}
}
</style>
