<template>
	<view>

		<view class="bm-info">
			<view class="line">
				<view class="label">
					姓名<i></i>
				</view>
				:<input type="input" v-model="param.realName" placeholder="请输入姓名"/>
			</view>
			<view class="line">
				<view class="label">
					手机号<i></i>
				</view>
				:<input type="input" class="phone-input" v-model="param.phone" placeholder="请输入手机号" disabled/>
			</view>
			<view class="line">
				<view class="label">
					身份证号<i></i>
				</view>
				:<input type="input" v-model="param.idCard" placeholder="请输入身份证号"/>
			</view>
		</view>

		<view class="bm-bottom">
			<view class="bm-btn" @click="save">保存</view>
		</view>

		<view>
			<!-- 提示信息弹窗 -->
			<uni-popup ref="message" type="message">
				<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
			</uni-popup>
		</view>
	</view>


</template>

<script>
	import { updateUserProfile } from "@/api/employee/system/user";
	// import { getCodeImg } from '@/api/employee/login'
  export default {
	data() {
		return {
			param: {
				realName: null,
				phone: null,
				idCard: null,
			},
			type: 'center',
			msgType: 'success',
			messageText: '这是一条成功提示',
			value: '',
		};
	  },
    onLoad: function(options) {
		this.param.realName = this.$store.state.user.nickName
		this.param.idCard = this.$store.state.user.idCard
		this.param.phone = this.$store.state.user.phone
    },
	 methods:{
		 save(){
			 if (this.param.realName == null || this.param.realName == ''){
				 wx.showToast({
					 title: '请填写姓名',
					 icon: 'none',
					 duration: 2000,
				 })
				 return
			 }
			 if (this.param.idCard == null || this.param.idCard.length != 18){
				 wx.showToast({
					 title: '请填写正确的身份证号',
					 icon: 'none',
					 duration: 2000,
				 })
				 return
			 }
			 updateUserProfile(this.param).then(response => {
				 this.messageToggle('success')
				 // 设置用户信息
				 this.$store.dispatch('GetInfo').then(res => {
					 this.param.realName = this.$store.state.user.nickName
					 this.param.idCard = this.$store.state.user.idCard
					 this.param.phone = this.$store.state.user.phone
				 })
			 })
		 },
		 messageToggle(type) {
			 this.msgType = type
			 this.messageText = `保存成功`
			 this.$refs.message.open()
		 },
	 }
  }
</script>

<style lang='scss'>
	.task-name{
		height: 100rpx;
		display: flex;
		align-items: center;
		margin-left: 30rpx;
	}
	.bm-info{
		margin-top: 70rpx;
		background-color: #ffffff;
		padding: 10rpx 30rpx 10rpx 30rpx;
		.line{
			border-bottom: 1rpx solid #dbdbdb;
			height: 80rpx;
			display: flex;
			align-items: center;
			.label{
				width: 18%;
				height: 40rpx;
				text-align: justify;

				i{
					display: inline-block;
					width: 100%;
					height: 0;
				}
			}

			input{
				/*width: 80%;*/
				margin-left: 40rpx;
				height: 50rpx;
			}

		}
		.line:last-child {
			border-bottom: none;
		}
	}
	.phone-input{
		color: #979595;
	}
	.bm-bottom{
		position: absolute;
		bottom: calc(env(safe-area-inset-bottom) + 40rpx);
		width: 100%;
		padding: 0 30rpx;
		.bm-btn{
			left: 0;
			display: grid;
			width: 100%;
			background-color: #107ff6;
			color: #ffffff;
			font-weight: 650;
			font-size: 30rpx;
			border-radius: 7rpx;
			height: 75rpx;
			text-align: center;
			place-items: center;
		}
	}


</style>

