<template>
	<view class="content">
		<view class="grxx">
			<view class="grxxItem">
				<view class="ygxm">个人信息</view>
				<view class="sfzhm">
					<text>姓名</text>
					<input type="text" placeholder="请输入姓名" v-model="userData.name" />
				</view>
				<view class="sfzhm">
					<text>身份证</text>
					<input type="text" placeholder="请输入身份证" v-model="userData.idcard" />
				</view>
				<view class="sfzhm">
					<text>手机号</text>
					<input type="text" placeholder="请输入手机号"  v-model="userData.phone" />
				</view>
				<!-- <view class="sfzhm">
					<picker @change="bindPickerChangeYylx" :value="userData.outOrIn" :range="outOrInList" range-key="name">
						<view class="gzdd">
							<text>人员类型</text>
							<input type="text" :disabled="true" placeholder="请选择>>" :value="outOrInName" />
						</view>
					</picker>
				</view> -->
				<view class="sfzhm">
					<view class="gzdd">
						<view class="uni-list-cell-left">
							归口单位
						</view>
						<view class="uni-list-cell-db">
							<uni-combox :candidates='officeList1' v-model="officeName" placeholder="请选择" @input="ksInput"></uni-combox>
						</view>
					</view>
				</view>
				<view class="sfzhm" v-if="iscompany">
					<view class="gzdd">
						<view class="uni-list-cell-left">
							所属公司
						</view>
						<view class="uni-list-cell-db">
							<uni-combox :candidates='companyList1' v-model="companyName" placeholder="请选择" @input="bindPickerChangeSsgs"></uni-combox>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="footer">
			<button type="default" :disabled="isSubmit"  @click="submit">提交</button>
		</view>
	</view>
</template>

