<!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">
<!--标准mui.css-->
<link rel="stylesheet" href="css/mui.min.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<style>
.mui-control-content {
min-height: 215px;
}
.mui-control-content .mui-loading {
margin-top: 50px;
}
.mui-media-body span {
min-width: 40px;
color: #C70F1A;
text-align: left;
float: right;
}
.hd {
width: 60px;
height: 30px;
font-size: 16px;
text-align: right;
margin-right: 10px;
margin-top: 7px;
color: #b3b3b3;
float: right;
}
.mui-table-view-cell.mui-active {
background-color: #FFFFFF;
}
.mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {
border-bottom: 2px solid#c70f1a;
}
</style>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">查询信息</h1>
</header>
<div class="mui-content">
<div id="SegmentedControl" class="mui-segmented-control mui-segmented-control-inverted">
<a class="mui-control-item mui-active" href="#item1mobile" id="tableregclick">
报名信息
</a>
<a class="mui-control-item" href="#item2mobile" id="tablejiaofeiclick">
缴费信息
</a>
<a class="mui-control-item" href="#item3mobile" id="tabletuixueclick">
退学信息
</a>
</div>
<div class="mui-slider-group">
<div id="item1mobile" class="mui-control-content mui-active">
<ul class="mui-table-view" id="tablereg">
</ul>
</div>
<div id="item2mobile" class="mui-control-content">
<ul class="mui-table-view" id="tablejiaofei">
</ul>
</div>
<div id="item3mobile" class="mui-control-content">
<ul class="mui-table-view" id="tabletuixue">
</ul>
</div>
</div>
</div>
<script src="js/mui.min.js"></script>
<script src="js/serverurl.js"></script>
<script src="js/userinfos.js"></script>
<script type="text/javascript">
var totalcount = 0;
var currentpage = 1;
function GetData(num, tableid) {
var table = document.getElementById(tableid);
//server data
plus.nativeUI.showWaiting("数据加载中...");
var param={
empid:users.ID,
num:num
}
mui.post(api+'/user/getstuinfo',{data:JSON.stringify(param)},function(res){
plus.nativeUI.closeWaiting();
if(res.code=="200"){
if(num == 1) {
GetData(2, "tablejiaofei");
}
if(num == 2) {
GetData(3, "tabletuixue");//
var activetab = plus.webview.currentWebview().activetab;
if(activetab != undefined && activetab != null && activetab != "") {
if(activetab == "tablereg") {
document.getElementById("item1mobile").className = "mui-slider-item mui-control-content mui-active";
}
if(activetab == "tablejiaofei") {}
if(activetab == "tabletuixue") {
mui.trigger(document.getElementById("tabletuixueclick"), 'tap');//
}
} else {
document.getElementById("tablereg").parentElement.classList = "mui-slider-item mui-control-content mui-active";
}
}
table.innerHTML = "";
table.innerText = "";
for(var i = 0; i < res.data.length; i++) {
//load list
var dataobject = res.data;
var li = document.createElement('li');
li.className = 'mui-table-view-cell mui-media';
li.innerHTML = '<img class="mui-media-object mui-pull-left" src="' + web + '/' + dataobject[i].userPhoto + '">' +
'<div class="mui-media-body">' +
'姓名：' + dataobject[i].strdentName + ' ' + dataobject[i].strMobile + '<span>' + dataobject[i].moneyQuota + '</span>' +
'<p>学院：' + dataobject[i].schoolName + '</p>' +
'<p class="mui-ellipsis">专业：' + dataobject[i].professionName + '</p>' +
'<p>生活费： ' + dataobject[i].professionMoney + '</p>';
if(tableid == "tablereg") {
li.innerHTML += '<p>' +
'<a class="mui-icon mui-icon-trash hd" onclick="DoDel(\'' + dataobject[i].ID + '\');">删除</a>' +
'<a class="mui-icon mui-icon-compose hd" onclick="DoEdit(\'' + dataobject[i].ID + '\');">修改</a>' +
'<a class="mui-icon mui-icon-chat hd" onclick="DoChat(\'' + dataobject[i].UserID + '\');">互动</a>';
}
if(tableid == "tablejiaofei") {
li.innerHTML += '<p>' +
'<a class="mui-icon mui-icon-compose hd" onclick="DoEdit(\'' + dataobject[i].ID + '\');">修改</a>' +
'<a class="mui-icon mui-icon-chat hd" onclick="DoChat(\'' + dataobject[i].UserID + '\');">互动</a>';
}
if(tableid == "tabletuixue") {
li.innerHTML += '<p>' +
'<a class="mui-icon mui-icon-chat hd" onclick="DoChat(\'' + dataobject[i].UserID + '\');">互动</a>';
}
li.innerHTML += '</p>';
li.innerHTML += '</div>';
//下拉刷新，新纪录插到最前面；
table.appendChild(li, table.firstChild);
}
}
},'json')
}
// mui.init({
// swipeBack: false,
// pullRefresh: {
// container: '#pullrefresh',
// down: {
// height: 50, //可选,默认50.触发下拉刷新拖动距离,
// auto: true, //可选,默认false.自动下拉刷新一次
// contentdown: "下拉可以刷新", //可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
// contentover: "释放立即刷新", //可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
// contentrefresh: "正在刷新...", //可选，正在刷新状态时，下拉刷新控件上显示的标题内容
// callback: pulldownRefresh
// },
// up: {
// contentrefresh: '正在加载...',
// callback: pullupRefresh
// }
// }
// });
mui.plusReady(function() {
CheckLogin();
var B = window.plus.bridge;
var Yuntx = {
OpenChat: function(uln, tln, successCallback, errorCallback) {
var success = typeof successCallback !== 'function' ? null : function(args) {
successCallback(args);
},
fail = typeof errorCallback !== 'function' ? null : function(code) {
errorCallback(code);
},
callbackID = B.callbackId(success, fail);
return B.exec("Yuntx", "OpenChat", [callbackID, uln, tln]);
}
};
window.plus.Yuntx = Yuntx;
// //循环初始化所有下拉刷新，上拉加载。
// $.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
// $(pullRefreshEl).pullToRefresh({
// down: {
// callback: function() {
// var self = this;
// setTimeout(function() {
// var ul = self.element.querySelector('.mui-table-view');
// ul.insertBefore(createFragment(ul, index, 10, true), ul.firstChild);
// self.endPullDownToRefresh();
// }, 1000);
// }
// },
// up: {
// callback: function() {
// var self = this;
// setTimeout(function() {
// var ul = self.element.querySelector('.mui-table-view');
// ul.appendChild(createFragment(ul, index, 5));
// self.endPullUpToRefresh();
// }, 1000);
// }
// }
// });
// });
GetData(1, "tablereg");
});
/**
* 下拉刷新具体业务实现
*/
function pulldownRefresh() {
setTimeout(function() {
totalcount = 0;
currentpage = 1;
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
table.innerHTML = "";
//server data
var xhr = new plus.net.XMLHttpRequest();
xhr.responseType = "json";
xhr.onreadystatechange = function() {
switch(xhr.readyState) {
case 4:
if(xhr.status == 200) {
if(xhr.response.GetPageContainOrderCountResult.length > 0) {
for(var i = 0; i < xhr.response.GetPageContainOrderCountResult.length; i++) {
//load list
var dataobject = xhr.response.GetPageContainOrderCountResult;
var li = document.createElement('li');
li.className = 'mui-table-view-cell mui-media';
li.innerHTML = '<a href="javascript:void(0);" onclick="OpenDetail(' + dataobject[i].CLID + ',' + dataobject[i].CLNumDeel + ');">' +
'<img class="mui-media-object mui-pull-left" src="' + dataobject[i].CIImgSrc.replace('106x100/', '175x155/') + '">' +
(dataobject[i].CLNumDeel == 0 ? '<div style="background:url(images/deal_soldout.png) no-repeat;position:absolute;top:0px;left:12px;width:158px;height:158px;"></div>' : '') +
'<div class="mui-media-body">' +
'<div class="mui-media-title">' + dataobject[i].CLName + '</div>' +
'<p class="mui-ellipsis">' + dataobject[i].CLInstruction + '</p>' +
'<div class="mui-media-price">' +
'<span>￥</span><span class="old">' + dataobject[i].CLPrice + '</span><span class="deel">￥' + dataobject[i].CLPriceDeel + '</span>' +
'<div class="mui-media-buy">仅剩' + dataobject[i].CLNumDeel + '件</div>' +
'<div class="mui-media-distance"></div>' +
'</div>' +
'</div>' +
'</a>';
//下拉刷新，新纪录插到最前面；
table.insertBefore(li, table.firstChild);
}
//所有记录总数
totalcount = xhr.response.recordCount;
if(totalcount <= 20)
mui('#pullrefresh').pullRefresh().disablePullupToRefresh();
else
mui('#pullrefresh').pullRefresh().enablePullupToRefresh();
mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
//重新启用下拉刷新
//mui('#pullrefresh').pullRefresh().refresh(true);
} else {
mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
}
} else {
plus.nativeUI.toast('世界上最遥远的距离就是没有网络。');
}
break;
default:
break;
}
}
xhr.open("POST", sysdomain + "/HttpWCF_sys_Class.svc/GetPageContainOrderCount");
var data = {
lon: 0,
lat: 0,
fields: "*",
conditions: "where 1=1 and CLISDeal=2 order by CLEndTimeDeel desc",
currentPage: "1",
pageSize: "20",
recordCount: "1"
};
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify(data));
}, 500);
}
/**
* 上拉加载具体业务实现
*/
function pullupRefresh() {
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
//server data
var xhr = new plus.net.XMLHttpRequest();
xhr.responseType = "json";
xhr.onreadystatechange = function() {
switch(xhr.readyState) {
case 4:
if(xhr.status == 200) {
if(xhr.response.GetPageContainOrderCountResult.length > 0) {
for(var i = 0; i < xhr.response.GetPageContainOrderCountResult.length; i++) {
//load list
var dataobject = xhr.response.GetPageContainOrderCountResult;
var li = document.createElement('li');
li.className = 'mui-table-view-cell mui-media';
li.innerHTML = '<a href="javascript:void(0);" onclick="OpenDetail(' + dataobject[i].CLID + ',' + dataobject[i].CLNumDeel + ');">' +
'<img class="mui-media-object mui-pull-left" src="' + dataobject[i].CIImgSrc.replace('106x100/', '175x155/') + '">' +
(dataobject[i].CLNumDeel == 0 ? '<div style="background:url(images/deal_soldout.png) no-repeat;position:absolute;top:0px;left:12px;width:158px;height:158px;"></div>' : '') +
'<div class="mui-media-body">' +
'<div class="mui-media-title">' + dataobject[i].CLName + '</div>' +
'<p class="mui-ellipsis">' + dataobject[i].CLInstruction + '</p>' +
'<div class="mui-media-price">' +
'<span>￥</span><span class="old">' + dataobject[i].CLPrice + '</span><span class="deel">￥' + dataobject[i].CLPriceDeel + '</span>' +
'<div class="mui-media-buy">仅剩' + dataobject[i].CLNumDeel + '件</div>' +
'<div class="mui-media-distance"></div>' +
'</div>' +
'</div>' +
'</a>';
table.appendChild(li, table.firstChild);
}
//所有记录总数
totalcount = xhr.response.recordCount;
mui('#pullrefresh').pullRefresh().endPullupToRefresh((table.childElementCount >= totalcount)); //参数为true代表没有更多数据了。
}
} else {
plus.nativeUI.toast('世界上最遥远的距离就是没有网络。');
}
break;
default:
break;
}
}
xhr.open("POST", sysdomain + "/HttpWCF_sys_Class.svc/GetPageContainOrderCount");
currentpage++;
var data = {
lon: 0,
lat: 0,
fields: "*",
conditions: "where 1=1 and CLISDeal=2 order by CLEndTimeDeel desc",
currentPage: currentpage,
pageSize: "5",
recordCount: "1"
};
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify(data));
}, 500);
}
function DoDel(id) {
if(confirm("是否删除学生信息？")) {
plus.nativeUI.showWaiting("加载中...");
mui.post(api+'/user/delstu',{data:id},function(res){
plus.nativeUI.closeWaiting();
if(res.code=="200"){
GetData(1, "tablereg");
plus.nativeUI.toast('删除成功。');
}
})
}
}
function DoEdit(id) {
mui.openWindow({
url: 'studentsinf.html',
id: 'studentsinf',
show: {
aniShow: 'pop-in'
},
extras: {
userid: '' + id + '',
}
});
}
function DoChat(id) {
plus.nativeUI.showWaiting("加载中...");
plus.Yuntx.OpenChat(users.ID, id,
function(contact) { //成功
plus.nativeUI.closeWaiting();
},
function(status) { //失败
plus.nativeUI.closeWaiting();
});
}
</script>
</body>
</html>