<!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" type="text/css" href="../css/select-patient.css" />
	</head>
	<body class="m0">
	<div id="app" style="height: 100%;" v-cloak>
		<div class="plr20 ptb10 c-border-b">
			<div class="clearfix c-border">
				<input class="fl search-input plr10" type="text" placeholder="输入居民姓名或身份证号码" v-model="keyword" />
				<span class="fr search-btn" @click="getPatientInfoByDoctor()"></span>
			</div>
		</div>
		<div style="overflow: hidden; height: calc(100% - 59px);">
			<ul class="pat-list p0 m0" style="overflow: auto; height: 100%;" v-if="isSearch">
				<li class="clearfix lh40 plr20 ptb10" v-for="(pati, index) in patiList" :key="index" @click="getPatientInfo(pati)">
					<div class="fl set-img">
						<img :src="setPatImg(pati.photo)" alt="居民头像" />
					</div>
					<span class="fl ml20 mr10 c-333 c-f16">{{pati.patientName}}</span>
					<span class="fl c-999">（{{pati.sex}}&emsp;{{pati.age}}岁）</span>
				</li>
				<li v-if="!patiList.length" class="c-t-center pt40 set-no-hover">无查询数据</li>
			</ul>
			<ul class="label-list p0 m0" style="overflow: auto; height: 100%;" v-if="isLabel">
				<li v-for="(label, index) in labelList" :key="index">
					<h4 class="c-border-b m0 lh40 pl10 pr50 cur-pit clearfix" @click="selectIndexFn(index, label)" :class="{'active':selectIndex == index}">{{label.labelName}}<span class="fr">{{label.count}}</span></h4>
					<ul class="pat-list p0 m0 c-border-b" v-if="selectIndex == index">
						<li class="clearfix lh40 plr20 ptb10 cur-pit" v-for="(pati, ind) in patiList" @click="getPatientInfo(pati)">
							<div class="fl set-img">
								<img :src="setPatImg(pati.photo)" alt="居民头像" />
							</div>
							<span class="fl ml20 mr10 c-333 c-f16">{{pati.patientName}}</span>
							<span class="fl c-999">（{{pati.sex}}&emsp;{{pati.age == 0 ? "<1" : pati.age}}岁）</span>
						</li>
					</ul>
				</li>
			</ul>
			<div class="selected-patient c-h100" v-if="!isSearch && !isLabel">
				<div class="clearfix plr20 ptb10">
					<div class="fl set-img">
						<img :src="setPatImg(patiInfo.photo)" alt="居民头像" />
					</div>
					<div class="fl ml10 set-txt c-999 clearfix">
						<div class="m0 lh22 clearfix"><span class="c-333 c-f16">{{patiInfo.patientName}}</span>&emsp;{{patiInfo.sex}}&emsp;{{patiInfo.age}}岁<p class="fr m0 p0 c-f14 mr20 c-333">出院医嘱：<span>0</span></p></div>
						<p class="m0">身份证号： <span class="c-333 c-f14">{{patiInfo.idcard}}</span></p>
					</div>
				</div>
				<div class="result plr20" style="overflow: hidden; height: calc(100% - 60px);">
					<div class="no-result c-t-center c-border-t ptb20" v-if="true">
						<img src="../images/wushuju01_img.png" alt="" />
						<p class="c-999 mt10 mb20">暂无相关信息</p>
						<span class="c-fff btn cur-pit plr10 ptb5 bgc-12b7f5 b-r-3" @click="selectPatient()">同步居民</span>
					</div>
					<ul class="p0 m0 c-333 c-border-t" style="overflow: auto; height: 100%;" v-if="false">
						<li class="ptb10 c-border-b">
							<div class="clearfix">
								<p class="fl p0 m0 w-100-70"><span class="c-999">出院医嘱：</span>这是出院医学征服世界爱的色放卡大V阿大V撒<span class="ml10 c-12b7f5 txt-underline cur-pit" @click="showLayer()">查看</span></p>
								<span class="fr w40 c-t-center c-fff btn cur-pit plr10 ptb5 bgc-12b7f5 b-r-3" @click="selectPatient()">提取</span>
							</div>
							<div class="clearfix mt5">
								<p class="fl m0"><span class="c-999">主治医生：</span>名字</p>
								<p class="fr m0"><span class="c-999">出院时间：</span>2018-08-28</p>
							</div>
						</li>
					</ul>
				</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="../../../plugins/toastr/toastr.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,
				doctorCode = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).uid
			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
				})
			}
			
			selectVue = new Vue({
                el: "#app",
                data: {
                	page: 1,
                	keyword: null,
                	selectIndex: null,
                	labelList: [],
                	isLabel: true,
                	isSearch: false,
                	patiList: [],
                	patiInfo: null
                },
                mounted: function() {
                	this.findLabelAndPatientCountByDoctor()
                },
                methods: {
                	showLayer: function() {
                		top.layer.open({
                			type: 1,
							area: ['400px', '500px'],
							shade: 0.5,
							title: "出院医嘱",
							closeBtn: 1,
							shift: 5,
							shadeClose: true, //点击遮罩关闭层
							content: "<div class='plr10 ptb10'>&emsp;&emsp;" + "这是医嘱大的大爱大" + "</div>"
                		})
                	},
                	findLabelAndPatientCountByDoctor: function() {
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				doctor: doctorCode
			    			}
						recoverAPI.findLabelAndPatientCountByDoctor(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.labelList = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
                	},
                	getPatientInfoByDoctor: function(label) {
                		if(!label && !this.keyword) {
							this.selectIndex = null
							this.isSearch = false
							this.isLabel = true
							return false
						}
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				doctor: doctorCode,
								patientInfo: this.keyword, // 居民身份证或者姓名
								disease: label ? label.label : "",
								page: vm.page,
								size: 50
			    			}
						recoverAPI.getPatientInfoByDoctor(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.patiList = res.data
								if(!label) {
									vm.isSearch = true
									vm.isLabel = false
								}
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
                	getPatientInfo: function(pati) {
                		this.isSearch = false
                		this.isLabel = false
                		this.patiInfo = pati
                	},
                	selectIndexFn: function(index, label) {
                		if(this.selectIndex == index) {
                			this.selectIndex = null
                		} else {
                			this.selectIndex = index
                			this.getPatientInfoByDoctor(label)
                		}
                	},
                	selectPatient: function() {
                		top.recoverVue.selectPatientOk(this.patiInfo)
                		top.layer.close(top.selectPatientIndex)
                	},
                	setPatImg: function(src) {
			    		if(!src) {
			    			return "../../../images/p-female.png"
			    		} else {
			    			var str = httpRequest.getImgUrl(src);
			    			return str
			    		}
			    	}
                }
            })
		</script>
	</body>
</html>
