tab-webview-subpage-app.html 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282
  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. <link href="css/mui.min.css" rel="stylesheet" />
  10. <link href="css/mui.indexedlist.css" rel="stylesheet" />
  11. <link href="css/OA-style.css" rel="stylesheet" />
  12. <style type="text/css">
  13. .mui-content>.mui-table-view:first-child {
  14. margin-top: -1px;
  15. }
  16. </style>
  17. </head>
  18. <body>
  19. <div class="mui-content">
  20. <ul class="mui-table-view mui-grid-view mui-grid-9" id="grid">
  21. <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="attendance">
  22. <a href="attendance.html">
  23. <div class="media-body-img"><img src="images/yy_kq.png"></div>
  24. <div class="mui-media-body">考勤管理</div>
  25. </a>
  26. </li>
  27. <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="notice">
  28. <a href="#">
  29. <div class="media-body-img"><img src="images/yy_tzgg.png"></div>
  30. <div class="mui-media-body">通知公告</div>
  31. </a>
  32. </li>
  33. <!--<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="schedule">
  34. <a href="#">
  35. <div class="media-body-img"><img src="images/index_richeng.png"></div>
  36. <div class="mui-media-body">我的日程</div>
  37. </a>
  38. </li>-->
  39. <!-- <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="document">
  40. <a href="#">
  41. <div class="media-body-img"><img src="images/yy_fmwjcy.png"></div>
  42. <div class="mui-media-body">公文管理</div>
  43. </a>
  44. </li> -->
  45. <!--<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="office">
  46. <a href="#">
  47. <div class="media-body-img"><img src="images/yy_wpgl.png"></div>
  48. <div class="mui-media-body">日常办公</div>
  49. </a>
  50. </li>-->
  51. <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="meeting">
  52. <a href="#">
  53. <div class="media-body-img"><img src="images/meeting.png"></div>
  54. <div class="mui-media-body">会议通知</div>
  55. </a>
  56. </li>
  57. <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="workPlan">
  58. <a href="#">
  59. <div class="media-body-img"><img src="images/gzjh.png"></div>
  60. <div class="mui-media-body">工作计划管理</div>
  61. </a>
  62. </li>
  63. <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="doc">
  64. <a href="#">
  65. <div class="media-body-img"><img src="images/doc.png"></div>
  66. <div class="mui-media-body">文件资料库</div>
  67. </a>
  68. </li>
  69. </ul>
  70. </div>
  71. </body>
  72. <script type="text/javascript" src="js/jquery.min.js"></script>
  73. <script src="js/mui.min.js"></script>
  74. <script src="js/config.js"></script>
  75. <script>
  76. mui.init({
  77. swipeBack: true //启用右滑关闭功能
  78. });
  79. mui.plusReady(function() {
  80. mui('#grid').on('tap', 'li', function() {
  81. // if(this.getAttribute("id") == 'notice') {
  82. // mui.openWindow({
  83. // url: 'page/notice/noticeFolder.html',
  84. // id: 'noticeFolder.html'
  85. // })
  86. //
  87. // } else
  88. if(this.getAttribute("id") == 'attendance') {
  89. mui.openWindow({
  90. url: 'page/attendance/attendance.html',
  91. id: 'attendance.html'
  92. })
  93. }
  94. else if(this.getAttribute("id") == 'notice') {//通知公告
  95. mui.openWindow({
  96. url: 'page/notice/noticeList.html',
  97. id: 'noticeList.html'
  98. })
  99. }
  100. // else if(this.getAttribute("id") == 'food') {
  101. // mui.openWindow({
  102. // url: 'page/food/foodFolder.html',
  103. // id: 'foodFolder.html'
  104. // })
  105. // }
  106. else if(this.getAttribute("id") == 'process') {
  107. mui.openWindow({
  108. url: 'page/flow/flow_main.html',
  109. id: 'flow_main.html'
  110. })
  111. }
  112. // else if(this.getAttribute("id") == 'materials') {
  113. // mui.openWindow({
  114. // url: 'page/material/materialFolder.html',
  115. // id: 'materialFolder.html'
  116. // })
  117. // } else if(this.getAttribute("id") == 'efficiency') {
  118. // mui.openWindow({
  119. // url: 'page/efficiency/efficiency.html',
  120. // id: 'efficiency.html'
  121. // })
  122. // }
  123. // else if(this.getAttribute("id")=='schedule'){
  124. // mui.openWindow({
  125. // url:'page/schedule/scheduleList.html',
  126. // id:'scheduleList.html'
  127. // })
  128. // }
  129. // else if(this.getAttribute("id")=='trip'){
  130. // mui.openWindow({
  131. // url:'page/trip/tripFolder.html',
  132. // id:'tripFolder.html'
  133. // })
  134. // }
  135. else if(this.getAttribute("id")=='document'){
  136. mui.openWindow({
  137. url:'page/document/document.html',
  138. id:'document.html'
  139. })
  140. }
  141. // else if(this.getAttribute("id")=='office'){
  142. // mui.openWindow({
  143. // url:'page/office/office.html',
  144. // id:'office.html'
  145. // })
  146. // }
  147. else if(this.getAttribute("id")=='meeting'){ //会议通知
  148. mui.openWindow({
  149. url:'page/meeting/meetingFolder.html',
  150. id:'meetingFolder.html'
  151. })
  152. }
  153. else if(this.getAttribute("id")=='workPlan'){ //工作计划通知
  154. mui.openWindow({
  155. url:'page/workPlan/workPlan.html',
  156. id:'workPlan.html'
  157. })
  158. }else if(this.getAttribute("id")=='doc'){ //文件资料库
  159. mui.openWindow({
  160. url:'page/doc/doc_first.html',
  161. id:'doc_first.html'
  162. })
  163. }
  164. })
  165. //自定义事件,模拟点击“首页选项卡”
  166. document.addEventListener('appEvent', function() {
  167. // alert(22);
  168. // getNotice();
  169. });
  170. //公告点击事件
  171. // var pageDetail = mui.preload({
  172. // url: 'page/article/detailList.html',
  173. // id: 'detailList.html',
  174. // })
  175. // mui('#noticeList').on('tap', 'li', function() {
  176. // mui.fire(pageDetail, 'newsEvent', {
  177. // 'articleId': this.getAttribute('articleId')
  178. // })
  179. // mui.openWindow({
  180. // url: 'page/article/detailList.html',
  181. // id: 'detailList.html'
  182. // })
  183. // })
  184. })
  185. // function timer(opj) {
  186. // $(opj).find('ul').animate({
  187. // marginTop: "-1.5rem"
  188. // }, 500, function() {
  189. // $(this).css({
  190. // marginTop: "0.75rem"
  191. // }).find("li:first").appendTo(this);
  192. // })
  193. // }
  194. // $(function() {
  195. // var num = $('.notice_active').find('li').length;
  196. // if(num > 1) {
  197. // var time = setInterval('timer(".notice_active")', 3500);
  198. // $('.gg_more a').mousemove(function() {
  199. // clearInterval(time);
  200. // }).mouseout(function() {
  201. // time = setInterval('timer(".notice_active")', 3500);
  202. // });
  203. // }
  204. // $(".news_ck").click(function() {
  205. // location.href = $(".notice_active .notice_active_ch").children(":input").val();
  206. // })
  207. // });
  208. //获取最新5条公告
  209. function getNotice() {
  210. var url = API.API_URL();
  211. mui.ajax(url, {
  212. dataType: 'json', //服务器返回json格式数据
  213. type: 'post', //HTTP请求类型
  214. data: {
  215. method: 'pageArticle',
  216. pageNo: 1,
  217. pageSize: 5,
  218. p: '{folderId:291}'
  219. },
  220. timeout: 10000, //超时时间设置为10秒;
  221. headers: {
  222. 'Accept': 'application/json'
  223. },
  224. success: function(data) {
  225. //服务器返回响应
  226. console.log(JSON.stringify(data))
  227. var response = data;
  228. var obj = eval(response);
  229. var totalRow = obj.data.totalRow;
  230. var totalPage = obj.data.totalPage;
  231. var list = obj.data.list;
  232. var table = document.body.querySelector('#noticeList');
  233. //$('#noticeList').empty();
  234. table.innerHTML = ''; //清空公告
  235. for(var i = 0, len = list.length; i < len; i++) {
  236. var listTitle = list[i].title;
  237. var articleId = list[i].id;
  238. var li = document.createElement('li');
  239. li.setAttribute("articleId", articleId);
  240. li.className = 'notice_active_ch';
  241. li.innerHTML = '<span>' + listTitle + '</span>';
  242. table.appendChild(li);
  243. }
  244. // var num = $('.notice_active').find('li').length;
  245. // alert(num +'=='+totalRow);
  246. var time = null;
  247. if(totalRow > 1) {
  248. // clearInterval(time);
  249. if(time == null) {
  250. // time = setInterval('timer(".notice_active")', 3500);
  251. }
  252. // $('.gg_more a').mousemove(function() {
  253. // clearInterval(time);
  254. // }).mouseout(function() {
  255. // time = setInterval('timer(".notice_active")', 3500);
  256. // });
  257. }
  258. },
  259. error: function(xhr, type, errorThrown) {
  260. //异常处理;
  261. console.log(type);
  262. }
  263. });
  264. }
  265. </script>
  266. </html>