raolu
/
PC-application


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321
							<!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 rel="stylesheet" type="text/css" href="../css/new_recover.css" />
		<link rel="stylesheet" type="text/css" href="../css/personal-manage.css" />
		<style>
			.content {height: calc(100% - 14px);}
		</style>
	</head>
	<body class="m0">
	<div id="app" class="c-333" v-cloak>
		<div class="content clearfix">
	        <div class="fl c-h100 w350 person_info c-border-r">
	        	<div class="plr5 c-h100">
		        	<h4 class="m0 pl10 lh40 c-border-b">个人基础信息</h4>
	    			<div class="bgc-f2fcfe mt10 ptb10 plr10">
	    				<div class="clearfix">
		    				<div class="fl w-100-66">
		    					<p class="m0 p0 mb10">
		    						<span class="c-999">姓名：</span>{{recoverPatInfo.patientInfo.patientName}}
		    						<span class="c-999 ml20">性别：</span>{{recoverPatInfo.patientInfo.sex == 1 ? "男" : "女"}}
		    						<span class="c-999 ml20">年龄：</span>{{recoverPatInfo.patientInfo.age}}岁
		    					</p>
		    					<p class="m0 p0 mb10">
		    						<span class="c-999">健康情况：</span>{{recoverPatInfo.patientInfo.healthyCondition}}
		    					</p>
		    					<p class="m0 p0 mb10">
		    						<span class="c-999">联系电话：</span><span class="c-12b7f5 cur-pit" v-if="isMobile" @click="changeStatu()">点击查看</span><span v-else>{{recoverPatInfo.patientInfo.mobile}}</span>
		    					</p>
		    				</div>
		    				<div class="fr set-photo">
		    					<img :src="setPatImg(recoverPatInfo.patientInfo.photo)" alt="居民头像" />
		    				</div>
	    				</div>
	    				<p class="m0 p0 mb10">
    						<span class="c-999">签约社区：</span>{{recoverPatInfo.patientInfo.signHospitalName}}
    					</p>
    					<p class="m0 p0">
    						<span class="c-999">康复机构：</span>{{recoverPatInfo.patientInfo.rehabilitationOrg}}
    					</p>
	    			</div>
	    			<h4 class="m0 pl10 lh40 c-border-b">服务医生</h4>
	    			<!--<div class="pt10 pb10" style="overflow: hidden; height: 190px;">-->
	    			<div class="pt10 pb10" style="overflow: hidden; height: calc(100% - 231px);">
		    			<ul class="p0 m0 c-h100" style="overflow: auto;">
		    				<li class="clearfix plr20 ptb10 doc-li" v-for="(docInfo, index) in recoverPatInfo.serviceDoctorList" :key="index">
		    					<div class="fl set-photo">
		    						<img :src="setPatImg(docInfo.doctorPhoto, 1)" alt="医生头像" />
		    					</div>
		    					<div class="fl ml10 lh18">
		    						<p class="m0 p0 c-f16">{{docInfo.doctorName}}</p>
		    						<p class="m0 p0 mt10 c-999">{{docInfo.type}}</p>
		    					</div>
		    					<div class="fl ml40 lh18">
		    						<p class="m0 p0">完成项目：<span class="c-orange">{{docInfo.finishedItem}}</span></p>
		    						<p class="m0 p0 mt10">服务次数：<span class="c-orange">{{docInfo.serviceCount}}</span></p>
		    					</div>
		    				</li>
		    			</ul>
	    			</div>
	    			<!--<h4 class="m0 pl10 lh40 c-border-b">出院小结</h4>
	    			<div class="ptb10" style="overflow: hidden; height: calc(100% - 481px);">
	    				<ul class="m0 p0 c-border b-r-3 c-h100" style="overflow: auto;">
	    					<li class="pt5 plr10">
	    						<p class="c-999 lh40 clearfix">
	    							<span class="fl">冠心病诊断</span>
	    							<span class="fr">2018-08-01</span>
	    						</p>
	    						<div class="bgc-f2fcfe plr5 ptb10" style="line-height: 20px;">
	    							&emsp;&emsp;这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容
	    						</div>
	    					</li>
	    				</ul>
	    			</div>-->
    			</div>
	        </div>
	        <div class="fl c-h100 w-100-350">
	        	<div class="fl w-100-300 c-h100">
	        		<div class="plr5">
		        		<h4 class="m0 pl10 lh40 c-border-b clearfix">康复计划<span class="fr w80 c-333 c-f12 c-t-center">进行中：{{recoverPatInfo.planUnderway}}</span><span class="fr w80 c-333 c-f12 c-t-center">已完成：{{recoverPatInfo.planFinish}}</span></h4>
		        		<div class="pb10" style="overflow: hidden; height: 230px;">
			    			<ul class="p0 m0 c-h100" style="overflow: auto;">
			    				<li class="clearfix plr5 ptb10 mt10 plan-li cur-pit c-border b-r-3" v-for="(plan, index) in recoverPatInfo.planList" :key="index" @click="jumpPlan(plan)">
			    					<div class="fl w300">
			    						<p class="p0 m0 lh22 clearfix">
			    							<span class="fl">{{plan.planTypeName}}</span>
			    							<span class="fr c-999">{{plan.time}}</span>
			    						</p>
			    						<div class="clearfix">
			    							<p class="fl w-100-78 bgc-c1c1c1 lh22 b-r-11 c-position-r c-t-center">
			    								<span class="c-position-a bgc-orange lh22 b-r-11 c-t-center c-fff" :style="{width: setPercent(plan), left: 0}"></span>
			    								<span class="c-position-r w-100 c-t-center">{{setPercent(plan)}}</span>
			    							</p>
			    							<span class="fr w60 c-999 lh22">{{plan.allFinishCount}}/{{plan.allCount}}</span>
			    						</div>
			    					</div>
			    					<div class="fr c-007cd9 lh40">{{plan.statusName}}</div>
			    				</li>
			    				<li class="ptb10 c-t-center" v-if="!recoverPatInfo.planList.length">暂无相关计划</li>
			    			</ul>
		    			</div>
	    			</div>
	    			<h4 class="m0 pl10 pr5 lh40 c-border-tb clearfix">康复相关记录<span class="fr w80 c-333 c-f12 c-t-center">已完成：{{finishData.planDetailFinish}}</span></h4>
	    			<div class="plr10" style="overflow: hidden; height: calc(100% - 323px);">
	    				<ul class="p0 m0 c-h100 c-999" style="overflow: auto;">
	    					<li class="clearfix cur-pit record-li" v-for="(plan, index) in planDetailList" @click="lookProject(plan)">
	    						<div class="fl w80 ptb10 c-t-right">
	    							<p class="p0 m0 lh18">{{plan.executeTime}}</p>
	    						</div>
	    						<div class="fl set-dianxian plr20 ptb10 clerfix">
	    							<span class="fl set-taday mt8 c-t-center c-fff" v-if="plan.istaDay">今</span>
	    							<span class="fl mlr5 mt13 set-row bgc-e1e1e1" v-else></span>
	    						</div>
	    						<div class="fl ptb10 w-100-220">
	    							<p class="p0 m0 lh18">{{plan.title}}</p>
	    							<p class="p0 m0 lh18 txt-ells">{{plan.content}}</p>
	    						</div>
	    						<div class="fr ptb10 w60 c-t-center">
	    							<p class="p0 m0 lh18">已完成</p>
	    							<p class="p0 m0 lh18">查看</p>
	    						</div>
	    					</li>
	    					<li class="plr20">
	    						<div class="c-border lh40 b-r-3 c-t-center cur-pit" v-if="isFinishMore" @click="addPage()">点击查看更早时间</div>
	    						<!--<div class="c-border lh40 b-r-3 c-t-center" v-else>没有更多了</div>-->
	    					</li>
	    				</ul>
	    			</div>
	        	</div>
	        	<div class="fr w300 c-h100 c-border-l">
	        		<div class="plr5 c-h100">
	        			<h4 class="m0 pl10 pr5 lh40 c-border-b clearfix">就诊记录</h4>
	        			<div style="overflow: hidden; height: calc(100% - 41px);">
	        				<ul class="c-h100 p0 m0" style="overflow: auto;">
	        					<li class="clearfix" v-for="(record, index) in seeRecord" :key="index">
	        						<div class="fl set-dianxian h73 plr10 pt20 clerfix">
	    								<span class="fl mlr5 set-row bgc-red" v-if="record.eventType == 2"></span>
	    								<span class="fl mlr5 set-row bgc-green" v-if="record.eventType == 3"></span>
	    								<span class="fl mlr5 set-row bgc-orange" v-if="record.eventType == 1"></span>
	    							</div>
	    							<div class="fl w-100-60 pt15">
		    							<div class=" c-border b-r-3">
		    								<p class="m0 p0 plr5 c-fff bgc-red lh22 clearfix" v-if="record.eventType == 2">住院<span class="fr">{{record.eventDate}}</span></p>
		    								<p class="m0 p0 plr5 c-fff bgc-green lh22 clearfix" v-if="record.eventType == 3">体检<span class="fr">{{record.eventDate}}</span></p>
		    								<p class="m0 p0 plr5 c-fff bgc-orange lh22 clearfix" v-if="record.eventType == 1">门诊<span class="fr">{{record.eventDate}}</span></p>
		    								<p class="m0 p0 plr5 pt5 lh22">{{record.dianosis}}</p>
		    								<p class="m0 p0 pr5 pb5 pl20 lh22 set-hospital">{{record.orgName}}</p>
		    							</div>
	    							</div>
	        					</li>
	        					<li class="c-t-center ptb10" v-if="!seeRecord.length">无就诊记录</li>
	        				</ul>
	        			</div>
	        		</div>
	        	</div>
		        </div>
	        </div>
	    </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="../../../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">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType
			var httpData=GetRequest()
			
			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
				})
			}
			var nowDate = new Date().format("yyyy/MM/dd")
			
			recoverVue = new Vue({
                el: "#app",
                data: {
                	isMobile: true,
                	recoverPatInfo: null,
                	finishData: null,
                	seeRecord: [],
                	planDetailList: [],
                	isFinishMore: false,
                	page: 1,
                	eventPage: 1
                },
                mounted: function() {
                	this.patientRehabilitationDetail()
                	this.recentPlanDetailRecord()
                	this.archivesEvent()
                },
                methods: {
                	changeStatu: function() {
                		this.isMobile = false
                	},
                	jumpPlan: function(plan) {
                		location.href = "../../rehabilitation/html/rehabilitation_management.html?planId=" + plan.planId
                	},
					lookProject: function(obj) {
						layer.open({
							type: 2,
							area: ['600px', '500px'],
							shade: 0.5,
							title: '服务项目内容',
							closeBtn: 1,
							shift: 5,
							shadeClose: false, //点击遮罩关闭层
							content: "project-detail.html?planId=" + obj.id
						});
					},
					patientRehabilitationDetail: function() {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patientCode: httpData.patientCode || "e040dd6814b648ceb3ba8d8a04f9f22c"
			    			}
						recoverAPI.patientRehabilitationDetail(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.recoverPatInfo = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
			    	recentPlanDetailRecord: function() {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patientCode: httpData.patientCode || "e040dd6814b648ceb3ba8d8a04f9f22c",
			    				page: vm.eventPage,
			    				pageSize: 10
			    			}
						recoverAPI.recentPlanDetailRecord(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.finishData = res.data
								vm.planDetailList = vm.planDetailList.concat(res.data.planDetailList)
								vm.planDetailList = $.each(vm.planDetailList, function(index, o) {
									if(nowDate == o.executeTime.split(" ")[0]) {
										o.istaDay = true
									}
									return o
								});
								if(vm.finishData.planDetailList >= 10) {
									vm.isFinishMore = true
								}
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
			    	archivesEvent: function() {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patient: httpData.patientCode || "e040dd6814b648ceb3ba8d8a04f9f22c",
			    				page: vm.page,
			    				pageSize: 20
			    			}
						recoverAPI.archivesEvent(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.seeRecord = vm.seeRecord.concat(res.data)
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
			    	setPatImg: function(src, doc) {
			    		if(!src) {
			    			if(doc) {
			    				return "../../../images/d-default.png"
			    			} else {
			    				return "../../../images/p-female.png"
			    			}
			    		} else {
			    			var str = httpRequest.getImgUrl(src);
			    			return str
			    		}
			    	},
			    	addPage: function() {
			    		this.page++;
			    		this.recentPlanDetailRecord()
			    	},
			    	setPercent: function(plan) {
			    		return Math.floor(plan.allFinishCount / plan.allCount * 100) + "%"
			    	}
                }
            })
		</script>
	</body>
</html>