<template>
	<view class="createTherapy">
		<p class="tip-head">请先检索再创建</p>	
		<view class="create-therapy-container">
			<view class="create-item-row">
				<view class="name">诊断时间</view>
				<view class="info date">
					<picker  mode="date" v-model="createTherapyForm.time" @change="timeChange">
						<view class="time">
							<text>{{ createTherapyForm.time }}</text>
							<text class="zhcx-icon-youbianjiantoujiaoduxiao zhcx-iconfont"></text>
						</view>
					</picker>
				</view>	
			</view>
			<view class="create-item-row ">
				<input class="inp-name" type="text" v-model="createTherapyForm.accountName" placeholder="请输入患者手机号码"  />
				<button type="default" @click="verifyAccout" class="verifyAccoutBt">检测</button>			
			</view>	
			<view class="patient-info" v-if="patientInfoModal">
				<view class="patient-info-item-row">
					<view  class="name">姓名</view>
					<input class="info" type="text" v-model="createTherapyForm.name" :disabled="userStatus" />
				</view>	
				<view class="patient-info-item-row">
					<view  class="name">身份证</view>
					<input class="info" type="text" v-model="createTherapyForm.patientIdCard" :disabled="userStatus"/>
				</view>	
				<view class="patient-info-item-row" >
					<view class="name">性别</view>
					<radio-group @change="changeGender">
						<label>
							<radio value="0" :checked="createTherapyForm.gender==='0'"  :disabled="userStatus"/><text>男</text>
						</label>
						<label class="gender-item-woman">
							<radio value="1" :checked="createTherapyForm.gender==='1'" :disabled="userStatus"  /><text>女</text>
						</label>
					</radio-group>
				</view>	
				<view class="patient-info-item-row">
					<view  class="name">地址</view>
					<input class="info" type="text" v-model="createTherapyForm.patientAddress" :disabled="userStatus" />
				</view>	
				<view class="patient-info-item-row" >
					<view  class="name">邮箱</view>
					<input class="info" type="text" v-model="createTherapyForm.accountEmail" :disabled="userStatus" />
				</view>													
			</view>
			<textarea class="textarea illness" v-model="createTherapyForm.illness" placeholder="病情描述" :disabled="illnessStatus" />			
			<view class="addImage">
				<view class="title">添加医学影像</view>
				<view class="tip">支持各类图片，文件不大于10M</view>	
				<view class="upload" @click="uploadBt">
					<view class="icon"></view>
					<view class="word">点击上传</view>
				</view>
			</view>
			<textarea class="textarea therapySchedule" v-model="createTherapyForm.therapySchedule" placeholder="治疗方案" :disabled="illnessStatus" />			
			<view class="submit-BT" @click="createSubmit" >
				<text>提交</text>
			</view>				
		</view>	
	</view>	
</template>

<script>
	import {parseTime,validPhone} from '@/libs/index';
	import {upload} from '@/api';
	import {detectionAccount,creatPatient} from '@/api/doctor.js'	
	export default{
		data(){
			return{
				createTherapyForm:{
					time:parseTime(new Date(),'{yyyy}-{mm}-{dd} {hh}:{mm}:{ss}'),
					accountName:"",
					name:"",
					illness:"",
					therapySchedule:'',
					patientIdCard:"",
					patientAddress:"",
					accountEmail:"",
					patientIdCard:"",
					image:null
				},
				patientInfoModal:true,
				userStatus:true,
				illnessStatus:true
			}
		},
		methods:{
			verifyAccout(){
				let accountName=this.createTherapyForm.accountName;
					accountName=accountName.trim();
				if(accountName.length<1){
					uni.showToast({
						icon:"none",
						title:"请输入患者手机号码"
					})
					return				
				}else{
					if(!(validPhone(accountName))){
						uni.showToast({
							icon:"none",
							title:"手机号码有误"
						})
						return						
					}				
				}
				detectionAccount(accountName).then((res)=>{
					this.patientInfoModal=true;
					this.initUser();//清空数据
					if(res.data.length>0){
						let patientInfo=res.data[0];
						let time=parseTime(new Date(patientInfo.createTime),'{yyyy}-{mm}-{dd} {hh}:{mm}:{ss}');
	                    this.$set(this.createTherapyForm,'name',patientInfo.patientName);
	                    this.$set(this.createTherapyForm,'gender',patientInfo.patientSex);
	                    this.$set(this.createTherapyForm,'time',time||'');
	                    this.$set(this.createTherapyForm,'patientIdCard',patientInfo.patientIdCard) ; 
	                    this.$set(this.createTherapyForm,'patientAddress',patientInfo.patientAddress);   
	                    this.$set(this.createTherapyForm,'accountEmail',patientInfo.accountEmail) ;	
						this.illnessStatus=false;
					}else{
						uni.showToast({
							icon:"none",
							title:"未检测到患者信息！"
						})
						this.userStatus=false;
						this.illnessStatus=false;							
					}
				})
			},
			createSubmit(){
				let accountName=this.createTherapyForm.accountName;
				if(accountName.length<1){
					uni.showToast({
						icon:"none",
						title:"请输入患者手机号码"
					})
					return				
				}else{
					accountName=accountName.trim();
					if(!(validPhone(accountName))){
						uni.showToast({
							icon:"none",
							title:"手机号码有误"
						})
						return						
					}				
				}
				let userInfo=uni.getStorageSync('userInfo');
				let form=this.createTherapyForm;
				let params={
					doctorId:userInfo.doctorId,
					accountTel:accountName,
					accountName:accountName,
					patientName: form['name'],
					patientSex: form['gender'],
					seekTime:form['time'],
					diseaseDesc:form['illness'],
					diseaseImgDesc:form["image"],
					doctorTreatment:form["therapySchedule"],
					patientIdCard:form['patientIdCard'],
					patientAddress:form['patientAddress'],
					accountEmail:form['accountEmail'],
					password:111111
				}
				/*检测账号信息，不存在就添加密码--防止用户检测后又更改账号但是不检测*/
					creatPatient(params).then(()=>{
						uni.showToast({
							title:"新建成功"
						})
						setTimeout(function(){
							uni.reLaunch({
								url:'/views/record/index?type=create'
							})
						},1500)
					})					
			},
			timeChange({detail }){
				let time=parseTime(new Date(detail.value),'{yyyy}-{mm}-{dd} {hh}:{mm}:{ss}')
				this.createTherapyForm.time=time;
			},
			uploadBt(){
				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;		
						this.uploadSubmit(tempFilePaths[0])
					}
				});			
			},
			uploadSubmit(filePath){
				upload({filePath}).then((res)=>{
					uni.showToast({
						title:"上传成功！"
					})
					let cont=JSON.parse(res);
					let image=[];
						image.push({
							path:cont.data.path
						})
					this.$set(this.createTherapyForm,'image',JSON.stringify(image));
				}).catch((msg)=>{
					uni.showToast({
						title:"上传失败！"
					})
				})	
			},
			changeGender({detail}){
				this.createTherapyForm.gender=detail.value;
			},	
			initUser(){
				this.$set(this.createTherapyForm,'name',"");
				this.$set(this.createTherapyForm,'gender',"");
				this.$set(this.createTherapyForm,'time',"");
				this.$set(this.createTherapyForm,'patientIdCard',""); 
				this.$set(this.createTherapyForm,'patientAddress',"");   
				this.$set(this.createTherapyForm,'accountEmail',"");				
			}
		}
	}
