efficiencyBanjieList.html 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  6. <meta name="apple-mobile-web-app-capable" content="yes">
  7. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  8. <title>党建系统</title>
  9. <link href="../../css/mui.min.css" rel="stylesheet" />
  10. <link href="../../css/OA-style.css" rel="stylesheet" />
  11. </head>
  12. <body>
  13. <header class="mui-bar mui-bar-nav ">
  14. <a href="" class="mui-action-back back mui-pull-left"><img src="../../images/back.png"></a>
  15. <h1 id="title" class="mui-title">已办结列表</h1>
  16. </header>
  17. <div class="mui-content" >
  18. <div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="">
  19. <div class="mui-scroll">
  20. <div class="mui-card" v-for="item in items">
  21. <a href="javascript:;" :data-id="item.id" @tap="open_detail(item)">
  22. <div class="mui-card-header tongzhi_title"><b>{{item.duban_name}}</b></div>
  23. <div class="mui-card-content">
  24. <div class="mui-card-content-inner">
  25. <div >
  26. <div class="tongzhi_div"><img class="tongzhi_img" src="../../images/dubanneirong.png"></div>
  27. <div class="tongzhi_div2">{{item.content}}</div><p></p>
  28. <span class="tongzhi_div"><img class="tongzhi_img" src="../../images/zhibanshijian.png"></span>
  29. <span class="tongzhi_div1">{{item.duban_date}}至{{item.yujing_date}}</span>
  30. </div>
  31. </div>
  32. </div>
  33. </a>
  34. </div>
  35. </div>
  36. </div>
  37. </div>
  38. <script type="text/javascript" src="../../js/jquery-1.11.2.min.js"></script>
  39. <script src="../../js/mui.min.js"></script>
  40. <script src="../../js/config.js"></script>
  41. <script src="../../js/app.js"></script>
  42. <script src="../../js/dj/article/list.js"></script>
  43. <script src="../../js/vue.min.js"></script>
  44. <script>
  45. var pageDetail = null;
  46. mui.init({
  47. pullRefresh: {
  48. container: '#pullrefresh',
  49. down: {
  50. style: 'circle', //必选,下拉刷新样式,目前支持原生5+ ‘circle’ 样式
  51. color: '#2BD009', //可选,默认“#2BD009” 下拉刷新控件颜色
  52. height: '50px', //可选,默认50px.下拉刷新控件的高度,
  53. range: '100px', //可选 默认100px,控件可下拉拖拽的范围
  54. offset: '0px', //可选 默认0px,下拉刷新控件的起始位置
  55. // auto: true, //可选,默认false.首次加载自动上拉刷新一次
  56. callback: reloadNews //必选,刷新函数,根据具体业务来编写,比如通过ajax从服务器获取新数据;
  57. },
  58. up: {
  59. contentrefresh: '正在加载...',
  60. auto: true, //可选,默认false.自动上拉加载一次
  61. callback: pullupRefresh
  62. }
  63. }
  64. });
  65. var vmA = new Vue({
  66. el: '#pullrefresh',
  67. data: {
  68. items: [] //列表信息流数据
  69. }
  70. });
  71. /**
  72. * 下拉刷新具体业务实现
  73. */
  74. function reloadNews() {
  75. pageNo = 1;
  76. vmA.items = [];
  77. // var table = document.body.querySelector('.mui-table-view');
  78. // table.innerHTML = "";
  79. addData();
  80. }
  81. var pageNo = 1;
  82. var jump_type = 0;
  83. /**
  84. * 上拉加载具体业务实现
  85. */
  86. function pullupRefresh() {
  87. addData();
  88. }
  89. function addData() {
  90. var url = API.API_URL();
  91. var serviceId = "oa_efficiency_2018V0010PHONE008";
  92. var state = app.getState(); //获取登陆信息
  93. var staffId = state.user.useId;
  94. var obj = {
  95. currentUser: staffId,
  96. pSize: APP.PageSize,
  97. p: pageNo
  98. };
  99. app.ajax(serviceId,obj, function(data) {
  100. //服务器返回响应
  101. console.log(JSON.stringify(data))
  102. var result = data.returnParams;
  103. var totalRow = data.total;
  104. var totalPage = Math.ceil(totalRow / APP.PageSize);
  105. //var totalPage = data.current;
  106. var list = data.list;
  107. console.log(list.length);
  108. if(list.length > 0) {
  109. vmA.items = vmA.items.concat(convert(list));
  110. }
  111. pageNo = endPull(totalPage, pageNo);
  112. });
  113. }
  114. /**
  115. * 1、将服务端返回数据,转换成前端需要的格式
  116. * 2、若服务端返回格式和前端所需格式相同,则不需要改功能
  117. *
  118. * @param {Array} items
  119. */
  120. function convert(items) {
  121. var newItems = [];
  122. items.forEach(function(item) {
  123. newItems.push({
  124. xiaolv_id: item.xiaolv_id,
  125. fankui_id:item.fankui_id,
  126. duban_name: item.duban_name,
  127. duban_date:item.duban_date,
  128. yujing_date:item.yujing_date,
  129. content: item.content == null ? "" : item.content.substr(0, 70)
  130. });
  131. });
  132. return newItems;
  133. }
  134. /*mui.plusReady(function() {
  135. var self = plus.webview.currentWebview();
  136. jump_type = self.jump_type;
  137. var title1 = mui('#title');
  138. title1[0].innerHTML = self.name;
  139. //接收上个界面传递的参数
  140. window.addEventListener('listEvent', function(event) {
  141. });
  142. // pageDetail = mui.preload({
  143. // url: 'detailList.html',
  144. // id: 'detailList.html',
  145. // })
  146. });*/
  147. /**
  148. * 打开详情
  149. *
  150. * @param {Object} item
  151. */
  152. function open_detail(item) {
  153. mui.openWindow({
  154. url: '../../page/efficiency/efficiencyBanjieInfo.html',
  155. id: 'efficiencyBanjieInfo.html',
  156. extras:{'xiaolv_id':item.xiaolv_id,'fankui_id':item.fankui_id}
  157. })
  158. }
  159. </script>
  160. </body>
  161. </html>