409 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			409 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			Vue
		
	
	
	
<template> 
 | 
						|
	<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
 | 
						|
	<view class="report-detail">
 | 
						|
		<u-loading-page :loading="sumbitStaus" loading-text="提交中..."></u-loading-page>
 | 
						|
		<view style="border-bottom: 1rpx solid #ccc;margin-bottom: 20rpx;" v-if="!sumbitStaus">
 | 
						|
			<view class="info-item">
 | 
						|
				<view class="label">体检日期</view>
 | 
						|
				<view class="value-wrapper" @click="dateShow=true">
 | 
						|
					<!-- <uni-easyinput v-model="medicalDate" placeholder="请选择体检日期" border="none" maxlength="24" /> -->
 | 
						|
					<view class="value" :class="medicalDate? '' :'placeholder'">{{medicalDate || '请选择体检日期'}}</view> 
 | 
						|
				</view>
 | 
						|
			</view>
 | 
						|
			<view class="info-item">
 | 
						|
				<view class="label">体检机构</view>
 | 
						|
				<view class="value-wrapper" style="border: none;">
 | 
						|
					<uni-easyinput v-model="medicalMechanism" placeholder="请输入体检机构" maxlength="24" />
 | 
						|
				</view>
 | 
						|
			</view> 
 | 
						|
		</view>
 | 
						|
		<u-datetime-picker :minDate="minDate" :maxDate="maxDate" :show="dateShow" v-model="defaultDate" mode="date"
 | 
						|
			:closeOnClickOverlay="true" :formatter="formatter" @cancel="dateShow = false" @confirm="birthDayConfirm">
 | 
						|
		</u-datetime-picker>
 | 
						|
		<scroll-view style="width: 100%;height: 70vh;" scroll-y="true" v-if="!sumbitStaus">
 | 
						|
			<table style="width: 100%;" v-for="(itmes,index) in reportList">
 | 
						|
			  <tr>
 | 
						|
			    <td colspan="3" align="left"><span>{{itmes.medicalProjectName}}</span></td>
 | 
						|
			  </tr>
 | 
						|
			  <tr>
 | 
						|
			    <td><span>项目名称</span></td>
 | 
						|
			    <td><span>检查结果</span></td>
 | 
						|
			    <td><span>单位</span></td>
 | 
						|
			  </tr>
 | 
						|
			  <tr v-for="(itme,indexd) in itmes.healthMedicalReportDetails">
 | 
						|
			    <td>{{itme.medicalProjectDetailName}}</td>
 | 
						|
			    <td><u-input
 | 
						|
			      v-model="itme.result"
 | 
						|
			      placeholder="请输入结果"
 | 
						|
			      maxlength="30"
 | 
						|
			      show-word-limit
 | 
						|
			    /></td>
 | 
						|
			    <td>{{itme.medicalProjectDetailUnit}}</td>
 | 
						|
			  </tr>
 | 
						|
			</table>
 | 
						|
			<!-- <view style="height: auto;padding-bottom: 20rpx;">
 | 
						|
				<view v-for="(item,index) in this.reportList":key="index">
 | 
						|
					<view class="list-title">
 | 
						|
						<text>{{item.medicalProjectName}}</text> 
 | 
						|
					</view>
 | 
						|
					<view class="list-item" v-for="(dItem,dIndex) in item.medicalReportDetailVOList":key="dIndex">
 | 
						|
						<view class="label">
 | 
						|
							<text>{{dItem.medicalProjectDetailName}}</text> 	
 | 
						|
							<text v-if="dItem.medicalProjectDetailUnit">({{ dItem.medicalProjectDetailUnit }})</text>
 | 
						|
						</view>
 | 
						|
						<view class="value-wrapper">
 | 
						|
							<u-input v-model="dItem.result" :placeholder="'请输入'+dItem.medicalProjectDetailName" border="none" maxlength="24"></u-input>
 | 
						|
						</view>
 | 
						|
					</view>
 | 
						|
				</view>
 | 
						|
			</view> -->
 | 
						|
		</scroll-view>
 | 
						|
		<!-- 提交按钮 -->
 | 
						|
		<view class="submit-btn" v-if="!sumbitStausV">
 | 
						|
		  <u-button 
 | 
						|
		    shape="squrd"
 | 
						|
			@click="saveReport"
 | 
						|
		    :customStyle="{
 | 
						|
		      width: '100%',
 | 
						|
		      height: '88rpx',
 | 
						|
		      background: '#ff9253',
 | 
						|
		      color: '#ffffff',
 | 
						|
		      border: 'none'
 | 
						|
		    }" style="font-size: 28rpx;"
 | 
						|
		  >保存</u-button>
 | 
						|
		</view>
 | 
						|
	   
 | 
						|
	</view>
 | 
						|
</template>
 | 
						|
 | 
						|
