medical/pages/addHandle/index.vue

<template>
	<view>
		<!-- 基本信息 -->
		<template>
			<view class="content">
				<u-cell isLink @click="show=true">
					<view
						slot="title"
						class="u-slot-title"
					>
						<text class="u-cell-text">
							<RedDot text="班级" :required="true"></RedDot>
						</text>
					</view>
					<view slot="right-icon" isLink class="cell-right">{{classCheck.label}}</view>
				</u-cell>
				<u-picker
					:closeOnClickOverlay="true"
					@close="show=false"
					:show="show"
					:columns="classData"
					keyName="label"
					@cancel="show=false"
					@confirm="choiceUser"
				></u-picker>
			</view>
			
			<view class="content">
				<u-cell isLink @click="nameshow">
					<view
						slot="title"
						class="u-slot-title"
					>
						<text class="u-cell-text">
							<RedDot text="姓名" :required="true"></RedDot>
						</text>
					</view>
					<view slot="right-icon" isLink class="cell-right">{{nameCheck.label}}</view>
				</u-cell>
				<u-picker
					:closeOnClickOverlay="true"
					@close="nameShow=false"
					:show="nameShow"
					:columns="nameData"
					keyName="label"
					@cancel="nameShow=false"
					@confirm="choiceName"
				></u-picker>
			</view>
			
			<view class="content">
			   <u-cell>
					<view
						slot="title"
						class="u-slot-title"
					>
						<text class="u-cell-text">
							性别
						</text>
					</view>
					<view slot="right-icon" style="padding-right: 40rpx; color: rgba(0,0,0,0.30);">{{formData.sex == 1 ? '男' : formData.sex == 2 ? '女' : '自动获取'}}</view>
			   </u-cell>
			</view>
		</template>
		
		<!-- 症状及体征 -->
		<view class="symptom">
			<text class="u-cell-text">
				<RedDot text="症状及体征" :required="true"></RedDot>
			</text>
			
			<u--textarea border="none" style="margin: 32rpx 0 72rpx 0; padding: 0;" v-model="formData.symptom" placeholder="请输入" autoHeight ></u--textarea>
			
			<text class="u-cell-text">
				症状体征照片
			</text>
			
			<upImage :img="symptomImgs"></upImage>
		</view>
		
		<!-- 处理措施 -->
		<view class="symptom">
			<view v-for="item in formData.disposeRecords">
				<RedDot text="处理措施" :required="true"></RedDot>
				<u--textarea border="none" style="margin: 32rpx 0 72rpx 0; padding: 0;" v-model="item.text" placeholder="请输入" autoHeight ></u--textarea>
			</view>
			
			<text class="u-cell-text">
				应急处置后照片
			</text>
			
			<upImage :img="emergencyImgs" @addImg="addImg"></upImage>
		</view>
		
		<!-- 备注 -->
		<!-- <view class="remarks"> -->
			<!-- 备注 -->
			<!-- <u-icon name="edit-pen" color="#8C8C8C" size="49rpx"></u-icon> -->
			<!-- 功能不明确 -->
		<!-- </view> -->
		
		<view class="symptom">
			<RedDot text="备注" :required="true"></RedDot>
			<u--textarea border="none" style="margin: 32rpx 0 72rpx 0; padding: 0;" v-model="formData.remark" placeholder="请输入" autoHeight ></u--textarea>
		</view>
		
		<!-- 结论多选 -->
		<view class="choice">
			<template>
			  <u-checkbox-group
			    v-model="checkboxValue1"
			    placement="row"
				class="radio"
			  >
			    <u-checkbox
			      :customStyle="{marginBottom: '8px'}"
			      v-for="(item, index) in radiolist1"
			      :key="index"
				  shape="square"
				  activeColor="#6241D5" 
			      :label="item.name"
			      :name="item.name"
			    >
			    </u-checkbox>
			  </u-checkbox-group>
			</template>
		</view>
		
		<!-- 提交按钮 -->
		<view class="submit">
			<u-button
				shape="circle"
				type="primary"
				text="提交"
				color="#7B5DF0"
				style="width: 550rpx;"
				@click="add"
			></u-button>
		</view>
		
	</view>

</template>