</script>

<style lang="scss" scoped>
	.createTherapy{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #fff;
		overflow-y: auto;
		z-index:999;
		.tip-head{
			background-color: orange;
			color: #fff;
			font-size: 12upx;
			padding: 4upx 0;
			text-align: center;
		}
		.create-therapy-container{
			padding: 40upx 24upx 200upx 44upx;
			.inp-name{
				height: 100upx;
				text-indent: 24upx;
			}
			.create-item-row{
				height: 100upx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				.info{
					width: 400upx;
					height: 100upx;
					line-height: 100upx;
					text-align: right;
					&.date{
						width: 500upx;
					}
					.time{
						height: 100upx;
						line-height: 100upx;
					}
				}
			}
			.textarea{
				width: 100%;
				display: block;
				height: 240upx;
				border:1px solid #ccc;
				padding: 30upx 24upx;
				box-sizing: border-box;
			}
			.addImage{
				padding: 30upx 0;
				.title{
					color: #333;
					font-size:28upx;						
				}
				.tip{
					padding: 8upx 0  16upx 0;
					color: #3584FF;
					font-size:24upx;
				}
				.upload{
					&{
						width: 150upx;
						height: 150upx;
						display: flex;
						justify-content: center;
						align-items: center;
						flex-direction: column;
						background-color: #F1F1F1;						
					}
					.icon{
						width: 50upx;
						height:50upx;
						position: relative;
						&::after{
							width: 50upx;
							height: 4upx;				
							display: block;
							content: "";
							position: absolute;
							left: 50%;
							top: 50%;
							transform: translate(-50%,-50%);
							background-color: #ccc;
						}
						&::before{
							width: 4upx;
							height: 50upx;				
							display: block;
							content: "";
							position: absolute;
							left: 50%;
							top: 50%;
							transform: translate(-50%,-50%);
							background-color: #ccc;
						}			
					}
					.word{
						font-size: 24upx;
						padding-top: 4upx;
					}						
				}
			}
			.submit-BT{
				width: 700rpx;
				height: 80upx;
				line-height: 80upx;
				text-align: center;
				background-color: #3384FF;
				position: fixed;
				bottom: 50upx;
				left: 50%;
				transform: translateX(-50%);
				color: #fff;
				border-radius: 8upx;				
			}			
		}
		.patient-info{
			border: 1px dashed #ccc;
			margin: 10upx 0;
			padding: 10upx;
			background-color: #f5f5f5;
			.patient-info-item-row{
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 70upx;
				line-height: 70upx;
				&:not(:first-child){
					border-top: 1px solid #eaeaea;
				}
				.info{
					color: #666;
					text-align: right;
					height: 100%;
					box-sizing: border-box;
				}
				.gender-item-woman{
					margin-left: 10upx;
				}				
			}
		}
		.verifyAccoutBt{
			width: auto;
			height: 60upx;
			line-height: 60upx;
			text-align: center;
			background-color: #3384FF;
			color: #fff;
			border-radius: 8upx;
			display: inline-block;
			font-size: 28upx;
			margin: 0;
		}
	}	
</style>
