<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="__WCSS__/hits.css">
<link rel="stylesheet" href="__WCSS__/mui.min.css">
<script src="/static/wapp/js/jquery.min.js"></script>
<script src="/static/wapp/js/mui/mui.min.js"></script>
</head>
<body>
{include file='public/head_normal'/}
<input type="hidden" id="totalPage" value="{$totalPage}">
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<!--數據列表 第一次進入頁面通過AJAX請求後臺獲得第一頁數據-->
<ul id='OA_task_1' class="mui-table-view mui-table-view-chevron">
</ul>
</div>
</div>
<script>
var curPage=0; //當前頁碼初始化數0開始
var totalPage = $('#totalPage').val(); //後臺算出總頁數
mui.init({
pullRefresh: {
container: '#pullrefresh', //容器
down: {
callback: pulldownRefresh
},
up: {
contentrefresh: '正在加載...',
callback: pullupRefresh
}
}
});
/**
* 下拉刷新具體業務實現 -》加載一頁數據
*/
function pulldownRefresh() {
curPage = 1;//當前頁碼數
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var data = getPageData(curPage);
if(data!=null){
table.innerHTML=data;
}
mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
mui('#pullrefresh').pullRefresh().refresh(true); //激活上拉加載
}, 1500);
}
/**
* 第一步 默認進-》上拉加載具體業務實現
*/
function pullupRefresh() {
setTimeout(function() {
//判斷當前頁是否大於總頁數
mui('#pullrefresh').pullRefresh().endPullupToRefresh((curPage > totalPage)); //參數爲true代表沒有更多數據了。
if(typeof(totalPage)=='undefined' || totalPage<=1 || curPage==totalPage){
mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
}else{
curPage = curPage+1;
if(curPage >totalPage){
mui('#pullrefresh').pullRefresh().enablePullupToRefresh(true);
}else{
var data = getPageData(curPage);
if(data!=null ){
var table = $(".mui-table-view");
table.append(data);
}
mui('#pullrefresh').pullRefresh().enablePullupToRefresh();
if(curPage == totalPage ){//當前頁加載數據之後判斷是不是還有下一頁 沒有的話底部顯示沒有更多數據
mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
}
}
}
}, 1500);
}
if (mui.os.plus) {
mui.plusReady(function() {
setTimeout(function() {
mui('#pullrefresh').pullRefresh().pullupLoading();
}, 1000);
});
} else {
mui.ready(function() {
mui('#pullrefresh').pullRefresh().pullupLoading();
});
}
/**
* 獲取數據
*/
function getPageData(page){
var data=null;
mui.ajax("/wapp/vip/hits.html",{
data:{'page':page},
dataType:'json',
type:"post",
async:false,
success:function(d){
data=d;
}
});
return data;
}
/**
* 左滑刪除功能
*/
$('#OA_task_1').on('tap', '.mui-btn', function(event) {
var elem = this;
var li = elem.parentNode.parentNode;
mui.confirm('確認刪除該條記錄？', 'Hello MUI', btnArray, function(e) {
if (e.index == 0) {
li.parentNode.removeChild(li);
} else {
setTimeout(function() {
$.swipeoutClose(li);
}, 0);
}
});
});
var btnArray = ['確認', '取消'];
</script>
</body>
</html>//通過AJAX請求第一頁數據 和更多數據
/**
* 誰看過我
*/
public function hits(Request $request){
if($request->isAjax()){
$map['v.uid'] = $this->uid;
$currentPage = $_POST['page'];
$limit=5;
$lst = Db::name('mycard_view v')
->join('mycard m','m.uid = v.vid')
->field('v.*,m.uname,m.company')
->where($map)
->limit(($currentPage - 1)*$limit, $limit)
->select();
$this->assign('lst',$lst);
$result= $this->fetch('ajaxhits');
exit(json_encode($result));
}else{
$limit = 5;
$map['uid'] = $this->uid;
$count = Db::name('mycard_view')->where($map)->count('id');
$totalPage = ceil($count/$limit);
$this->assign('totalPage',$totalPage);
$this->assign('page_title','誰看過我');
$this->assign('arrow','arrow');
$this->assign('backurl','/wapp/member/personal.html');
$this->assign('nav3','munow');
return view();
}
}
