Browse Source

我的居民功能
我的居民

linehang 7 years ago
parent
commit
f808952f2e
2 changed files with 134 additions and 503 deletions
  1. 14 72
      html/home/html/huanzhe.html
  2. 120 431
      html/home/js/huanzhe.js

+ 14 - 72
html/home/html/huanzhe.html

@ -14,92 +14,35 @@
	</head>
	<body>
		<div class="lin-mask"></div>
		<ul class="lin-sel-group">
			
		</ul>
		<div class="h45">
			<div class="demo-comtop">
				<a class="mui-action-back"></a>
				<a class="mui-action-back" style="display: none;"></a>
				<h1>我的居民</h1>
			</div>
		</div>
		<div id="wrapper" class="mui-scroll-wrapper">
          <div class="mui-scroll">
				  <div class="c-main " style="margin-top:45px;">
					<!--<div class="lin-search searchbar">
						<div class="c-f12 search-input">
							<img src="../../../images/sousuo_icon.png" />
							搜索居民
						</div>
					</div>
					<div id="top_msg_bar" >
						您有<span id="unassigned_num"></span>个居民待分配健管师。<a id="handle_link" href="javascript:void(0)">点击处理</a>
						<img class="close-btn" src="../images/guanbi_btn.png"></img>
					</div>
					<div id="group_label_list">
						 <ul class="c-blocks-4">
					        <li class="group-item" data-type="2" style="width:20%"><img src="../images/jiankangqingkuang_icon.png"></img><div class="item-label">健康情况</div></li>
					        <li class="group-item" data-type="3" style="width:20%"><img src="../images/jibingleixing_icon.png"></img><div class="item-label">疾病类型</div></li>
					        <li class="group-item" data-type="4" style="width:20%"><img src="../images/icon_tuanduibiaoqian.png"></img><div class="item-label">团队标签</div></li>
					        <li class="group-qytx" style="width:20%"><img src="../images/tijiantixing_icon.png"></img><div class="item-label">体检提醒</div></li>
					        <li class="group-item" data-type="9" style="width:20%"><img src="../images/icon_qianyuedaoqi.png"></img><div class="item-label">签约到期</div></li>
					    </ul>
					</div>
					
					<div class="mid-bar">
						<div class="div-wfp c-hide">
							<img src="../images/weifenpei_icon.png" />未分配健管师居民<label>(45人)</label>
						</div>
						
						<div class="div-qbjm c-hide">
							<img src="../images/guanli_icon.png" />管理团队所有签约居民<label>(0人)</label>
						</div>
					</div>
					
					<div id="search_result" class="patient c-border-t" style="position: relative;">
						<div class="my-work-secflo" id="pati_list">
				
						</div>
					</div>
					<div id="no_result_wrap" class="c-hide">
						<img class="no-result-img" src="../../../images/shujuweikong_img.png" />
						<div class="f-fs14 c-323232 c-t-center">抱歉,暂未找到符合条件的结果。</div>
					</div>-->
					<ul class="n-list" id="n-list">
		<div id="patient_list_wrap">
			<div class="mui-scroll-wrapper" style="top:45px;">
				<div class="list-wrap mui-scroll">
					<ul class="n-list" id="pati_list">
					</ul>
				</div>
			</div>
        </div>
		
		<script type="text/html" id="teams_tmpl">
			{{each data as v i}}
			<li class="{{v.id,i | setChecked}}" data-code="{{v.id}}" data-name="{{v.name}}" data-leaderCode="{{v.leaderCode}}"><img src="../images/checked_blue.png"><label>{{v.name}}</label></li>
			{{/each}}
		</script>
		<script type="text/html" id="pati_group_tmpl">
			{{each list as val i}}
				<div class="patient-list" data-group="{{val.labelCode}}" data-amount="{{val.amount}}" data-page="1">
					<div class="patient-type">
						<div class="arrow "> <i class="ui-arrow ui-arrow-b"></i></div>
						<h3 class="t c-f16">{{val.labelName}}<em class="c-ccc ml10 c-f10">({{val.focusAmount}}/{{val.amount}})</em></h3>
					</div>
					<ul class="n-list">
					</ul>
					<div class="load-more c-hide">点击加载更多</div>
				</div>
			{{/each}}
		</script>
		</div>
		<div id="no_result_wrap" class="c-hide">
			<img class="no-result-img" src="../../../images/shujuweikong_img.png" />
			<div class="f-fs14 c-323232 c-t-center">抱歉,暂未找到符合条件的结果。</div>
		</div>
		
		<script type="text/html" id="pati_list_tmpl">
			{{each list as value j}}
			<li class="n-list-link list-arrow-r n-list-cover patient-list-item" data-patient-code="{{value.code}}"><!-- data-json="{{value.jsonStr}}"-->
			<li class="n-list-link list-arrow-r n-list-cover" data-patient-code="{{value.code}}">
				<div class="patient-face patient-face-new">
					<img src="{{value.photo,value.sex | setPatiPic}}"> 
					<img src="{{value.photo}}"> 
				</div>
				<div class="n-list-info">
					<h4 class="c-nowrap c-f16 mt5">{{value.name}}
						<em class="mb-em">({{value.sex | setSex}} {{value.age | setAge}}岁)</em>
						<em class="mb-em">({{value.sex | setSex}} {{value.age | setAge}}岁 )</em>
					</h4>
					<div class="mj-flex">
						{{if value.isWX}}
