raolu
/
PC-application


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465
							<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="renderer" content="webkit">
		<meta http-equiv="Cache-Control" content="no-siteapp">
		<meta http-equiv="X-UA-Compatible" content="IE=Edge">
		<meta name="referrer" content="no-referrer" />
		<title>服务记录</title>
		<link rel="shortcut icon" href="../../../favicon.ico">
		<link rel="stylesheet" type="text/css" href="../../../css/bootstrap.min.css" />
		<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" />
		<style type="text/css">
			body{background: #f5f5f5;}
			.flex-box{
			  display: -webkit-box;
			  display: -ms-flexbox;
			  display: flex;
			  -webkit-box-pack: center;
			      -ms-flex-pack: center;
			          justify-content: center;
			  -webkit-box-align: center;
			      -ms-flex-align: center;
			          align-userInfos: center;
			}
			.flex-box-item{
			  -webkit-box-flex: 1;
			      -ms-flex: 1;
			          flex: 1;
			}
			[v-cloak]{display: none;}
			.icon{width: 21px;height: 21px;vertical-align:middle;display: inline-block;background-size: auto 100%;background-position: center center;background-repeat: no-repeat;}
			.icon-submit{background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTVDOTU5OTIzMDlEMTFFOEEwQTNGOTRDM0NEODM3N0UiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTVDOTU5OTEzMDlEMTFFOEEwQTNGOTRDM0NEODM3N0UiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjlEMTc4Rjc3MEE0MTExRTg5RjBBRTlCRTRGQTk3M0MzIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjlEMTc4Rjc4MEE0MTExRTg5RjBBRTlCRTRGQTk3M0MzIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ohj6EQAAAWlJREFUeNqMkk0oBVEUx+88+dgKxcZCUiS5a56NhQUP6aWs9BYWk5WsiGQrYvVmQ7IhJEKJjQUvKTWWkvWTFMlCPl7jd+bNjGnydev3n3Nnzv/cufcew3EcFQxLl6LD0Af1UAK3kIFFOFKm7RpiIVMPegMp2IFuaIFReIU92CWvTNINd0VLJ4nXYQamqPqmosPSDegG5KDVcNLNVQTXsIBhUv02LF2B2rApvzoCdzCt/jceoU2MCVhhtY8/VqtBz0AOJyHGWrgMJcxDe8TUhJ5CFuIsko39UP+A5JRniqMncA4dmJ7865Ar0IHFtGXPY7CEaZXnoRwGJPn24hUrFOM2DDIpCpnn3ESlukDiId7lPFMnei/XUUlwBWk+jkf2VhAY8vNy9EK24jdAP5M1mIUJkt+/OdU6dOurAfxetbS02DI8u/vLH4bE1d6VSfFjGKDwgxFpculDE3qhEYq95si4RU1730/9FGAA8H55RsdHM3kAAAAASUVORK5CYII=);width: 14px;height: 14px;}
			.c-container{width: 500px;margin: 0 auto;padding: 10px 10px 0;overflow: hidden;background: #fff;height: 360px;position: relative;}
			.label-title{font-size: 15px;font-weight: bold;line-height: 1;}
			.label-list{margin: 0;padding: 10px 0 0 10px;font-size: 0;list-style: none;}
			.label-list li{width: 80px;text-align: center;margin-right: 10px;margin-bottom: 10px;cursor: not-allowed;border-radius: 10px;display: inline-block;font-size: 12px;height: 20px;line-height: 20px;border: 1px solid #c8c8c8;color: #c8c8c8;}
			.scroll-box{overflow-x: auto;height: 300px;}
			.label-list li.active,.label-list li.optional,.label-list li.luck{cursor: pointer;}
			.luck{color: #fff!important;}
			.bgc-12b7f5  li.active{background-color: #12B7F5;color: #fff;border-color: #12B7F5;}
			.bgc-12b7f5  li.optional,.bgc-12b7f5  li.luck{border-color: #12B7F5;color: #12B7F5;}
			.bgc-2DBE55 li.active{background-color: #2DBE55;color: #fff;border-color: #2DBE55;}
			.bgc-2DBE55 li.optional{border-color: #2DBE55;color: #2DBE55;}
			.bgc-ff3b30 li.active{background-color: #ff3b30;color: #fff;border-color: #ff3b30;}
			.bgc-ff3b30 li.optional,.bgc-ff3b30 li.luck{border-color: #ff3b30;color: #ff3b30;}
			.bgc-FF9630 li.active{background-color: #FF9630;color: #fff;border-color: #FF9630;}
			.bgc-FF9630 li.optional,.bgc-FF9630 li.luck{border-color: #FF9630;color: #FF9630;}
			.edit-value{background-color: transparent;border: none;border-bottom: 1px solid #FF9630;height: 15px;width: 50px;}
			.edit-value:hover,.edit-value:active,.edit-value:visited,.edit-value:focus{box-shadow: none;outline: none;}
			.add-lable{display: block;}
			.clear-fixed-bottom{height: 44px;}
			.btn-box{position: absolute;bottom: 0;left: 0;right: 0;background-color: #fff;}
			.btn-save{margin: 8px auto;border-color: #12b7f5;color: #333;padding: 4px 15px;background-color: #fff;}
		</style>
	</head>
	<body>
		<div class="c-container" id="app" v-cloak>
			<div class="scroll-box">
				<div class="label-row mb5">
					<div class="label-title">服务类型</div>
					<ul class="label-list bgc-12b7f5">
						<li :class="fw.className" @click="changeFW(fw.className,fw.code,index)" v-for="(fw,index) in fwlx">{{fw.name}}</li>
					</ul>
				</div>
				<div class="label-row mb5">
					<div class="label-title">健康情况</div>
					<ul class="label-list bgc-2DBE55">
						<li :class="jk.className" @click="changeJK(jk.className,jk.labelCode,index)" v-for="(jk,index) in jkqk">{{jk.labelName}}</li>
					</ul>
				</div>
				<div class="label-row mb5">
					<div class="label-title">疾病类型</div>
					<ul class="label-list bgc-ff3b30">
						<li :class="jb.className" @click="changeJB(jb.className,jb.labelCode,index)" v-for="(jb,index) in jblx">{{jb.labelName}}</li>
					</ul>
				</div>
				<div class="label-row">
					<div class="label-title">团队标签</div>
					<ul class="label-list bgc-FF9630">
						<li :class="td.className" v-for="(td,index) in tdbq" @click="changeTD(td.className,td.labelCode,index)">{{td.labelName}}</li>
						<li class="optional">
							<span class="add-lable" v-if="!isEdit" @click="isEdit=true">＋</span>
							<span v-else style="position: relative;top: -2px;">
								<input type="text" v-model="newLabel" class="edit-value" autofocus="autofocus" />
								<span class="icon icon-submit" @click="addTeamLabel"></span>
							</span>
						</li>
					</ul>
				</div>
			</div>
			
			<div class="clear-fixed-bottom">
				<div class="text-center btn-box">
					<button class="btn btn-save" @click="determine">确定</button>
				</div>
			</div>
		</div>
		<script type="text/javascript" src="../../../js/vue.js"></script>
		<script type="text/javascript" src="../../../js/jquery-2.2.4.js"></script>
		<script src="../../../js/util.js"></script>
		<script src="../../../api/http-request.js"></script>
		<script src="../../../js/underscore.js"></script>
		<script src="../../../api/temp-api.js"></script>
		<script type="text/javascript" src="../../../plugins/layer/layer.min.js" ></script>
		<script type="text/javascript">
			var httpData=GetRequest();
			(function(){
				new Vue({
					el:"#app",
					data:{
						patient:httpData['patient'],
						isEdit:false,//团队标签是够可编辑
						fwlx:[],//服务类型
						serverTypes:[],//已选择服务code
						jkqk:[],//健康情况
						jkqkSelect:[],//已选择健康情况
						jblx:[],//疾病类型
						jblxSelect:[],//疾病类型
						tdbq:[],//团队标签
						tdbqSelect:[],//团队标签
						teamCode:httpData['teamCode'],//医生团队code
						newLabel:'',//新团队label
					},
					mounted:function(){
						this.getSigndict()
						this.getPatient()
					},
					methods:{
						determine:function(){
							console.log(this.serverTypes)
							console.log(this.jkqkSelect)
							console.log(this.jblxSelect)
							console.log(this.tdbqSelect)
						},
//						添加团队label
						addTeamLabel:function(){
							var vm=this
							if(!vm.newLabel) return layer.msg('请输入标签命名', {icon: 5})
							var params={
								labelName:vm.newLabel, 
								teamCode:vm.teamCode
							}
							var loadding = layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
							tempAPI.addTeamLabel(params).then(function(res){
								layer.close(loadding);
								if(res.status==200){
									res.data[0] && ((res.data[0].className='optional'),vm.tdbq=vm.tdbq.concat(res.data));
									vm.isEdit=false;
									vm.newLabel='';
								}else{
									layer.msg(res.msg, {icon: 5})
								}
							})
						},
//						服务类型改变
						changeFW:function(cls,code,idx){
							var vm=this
							if(!cls || cls.indexOf('luck')!==-1) return ;
							var types=JSON.parse(JSON.stringify(vm.serverTypes));
							var _index=types.indexOf(code)
							console.log(code)
							if(_index===-1){
								vm.serverTypes.push(code);
								vm.fwlx[idx].className='active';
							}else{
								vm.serverTypes.splice(_index,1);
								var __index=-1
								if (code == 4) {
									vm.jblx[0].className='optional';
				                    (__index=vm.jblxSelect.indexOf('1'))!==-1 && vm.jblxSelect.splice(__index,1)
				                }
				                if (code == 5) {
				                	vm.jblx[1].className='optional';
				                    (__index=vm.jblxSelect.indexOf('2'))!==-1 && vm.jblxSelect.splice(__index,1)
				                }
				                if (code == 10) {
				                	vm.jblx[10].className='optional';
				                    (__index=vm.jblxSelect.indexOf('10'))!==-1 && vm.jblxSelect.splice(__index,1)
				                }
				                if (code == 11) {
				                	vm.jblx[9].className='optional';
				                    (__index=vm.jblxSelect.indexOf('9'))!==-1 && vm.jblxSelect.splice(__index,1)
				                }
				                if (code == 12) {
				                	vm.jblx[8].className='optional';
				                    (__index=vm.jblxSelect.indexOf('8'))!==-1 && vm.jblxSelect.splice(__index,1)
				                }
								vm.fwlx[idx].className='optional';
							}
						},
//						健康状况改变
						changeJK:function(cls,code,idx){
							var vm=this
							if(!cls || cls.indexOf('luck')!==-1) return ;
							var types=JSON.parse(JSON.stringify(vm.jkqkSelect));
							var _index=types.indexOf(code)
							if(_index===-1){
								for(var i in vm.jkqk){
									if(vm.jkqk[i].labelCode==vm.jkqkSelect[0]){
										vm.jkqk[i].className='optional';
										break
									}
								}
								vm.jkqkSelect=new Array(code);
								vm.jkqk[idx].className='active';
							}else{
								vm.jkqkSelect.splice(_index,1);
								vm.jkqk[idx].className='optional';
							}
						},
//						疾病类型改变
						changeJB:function(cls,code,idx){
							var vm=this
							if(!cls || cls.indexOf('luck')!==-1) return ;
							var types=JSON.parse(JSON.stringify(vm.jblxSelect));
							var _index=types.indexOf(code)
							if(_index===-1){
								vm.jblxSelect.push(code);
								vm.jblx[idx].className='active';
							}else{
								vm.jblxSelect.splice(_index,1);
								vm.jblx[idx].className='optional';
							}
						},
//						团队标签选择取消
						changeTD:function(cls,code,idx){3
							var vm=this
							var types=JSON.parse(JSON.stringify(vm.tdbqSelect));
							var _index=types.indexOf(code)
							if(_index===-1){
								vm.tdbqSelect.push(code);
								vm.tdbq[idx].className='active';
							}else{
								vm.tdbqSelect.splice(_index,1);
								vm.tdbq[idx].className='optional';
							}
						},
						getAllLabels:function(types){
							var vm=this
							tempAPI.allLabels({teamCode:vm.teamCode}).then(function(res){
								if(res.status==200){
									_.map(res.data || {},function(item,index){
										if(item.labelType==2){
											vm.jkqk.push(item)
										}else if(item.labelType==3){
											vm.jblx.push(item)
										}else if(item.labelType==4){
											item.className='optional'
											vm.tdbq.push(item)
										}
									})
									vm.getPatientLabel(types);//获取已选择类型（非服务类型）
								}
							})
						},
						getSigndict:function(){
							var vm=this
							tempAPI.getSigndict({teamCode:vm.teamCode}).then(function(res){
								if(res.status==200){
									vm.fwlx=res.data
//									vm.filterSer()
								}
							})
						},
						getPatient:function(){
							var vm=this;
							var data={
								patient:vm.patient
							}
							tempAPI.getPatient(data).then(function(res){
								if(res.status==200){
									var _typss=_.pluck(res.data.serverTypes || [],'server_type')
//									res.data && (vm.teamCode=res.data.jtAdminTeam);
									vm.getAllLabels(_typss)
								}else{
									layer.msg(res.msg, {icon: 5})
								}
							})
						},
						getPatientLabel:function(types){
							var vm=this
							var data={
								patient:vm.patient
							}
							tempAPI.patientLabel(data).then(function(res){
								if(res.status==200){
									var data=res.data
									if(data.length){
										var jkqkSelect=[],jblxSelect=[],tdbqSelect=[]
										_.map(data||{},function(item,index){
											if(item.labelType==2){
												jkqkSelect.push(item)
											}else if(item.labelType==3){
												jblxSelect.push(item)
											}else if(item.labelType==4){
												tdbqSelect.push(item)
											}
										})
										vm.jkqkSelect=_.pluck(jkqkSelect,'label')
										vm.jblxSelect=_.pluck(jblxSelect,'label')
										vm.tdbqSelect=_.pluck(tdbqSelect,'label')
										setTimeout(function(){											
											vm.serverTypes = types;//过滤时防止其他标签未加载完成就计算
										},100/60)
									}
								}else{
									layer.msg(res.msg, {icon: 5})
								}
							})
						},
						 // 普通1 老年3 高血4 糖尿5 孕妇6 儿童7 贫困8 计生9 重性10 残疾11 结核12
				        filterSer() {
				            var vm=this
				            var fwlx=JSON.parse(JSON.stringify(vm.fwlx))
				            vm.jkqk[0] && (vm.jkqk[0].className='optional');
				            _.map(vm.serverTypes, function(item, index) {
				                var code = item | 0;
				                var arr=[];
				                if (code === 1) {
				                    arr = [2, 3, 6, 7, 8, 9, 10]
				                }
				                if (code === 3) {
				                   	arr = [4, 5]
				                }
				                if (code === 4 || code === 5 || code === 9 || code === 10 || code === 11 || code === 12) {
				                    arr = [0]
				                    vm.jkqk[0] && (vm.jkqk[0].className='');
				                }
				                if (code === 7) {
				                    arr = [1, 4]
				                }
				                if (code === 6) {
				                    arr = [1, 5]
				                }
				                _.map(arr, function(it) {
				                	fwlx[it].className=''
				                })
				            })
				            for(var i in fwlx){
				            	for(var j in vm.serverTypes){
				            		if(fwlx[i].code==vm.serverTypes[j]){
				            			if(fwlx[i].className=='luck'){				            				
				            				fwlx[i].className='luck active'
				            			}else{
				            				fwlx[i].className='active'
				            			}
				            		}
				            	}
				            	if(fwlx[i].className==undefined) fwlx[i].className='optional'
				            }
							vm.fwlx=fwlx;
							vm.filterHea()
				        },
				        // 健康1 患病2 高危3 恢复4 未标注0
				        filterHea() {
				            var vm=this
				            var jkqk=JSON.parse(JSON.stringify(vm.jkqk))
				            _.map(vm.jkqkSelect, function(item, index) {
				                var code = item | 0
				                if (code === 1) {
				                    var arr = [1, 2, 3]
				                    _.map(arr, function(it, idx) {
				                        vm.jblx[it].className='';
				                    })
				                    vm.jblx=_.map(vm.jblx,function(it, idx){
				                    	it.className='';
				                    	return it;
				                    })
				                }
				            })
				            for(var i in jkqk){
				            	for(var j in vm.jkqkSelect){
				            		if(jkqk[i].labelCode==vm.jkqkSelect[j]){
				            			if(jkqk[i].className=='luck'){
				            				jkqk[i].className='luck active'
				            			}else{				            				
				            				jkqk[i].className='active'
				            			}
				            		}
				            	}
				            	if(jkqk[i].className==undefined) jkqk[i].className='optional'
				            }
				            vm.jkqk=jkqk
			        		vm.filterDea()
				        },
				        // 疾病类型
				        filterDea() {
				            var vm=this
				            var jblx=JSON.parse(JSON.stringify(vm.jblx))
				            _.map(vm.serverTypes, function(item, index) {
				                var code = item | 0;
				                if (code === 4) {
				                    jblx[0].className='luck active';
				                    vm.jblxSelect.indexOf('1')===-1 && vm.jblxSelect.push('1')
				                }
				                if (code === 5) {
				                    jblx[1].className='luck active';
				                    vm.jblxSelect.indexOf('2')===-1 && vm.jblxSelect.push('2')
				                }
				                if (code === 10) {
				                    jblx[10].className='luck active';
				                    vm.jblxSelect.indexOf('10')===-1 && vm.jblxSelect.push('10')
				                }
				                if (code === 11) {
				                    jblx[9].className='luck active';
				                    vm.jblxSelect.indexOf('9')===-1 && vm.jblxSelect.push('9')
				                }
				                if (code === 12) {
				                    jblx[8].className='luck active';
				                    vm.jblxSelect.indexOf('8')===-1 && vm.jblxSelect.push('8')
				                }
				            })
				            for(var i in jblx){
				            	for(var j in vm.jblxSelect){
				            		if(jblx[i].labelCode==vm.jblxSelect[j]){
				            			jblx[i].className=(jblx[i].className && jblx[i].className!='optional')?jblx[i].className:'active'
				            		}else{
				            			if(vm.jblxSelect.indexOf(jblx[i].labelCode)===-1)
				            				jblx[i].className && (jblx[i].className.indexOf('luck')!==-1) && jblx[i].className!='optional' && (jblx[i].className='');
				            		}
				            	}
				            	!vm.jblxSelect.length && (jblx[i].className='optional');
				            	jblx[i].className==undefined && (jblx[i].className='optional');
				            }
				            vm.jblx=jblx
				        },
				        filterTea:function(){
				        	var vm=this
				        	var jblx=vm.tdbq
				        	for(var i in jblx){
				            	for(var j in vm.tdbqSelect){
				            		if(jblx[i].labelCode==vm.tdbqSelect[j]){
				            			jblx[i].className=(jblx[i].className && jblx[i].className!='optional')?jblx[i].className:'active'
				            		}else{
				            			if(vm.tdbqSelect.indexOf(jblx[i].labelCode)===-1)
				            				jblx[i].className && (jblx[i].className.indexOf('luck')!==-1) && jblx[i].className!='optional' && (jblx[i].className='');
				            		}
				            	}
				            	!vm.tdbqSelect.length && (jblx[i].className='optional');
				            	jblx[i].className==undefined && (jblx[i].className='optional');
				            }
				        	vm.tdbq=jblx
				        },
					},
					watch:{
			        	serverTypes:function(val){
			        		this.filterSer()
			        	},
			        	jkqkSelect:function(){
			        		this.filterHea()
			        	},
			        	tdbqSelect:function(){
			        		this.filterTea()
			        	}
			        }
				})
			})();
		</script>
	</body>
</html>