暫無描述

WorkList.html 5.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>工单列表</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 rel="stylesheet" href="../css/iconfont.css" />
  11. <!-- <link rel="stylesheet" href="../css/inits.css" />-->
  12. <style>
  13. .mui-bar-popover {
  14. width: 30%;
  15. }
  16. .mui-popover.mui-bar-popover .mui-table-view {
  17. width: 100%;
  18. }
  19. .san {
  20. font-size: 14px;
  21. margin-right: 5px
  22. }
  23. .nav_a {
  24. border-right: 1px solid #ccc;
  25. }
  26. .time {
  27. text-align: right;
  28. }
  29. .mui-table-view .mui-media-object {
  30. /* line-height: 71px; */
  31. max-width: 80px;
  32. height: 80px;
  33. }
  34. input[type=search] {
  35. border: 1px solid #ccc;
  36. border-radius: 18px;
  37. background-color: rgb(255, 255, 255);
  38. }
  39. </style>
  40. </head>
  41. <body>
  42. <div class="mui-content mui-content mui-scroll-wrapper" id="pullrefresh">
  43. <div class="mui-scroll">
  44. <ul class="mui-table-view" id="OA_task_2">
  45. </ul>
  46. </div>
  47. </div>
  48. <script src="../js/zepto.js"></script>
  49. <script src="../Script/Common/huayi.config.js"></script>
  50. <script src="../Script/Common/huayi.http.js"></script>
  51. <script src="../js/mui.min.js"></script>
  52. <script type="text/javascript">
  53. var page = 1; //页数
  54. var pageSize = 10; //每页显示条目
  55. var total; //数据总条数
  56. mui.init({
  57. swipeBack: false,
  58. pullRefresh: {
  59. container: '#pullrefresh',
  60. up: {
  61. contentrefresh: "正在加载...", //可选,正在加载状态时,上拉加载控件上显示的标题内容
  62. contentnomore: '没有更多数据了', //可选,请求完毕若没有更多数据时显示的提醒内容;
  63. callback: pullupRefresh
  64. }
  65. }
  66. });
  67. Ajax();
  68. // 下拉刷新
  69. function pullupRefresh() {
  70. setTimeout(function() {
  71. mui('#pullrefresh').pullRefresh().endPullupToRefresh((page++ >= Math.ceil(total / 10)));
  72. $.ajax({
  73. url: huayi.config.callcenter_url + 'WxLogin/GetList',
  74. data: {
  75. // openid: helper.cookies.get("openid"), //微信openid
  76. openid: "oKOqcv31fh76rtNmJDjKc39oIsfA",
  77. page: page,
  78. pagesize: pageSize
  79. },
  80. async: true,
  81. dataType: 'json',
  82. type: 'get', //HTTP请求类型
  83. success: function(data) {
  84. $(data.rows).each(function(i, n) {
  85. $('<li class="mui-table-view-cell order" data-index="' + n.ID + '">' +
  86. '<div class = "mui-slider-right mui-disabled" >' +
  87. '<a class = "mui-btn mui-btn-grey" > 处理 </a></div >' +
  88. '<div class = "mui-slider-handle" >' +
  89. '<div class = "mui-table-cell mui-col-xs-10" > ' +
  90. '<h4 class = "mui-ellipsis" > ' + n.Detail + ' </h4> ' +
  91. '<h5 > <span>联系人:' + n.Customer + '</span>' +
  92. '</h5>' +
  93. '</div >' +
  94. '</div> ' +
  95. '</li > ').appendTo('#OA_task_2 ');
  96. })
  97. //工单跳转
  98. $('.order').on('tap', function() {
  99. var index = $(this).attr('data-index');
  100. window.location.href = "Schedule.html?id=" + index;
  101. });
  102. },
  103. error: function(xhr, type, errorThrown) {
  104. //异常处理;
  105. }
  106. })
  107. }, 1000);
  108. }
  109. //获取数据
  110. function Ajax() {
  111. $.ajax({
  112. url: huayi.config.callcenter_url + 'WxLogin/GetList',
  113. data: {
  114. openid:"oKOqcv31fh76rtNmJDjKc39oIsfA", //微信openid ,
  115. page: page,
  116. pagesize: pageSize
  117. },
  118. async: true,
  119. dataType: 'json',
  120. type: 'get', //HTTP请求类型
  121. success: function(data) {
  122. // var con=JSON.parse(data);
  123. // total=con.total;
  124. total = data.total;
  125. $(data.rows).each(function(i, n) {
  126. $('<li class="mui-table-view-cell order" data-index="' + n.ID + '">' +
  127. '<div class = "mui-slider-right mui-disabled" >' +
  128. '<a class = "mui-btn mui-btn-grey" > 处理 </a></div >' +
  129. '<div class = "mui-slider-handle" >' +
  130. '<div class = "mui-table-cell mui-col-xs-10" > ' +
  131. '<h4 class = "mui-ellipsis" > ' + n.Detail + ' </h4> ' +
  132. '<h5 > <span>联系人:' + n.Customer + '</span>' +
  133. '</h5>' +
  134. '</div >' +
  135. '</div> ' +
  136. '</li > ').appendTo('#OA_task_2 ');
  137. })
  138. //工单跳转
  139. $('.order').on('tap', function() {
  140. var index = $(this).attr('data-index');
  141. window.location.href = "Schedule.html?id=" + index;
  142. });
  143. },
  144. error: function(xhr, type, errorThrown) {
  145. //异常处理;
  146. }
  147. })
  148. }
  149. (function($) {
  150. var btnArray = ['确认', '取消'];
  151. //第二个demo,向左拖拽后显示操作图标,释放后自动触发的业务逻辑
  152. $('#OA_task_2').on('slideleft', '.mui-table-view-cell', function(event) {
  153. var elem = this;
  154. var Workindex = elem.getAttribute("data-index");
  155. mui.confirm('确认要处理此工单?', '提示', btnArray, function(e) {
  156. if(e.index == 0) {
  157. window.location.href = "Workdeal.html?id=" + Workindex;
  158. } else {
  159. setTimeout(function() {
  160. $.swipeoutClose(elem);
  161. }, 0);
  162. }
  163. });
  164. });
  165. })(mui);
  166. </script>
  167. </body>
  168. </html>