@ -111,7 +54,6 @@
				</div>
			</li>
			{{/each}}
			<li class="load-more">点击加载更多</li>
		</script>
		
		<script type="text/javascript" src="../../../js/jquery/2.1.3/jquery.js"></script>

+ 120 - 431
html/home/js/huanzhe.js

@ -1,483 +1,172 @@
// 基本信息(包括userAgent)
// TODO 临时构造plus对象,使得能够在浏览器中进行调试
// var plus = null;
	// 基本信息(包括userAgent、上个页面传递的数据)
var baseInfo = null,
	// 基础环境信息(包括当前webview)
	baseEnv = null;
var $patientListWrapper = $('#patient_list_wrap'),
	$patientList = $('#pati_list'),
	// 搜索无结果时显示
	$noResultWrap = $('#no_result_wrap');
// 分页查询当前页数
var curPage = 0,
 	pageSize = 5,
 	myScroll = null,
 	hasMore = true;
	
// 获取基本信息(包括userAgent、上个页面传递的数据)
var getBaseInfoPromise = function() {
		// 登录的相关信息
	var userAgent = plus && JSON.parse(plus.storage.getItem("userAgent"))
	return {
		userAgent: userAgent
	}
},
// 获取基础环境信息
getBaseEnvPromise = function () {
	
	// 患者分组列表
	$patiList = $('#n-list'),
	
	$wfp = $('.div-wfp'),
	$qbjm = $('.div-qbjm'),
	$back = $('.mui-action-back');
	var self;
	var docInfo;
	var myScroll;
function initScroller(){
	var env = {
		webview: plus&&plus.webview.currentWebview()
	};
	return Promise.resolve().then(function(res) {
		return env;
	});
},
// 分页查询列表
searchByPaging = function (isRefresh) {
	 curPage = isRefresh ? 0 : curPage+1;
	var url = "/doctor/concern/getConcernPatients",
	params = { page:curPage,pageSize:pageSize};
	getReqPromise(url,params,'GET').then(function(res){
		var data = res.data;
		if(!data || !data.length) {
			$patientListWrapper.hide();
			$noResultWrap.show();
		} else {
			$noResultWrap.hide();
			$patientListWrapper.show();
		}
		 if(isRefresh){
            myScroll.refresh(true);
            $patientList.empty().append(template("pati_list_tmpl", {list: data}));
        }else{
            $patientList.append(template('pati_list_tmpl', {list: data}));
        }
         if(data.length < pageSize){
            hasMore = false;
            myScroll.endPullUpToRefresh(!hasMore);
        }else{
            hasMore = true;
        }
	}).catch(function(e) {
		console && console.error(e)
	});
},
// 滚动条分页实例初始化
initScroller = function() {
    //阻尼系数
    var deceleration = mui.os.ios?0.003:0.0009;
    mui('.mui-scroll-wrapper').scroll({
        scrollX: true,
        bounce: false,
        indicators: true, //是否显示滚动条
        deceleration:deceleration
    });
    
    myScroll = mui(".mui-scroll").pullToRefresh({
   myScroll =  mui(".mui-scroll").pullToRefresh({
    	up: {
            callback: function(){
                var self = this;
                setTimeout(function() {
                    searchByPaging();
                    self.endPullUpToRefresh(!hasMore);
                }, 1000);
            }
        },
        down: {
            callback: function() {
                var self = this;
                setTimeout(function() {
                    $('.lin-mask').hide();
					$('.lin-sel-group').hide();
					refreshPage();
                    searchByPaging(true);
                    self.endPullDownToRefresh();
                    showTopMsgBar();
                }, 1000);
            }
        },
        scrollLeft: function(){
            xScroll = true;
        }
    });
}
	
// 获取登录相关信息
var getBaseInfo = function() {
		// 登录的相关信息
	var userAgent = JSON.parse(plus.storage.getItem("userAgent"))
	return {
		userAgent: userAgent,
		teamInfo: JSON.parse(plus.storage.getItem("teamInfo"))
	}
},
// 获取基础环境信息
getBaseEnvPromise = function () {
	self = plus.webview.currentWebview();
	docInfo = JSON.parse(plus.storage.getItem("docInfo"));
	var env = {
		webview: plus&&plus.webview.currentWebview()
	};
	return Promise.resolve().then(function(res) {
		return env;
	});
},
updateLastTeamId = function(id) {
	lastTeamId = id;
	plus.storage.setItem("selectedTeamId",lastTeamId+"");
},
// 初始化选择团队
//initTeams = function (){
	
	// 判断缓存中的团队是否在团队列表中
//	var isExist = _.some(baseInfo.teamInfo.data,function(t) {
//		return lastTeamId == t.id
//	});
//	
//	if(!isExist) {
//		updateLastTeamId(baseInfo.teamInfo.data[0].id);
//	}
	
	
//	template.helper("setChecked", function(id, i) {
//		if(lastTeamId && lastTeamId==id)
//			return "checked";
//		return "";
//	});
//
//	$('.lin-sel-group').html(template('teams_tmpl', baseInfo.teamInfo));
//
//	var $selected;
//	if(!lastTeamId && baseInfo.teamInfo.data && baseInfo.teamInfo.data.length) {
//		updateLastTeamId(baseInfo.teamInfo.data[0].id);
//		setTitle(baseInfo.teamInfo.data[0].name);
//		$selected = $('.lin-sel-group li').eq(0);
//		$selected.addClass("checked");
//	} else {
//		$selected = $('.lin-sel-group').find("li.checked");
//		setTitle($selected.attr("data-name"));
//	}
//	getTeamPatientCount();
//	$qbjm.toggle($selected.attr('data-leadercode') == docInfo.code);
//},
//getTeamPatientCount = function(){
//	sendPost("/doctor/patient_label_info/team_amount", {teamCode: lastTeamId}, null, function(res){
//		if(res.status == 200){
//			$('.div-qbjm label').html("("+ res.data.focusAmount +"/"+ res.data.amount+")");
//		} else {
//			mui.toast("获取居民总数失败!");
//		}
//	},'POST','',true)
//},
//setTitle = function(title){
//	if(self.type == 1)
//		$selectedTeamName.html(title + "签约居民管理");
//	else
//		$selectedTeamName.html(title + '签约居民<label class="lin-down-arrow"></label>');
//},
//显示选中的分组
//showGroup = function(type) {
//	if(type){
//		activeGroupType = type;
//	} 
//},
showGroupSel = function() {
	if(self.type == 1)
		return;
	var isShow = isShow || $('.lin-mask:hidden').length != 0;
	$('.lin-mask').toggle(isShow);
	$('.lin-sel-group').toggle(isShow);
},
// 初始化画面患者分组列表
initPatientListByGroup = function() {
	plus.nativeUI.showWaiting();
//	var url = self.type == 1 ? "/doctor/patient_label_info/label_team_amount" : "doctor/patient_label_info/label_patient_amount";
	var queryType = self.type == 1 ? "POST" : "GET";
	var url = self.type == 1 ? "/doctor/patient_label_info/label_team_amount" : "/doctor/concern/getConcernPatients";
	getReqPromise(url,{page: 0, pageSize: 10},queryType,true)
	.then(function(res) {
		if(res.status == 200) {
			var data = _.filter(res.data,function(o) {
				return o.labelCode != 0 || (o.labelCode==0 && o.amount > 0);
			});
			data=[
					{
			      "code":"915cc456-5b1d-11e6-8344-fa163e8aee56",
			      "name":"ceshi",
			      "photo":"../../../images/p-female.png",
			      "sex":1,
			      "age":76,
			      "isWX":true,
			      "concernTime":"2018-04-04 15:17:52"
		   	 	},
					{
			      "code":"915cc456-5b1d-11e6-8344-fa163e8aee56",
			      "name":"ceshi",
			      "photo":"../../../images/p-female.png",
			      "sex":1,
			      "age":76,
			      "isWX":false,
			      "concernTime":"2018-04-04 15:17:52"
		   	 	}
			]
			console.log(data)
			if(data && data.length) {
//				var html = template("pati_group_tmpl", {list: data});
				var html = template("pati_list_tmpl", {list: data});
				$('ul.n-list').empty().append(html);
//				if(activeGroupType) {
//					$patiList.find('.patient-list[data-group="'+activeGroupType+'"]').trigger("tap");
//				}
				$noResultWrap.hide();
				$searchtResult.show(); 
			} else {
				$searchtResult.hide();
				$noResultWrap.show();
			}
		}
		plus.nativeUI.closeWaiting();
	}).catch(function(e){ 
		plus.nativeUI.closeWaiting();
		console && console.error(e) });;
},
showLoadMore = function($el) {
	var amount = $el.attr("data-amount"),
		loaded = $el.find('ul.n-list li').length,
		$loadMore = $el.find('.load-more');
	if(amount>loaded) {
		$loadMore.show();
	} else {
		$loadMore.hide();
	}
},
//initPatientListByGroup = function(code) {
////	var url = self.type == 1 ? "doctor/patient_label_info/team_patient" : "doctor/patient_label_info/patients_by_label";
//	var queryType = self.type == 1 ? "POST" : "GET";
//	var url = self.type == 1 ? "/doctor/patient_label_info/label_team_amount" : "/doctor/concern/getConcernPatients";
//	
//	plus.nativeUI.showWaiting();
//	var $group = $patiList.find('.patient-list[data-group="'+code+'"]');
//	getReqPromise(url, {labelType:1, teamCode: lastTeamId, labelCode: code, page: 0, pagesize: 10},queryType,true)
//	.then(function(res) {
//		if(res.status == 200) {
//			var html = template("pati_list_tmpl", {list: _.map(res.data,function(o) {
//					o.jsonStr = JSON.stringify(o);
//					return o;
//				})});
//			$group.find('ul.n-list').empty().append(html);
//			showLoadMore($group);
//		} else {
//			plus.nativeUI.toast(res.msg);
//		}
//		plus.nativeUI.closeWaiting();
//	}).catch(function(e){ console && console.error(e); plus.nativeUI.closeWaiting(); });
//},
togglePatientListShow = function($el) {
	var isOpen = $el.hasClass("current"),
		$list = $el.find('ul.n-list'),
		$siblings = $el.siblings('.patient-list');
	if(isOpen) {
		$el.removeClass("current");
		$list.hide();
		$el.find('.load-more').hide();
	} else {
		$el.addClass("current");
		showLoadMore($el);
		$siblings.removeClass('current').find("ul.n-list").hide();
		$siblings.find('.load-more').hide();
		$list.show();
	}
	return isOpen;
},
showTopMsgBar = function() {
	if(baseEnv.webview.message){//“转发给”功能,需要返回按钮
		return false;
	}
	var leadCode =  $(".lin-sel-group li.checked").attr("data-leaderCode");
	$qbjm.toggle(leadCode==docInfo.code);
	
	if($.trim(leadCode) == $.trim(baseInfo.userAgent.uid)) {
		getReqPromise("doctor/family_contract/findNoHealthSignFamilyNum",{doctor: leadCode, teamCode: lastTeamId},'POST',true)
		.then(function(res){
			if(res.status == 200) {
				if(parseInt(res.data.num)) {
					$('.div-wfp label').html("("+ res.data.num +")");
					$wfp.show();
				} else {
					$wfp.hide();
				}
			}
		}).catch(function(e){ console && console.error(e); plus.nativeUI.closeWaiting(); });
	} else {
		$wfp.hide();
	}
},
refreshPage = function(){
	baseInfo = getBaseInfo();
	lastTeamId = plus.storage.getItem("selectedTeamId");
	initPatientListByGroup();
//	getTeamPatientCount();
},
// 绑定页面事件
bindEvents = function () {
	
	$patiList.on('tap','.load-more',function() {
		console.log("你点到了")
		plus.nativeUI.showWaiting();
			page = $('ul.n-list').length/10 | 0;
			var queryType = self.type == 1 ? "POST" : "GET";
			var url = self.type == 1 ? "/doctor/patient_label_info/label_team_amount" : "/doctor/concern/getConcernPatients";
		
			getReqPromise(url,{labelType: 1,labelCode: code, teamCode: lastTeamId, page: page + 1, pagesize: 50},'POST',true)
			.then(function(res) {
				if(res.status == 200) {
					var html = template("pati_list_tmpl", {list: _.map(res.data,function(o) {
						o.jsonStr = JSON.stringify(o);
						return o;
					})});
					$('ul.n-list').append(html);
					showLoadMore($wrap);
				}
				plus.nativeUI.closeWaiting();
			}).catch(function(e){ console && console.error(e); plus.nativeUI.closeWaiting(); });
		return false;	
	}).on('tap','li[data-patient-code]',function(e) {
		var patiInfo = $(this).attr("data-json");
		var info = JSON.parse(patiInfo);
		if(baseEnv.webview.message) {
			openWebview("../../message/html/p2p.html",{otherCode: info.code,otherName: info.name,otherPhoto: info.photo,otherSex: info.sex});
		} else {
	$patientList.on('tap','li[data-patient-code]',function(e) {
		var code = $(this).attr("data-patient-code");
		if(baseEnv.webview.origin=="suifang") {//“随访”功能
			if(baseEnv.webview.follow_type == 1){
	            openWebview("../../suifang/html/add_plan.html",{patientInfo: code,chooseDate:baseEnv.webview.chooseDate});
	            return false;
	        }
	        if(baseEnv.webview.follow_type == 2){
	            openWebview("../../suifang/html/follow_way.html",{patientInfo: code});
	            return false;
	        }
		}else{
			openWebview("../../huanzhe/html/huanzhexinxi.html",{
				teamCode: self.type==1? lastTeamId : undefined, 
				patiInfo: patiInfo,
				patiCode: info.code
				patiCode: code
			});
		}
		
		return false;
	}).on('tap','.patient-type-big',function(){
		var self = $(this);
		var groupType = self.attr('data-groupindex');
		$('.patient-list').each(function(i,el){
			if($(el).attr('data-parent') == groupType){
				if(!$(el).hasClass('show')){
					$(el).show().addClass('show'); 
					self.addClass('current');
				}else{
					$(el).hide().removeClass('show'); 
					self.removeClass('current');
				}
			}
		})
	})
	$('.demo-comtop h1').on('tap', showGroupSel);
	$('.lin-mask').on('tap', showGroupSel).on('touchmove',function() {
		return false;
	});
	$('.lin-sel-group').on('touchmove',function() {
//		return false;
	});
	$('.lin-sel-group').on('tap', 'li', function(){
		updateLastTeamId($(this).attr("data-code"));
		setTitle($(this).attr("data-name"));
		showGroupSel(undefined, false);
		if(!$(this).hasClass('checked')){
			$(this).addClass('checked').siblings().removeClass('checked');
		}
		showTopMsgBar();
//		getTeamPatientCount();
		refreshPage();
	});
	
	$topMsgBar.on('tap','.close-btn',function(){
		$topMsgBar.hide();
	});
	
	$groupLabelList.on('tap',"li.group-item",function() {
		openWebview("../../huanzhe/html/huanzhe-by-type.html",{
			type: self.type,
			accessData: {
				labelType: $(this).attr("data-type"),
				typeName: $(this).find(".item-label").text()
			},
			message: baseEnv.webview.message});
	})
	$groupLabelList.on('tap',"li.group-qytx",function() {
		openWebview("../../huanzhe/html/huanzhe-tijian.html",{
			type: self.type,
			accessData: {
				labelType: $(this).attr("data-type"),
				typeName: $(this).find(".item-label").text()
			},
			message: baseEnv.webview.message});
	})
	
	$searchbarInput.on('tap',function() {
	    var searchPage = plus.webview.getWebviewById('searchhuanzhe');
	    if(searchPage){
	        mui.fire(searchPage, "initSearch", {
                msgForward: "",
                type: self.type
           	})
	    }
	    if(self.type == 1){
	    	mui.openWindow({
				id: "searchhuanzhe2",
				url: "../../huanzhe/html/searchhuanzhe.html",
				extras: {
					msgForward: "",
	            	type: 1
				}
			})	
	    }else{
	    	mui.openWindow({
				id: "searchhuanzhe",
				url: "../../huanzhe/html/searchhuanzhe.html",
				extras: {
					msgForward: "",
	            	type: self.type
				}
			})	
	    }
	});
	$handleLink.on('click',function() {
		openWebview("../../tuandui/html/xuanzezhuanyijumin.html",{
			docCode: baseInfo.userAgent.uid,
			teamCode: lastTeamId,
			type: "dfp"
		});
	});
	
	$wfp.on('tap', function(){
		mui.openWindow({
			id: "zhuanyijumin",
			url: "../../search/html/zhuanyijumin.html",
			extras: {
				type: "分配",
				teamCode: lastTeamId,
			}
		});
		return;
		openWebview("../../tuandui/html/fp-xuanzejumin.html",{
			docCode: "",
			teamCode: lastTeamId,
			type: "dfp"
		});
	})
	
	$qbjm.on('tap', function(){
		var $team =  $('.lin-sel-group li.checked');
		mui.openWindow("huanzhe.html", "quanbu-huanzhe", {
			extras: {
				type: 1,
				teamName: $team.attr('data-name')
			}
		})
	})
	
	/*刷新事件*/
	window.addEventListener("refresh", function refresh(e) {
		$('.lin-mask').hide();
		$('.lin-sel-group').hide();
		refreshPage();
	});
	
	window.addEventListener("refreshWfp", function refresh(e) {
		showTopMsgBar();
	});
	
	window.onscroll = function() {
		var scrollTop = document.body.scrollTop,
			$current = $('.patient-list.current',$patiList).eq(0),
			top = $current.length && $current.offset().top;
		if($current.length) {
			if(scrollTop >= top - 50) {
				$current.find(".patient-type").css({position: "fixed", top: 45, "z-index": 9999});
			} else {
				$current.find(".patient-type").css({position: "relative", top: "initial", "z-index": "initial"});
			}
		}	
	}
//	window.addEventListener("refresh", function group(e) {
//		searchByPaging(true);
//	});
};
// 页面业务处理流程开始
new Promise(function(resolve, reject) {
	// TODO 临时放开
	//resolve(true);
	mui.plusReady(function() {
		// hrefhrefplus已经准备好,可以往下执行
		// plus已经准备好,可以往下执行
		resolve(true);
	});
}).then(function() {
	mui('.mui-scroll-wrapper').scroll()
	initScroller();
	
	// 获取基础环境信息
	return getBaseEnvPromise().then(function(env) {
		baseEnv = env;
		if(self.type == 1){
			$back.show();
			setTitle(self.teamName);
		}
		
		$('.mid-bar').toggle(self.type!=1);
		
	}).then(function() {
		// 获取登录基本信息
		baseInfo = getBaseInfo();
		lastTeamId = plus.storage.getItem("selectedTeamId");
		// 获取登录医生信息
		baseInfo = getBaseInfoPromise();
		initScroller();
		searchByPaging(true);
		// 绑定页面事件
		bindEvents();
//		initTeams();
		showTopMsgBar();
		initPatientListByGroup();
		if(baseEnv.webview.message){//“转发给”功能,需要返回按钮
		if(baseEnv.webview.origin){//“随访”功能,需要返回按钮
			$(".mui-action-back").show();
		}
		
	})
}).catch(function(e) {
	plus.nativeUI.closeWaiting();
	console && console.error(e);
});
function setAge(age) {
	if(age == 0) {
		return "<1";
	} 
	if(age == -1)
		return "未知";
	return age;
}
template.helper("setAge", setAge);
function setSex(s) {
	if(s == 1) {
		return "男";
	} else if(s == 2) {
		return "女";
	}
}
template.helper("setSex", setSex);