diagnosis_app/views/doctorItems/register/index.vue

<template>
	<view class="doctor-register-content">
		<view class="register-wrap">
			<view class="zhcx-table">
				<view class="zhcx-table-row">
					<view class="name">
						<text>账号</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.accountName"   />
					</view>
				</view>	
				<view class="zhcx-table-row">
					<view class="name">
						<text>密码</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.password"   />
					</view>
				</view>				
				<view class="zhcx-table-row">				  
					<view class="name">
						<text>姓名</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.name"  />
					</view>
				</view>		
				<view class="zhcx-table-row">
					<view class="name">
						<text>身份证</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.idCard"  />
					</view>
				</view>	
				<view class="zhcx-table-row">
					<view class="name">
						<text>性别</text>
					</view>
					<view class="text" >
						<radio-group @change="changeGender">
							<label>
								<radio value="0" :checked="form.gender==='0'"  /><text>男</text>
							</label>
							<label class="gender-item-woman">
								<radio value="1" :checked="form.gender==='1'"  /><text>女</text>
							</label>
						</radio-group>					
					</view>
				</view>		
				<view class="zhcx-table-row">
					<view class="name">
						<text>住址</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.address" />
					</view>
				</view>		
				<view class="zhcx-table-row">
					<view class="name">
						<text>所属医院</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.hospital" />
					</view>
				</view>	
				<view class="zhcx-table-row">
					<view class="name">
						<text>科室</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.offices" />
					</view>
				</view>		
				<view class="zhcx-table-row">
					<view class="name">
						<text>医生资格证号</text>
					</view>
					<view class="text" >
						<input type="text" v-model="form.doctorQualificationsNumber" />
					</view>
				</view>	
				<view class="zhcx-table-row">
					<view class="name">
						<text>资格证照片</text>
					</view>
<!-- 					<view class="text" >
						<input type="text" v-model="form.qualificationsImg" />
					</view> -->
				</view>	
				<image :src="uploadServer+form.qualificationsImg"
						mode="widthFix"
						@click="preview(form.qualificationsImg)"
						v-if="form.qualificationsImg" class="qualificationsImg"></image>			
				<view class="zhcx-upload" @click="uploadBt">
					<div class="icon"></div>
					<text class="uploadTitle">点击上传</text>
				</view>													
			</view>				
		</view>	
		<view class="handle-wrap">
			<view class="submit-BT" @click="submit">
				<text>提交</text>
			</view>			
		</view>
	</view>
</template>
<script>
	import { validPhone ,notEmpty} from '@/libs/index';
	import {register} from '@/api/user';
	import {upload} from '@/api/index';
	import config from'@/config';
	export default {
		data() {
			return {
				uploadServer:config.uploadServer,
				form:{
					name:"",
					phoneNumber:"",
					idCard:"",
					gender:"",
					address:"",
					password:"",
					hospital:"",
					offices:"",		
					doctorQualificationsNumber:"",
					qualificationsImg:""
				}
			}
		},
		methods: {
			changeGender({detail}){
				this.form.gender=detail.value;
			},
			submit(){	
				let form=this.form;
					if(!validPhone(form['accountName'])){
						uni.showToast({
							icon:"none",
							title:"账号必须位11位手机号码"
						})
						return;
					}
					if(!notEmpty(form['password'])){
						uni.showToast({
							icon:"none",
							title:"请设置登录密码"
						})
						return;				
					}				
					if(!notEmpty(form['name'])){
						uni.showToast({
							icon:"none",
							title:"请填写真实姓名"
						})
						return;				
					}	
					if(!notEmpty(form['idCard'])){
						uni.showToast({
							icon:"none",
							title:"请填写身份证号码"
						})
						return;				
					}						
				var params={
					accountName:form['accountName'],
					password:form['password'],
					accountType:1,
					doctorName:form['name'],
					accountTel:form['accountName'],
					doctorSex:form['gender'],
					doctorIdCard:form['idCard'],
					doctorHospital:form['hospital'],
					doctorDepartment:form['offices'],
					doctorQualificationsNumber:form['doctorQualificationsNumber'],
					doctorQualificationsImg:form['qualificationsImg'],
					doctorAddress:form['address']		
				}
				register(params).then(()=>{
					uni.showToast({
						title:"注册成功!"
					})
					setTimeout(()=>{
						uni.reLaunch({
							url:"/pages/login/index"
						})
					},1500)
				})
			},
			uploadBt(){
				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;		
						this.uploadSubmit(tempFilePaths[0])
					}
				});			
			},
			uploadSubmit(filePath){
				upload({filePath}).then((res)=>{
					let cont=JSON.parse(res)
					this.$set(this.form,'qualificationsImg',cont.data.path);
					uni.showToast({
						title:'上传成功！',
						icon:'success'
					})
				}).catch((msg)=>{
					uni.showToast({
						title:'上传失败！',
						icon:'none'
					})
				})	
			},
			preview(path){
				let urls=[];
				let imgsrc=config.uploadServer+path;
				urls.push(imgsrc)
				uni.previewImage({
					urls,
					fail() {
						uni.showToast({
							icon:'none',
							title:'预览失败！'
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.doctor-register-content{
		padding-bottom: 200upx;
		.register-wrap{
			.zhcx-table-row{
				.text{
					text-align: left;
					.gender-item-woman{
						margin-left: 40upx;
					}
				}
			}
			.zhcx-upload{
				margin-top: 10upx;
			}
		}
		.qualificationsImg{
			display: block;
			width: 100upx;
			height: 100upx;
		}
	}
	.handle-wrap{
		&{
			width: 100%;
			position: fixed;
			bottom: 0;
			left: 0;
			padding: 10upx 0;
		}
		.submit-BT{
			width: 702upx;
			height: 100upx;
			line-height: 100upx;
			text-align: center;
			background-color: #3384FF;
			border-radius: 12upx;	
			color: #fff;
			font-size: 32upx;
			margin: 0 auto;
		}				
	}
</style>