<script> 
 | 
						|
import { listTemplateApi,getTemplateInfoApi,getMedicalReportInfoApi,editMedicalReportApi } from '@/api/mine/survey.js'
 | 
						|
 | 
						|
export default {
 | 
						|
  name: 'details', 
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
		fontValue:uni.getStorageSync('fontSize') || 8,
 | 
						|
		dateShow: false,
 | 
						|
		defaultDate: Number(new Date()),
 | 
						|
		minDate: 7200000,
 | 
						|
		maxDate: Number(new Date()),
 | 
						|
		medicalDate:uni.$u.timeFormat(new Date(), 'yyyy-mm-dd'),
 | 
						|
		medicalMechanism:"",
 | 
						|
		paramsData:{},
 | 
						|
		medicalTemplateId:"",
 | 
						|
		reportList:[],
 | 
						|
		sumbitStaus:false,
 | 
						|
		sumbitStausV:true,
 | 
						|
		reportModelId:"",
 | 
						|
    }
 | 
						|
  },
 | 
						|
  onLoad(opt) {
 | 
						|
		console.log(opt)
 | 
						|
		opt = JSON.parse(opt.params)
 | 
						|
		this.paramsData = opt
 | 
						|
		if(this.paramsData.medicalId&&this.paramsData.medicalId!=""){ 
 | 
						|
			// 编辑
 | 
						|
			this.getMedicalReportInfo()
 | 
						|
			this.medicalTemplateId = this.paramsData.medicalTemplateId
 | 
						|
			this.medicalMechanism = this.paramsData.medicalMechanism
 | 
						|
			this.medicalDate = this.paramsData.medicalDate
 | 
						|
		}else{
 | 
						|
			//新增
 | 
						|
			this.sumbitStausV=false;
 | 
						|
			this.listTemplate() 
 | 
						|
		}
 | 
						|
	 
 | 
						|
  },
 | 
						|
  methods: { 
 | 
						|
		//模板列表
 | 
						|
		async listTemplate() {
 | 
						|
			let param = {  }
 | 
						|
			const res = await listTemplateApi(param)
 | 
						|
			console.log(res, '模板--------')
 | 
						|
			this.medicalTemplateId = res.data[0].medicalTemplateId
 | 
						|
			this.getTemplateInfo() 
 | 
						|
		},
 | 
						|
		//模板详情
 | 
						|
		async getTemplateInfo() {
 | 
						|
			let param = {
 | 
						|
				"medicalTemplateId": this.medicalTemplateId, 
 | 
						|
			}
 | 
						|
			const res = await getTemplateInfoApi(param)
 | 
						|
			console.log(res, '模板--------')
 | 
						|
			this.reportList = res.data
 | 
						|
		},
 | 
						|
		//模板详情
 | 
						|
		async getMedicalReportInfo() {
 | 
						|
			let param = {
 | 
						|
				"medicalId": this.paramsData.medicalId, 
 | 
						|
			}
 | 
						|
			const res = await getMedicalReportInfoApi(param)
 | 
						|
			this.reportList = res.data
 | 
						|
			console.log(res, '详情--------')
 | 
						|
		},
 | 
						|
		saveReport() {
 | 
						|
			if(!this.sumbitStaus){
 | 
						|
				this.sumbitStaus=true
 | 
						|
				console.log("确认获取数据",this.reportList)
 | 
						|
				if(this.medicalDate==null||this.medicalDate==""||this.medicalDate==undefined||this.medicalMechanism==null||this.medicalMechanism==""||this.medicalMechanism==undefined){
 | 
						|
				  this.$modal.msgSuccess("请检查机构或时间是否填入");
 | 
						|
				  return;
 | 
						|
				}
 | 
						|
				let params={
 | 
						|
				    "medicalTemplateId":this.medicalTemplateId,
 | 
						|
				    "medicalDate":this.medicalDate,
 | 
						|
				    "medicalMechanism":this.medicalMechanism,
 | 
						|
				    "userId":uni.getStorageSync('userId'),
 | 
						|
				    "reportDatas":this.reportList
 | 
						|
				}
 | 
						|
				console.log("params",params)
 | 
						|
				editMedicalReportApi(params).then(response => {
 | 
						|
				    this.sumbitStaus=false
 | 
						|
					uni.navigateBack() 
 | 
						|
				});
 | 
						|
				// let param = {}
 | 
						|
				// if(this.paramsData.medicalId&&this.paramsData.medicalId!=""){
 | 
						|
				// 	 param = {
 | 
						|
				// 		"medicalId": this.paramsData.medicalId,
 | 
						|
				// 		"userId": uni.getStorageSync('userId'),
 | 
						|
				// 		"medicalDate": this.medicalDate,
 | 
						|
				// 		"medicalTemplateId": this.medicalTemplateId,
 | 
						|
				// 		"medicalMechanism": this.medicalMechanism,
 | 
						|
				// 		"reportProjectVOS":this.reportList
 | 
						|
				// 	}
 | 
						|
				// }else{
 | 
						|
				// 	param = { 
 | 
						|
				// 		"userId": uni.getStorageSync('userId'),
 | 
						|
				// 		"medicalDate": this.medicalDate,
 | 
						|
				// 		"medicalTemplateId": this.medicalTemplateId,
 | 
						|
				// 		"medicalMechanism": this.medicalMechanism,
 | 
						|
				// 		"reportProjectVOS":this.reportList
 | 
						|
				// 	}
 | 
						|
				// } 
 | 
						|
				// editMedicalReportApi(param).then((res)=>{
 | 
						|
				// 	if(res.code==200){
 | 
						|
				// 		this.sumbitStaus=false
 | 
						|
				// 		uni.navigateBack() 
 | 
						|
				// 	}else{
 | 
						|
				// 		this.sumbitStaus=false
 | 
						|
				// 	}
 | 
						|
				// }).catch(()=>{
 | 
						|
				// 	this.sumbitStaus=false
 | 
						|
				// })
 | 
						|
				
 | 
						|
			}
 | 
						|
		},
 | 
						|
		
 | 
						|
		
 | 
						|
		// 体检日期
 | 
						|
		birthDayConfirm(e) {
 | 
						|
			this.medicalDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd'); 
 | 
						|
			this.dateShow = false;
 | 
						|
		},
 | 
						|
		formatter(type, value) {
 | 
						|
			if (type === 'year') {
 | 
						|
				return `${value}年`
 | 
						|
			}
 | 
						|
			if (type === 'month') {
 | 
						|
				return `${value}月`
 | 
						|
			}
 | 
						|
			if (type === 'day') {
 | 
						|
				return `${value}日`
 | 
						|
			}
 | 
						|
			return value
 | 
						|
		},
 | 
						|
  },
 | 
						|
}
 | 
						|
