raolu
/
PC-application


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>添加住院病历</title>
		<link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
		<link href="../../../plugins/toastr/toastr.min.css" rel="stylesheet">
		<link rel="stylesheet" href="../../../plugins/element-ui/element-ui.css" />
		<link rel="stylesheet" type="text/css" href="../css/common.css" />
		<style>
			.el-select-dropdown{
				width: 381px !important;
				left: 89px!important;
			}
			.upload-box{margin-top:0;padding: 10px 0 10px 10px;overflow: hidden;border: 1px solid #d7dce6;}
			.upload-box li{width: 60px;height: 60px;position: relative;display: block;float: left;margin-right: 10px;}
			.upload-box li img{width: 100%;display: block;}
			.upload-img-box{width: 100%;height: 100%;overflow: hidden;}
			.delete-img{position: absolute;right: -5px;top: -5px;color: #fff;background-color: #ccc;border-radius: 100%;text-align: center;line-height: 15px;width: 15px;height: 15px;}
			.upload-img{position: absolute;left: 0;right: 0;top: 0;bottom: 0;opacity: 0;z-index: 3;font-size: 0;width: 100%;height: 100%;}
			.add-img{font-size: 40px;line-height: 60px;font-weight: 500;width: 60px;height: 60px;display: block;text-align: center;border: 1px dashed #d7dce6;color: #bec8d2;}
		</style>
	</head>
	<body class="m0">
	<div id="app" class="p10 c-333" v-cloak>
		<el-tabs v-model="uploadType" @tab-click="handleClick" :stretch="true">
		    <el-tab-pane label="手动上传" name="0"></el-tab-pane>
		    <el-tab-pane label="拍照上传" name="1"></el-tab-pane>
		</el-tabs>
		<div v-show="uploadType=='0'">
	        <div class="pt10 flex ui-row mt10">
	            <label class="c-999 required" style="font-weight: normal;">入院时间：</label>
	            <div class="flex1">
					<el-date-picker v-model="admissionTime" type="date" placeholder="请选择">
					</el-date-picker>
	            </div>
	        </div>
			<div class="pt10 flex ui-row mt10">
	            <label class="c-999 required" style="font-weight: normal;">入院诊断：</label>
	            <div class="flex1">
					<div class="flex">
					    <el-autocomplete
							class="w-220"
							v-model="admittingDiagnosisValue"
							:fetch-suggestions="fetchAdmittingDiagnosis"
							placeholder="请输入内容"
							@select="handleSelect"
						></el-autocomplete>
						<button type="button" class="btn btn-12B7F5 btn-size-s ml15" style="border-radius: 0;" @click="saveDiagnosisWrap('admitting')">+ 添加</button>
					</div>
					<div>
						<el-tag
							v-for="(v, i) in admittingTags"
							:key="i"
							closable
							class="mr5 mt5"
							@close="closeTag('admitting', i)">
							{{v}}
						</el-tag>
					</div>
	            </div>
	        </div>
	        <div class="pt10 flex ui-row mt10">
	            <label class="c-999 required" style="font-weight: normal;">出院时间：</label>
	            <div class="flex1">
					<!-- :picker-options="pickerOptions1" -->
					<el-date-picker v-model="dischargeTime" type="date" placeholder="请选择">
					</el-date-picker>
	            </div>
	        </div>
	        <div class="pt10 flex ui-row mt10">
	            <label class="c-999 required" style="font-weight: normal;">出院诊断：</label>
	            <div class="flex1">
					<div class="flex">
					    <el-autocomplete
							class="w-220"
							v-model="dischargeDiagnosisValue"
							:fetch-suggestions="fetchDischargeDiagnosis"
							placeholder="请输入内容"
							@select="handleSelect"
						></el-autocomplete>
						<button type="button" class="btn btn-12B7F5 btn-size-s ml15" style="border-radius: 0;" @click="saveDiagnosisWrap('')">+ 添加</button>
					</div>
					<div>
						<el-tag
							v-for="(v, i) in dischargeTags"
							:key="i"
							closable
							class="mr5 mt5"
							@close="closeTag('discharge', i)">
							{{v}}
						</el-tag>
					</div>
	            </div>
	        </div>
	        <div class="pt10 flex ui-row mt10">
	            <label class="c-999 required" style="font-weight: normal;">医嘱小结：</label>
	            <div class="flex1">
	                <textarea v-model="advice" class="p10 c-333" style="height: 160px; width: 100%; border:1px solid #e1e1e1; resize:none;box-sizing: border-box"></textarea>
	            </div>
	        </div>
		</div>
		<div class="pt10 flex ui-row mt10" v-show="uploadType=='1'">
            <label class="c-999 required" style="font-weight: normal;">病历图片：</label>
			<div class="flex1">
				<ul class="upload-box">
					<li class="flex-box" v-for="(img,index) in upImgs">
						<div class="upload-img-box">      						
							<img :src="img.baseUrl" @click="previewImg(img.baseUrl)"/>
						</div>
						<a class="delete-img" @click="deleteImg(index)">&times;</a>
					</li>
					<li class="flex-box" v-if="upImgs.length<6">
						<span class="add-img">＋</span>
						<input type="file" @change="upLoadImgToBase64" class="upload-img" />
					</li>
				</ul>
				<div>({{upImgs.length}}/6)</div>
			</div>
		</div>
		
        <div class="c-t-center mt20">
            <button type="button" class="btn btn-white btn-size-m mr15" @click="cancelMedicalRecords">取消</button>
            <button type="button" class="btn btn-12B7F5 btn-size-m" @click="addMedicalRecords">保存</button>
        </div>
	</div>
		<!--查看图片-->
	<div id="outerdiv" style="position:fixed;top:0;left:0;background:rgba(0,0,0,0.7);z-index:2;width:100%;height:100%;display:none;">
		<div id="innerdiv" style="position:absolute;">
			<img id="bigimg" style="border:5px solid #fff;" src="" />
		</div>
	</div>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/jquery-2.2.4.js"></script>
        <script src="../../../plugins/layer/layer.min.js"></script>
		<script src="../../../plugins/toastr/toastr.min.js"></script>
		<script type="text/javascript" src="../../../plugins/element-ui/element-ui.js"></script>
        <script src="../../../js/bootstrap.min.js"></script>
        <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../api/http-request.js" type="text/javascript"></script>
		<script src="../../../api/recover_api.js" type="text/javascript"></script>
		<script type="text/javascript" src="../../../api/rehabilitation-api.js"></script>
		<script type="text/javascript">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType,
				docInfo = JSON.parse(window.localStorage.getItem('wlyyAgent'))
			var httpData=GetRequest()
			console.log('httpData:', httpData)
			function showSuccessMessage(msg) {
				layer.msg(msg, {
					icon: 1
				})
			}
			
			function showErrorMessage(msg) {
				layer.msg(msg, {
					icon: 5
				})
			}
			
			function showWarningMessage(msg) {
				layer.msg(msg, {
					icon: 2
				})
			}
			
			function showInfoMessage(msg) {
				layer.msg(msg, {
					icon: 6
				})
			}
			
			top.medicalRecordsVue = new Vue({
                el: "#app",
                data: {
					pickerOptions1: {
			        	disabledDate: function(time) {
			            	return time.getTime() < Date.now() - 8.64e7;
			        	}
					},
					admissionTime: '',
					dischargeTime: '',
					admittingDiagnosisValue: '',
					admittingDiagnosisObj: {},
					admittingTagsObj: {},
					admittingTags: [],//入院诊断标签
					dischargeDiagnosisValue: '',
					dischargeDiagnosisObj: {},
					dischargeTagsObj: {},
					dischargeTags: [],//出院诊断标签
					advice: '',
					doctorCode: docInfo.uid,
					patient: httpData.patient,
					patientName: decodeURI(httpData.patientName),
					medicalRecordsId: '',
					upImgs: [],
					upImgArr: [],
					imgData: {
						accept: 'image/gif, image/jpeg, image/png, image/jpg',
					},
					uploadType:'0',
                },
                mounted: function() {
					if(httpData['medicalRecordsId']){
						this.medicalRecordsId = httpData['medicalRecordsId']
						var curMedicalRecords = JSON.parse(window.localStorage.getItem('curMedicalRecords'))
						this.initMedicalRecords(curMedicalRecords)
					}
                },
                methods: {
                	handleClick(tab, event) {
                		this.uploadType = tab.index
				    },
					initMedicalRecords: function(model){
						var vm = this
						if(model.admissionTime){
							vm.uploadType = "0"
							vm.admissionTime = model.admissionTime
							vm.dischargeTime = model.dischargeTime
							vm.admittingTags = model.admittingDiagnosisName.split(',')
							var admittingCodeArr = model.admittingDiagnosis.split(',')
							$.each(vm.admittingTags, function(index, o){
								vm.admittingTagsObj[o] = admittingCodeArr[index]
							})
							vm.dischargeTags = model.dischargeDiagnosisName.split(',')
							var dischargeCodeArr = model.dischargeDiagnosis.split(',')
							$.each(vm.dischargeTags, function(index, o){
								vm.dischargeTagsObj[o] = dischargeCodeArr[index]
							})
							vm.advice = model.advice
						}else{
							vm.uploadType = "1"
							var imgList = model.images.split(',')||[]
							$.each(imgList, function(index, item){
								var obj = {
									baseUrl: httpRequest.getImgUrl(item)
								}
								vm.upImgs.push(obj)
							})
						}
					},
					handleSelect: function(res){
						
					},
					deleteImg: function(idx) {
						console.log(idx)
						this.upImgs.splice(idx, 1)
					},
					upLoadImgToBase64: function() {
						var vm = this;
						var img1 = event.target.files[0];
						var reader = new FileReader();
						var type = img1.type; //文件的类型，判断是否是图片  
						var size = img1.size; //文件的大小，判断图片的大小  
						if(this.imgData.accept.indexOf(type) == -1) {
							alert('请选择我们支持的图片格式！');
							return false;
						}
						if(size > 3145728) {
							alert('请选择3M以内的图片！');
							return false;
						}
						reader.readAsDataURL(img1);
						reader.onload = function(e) {
							vm.upImgs.push({
								baseUrl: e.target.result
							});
							vm.upImgArr.push(img1);
							vm.uploadImg(vm.upImgArr);
						}
					},
					//上传图片
					uploadImg: function(data) {
						var vm = this;
						var len = data.length;
						if(len==0){
							return
						}
						var file = data[len - 1];
						var formData = new FormData();
						formData.append('file', file);
						rehaAPI.upload(formData).then(function(res) {
							if(res.status == 200) {
								vm.upImgs[len - 1].img = res.data;
								data.pop();
								vm.$forceUpdate()
								vm.uploadImg(data);
							} else {
								layer.msg(res.msg, {
									icon: 5
								});
							}
						})
					},
					//添加诊断
					saveDiagnosisWrap: function(type){
						if(type=='admitting'){
							if(this.admittingDiagnosisValue.trim().length>0){
								if(this.admittingTagsObj[this.admittingDiagnosisValue]){
									showInfoMessage('该诊断已被添加')
									return false
								}
								this.admittingTagsObj[this.admittingDiagnosisValue] = this.admittingDiagnosisObj[this.admittingDiagnosisValue]
								this.admittingTags.push(this.admittingDiagnosisValue)
								this.admittingDiagnosisValue = ''
							}else{
								showErrorMessage('请先选择诊断内容')
							}
						} else {
							if(this.dischargeDiagnosisValue.trim().length>0){
								if(this.dischargeTagsObj[this.dischargeDiagnosisValue]){
									showInfoMessage('该诊断已被添加')
									return false
								}
								this.dischargeTagsObj[this.dischargeDiagnosisValue] = this.dischargeDiagnosisObj[this.dischargeDiagnosisValue]
								this.dischargeTags.push(this.dischargeDiagnosisValue)
								this.dischargeDiagnosisValue = ''
							}else{
								showErrorMessage('请先选择诊断内容')
							}
						}
					},
					//删除诊断标签
					closeTag: function(type, i){
						if(type=='admitting'){
							var key = this.admittingTags[i]
							delete this.admittingTagsObj[key]
							this.admittingTags.splice(i, 1)
						} else {
							var key = this.dischargeTags[i]
							delete this.dischargeTagsObj[key]
							this.dischargeTags.splice(i, 1)
						}
					},
					fetchAdmittingDiagnosis: function(queryString, cb){
						var vm = this
						vm.getIcd10Info('admitting',queryString, cb)
					},
					fetchDischargeDiagnosis: function(queryString, cb){
						var vm = this
						vm.getIcd10Info('discharge',queryString, cb)
					},
					getIcd10Info: function(type, queryString, cb){
						var vm = this,nameKey = queryString,
			    			params = {
								nameKey:nameKey,
								page: 1,
								pageSize: 10000
							}
						rehaAPI.getIcd10Info(params).then(function(res){
							if(res.status == 200) {
								var arr = []
								if(type=='admitting'){
									var admittingDiseaseData = $.each(res.data, function(i, o){
										vm.admittingDiagnosisObj[o.name]=o.code
										o.value = o.name								
										return o
									})
									arr = admittingDiseaseData
								} else if(type=='discharge') {
									var dischargeDiseaseData = $.each(res.data, function(i, o){
										vm.dischargeDiagnosisObj[o.name]=o.code
										o.value = o.name								
										return o
									})
									arr = dischargeDiseaseData
								}

								cb(arr);
							} else {
								showErrorMessage(res.msg);
							}
						})
					},
					cancelMedicalRecords: function(){
						top.recoverVue.closeMedicalRecords()
					},
					previewImg: function(url){
						imgShow("#outerdiv", "#innerdiv", "#bigimg", url);
					},
					addMedicalRecords: function(){
						var vm = this
						var jsonData = {}
						if(vm.uploadType == '0'){
							if(!this.admissionTime){
								showErrorMessage('请选择入院时间！')
								return false
							}
							if(!this.dischargeTime){
								showErrorMessage('请选择出院时间！')
								return false
							}
							if(this.admissionTime>this.dischargeTime){
	                			showWarningMessage("入院时间应小于出院时间！")
	                			return false;
	                		}
							if(this.admittingTags.length<=0){
								showErrorMessage('请添加入院诊断！')
								return false
							}
							if(this.dischargeTags.length<=0){
								showErrorMessage('请添加出院诊断！')
								return false
							}
							if(!this.advice||this.advice.trim().length<=0){
								showErrorMessage('请输入医嘱小结！')
								return false
							}
							
							var admittingDiagnosisArr=[], admittingDiagnosisNameArr=[],
								dischargeDiagnosisArr = [], dischargeDiagnosisNameArr = []
								$.each(vm.admittingTags, function(index, value){
									var code = vm.admittingTagsObj[value]
									admittingDiagnosisArr.push(code)
									admittingDiagnosisNameArr.push(value)
								})
								$.each(vm.dischargeTags, function(index, value){
									var code = vm.dischargeTagsObj[value]
									dischargeDiagnosisArr.push(code)
									dischargeDiagnosisNameArr.push(value)
								})
							jsonData = {
								admissionTime: new Date(this.admissionTime).format('yyyy-MM-dd HH:mm:ss'),
								dischargeTime: new Date(this.dischargeTime).format('yyyy-MM-dd HH:mm:ss'),
								admittingDiagnosis: admittingDiagnosisArr.join(','), // 入院诊断
								admittingDiagnosisName: admittingDiagnosisNameArr.join(','), //入院诊断名称
								dischargeDiagnosis: dischargeDiagnosisArr.join(','), // 出院诊断
								dischargeDiagnosisName: dischargeDiagnosisNameArr.join(','), // 出院诊断名称，多个用逗号
								advice: this.advice,
								images: ""
							}
						}
						if(vm.uploadType == '1'){
							if(vm.upImgs.length==0){
								showErrorMessage('请上传图片！')
								return false
							}
							var imgList=[];
							$.each(vm.upImgs, function(index, item){
								imgList.push(item.img)
							})
							jsonData = {
								admissionTime: "",
								dischargeTime: "",
								admittingDiagnosis: "", // 入院诊断
								admittingDiagnosisName: "", //入院诊断名称
								dischargeDiagnosis: "", // 出院诊断
								dischargeDiagnosisName: "", // 出院诊断名称，多个用逗号
								advice: "出院继续观察",
								images: imgList.join(',')
							}
						}
						var params = {
							doctorCode: vm.doctorCode,
							patient: vm.patient,
							patientName: vm.patientName,
							jsonData: JSON.stringify(jsonData)
						}
						if(vm.medicalRecordsId){
							params['id'] = vm.medicalRecordsId
						}
						// console.log('paramsparamsparamsparamsparams', jsonData)
						// return 
						var loading = layer.load(0, {shade: false})
						rehaAPI.createMedicalRecords(params).then(function(res){
							layer.close(loading)
							if(res.status==200){
								console.log('res.data', res.data)
								if(vm.medicalRecordsId){
									top.recoverVue.completeMedicalRecords('edit', res.data)
								} else {
									top.recoverVue.completeMedicalRecords('isNew', res.data)
								}
							}else{
								top.recoverVue.closeMedicalRecords()
								showErrorMessage(res.msg);
							}
							
						})
						
					}
                }
            })
			function imgShow(outerdiv, innerdiv, bigimg, src){
			//      var src = _this.attr("src");//获取当前点击的pimg元素中的src属性  
			$(bigimg).attr("src", src);//设置#bigimg元素的src属性  
				/*获取当前点击图片的真实大小，并显示弹出层及大图*/  
			$("<img/>").attr("src", src).load(function(){  
				var windowW = $(window).width();//获取当前窗口宽度  
				var windowH = $(window).height();//获取当前窗口高度  
				var realWidth = this.width;//获取图片真实宽度  
				var realHeight = this.height;//获取图片真实高度  
				var imgWidth, imgHeight;  
				var scale = 0.8;//缩放尺寸，当图片真实宽度和高度大于窗口宽度和高度时进行缩放  
					
				if(realHeight>windowH*scale) {//判断图片高度  
					imgHeight = windowH*scale;//如大于窗口高度，图片高度进行缩放  
					imgWidth = imgHeight/realHeight*realWidth;//等比例缩放宽度  
					if(imgWidth>windowW*scale) {//如宽度扔大于窗口宽度  
						imgWidth = windowW*scale;//再对宽度进行缩放  
					}  
				} else if(realWidth>windowW*scale) {//如图片高度合适，判断图片宽度  
					imgWidth = windowW*scale;//如大于窗口宽度，图片宽度进行缩放  
								imgHeight = imgWidth/realWidth*realHeight;//等比例缩放高度  
				} else {//如果图片真实高度和宽度都符合要求，高宽不变  
					imgWidth = realWidth;  
					imgHeight = realHeight;  
				}  
						$(bigimg).css("width",imgWidth);//以最终的宽度对图片缩放  
					
				var w = (windowW-imgWidth)/2;//计算图片与窗口左边距  
				var h = (windowH-imgHeight)/2;//计算图片与窗口上边距  
				$(innerdiv).css({"top":h, "left":w});//设置#innerdiv的top和left属性  
				$(outerdiv).fadeIn("fast");//淡入显示#outerdiv及.pimg  
			});  
			$(outerdiv).click(function(){//再次点击淡出消失弹出层  
				$(this).fadeOut("fast");  
			}); 
			}
		</script>
	</body>
</html>