You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

402 lines
14 KiB

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Hello MUI</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
  7. <meta name="apple-mobile-web-app-capable" content="yes">
  8. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  9. <!--标准mui.css-->
  10. <link rel="stylesheet" href="css/mui.min.css">
  11. <link rel="stylesheet" href="css/style.css">
  12. </head>
  13. <body>
  14. <style>
  15. .mui-control-content {
  16. min-height: 215px;
  17. }
  18. .mui-control-content .mui-loading {
  19. margin-top: 50px;
  20. }
  21. .mui-media-body span {
  22. min-width: 40px;
  23. color: #C70F1A;
  24. text-align: left;
  25. float: right;
  26. }
  27. .hd {
  28. width: 60px;
  29. height: 30px;
  30. font-size: 16px;
  31. text-align: right;
  32. margin-right: 10px;
  33. margin-top: 7px;
  34. color: #b3b3b3;
  35. float: right;
  36. }
  37. .mui-table-view-cell.mui-active {
  38. background-color: #FFFFFF;
  39. }
  40. .mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {
  41. border-bottom: 2px solid#c70f1a;
  42. }
  43. </style>
  44. <header class="mui-bar mui-bar-nav">
  45. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
  46. <h1 class="mui-title">查询信息</h1>
  47. </header>
  48. <div class="mui-content">
  49. <div id="SegmentedControl" class="mui-segmented-control mui-segmented-control-inverted">
  50. <a class="mui-control-item mui-active" href="#item1mobile" id="tableregclick">
  51. 报名信息
  52. </a>
  53. <a class="mui-control-item" href="#item2mobile" id="tablejiaofeiclick">
  54. 缴费信息
  55. </a>
  56. <a class="mui-control-item" href="#item3mobile" id="tabletuixueclick">
  57. 退学信息
  58. </a>
  59. </div>
  60. <div class="mui-slider-group">
  61. <div id="item1mobile" class="mui-control-content mui-active">
  62. <ul class="mui-table-view" id="tablereg">
  63. </ul>
  64. </div>
  65. <div id="item2mobile" class="mui-control-content">
  66. <ul class="mui-table-view" id="tablejiaofei">
  67. </ul>
  68. </div>
  69. <div id="item3mobile" class="mui-control-content">
  70. <ul class="mui-table-view" id="tabletuixue">
  71. </ul>
  72. </div>
  73. </div>
  74. </div>
  75. <script src="js/mui.min.js"></script>
  76. <script src="js/serverurl.js"></script>
  77. <script src="js/userinfos.js"></script>
  78. <script type="text/javascript">
  79. var totalcount = 0;
  80. var currentpage = 1;
  81. function GetData(num, tableid) {
  82. var table = document.getElementById(tableid);
  83. //server data
  84. plus.nativeUI.showWaiting("数据加载中...");
  85. var param={
  86. empid:users.ID,
  87. num:num
  88. }
  89. mui.post(api+'/user/getstuinfo',{data:JSON.stringify(param)},function(res){
  90. plus.nativeUI.closeWaiting();
  91. if(res.code=="200"){
  92. if(num == 1) {
  93. GetData(2, "tablejiaofei");
  94. }
  95. if(num == 2) {
  96. GetData(3, "tabletuixue");//
  97. var activetab = plus.webview.currentWebview().activetab;
  98. if(activetab != undefined && activetab != null && activetab != "") {
  99. if(activetab == "tablereg") {
  100. document.getElementById("item1mobile").className = "mui-slider-item mui-control-content mui-active";
  101. }
  102. if(activetab == "tablejiaofei") {}
  103. if(activetab == "tabletuixue") {
  104. mui.trigger(document.getElementById("tabletuixueclick"), 'tap');//
  105. }
  106. } else {
  107. document.getElementById("tablereg").parentElement.classList = "mui-slider-item mui-control-content mui-active";
  108. }
  109. }
  110. table.innerHTML = "";
  111. table.innerText = "";
  112. for(var i = 0; i < res.data.length; i++) {
  113. //load list
  114. var dataobject = res.data;
  115. var li = document.createElement('li');
  116. li.className = 'mui-table-view-cell mui-media';
  117. li.innerHTML = '<img class="mui-media-object mui-pull-left" src="' + web + '/' + dataobject[i].userPhoto + '">' +
  118. '<div class="mui-media-body">' +
  119. '姓名:' + dataobject[i].strdentName + ' &nbsp;&nbsp;&nbsp;&nbsp;' + dataobject[i].strMobile + '<span>' + dataobject[i].moneyQuota + '</span>' +
  120. '<p>学院:' + dataobject[i].schoolName + '</p>' +
  121. '<p class="mui-ellipsis">专业:' + dataobject[i].professionName + '</p>' +
  122. '<p>生活费: ' + dataobject[i].professionMoney + '</p>';
  123. if(tableid == "tablereg") {
  124. li.innerHTML += '<p>' +
  125. '<a class="mui-icon mui-icon-trash hd" onclick="DoDel(\'' + dataobject[i].ID + '\');">删除</a>' +
  126. '<a class="mui-icon mui-icon-compose hd" onclick="DoEdit(\'' + dataobject[i].ID + '\');">修改</a>' +
  127. '<a class="mui-icon mui-icon-chat hd" onclick="DoChat(\'' + dataobject[i].UserID + '\');">互动</a>';
  128. }
  129. if(tableid == "tablejiaofei") {
  130. li.innerHTML += '<p>' +
  131. '<a class="mui-icon mui-icon-compose hd" onclick="DoEdit(\'' + dataobject[i].ID + '\');">修改</a>' +
  132. '<a class="mui-icon mui-icon-chat hd" onclick="DoChat(\'' + dataobject[i].UserID + '\');">互动</a>';
  133. }
  134. if(tableid == "tabletuixue") {
  135. li.innerHTML += '<p>' +
  136. '<a class="mui-icon mui-icon-chat hd" onclick="DoChat(\'' + dataobject[i].UserID + '\');">互动</a>';
  137. }
  138. li.innerHTML += '</p>';
  139. li.innerHTML += '</div>';
  140. //下拉刷新,新纪录插到最前面;
  141. table.appendChild(li, table.firstChild);
  142. }
  143. }
  144. },'json')
  145. }
  146. // mui.init({
  147. // swipeBack: false,
  148. // pullRefresh: {
  149. // container: '#pullrefresh',
  150. // down: {
  151. // height: 50, //可选,默认50.触发下拉刷新拖动距离,
  152. // auto: true, //可选,默认false.自动下拉刷新一次
  153. // contentdown: "下拉可以刷新", //可选,在下拉可刷新状态时,下拉刷新控件上显示的标题内容
  154. // contentover: "释放立即刷新", //可选,在释放可刷新状态时,下拉刷新控件上显示的标题内容
  155. // contentrefresh: "正在刷新...", //可选,正在刷新状态时,下拉刷新控件上显示的标题内容
  156. // callback: pulldownRefresh
  157. // },
  158. // up: {
  159. // contentrefresh: '正在加载...',
  160. // callback: pullupRefresh
  161. // }
  162. // }
  163. // });
  164. mui.plusReady(function() {
  165. CheckLogin();
  166. var B = window.plus.bridge;
  167. var Yuntx = {
  168. OpenChat: function(uln, tln, successCallback, errorCallback) {
  169. var success = typeof successCallback !== 'function' ? null : function(args) {
  170. successCallback(args);
  171. },
  172. fail = typeof errorCallback !== 'function' ? null : function(code) {
  173. errorCallback(code);
  174. },
  175. callbackID = B.callbackId(success, fail);
  176. return B.exec("Yuntx", "OpenChat", [callbackID, uln, tln]);
  177. }
  178. };
  179. window.plus.Yuntx = Yuntx;
  180. // //循环初始化所有下拉刷新,上拉加载。
  181. // $.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
  182. // $(pullRefreshEl).pullToRefresh({
  183. // down: {
  184. // callback: function() {
  185. // var self = this;
  186. // setTimeout(function() {
  187. // var ul = self.element.querySelector('.mui-table-view');
  188. // ul.insertBefore(createFragment(ul, index, 10, true), ul.firstChild);
  189. // self.endPullDownToRefresh();
  190. // }, 1000);
  191. // }
  192. // },
  193. // up: {
  194. // callback: function() {
  195. // var self = this;
  196. // setTimeout(function() {
  197. // var ul = self.element.querySelector('.mui-table-view');
  198. // ul.appendChild(createFragment(ul, index, 5));
  199. // self.endPullUpToRefresh();
  200. // }, 1000);
  201. // }
  202. // }
  203. // });
  204. // });
  205. GetData(1, "tablereg");
  206. });
  207. /**
  208. * 下拉刷新具体业务实现
  209. */
  210. function pulldownRefresh() {
  211. setTimeout(function() {
  212. totalcount = 0;
  213. currentpage = 1;
  214. var table = document.body.querySelector('.mui-table-view');
  215. var cells = document.body.querySelectorAll('.mui-table-view-cell');
  216. table.innerHTML = "";
  217. //server data
  218. var xhr = new plus.net.XMLHttpRequest();
  219. xhr.responseType = "json";
  220. xhr.onreadystatechange = function() {
  221. switch(xhr.readyState) {
  222. case 4:
  223. if(xhr.status == 200) {
  224. if(xhr.response.GetPageContainOrderCountResult.length > 0) {
  225. for(var i = 0; i < xhr.response.GetPageContainOrderCountResult.length; i++) {
  226. //load list
  227. var dataobject = xhr.response.GetPageContainOrderCountResult;
  228. var li = document.createElement('li');
  229. li.className = 'mui-table-view-cell mui-media';
  230. li.innerHTML = '<a href="javascript:void(0);" onclick="OpenDetail(' + dataobject[i].CLID + ',' + dataobject[i].CLNumDeel + ');">' +
  231. '<img class="mui-media-object mui-pull-left" src="' + dataobject[i].CIImgSrc.replace('106x100/', '175x155/') + '">' +
  232. (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>' : '') +
  233. '<div class="mui-media-body">' +
  234. '<div class="mui-media-title">' + dataobject[i].CLName + '</div>' +
  235. '<p class="mui-ellipsis">' + dataobject[i].CLInstruction + '</p>' +
  236. '<div class="mui-media-price">' +
  237. '<span>¥</span><span class="old">' + dataobject[i].CLPrice + '</span><span class="deel">¥' + dataobject[i].CLPriceDeel + '</span>' +
  238. '<div class="mui-media-buy">仅剩' + dataobject[i].CLNumDeel + '件</div>' +
  239. '<div class="mui-media-distance"></div>' +
  240. '</div>' +
  241. '</div>' +
  242. '</a>';
  243. //下拉刷新,新纪录插到最前面;
  244. table.insertBefore(li, table.firstChild);
  245. }
  246. //所有记录总数
  247. totalcount = xhr.response.recordCount;
  248. if(totalcount <= 20)
  249. mui('#pullrefresh').pullRefresh().disablePullupToRefresh();
  250. else
  251. mui('#pullrefresh').pullRefresh().enablePullupToRefresh();
  252. mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
  253. //重新启用下拉刷新
  254. //mui('#pullrefresh').pullRefresh().refresh(true);
  255. } else {
  256. mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
  257. }
  258. } else {
  259. plus.nativeUI.toast('世界上最遥远的距离就是没有网络。');
  260. }
  261. break;
  262. default:
  263. break;
  264. }
  265. }
  266. xhr.open("POST", sysdomain + "/HttpWCF_sys_Class.svc/GetPageContainOrderCount");
  267. var data = {
  268. lon: 0,
  269. lat: 0,
  270. fields: "*",
  271. conditions: "where 1=1 and CLISDeal=2 order by CLEndTimeDeel desc",
  272. currentPage: "1",
  273. pageSize: "20",
  274. recordCount: "1"
  275. };
  276. xhr.setRequestHeader('Content-Type', 'application/json');
  277. xhr.send(JSON.stringify(data));
  278. }, 500);
  279. }
  280. /**
  281. * 上拉加载具体业务实现
  282. */
  283. function pullupRefresh() {
  284. setTimeout(function() {
  285. var table = document.body.querySelector('.mui-table-view');
  286. var cells = document.body.querySelectorAll('.mui-table-view-cell');
  287. //server data
  288. var xhr = new plus.net.XMLHttpRequest();
  289. xhr.responseType = "json";
  290. xhr.onreadystatechange = function() {
  291. switch(xhr.readyState) {
  292. case 4:
  293. if(xhr.status == 200) {
  294. if(xhr.response.GetPageContainOrderCountResult.length > 0) {
  295. for(var i = 0; i < xhr.response.GetPageContainOrderCountResult.length; i++) {
  296. //load list
  297. var dataobject = xhr.response.GetPageContainOrderCountResult;
  298. var li = document.createElement('li');
  299. li.className = 'mui-table-view-cell mui-media';
  300. li.innerHTML = '<a href="javascript:void(0);" onclick="OpenDetail(' + dataobject[i].CLID + ',' + dataobject[i].CLNumDeel + ');">' +
  301. '<img class="mui-media-object mui-pull-left" src="' + dataobject[i].CIImgSrc.replace('106x100/', '175x155/') + '">' +
  302. (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>' : '') +
  303. '<div class="mui-media-body">' +
  304. '<div class="mui-media-title">' + dataobject[i].CLName + '</div>' +
  305. '<p class="mui-ellipsis">' + dataobject[i].CLInstruction + '</p>' +
  306. '<div class="mui-media-price">' +
  307. '<span>¥</span><span class="old">' + dataobject[i].CLPrice + '</span><span class="deel">¥' + dataobject[i].CLPriceDeel + '</span>' +
  308. '<div class="mui-media-buy">仅剩' + dataobject[i].CLNumDeel + '件</div>' +
  309. '<div class="mui-media-distance"></div>' +
  310. '</div>' +
  311. '</div>' +
  312. '</a>';
  313. table.appendChild(li, table.firstChild);
  314. }
  315. //所有记录总数
  316. totalcount = xhr.response.recordCount;
  317. mui('#pullrefresh').pullRefresh().endPullupToRefresh((table.childElementCount >= totalcount)); //参数为true代表没有更多数据了。
  318. }
  319. } else {
  320. plus.nativeUI.toast('世界上最遥远的距离就是没有网络。');
  321. }
  322. break;
  323. default:
  324. break;
  325. }
  326. }
  327. xhr.open("POST", sysdomain + "/HttpWCF_sys_Class.svc/GetPageContainOrderCount");
  328. currentpage++;
  329. var data = {
  330. lon: 0,
  331. lat: 0,
  332. fields: "*",
  333. conditions: "where 1=1 and CLISDeal=2 order by CLEndTimeDeel desc",
  334. currentPage: currentpage,
  335. pageSize: "5",
  336. recordCount: "1"
  337. };
  338. xhr.setRequestHeader('Content-Type', 'application/json');
  339. xhr.send(JSON.stringify(data));
  340. }, 500);
  341. }
  342. function DoDel(id) {
  343. if(confirm("是否删除学生信息?")) {
  344. plus.nativeUI.showWaiting("加载中...");
  345. mui.post(api+'/user/delstu',{data:id},function(res){
  346. plus.nativeUI.closeWaiting();
  347. if(res.code=="200"){
  348. GetData(1, "tablereg");
  349. plus.nativeUI.toast('删除成功。');
  350. }
  351. })
  352. }
  353. }
  354. function DoEdit(id) {
  355. mui.openWindow({
  356. url: 'studentsinf.html',
  357. id: 'studentsinf',
  358. show: {
  359. aniShow: 'pop-in'
  360. },
  361. extras: {
  362. userid: '' + id + '',
  363. }
  364. });
  365. }
  366. function DoChat(id) {
  367. plus.nativeUI.showWaiting("加载中...");
  368. plus.Yuntx.OpenChat(users.ID, id,
  369. function(contact) { //成功
  370. plus.nativeUI.closeWaiting();
  371. },
  372. function(status) { //失败
  373. plus.nativeUI.closeWaiting();
  374. });
  375. }
  376. </script>
  377. </body>
  378. </html>