</script>
 | 
						|
 | 
						|
<style scoped>
 | 
						|
.report-detail { 
 | 
						|
  background-color: #fff;
 | 
						|
  min-height: 94vh;
 | 
						|
}
 | 
						|
.info-item {
 | 
						|
	display: flex;
 | 
						|
	align-items: center;
 | 
						|
	justify-content: center;
 | 
						|
	padding: 28rpx;
 | 
						|
	border-bottom: 1rpx solid #FFFFFF;
 | 
						|
 | 
						|
	&:last-child {
 | 
						|
		border-bottom: none;
 | 
						|
	}
 | 
						|
 | 
						|
	.label {
 | 
						|
		width: 25%;
 | 
						|
		font-size: 32rpx;
 | 
						|
		color: #333;
 | 
						|
		margin-right: 10rpx;
 | 
						|
	}
 | 
						|
 | 
						|
	.value-wrapper {
 | 
						|
		display: flex;
 | 
						|
		align-items: center;
 | 
						|
		border: 1px solid rgb(229, 229, 229);
 | 
						|
		border-radius: 10rpx;
 | 
						|
		width: 70%;
 | 
						|
		height: 70rpx;
 | 
						|
		 
 | 
						|
		.value {	
 | 
						|
			font-size: 28rpx;
 | 
						|
			color: #333;
 | 
						|
			padding-left: 16rpx; 
 | 
						|
			&.placeholder {
 | 
						|
				color: #999;
 | 
						|
			}
 | 
						|
		}
 | 
						|
	}
 | 
						|
}
 | 
						|
 | 
						|
.list-title{
 | 
						|
	height: 50rpx;
 | 
						|
	width: 200rpx;
 | 
						|
	padding-left: 10rpx;
 | 
						|
	padding-right: 10rpx;
 | 
						|
	margin-bottom: 20rpx;
 | 
						|
	background: red;
 | 
						|
	color: #FFF;
 | 
						|
	border-top-right-radius: 20rpx;
 | 
						|
	border-bottom-right-radius: 20rpx;
 | 
						|
}
 | 
						|
 | 
						|
.list-item{
 | 
						|
	display: flex;
 | 
						|
	align-items: center;
 | 
						|
	justify-content: space-between;
 | 
						|
	padding: 32rpx;
 | 
						|
	border-bottom: 1rpx solid #ccc;
 | 
						|
	margin-bottom: 10rpx;
 | 
						|
	
 | 
						|
	.label {
 | 
						|
		font-size: 32rpx;
 | 
						|
		color: #333;
 | 
						|
		margin-right: 10rpx;
 | 
						|
		width: 35%;
 | 
						|
	}
 | 
						|
	.value-wrapper {
 | 
						|
		display: flex;
 | 
						|
		align-items: center;
 | 
						|
		border: 1px solid rgb(229, 229, 229);
 | 
						|
		border-radius: 10rpx;
 | 
						|
		width: 60%;
 | 
						|
		height: 60rpx;
 | 
						|
	}
 | 
						|
	
 | 
						|
}
 | 
						|
 | 
						|
 | 
						|
