raolu
/
PC-application


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486
							<!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>
        <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 class="pt10 flex ui-row mt10">
            <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',
					},
                },
                mounted: function() {
					if(httpData['medicalRecordsId']){
						this.medicalRecordsId = httpData['medicalRecordsId']
						var curMedicalRecords = JSON.parse(window.localStorage.getItem('curMedicalRecords'))
						this.initMedicalRecords(curMedicalRecords)
					}
                },
                methods: {
					initMedicalRecords: function(model){
						var vm = this
						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]
						})
						var imgList = model.images.split(',')||[]
						$.each(imgList, function(index, item){
							var obj = {
								baseUrl: httpRequest.getImgUrl(item)
							}
							vm.upImgs.push(obj)
						})
						vm.advice = model.advice
					},
					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 {
							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 = ''
							}
						}
					},
					//删除诊断标签
					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
						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)
							})
						var imgList=[];
						$.each(vm.upImgs, function(index, item){
							imgList.push(item.img)
						})
						var 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: 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>