master/container/acceptance/index.html

<!--验收列表  - 列表页 - wwb-->
<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link href="../../css/themes.css" rel="stylesheet" />
		<link href="../../css/index_view.css" rel="stylesheet" />
		<link rel="import" href="../../tpl/acceptance_card.html " id="card_view"/>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav themes_bg_color">
		   	<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left">
		   		<label class="mui-pull-right theme_back_font">返回</label>
		   	</a>
		    <h1 class="mui-title themes_title">验收</h1>
		    <a id="barcode" href="#modal" class="mui-pull-right"  style="height: 45px;padding-top: 12px;">
		    	<div class="qrcode" id="qrcode" onclick="clicked('../commonPages/qrcode',true,true)">
					<img src="../../assest/qrcode.png" width="24" height="24"/>
				</div>
		    </a>
		</header>
		<div class="mui-content">
		    <div class="mui-input-row mui-search search_head" onclick="toSearchPage()">
				<input type="search" class="mui-input-clear" readonly="readonly" placeholder="供应商名称">
			</div>
			<div id="slider" class="mui-slider themes_tab mui-fullscreen" style="top: 102px;">
				<div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
					<a class="mui-control-item themes_font_color_tab" href="#item1mobile">待验收</a>
					<a class="mui-control-item themes_font_color_tab" href="#item2mobile">已验收</a>
				</div>
				<div id="sliderProgressBar" class="mui-slider-progress-bar mui-col-xs-6"></div>
				<div class="mui-slider-group">
					<div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
						<div id="scroll1" class="mui-scroll-wrapper">
							<div class="mui-scroll" id='mui-table-view-tab1'>
								<ul class="mui-table-view">
									<li class="mui-table-view-cell mui-tab1" style="padding: 0;"></li>
								</ul>
							</div>
						</div>
					</div>
					<div id="item2mobile" class="mui-slider-item mui-control-content">
						<div id="scroll2" class="mui-scroll-wrapper">
							<div class="mui-scroll" id='mui-table-view-tab2'>
								<ul class="mui-table-view">
									<li class="mui-table-view-cell mui-tab2" style="padding: 0;"></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script src="../../js/mui.js"></script>
		<script src="../../js/jquery.min.js" ></script>
		<script src="../../js/mui.pullToRefresh.js"></script>
		<script src="../../js/mui.pullToRefresh.material.js"></script>
		<script src="../../js/template-web.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/utils.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/common.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/request.js" type="text/javascript" charset="utf-8"></script>
		
		<script type="text/javascript">
			
			
			var selectTabs = 1; // 默认选中第一个tab
			//货位码
			function clicked(){
				
				common.openwin('../commonPages/qrcode',true,{ titleText: '扫码验收' })
			}
			
			/*获取二维码返回值*/
			function scaned(t, r, f) {
				
				console.log(r+"条形码读取的数据");//返回二维码读取的数据
				if(r){
					r = r+"";
					if(typeof r == 'string'){//去掉条形码前面的0
						r = r.replace(/\b(0+)/gi,"");
					}
					var itemData = {barcode:r}
					itemData.currentSelected = selectTabs === 1 ? 'left': 'right';
					console.log(JSON.stringify(itemData))
					document.activeElement.blur(); // 隐藏软键盘
					let openwinUrl = 'acc_not_list';
					common.openwin(openwinUrl,{ params: JSON.stringify(itemData) },false)
				}
			}
			
			//去搜索页面
			function toSearchPage (){
				var params = {};
				params.key = 'supplier';
				params.route = '../acceptance/index';
				params.module = 'acceptance';
				params.selectTabs = selectTabs;
				params.location = 'main_list'
				common.openwin('../commonPages/searchPage',{ params: JSON.stringify(params) },false)
				document.activeElement.blur(); // 隐藏软键盘
			}

			
			(function($,$$) {
				
				$.init({
					beforeback:function(){
						var list = plus.webview.currentWebview().opener();
						 mui.fire(list, 'refresh',{ getCountFlag: true });
						 return true;
					}
				});
				
				var deceleration = mui.os.ios?0.003:0.0009;
				$('.mui-scroll-wrapper').scroll({
					bounce: true,
					indicators: true, //是否显示滚动条
					deceleration:deceleration
				});
				var utils = new Utils();
				utils.appendModule('#card_view');
				
				/* 渲染模板   */
				var page = undefined, pageSize = 15,totalPage = undefined, query = {};
				
				var checkType, type, acceptanceType// 验收单类型 // 验收状态   5 待验收  2 已验收 
				var requestUrl =  '/a/checkaccept/list'; // 请求地址
				
				var pageLeft = 1, 
					pageRight = 1, 
					totalPageLeft, 
					totalPageRight, 
					isMore = true,
					selected = '.mui-tab1'; // 默认选中内容区块
				
            	function template(selected, data, insertType){
        			utils.innerTplHtml('acceptance', selected, data, insertType);
            	}
            	
            	/*
            	 	下拉刷新
            	 * */
            	function pulldownRefresh(){
            		console.log(query)
            		var self = this;
					pageLeft = 1; pageRight = 1
					acceptanceType = selectTabs === 1 ? '5': '2';
					page = 1;
					var postData = {
						acceptanceType: acceptanceType,
                		checkType: checkType,
                		pageNo: page,
                		pageSize: pageSize
					}
					if(query.supplierCode){
						postData.supplierCodeList = [ query.supplierCode ];
					}
					query = {};
					mui.ajaxRequest(requestUrl,{
                		type: 'POST',
                		data: postData,
                    	contentType: "application/json",
                		success: function(data){
                			var resData = data.data;
                			var total = resData.totalPage;
                			if(selectTabs === 1){
                				totalPageLeft = total;
                			}else{
                				totalPageRight = total;
                			}
                			if(resData.list.length === 0 || (resData.list.length <= resData.pageSize && resData.pageNo === resData.totalPage)){
                				var i = selectTabs === 1 ? 0 : 1;
                				document.querySelectorAll('.mui-pull-loading')[i].innerHTML = '没有更多数据';
                				isMore = false;
                				self.endPullDownToRefresh(true);
                			}else{
                				isMore = true;
                				self.endPullDownToRefresh(false);
                				self.refresh(true);
                			}
							return template(selected,resData,false)
                		},
                		error: function(xhr,type,errorThrown){
                			console.log(xhr)
                		}
            		});
				}
            	/*
					 
				 *  上拉加载更多
				 * */
				function pullupRefresh(){
					var self = this;
					if(isMore){
						if(selectTabs === 1){
							pageLeft ++
						}else{
							pageRight ++;
						}
						page = selectTabs === 1 ? pageLeft: pageRight;
						totalPage = selectTabs === 1 ? totalPageLeft: totalPageRight;
						acceptanceType = selectTabs === 1 ? '5': '2';
						var postData = {
							acceptanceType: acceptanceType,
	                		checkType: checkType,
	                		pageNo: page,
	                		pageSize: pageSize
						}
						console.log(JSON.stringify(postData))
						if(page <= totalPage){
							mui.ajaxRequest(requestUrl,{
								type: 'POST',
		                		data: postData,
		                    	contentType: "application/json",
		                		success: function(data){
		                			var resData = data.data;
		                			if(resData.pageNo === resData.totalPage){
			            				isMore = false;
			            				self.endPullUpToRefresh(true);
			            			}else{
			            				isMore = true;
			            				self.endPullUpToRefresh(false);
			            				self.refresh(true);
			            			}
									return template(selected,resData,true)
		                		},
		                		error: function(xhr,type,errorThrown){
									console(xhr.responseText)
		                		}
		            		});
						}
					}else{
						var i = selectTabs === 1 ? 0 : 1;
						document.querySelectorAll('.mui-pull-loading')[i].innerHTML = '没有更多数据';
						self.endPullUpToRefresh(true);
					}
				}
				$.plusReady(function(){
		
					// 触发刷新 搜索页面搜的值
					window.addEventListener('search',function(event){
						console.log(event.detail)
						query.supplierCode = JSON.parse(event.detail.searchParams).supplierCode;
						query.supplierName = JSON.parse(event.detail.searchParams).supplierName;
						console.log(JSON.stringify(query),'query')
						$$('.mui-placeholder').hide();
						$$('.mui-input-clear').val(query.supplierName);
						
						mui(".mui-slider-group .mui-scroll").pullToRefresh()[0].pullDownLoading();
					})
					
					window.addEventListener('pagefresh',function(e){
						let index = e.detail.hasAcceptance ? 0: 1;
						if(index === 1){
							mui('#slider').slider().gotoItem(1);
						}
						mui('.mui-scroll-wrapper').scroll()[index].scrollTo(0,0,100);
						setTimeout(function(){
							mui(".mui-slider-group .mui-scroll").pullToRefresh()[index].pullDownLoading();
						},300)
					})
					
					plus.key.addEventListener('backbutton',function(){
	                    plus.webview.currentWebview().close();
	                })
					
					if(plus.storage.getItem('currDept')){
						type = JSON.parse(plus.storage.getItem('currDept')).deptType;
						switch(type){
							case '3'://药房
								checkType = 1;
								break;
							case '4':// 药库
								checkType = 2;
								break;
							case '5': // 基数药
								checkType = 3;
								break;
							default:
								break;
						}
						//除了药库显示右上角扫描按钮,其他都不显示
						if(type == "3"){
							$$("#barcode").css("display","black");
						}else{
							$$("#barcode").css("display","none");
						}
					}else{
						mui.toast('请重新登陆');
						common.openwin('../login/index')
					}
					
					var item2 = document.querySelector('#item2mobile');
					var item1 = document.querySelector('#item1mobile');
					document.getElementById('slider').addEventListener('slide', function(e) {
						$$('.mui-input-clear').val('');
						let index = e.detail.slideNumber;
						if (index === 1) {
							selected = '.mui-tab2';
							selectTabs = 2;
							mui('#slider').slider().gotoItem(1);
							$('.mui-slider-group .mui-scroll .mui-tab2')[0].innerHTML = '';
							if (!item2.querySelector('.am-card')) {
								mui(".mui-slider-group .mui-scroll").pullToRefresh()[index].pullDownLoading();
							}
						}
						if(index === 0){
							selected = '.mui-tab1';
							selectTabs = 1;
							mui('#slider').slider().gotoItem(0);
							$('.mui-slider-group .mui-scroll .mui-tab1')[0].innerHTML = '';
							if (!item1.querySelector('.am-card')) {
								mui(".mui-slider-group .mui-scroll").pullToRefresh()[index].pullDownLoading();
							}
						}
					});
					//循环初始化所有下拉刷新，上拉加载。
					$.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
						
						$(pullRefreshEl).pullToRefresh({
							down: {
								style:'circle',
								contentdown : "下拉可以刷新",
								contentover : "释放立即刷新",
								contentrefresh : "正在刷新...",
								callback: pulldownRefresh
							},
							up: {
								contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
	      						contentnomore:'没有更多数据',
								callback: pullupRefresh
							}
						});
					});
					// 第一个tab 默认加载一次数据
					mui(".mui-slider-group .mui-scroll").pullToRefresh()[0].pullDownLoading();
					
					//绑定点击事件  - 进入详情页
						
					$('#slider').on('tap','.am-card',function(){
						
						let itemData = this.dataset;
						itemData.currentSelected = selectTabs === 1 ? 'left': 'right';
						console.log(JSON.stringify(itemData))
						document.activeElement.blur(); // 隐藏软键盘
						let openwinUrl = selectTabs === 1 ? 'acc_not_list':'acc_list';
						common.openwin(openwinUrl,{ params: JSON.stringify(itemData) },false)
					})
				});
				
			})(mui,jQuery);
		
		</script>
	</body>

</html>