<script>
	import {
		postRequest,
		getRequest,
		baseURL,
		baseURL1
	} from '../../api/api.js'
	export default {
		data() {
			const date = new Date()
			const years = []
			const year = date.getFullYear()
			const months = []
			const month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
			const days = []
			const day = date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()
			for (let i = 1990; i <= date.getFullYear(); i++) {
				years.push(i)
			}
			for (let i = 1; i <= 12; i++) {
				if (i < 10) {
					months.push('0' + i)
				} else {
					months.push(i)
				}
			}
			for (let i = 1; i <= 31; i++) {
				if (i < 10) {
					days.push('0' + i)
				} else {
					days.push(i)
				}
			}
			return {
				title: 'picker-view',
				years,
				months,
				days,
				timers: year + '-' + month + '-' + day,
				value: [9999, month - 1, day - 1],
				visible: true,
				indicatorStyle: `height: 50px;`,

				//地域选择器
				array: [],
				index: 0,
				//是否按钮
				abnormalBody: null,
				//时间选择
				confirm: '', //信息真实有效承诺标识
				idcard: '',
				ids: 0, //主键(每日疫情登记表ID)
				inShanghai: null, //当前是否在上海
				injestComplet: null, //是否注册完成
				injestVaccine: null, //是否注册疫苗
				name: "", //姓名
				nucleicTest: null, //是否七天内核酸检测
				officeId: "", //科室ID
				openId: "", //微信ID
				passbyDanger: null, //是否去过危险区
				phone: "", //手机号
				testDate: "", //检测时间
				firstInjest: "", //第一针时间
				secondInjest: "", //第二针时间
				thirdInjest: "", //第三针时间
				animalHeat: '', //温度
				areaType: '', //所在区域
				areaName: '',
				candidates: [{
					id: 1,
					name: '金山'
				}, {
					id: 2,
					name: '市区'
				}],

				loginData: {},
				
				//个人信息
				userData: {
					name:'',
					idcard:'',
					phone:'',
					outOrIn:'',
					officeId:'',
					companyId:''
				},
				//人员类型显示
				outOrInName:'',
				outOrInList:[
					{
						id:0,
						name:'院外'
					},
					{
						id:1,
						name:'院内'
					}
				],
				//归口单位显示
				officeName:'',
				officeList:[],
				officeList1:[],
				//所属公司显示
				iscompany:false,
				companyName:'',
				companyList:[],
				companyList1:[],
				id: '0', //地域选择id
				isdqs: false,
				//疫苗v-model
				base: baseURL,
				base1: baseURL1,
				imageValue: [],
				imageValue2: [],
				imageValue3: [],
				vaccinePicture: '', //疫苗图片
				nucleicPicture: '', //核酸图片
				routePicture: '', //高危地区图片
				contentVal: '', //富文本数据
				isSubmit:false
			}
		},
		onLoad: function(option) {
			let type=uni.getStorageSync('type')
			if(type==2){
				this.iscompany=true
			}else{
				this.iscompany=false
			}
			//获取归口单位list
			getRequest('/covidRegister/selectOfficName').then(res=>{
				if(res.code=='200'){
					this.officeList=res.data
					this.officeList.forEach(item=>{
						this.officeList1.push(item.name)
					})
				}
			})
			//获取所属公司list
			getRequest('/covidRegister/selectCompanyName').then(res=>{
				if(res.code=='200'){
					if(res.code=='200'){
						this.companyList=res.data
						this.companyList.forEach(item=>{
							this.companyList1.push(item.name)
						})
					}
				}
			})
		},
		methods: {
			
			changeImg(url){
				let name=url.split('/')[3]
				let data={
					name,
					extname:'png,jpg',
					url:this.base1+url
				}
				return data
			},
			//url参数获取
			getQueryString(name) {
				const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
				const search = window.location.search.split('?')[1] || '';
				const r = search.match(reg) || [];
				return r[2];
			},
			//风险地区文本编辑器
			onEditorReady() {
				let that = this
				// #ifdef MP-BAIDU
				this.editorCtx = requireDynamicLib('editorLib').createEditorContext('editorId');
				// #endif

				// #ifdef APP-PLUS || H5 ||MP-WEIXIN
				uni.createSelectorQuery().select('#editor').context((res) => {
					//获取文本编辑器数据
					let id = uni.getStorageSync('id')
					getRequest('/dailyRegisterType/findList', {
						id
					}).then(resd => {
						if (resd.code == '200') {
							that.contentVal = resd.data.riskyArea;
							var contentVal_1 = that.contentVal;
							//将内容写入编辑器
							that.editorCtx = res.context;
							let EContent = {
								html: contentVal_1
							}
							that.editorCtx.setContents(EContent); //设置富文本编辑器的内容
						}
					})

				}).exec()
				// #endif
			},
			//工作地点
			bindPickerChangeGzdd: function(e) {
				this.areaType = this.candidates[e.target.value].id;
				this.areaName = this.candidates[e.target.value].name
			},
			//人员类型
			bindPickerChangeYylx(e){
				this.userData.outOrIn = this.outOrInList[e.target.value].id;
				this.outOrInName = this.outOrInList[e.target.value].name
			},
			//归口单位
			ksInput(value) {
				if (this.officeList1.indexOf(value) >= 0) {
					this.userData.officeId = this.officeList[this.officeList1.indexOf(value)].id
				}
			},
			//所属公司
			bindPickerChangeSsgs(value) {
				if (this.companyList1.indexOf(value) >= 0) {
					this.userData.companyId = this.companyList[this.companyList1.indexOf(value)].id
				}
			},
			open() {
				this.isdqs = true
			},
			submit() {
				if (this.areaName == '金山') {
					this.areaType = 1
				} else if (this.areaName == '市区') {
					this.areaType = 2
				}
				this.save()
			},
			save() {
				let that = this;
				let userId = uni.getStorageSync('userId');
				let data = {
					userId,
					confirm: that.confirm,
					id: null,
					companyId:that.userData.companyId,
					// outOrIn:that.userData.outOrIn,
					idcard: that.userData.idcard,
					name: that.userData.name,
					officeId: that.userData.officeId,
					phone: that.userData.phone,
					testDate: that.testDate
				};
				postRequest('/covidRegister/save', data).then((res) => {
					if (res.code == '200') {
						uni.showModal({
							title: '提示',
							showCancel: false,
							content: res.data,
							success: function(res) {
								if (res.confirm) {
									that.isSubmit=true;
								}
							}
						})
					} else {
						uni.showModal({
							title: '提示',
							showCancel: false,
							content: res.data,
							success: function(res) {

							}
						})
					}
				})
			}
		}
	}
</script>