.submit-btn{
 | 
						|
	position: fixed;
 | 
						|
	left: 30rpx;
 | 
						|
	right: 30rpx;
 | 
						|
	bottom: 40rpx;
 | 
						|
	display: flex;align-items: center;
 | 
						|
	justify-content: space-between;
 | 
						|
}
 | 
						|
.addReportStyle{
 | 
						|
      width: 880px;
 | 
						|
      height: 100%;
 | 
						|
      margin-right: 0;
 | 
						|
      margin-left: auto;
 | 
						|
    }
 | 
						|
    .el-dialog {
 | 
						|
      margin: 0 !important; /* 重置默认的margin */
 | 
						|
      position: fixed !important; /* 固定定位 */
 | 
						|
      top: 20px; /* 距离顶部距离 */
 | 
						|
      right: 20px; /* 靠右距离 */
 | 
						|
    }
 | 
						|
    .remind-question{
 | 
						|
        width: 100%;
 | 
						|
        height: 50px;
 | 
						|
        font-size: 22px;
 | 
						|
        display: flex;
 | 
						|
        align-items: center;
 | 
						|
        justify-content: center;
 | 
						|
    }
 | 
						|
    .remind-title{
 | 
						|
        width: 100%;
 | 
						|
        height: 40px;
 | 
						|
        font-size: 16px;
 | 
						|
        font-weight: bold;
 | 
						|
        color: #000;
 | 
						|
        display: flex;
 | 
						|
        align-items: center;
 | 
						|
        justify-content: center;
 | 
						|
    }
 | 
						|
    table td, table th{
 | 
						|
        border: 1px solid #dfe6ec;
 | 
						|
    }
 | 
						|
    .table-title {
 | 
						|
        height: 45px;
 | 
						|
        background-color: #f8f8f9;
 | 
						|
    }
 | 
						|
    .table-label{
 | 
						|
        height: 45px;
 | 
						|
        width: 110px;
 | 
						|
        min-width: 100px;
 | 
						|
        background-color: #f8f8f9;
 | 
						|
    }
 | 
						|
    .table-content{
 | 
						|
        min-width: 250px;
 | 
						|
    }
 | 
						|
    //隐藏图片上传框的css
 | 
						|
    ::v-deep.disabled {
 | 
						|
        .el-upload--picture-card {
 | 
						|
            display: none;
 | 
						|
        }
 | 
						|
    }
 | 
						|
    .box-content {
 | 
						|
      display: -webkit-box;
 | 
						|
      display: -ms-flexbox;
 | 
						|
      display: flex;
 | 
						|
      -webkit-box-orient: vertical;
 | 
						|
      -webkit-box-direction: normal;
 | 
						|
      -ms-flex-direction: column;
 | 
						|
      flex-direction: column;
 | 
						|
      -webkit-box-align: center;
 | 
						|
      -ms-flex-align: center;
 | 
						|
      align-items: center;
 | 
						|
    }
 | 
						|
    .box {
 | 
						|
      width: 100%;
 | 
						|
      height: 100%;
 | 
						|
      min-width: 1000px;
 | 
						|
      text-align: center;
 | 
						|
      color: rgba(80, 81, 82, .9098039215686274);
 | 
						|
    }
 | 
						|
    .box .title {
 | 
						|
        margin-top: 40px;
 | 
						|
        font-size: 24px;
 | 
						|
        font-weight: 700;
 | 
						|
        color: #101d34;
 | 
						|
    }
 | 
						|
    .header-box {
 | 
						|
        display: -webkit-box;
 | 
						|
        display: -ms-flexbox;
 | 
						|
        display: flex;
 | 
						|
        font-weight: 600;
 | 
						|
        margin-top: 40px;
 | 
						|
        -ms-flex-pack: distribute;
 | 
						|
        justify-content: space-around;
 | 
						|
        font-size: 16px;
 | 
						|
        font-weight: 400;
 | 
						|
        -webkit-box-align: center;
 | 
						|
        -ms-flex-align: center;
 | 
						|
        align-items: center;
 | 
						|
        color: #8195a5;
 | 
						|
        border-bottom: 1px solid #e5ebef;
 | 
						|
        padding-bottom: 20px;
 | 
						|
        margin-bottom: 40px;
 | 
						|
    }
 | 
						|
    .tabledata span{
 | 
						|
      font-size: 16px;
 | 
						|
      font-weight: 700;
 | 
						|
      color: #000;
 | 
						|
    }
 | 
						|
 | 
						|
</style> |