<script>
import RedDot from '../../conponents/red-dot.vue'
import upImage from '../../conponents/upload/upImage.vue'

	export default {
		components:{
			RedDot,
			upImage,
		},
		data() {
			return {
				show: false,
				nameShow: false,
				
				formData:{
					symptom: "", // 症状文本
					disposeRecords: [{
						text: '',
						studentId : '',
					}], // 处理措施
					remark: '备注', // 备注
					isWatch: 0, // 是否需要观察
					isNoticeParent: 0, // 是否通知家长
					sex: '自动生成',
				},
				checkboxValue1: [],
				
				id: '', 
				detailsData: '',
				
				classData:[], // 班级列表
				nameData:[], // 姓名列表
				
				radiolist1: [{
					name: '需要观察',
					disabled: false
				  },
					{
					  name: '通知家长',
					  disabled: false
					}
				  ],

				classCheck: {
					label: '请选择'
				}, // 选中班级
				nameCheck: {
					label: '请选择'
				}, // 选中姓名
				
				emergencyImgs: [], // 应急处置照片
				symptomImgs: [], // 症状体征照片
			}
		},
		
		onLoad(e) {
			console.log(e)
			if(e.type == 2){
				uni.setNavigationBarTitle({
					title: '编辑'
				})
				
				this.id = e.id
				this.getData()
			}
			if(e.id){
				this.getBasics(e.id)
			}
			
			this.getClass(e.id)
		},
		
		methods: {
         choiceUser(e){
			if(e.value[0] != undefined){
				this.show=false;
				this.classCheck=e.value[0];
			}
		 },
		 
		 choiceName(e){
		 	if(e.value[0] != undefined){
				this.nameShow=false;
				this.nameCheck=e.value[0];
				for(let item of this.formData.disposeRecords){
					item.studentId = e.value[0].value;
				}
				this.formData.sex = e.value[0].sex
			}
		 },
		 
		 // 编辑时调用获取学生信息
		 getData(){
		 	this.$request({
		 		url: this.$api.index.emergencyDetail,
		 		data: {
		 			id: this.id,
		 		},
		 	}).then(res => {
		 		for(let item of res.data.detail.disposeRecords){
		 			item.createTime = item.createTime.replace('T', ' ')
		 		}
		 		this.formData = res.data.detail
				
				this.classCheck = {
					label: this.formData.className,
					value: this.formData.classId,
				}
				
				this.nameCheck = {
					label: this.formData.name,
					value: this.formData.studentId,
				}
				
				this.formData.isWatch?  this.checkboxValue1.push('需要观察') : ''
				this.formData.isNoticeParent?  this.checkboxValue1.push('通知家长') : ''
				checkboxValue1
		 	})
		 },
		 
		 // 人脸识别成功获取基础信息
		 getBasics(id){
			 this.$request({
			 	url: this.$api.addHandle.student,
			 	data: {
			 		id: id,
			 	},
			 }).then(res => {
				 console.log(res)
				 this.getClass(res.data.classId)
				 this.classCheck.label = res.data.className
				 this.nameCheck.label = res.data.name
				 this.formData.sex = res.data.sex
				 
				 for(let item of this.formData.disposeRecords){
				 	item.studentId = res.data.studentId
				 }
			 })
		 },
		 
		 // 获取班级信息
		 getClass(id){
			 this.$request({
			 	url: this.$api.addHandle.getClassSelectVos,
			 	data: {
			 		id: id,
			 	},
			 }).then(res => {
				this.classData = []
				this.classData.push(res.data)
			 })
		 },
		 
		 nameshow(){
			 if(this.classCheck.label == "请选择"){
				this.$u.toast('请先选择班级')
			 }else{
				this.getName()
				this.nameShow = true
			 }
		 },
		 
		 // 请求姓名信息
		 getName(){
			this.$request({
				url: this.$api.addHandle.getNameSelectVos,
				data: {
					classId: this.classCheck.value,
				},
			}).then(res => {
				this.nameData = []
				this.nameData.push(res.data)
			})
		 },
		 
		 // 关闭遮罩层
		 close(){
			 this.show = false
			 this.nameShow = false
		 },
		 
		 addImg(img){
			 console.log('img' , img)
		 },
		 
		 // 提交
		 add(){
			this.checkboxValue1.indexOf("需要观察") != -1 ? this.formData.isWatch = 1 : this.formData.isWatch = 0
			this.checkboxValue1.indexOf("通知家长") != -1 ? this.formData.isNoticeParent = 1 : this.formData.isNoticeParent = 0
			
			for(let item of this.formData.disposeRecords){
				item.disposeText = item.text
			}
				
			var arr = {
				...this.formData,
				className: this.classCheck.label,
				classId: this.classCheck.value,
				name: this.nameCheck.label,
				studentId: this.nameCheck.value,
				emergencyImgs: 'img', // 应急处置照片
				symptomImgs: 'img', // 症状体征照片
				id: this.id,
			}
			console.log(arr, this.id)
			
			if(this.id){
				// 判断是否编辑
				console.log('编辑')
				this.$request({
					url: this.$api.index.modifyAppEmergency,
					data: arr,
					header: {
					    contentType: "application/json"
					},
					method: 'POST',
				}).then(res => {
					console.log(res)
				})
			}else{
				console.log('新增')
				arr.disposeText = this.formData.disposeRecords[0].text,
				this.$request({
					url: this.$api.index.addAppEmergency,
					data: arr,
					header: {
					    contentType: "application/json"
					},
					method: 'POST',
				}).then(res => {
					console.log(res)
					if(res.code == 200){
						this.$u.toast('添加成功')
						uni.switchTab({
							url: '/pages/index/index'
						});
					}
				})
			}
			
		 },
		
		}
	}
</script>

<style lang="scss" scoped>
	page{
		/* background-color: #D9D9D9; */
		background-color: #F5F5F5 !important;
	}
	
	.u-cell{
		background-color: #fff;
		height: 112rpx;
		line-height: 73rpx;
	}
	
	.u-cell-text {
		font-size: 32rpx;
	}
	
	.u-cell-text image{
		width: 10rpx;
		height: 28rpx;
		margin-left: 15rpx;
	}
	
	.symptom{
		margin-top: 20rpx;
		padding: 32rpx 32rpx;
		box-sizing: border-box;
		background-color: #fff;
	}
	
	.upImage{
		width: 160rpx;
		height: 160rpx;
		border-radius: 16rpx;
		border: 2rpx solid #d9d9d9;
		display: flex;
		justify-content: center;
	}
	
	.remarks{
		height: 80rpx;
		margin-top: 20rpx;
		font-size: 32rpx;
		color: rgba(0,0,0,0.60);
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.choice{
		height: 178rpx;
		background-color: #fff;
		margin-top: 20rpx;
		padding-top: 36rpx;
		box-sizing: border-box;
	}
	
	.radio{
		display: flex;
		justify-content: space-evenly;
	}
	
	.submit{
		height: 240rpx;
		padding-top: 49rpx;
		box-sizing: border-box;
	}
	
	.cell-right{
		padding-right: 50rpx;
		background-image: url(@/static/chevron_right.svg);
		background-repeat:no-repeat;
		background-position: 100% 12px;
		color: rgba(0,0,0,0.30);
	}
	
</style>