<style>
	page {
		position: relative;
	}

	.content {
		padding:10px;
	}

	.content .grxxTitle {
		padding: 5% 0;
		font-size: 14px;
	}

	.grxxItem {
		border-radius: 5px;
		box-shadow: 0px 0px 15px 3px rgba(0, 0, 0, 0.1);
	}

	.grxxItem .ygxm {
		padding: 10px;
		background-color: #3297ff;
		color: white;
	}

	.contextdqs {
		position: fixed;
		z-index: 100;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.3);
	}


	.contextdq {
		width: 80%;
		height: 50%;
		margin: 0 auto;
		transform: translateY(44%);
		background-color: white;
		overflow-y: scroll;
		padding: 5%;
		border-radius: 5px;
		font-size: 14px;
	}

	.xcmphoto {
		padding: 5%;
	}

	.xcmphoto text {
		color: red;
		font-size: 14rpx;
	}

	.grxxItem .sfzhm {
		width: 96%;
		border-bottom: 1px solid #CCCCCC;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 10px;
		font-size: 84%;
		color: #999999;
		position: relative;
	}


	.hxx {
		position: absolute;
		color: red;
		left: 3px;
		top: 25%;
	}

	.grxxItem .sfzhm {
		border: none;
		height: 36rpx;
		font-size: 14px;
	}
	.uni-list-cell-db{
		width: 61%;
	}
	.grxxItem .sfzhm:last-of-type .uni-combox {
		width: 100%;
	}

	.grxxItem .sfzhm:last-of-type .uni-combox .uni-input-input {
		margin-left: 50rpx;
	}

	.dxkxxx label {
		display: block;
		width: 100%;
	}

	.xx {
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 4px 10px;
		padding: 10px 0;
	}

	.xx1 {
		margin: 0;
		padding: 0;
		width: 34%;
		border-radius: 68px 0 0 68px;
		height: 34px;
		line-height: 34px;
		border: none;
		font-size: 15px;

	}

	.xx2 {
		margin: 0;
		padding: 0;
		width: 34%;
		border-radius: 0 68px 68px 0;
		height: 34px;
		line-height: 34px;
		border: none;
		font-size: 15px;
	}

	.xx3 {
		background-color: #007AFF;
		color: white;
	}

	.xxdz {
		margin: 0 10px;
		padding: 10px;
		font-size: 84%;
		color: #999999;
		position: relative;
	}

	.xxdz .hxx {
		top: 7%;
	}

	.xxdz .sfzhm {
		margin: 0;
		border-bottom: 1px solid #CCCCCC;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 10px 0;
		font-size: 84%;
		color: #999999;
		border: none;
	}



	.sfzhm radio {
		border-radius: 0;
		transform: scale(0.7)
	}

	.sfzhm image {
		width: 30rpx;
		height: 30rpx;
	}

	.sfzhm .radio {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.sfzhm .radio image {
		width: 40rpx;
		height: 40rpx;
	}

	uni-picker {
		width: 100%;
	}

	.gzdd {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
	}

	.gzdd input {
		width: 61%;
		font-size: 14px;
	}

	.xzdzxx {
		text-align: center;
	}

	.xzdzxx {
		padding: 10px;
		text-align: center;
		color: #007AFF;
	}

	.footer {
		padding: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.footer button {
		width: 50%;
		background-color: #007AFF;
		color: white;
	}

	.picTime {
		z-index: 10;
		height: 100%;
		width: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		position: fixed;
		bottom: 0;
		left: 0;
	}

	.uni-padding-wrap {
		width: 750rpx;
		background-color: white;
		display: flex;
		justify-content: center;
		padding: 10px 0;
	}

	.uni-padding-wrap button {
		height: 30px;
		line-height: 30px;
		font-size: 15px;
	}

	.uni-padding-wrap button:last-of-type {
		background-color: #007AFF;
		color: white;
	}

	.yymc {
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: 100;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
	}

	.pickers {
		position: absolute;
		bottom: 0;
		left: 0;
		height: 40%;
		z-index: 10;
		text-align: center;
		background-color: white;
	}

	.picker-view {
		width: 750rpx;
		height: 600rpx;
		margin-top: 20rpx;
	}

	.item {
		height: 50px;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}

	.dqxz {
		position: absolute;
		left: 0;
		bottom: 0;
		height: 70%;
		width: 100%;
		background-color: white;
		padding: 10px;
	}

	.dqxz .uni-title {
		padding: 10px 0;
		text-align: center;
	}

	.dqxz .uni-list-cell-db {
		margin: 10px 20px 10px 10px;
		padding: 5px;
		border-radius: 6px;
		background-color: #CCCCCC;
		border-top: 1px solid #CCCCCC;
		border-bottom: 1px solid #CCCCCC;
	}

	.dyButton {
		overflow: hidden;
		text-align: center;
		border-bottom: 1px solid #f3eded;
		padding: 1%;
	}

	.dyButtons {
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		position: relative;
		height: 4.1%;
		text-align: center;
		padding: 1%;
		border-bottom: 1px solid #f3eded;
	}

	.dyButton view {
		float: left;

		border: none;
		background-color: white;
		font-size: 15px;
	}

	.dyButtons view:first-of-type {
		position: absolute;
		left: 0%;
		top: 0%;
		border: 1px solid rgba(0, 0, 0, 0);
		background-color: white;
		font-size: 15px;
	}

	.dyButtons .dybuttonst {
		position: absolute;
		right: 5%;
		top: 0%;
		border: 1px solid rgba(0, 0, 0, 0);
		background-color: white;
		font-size: 15px;
	}

	.dyButtons .dybuttonst {
		color: #007AFF;
	}

	.container .ql-container {
		height: 80%;
	}
</style>
