PingAnYeXianSZCG_Web 前端代码

WorkList.html 7.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268
  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. .Success {
  40. color: #4cd964;
  41. }
  42. .Finish {
  43. color: #ccc;
  44. }
  45. .mui-search.mui-active:before {
  46. font-size: 20px;
  47. right: auto;
  48. left: 5px;
  49. display: block;
  50. margin-right: 0;
  51. top: 25px;
  52. }
  53. .mui-icon-clear{
  54. right: 80px!important;
  55. }
  56. .mui-search{
  57. margin-right: 55px;
  58. }
  59. .success{
  60. color: #ccc;
  61. }
  62. .wait{
  63. color: #2AC845;
  64. }
  65. </style>
  66. </head>
  67. <body>
  68. <div class="mui-content mui-content mui-scroll-wrapper" id="pullrefresh">
  69. <div class="mui-scroll">
  70. <ul class="mui-table-view" id="OA_task_2">
  71. <li class="mui-table-view-cell">
  72. <div class="mui-input-row mui-search">
  73. <input type="search" class="mui-input-clear go_search" placeholder="请输入关键字" style="margin-bottom: 0;">
  74. </div>
  75. <div class="mui-btn mui-btn-primary turnGo">更多</div>
  76. </li>
  77. </ul>
  78. </div>
  79. </div>
  80. <script src="../js/zepto.js"></script>
  81. <script src="../Script/Common/huayi.config.js"></script>
  82. <script src="../Script/Common/huayi.http.js"></script>
  83. <script src="../js/mui.min.js"></script>
  84. <script type="text/javascript">
  85. var page = 1; //页数
  86. var pageSize = 10; //每页显示条目
  87. var total; //数据总条数
  88. var state=helper.request.queryString("state");//手机号
  89. var name=helper.request.queryString("name");//手机号
  90. var tel=helper.request.queryString("tel");//受理编号
  91. var starttime=helper.request.queryString("starttime");//受理编号
  92. var endtime=helper.request.queryString("endtime");//受理编号
  93. var workid=helper.request.queryString("workid");//受理编号
  94. var source=helper.request.queryString("source");//受理编号
  95. var infotype=helper.request.queryString("infotype");//受理编号
  96. mui.init({
  97. swipeBack: false,
  98. pullRefresh: {
  99. container: '#pullrefresh',
  100. up: {
  101. contentrefresh: "正在加载...", //可选,正在加载状态时,上拉加载控件上显示的标题内容
  102. contentnomore: '没有更多数据了', //可选,请求完毕若没有更多数据时显示的提醒内容;
  103. callback: pullupRefresh
  104. }
  105. }
  106. });
  107. //查找
  108. $('.go_search').on('input focus', function() {
  109. keyw = $(this).val();
  110. page = 1;
  111. console.log();
  112. Ajax(keyw);
  113. })
  114. Ajax();
  115. // 下拉刷新
  116. function pullupRefresh(keyw) {
  117. setTimeout(function() {
  118. mui('#pullrefresh').pullRefresh().endPullupToRefresh((page++ >= Math.ceil(total / 10)));
  119. $.ajax({
  120. url: huayi.config.callcenter_url + 'WxLogin/GetList',
  121. data: {
  122. openid: helper.cookies.get("openid"), //微信openid
  123. // openid: "oKOqcv31fh76rtNmJDjKc39oIsfA",
  124. key: keyw,
  125. page: page,
  126. state:state,
  127. name:name, ///联系人
  128. tel:tel,//联系电话
  129. starttime:starttime, //
  130. endtime:endtime, //
  131. workid:workid,//工单编号
  132. source:source,//工单来源
  133. infotype:infotype, //信息分类
  134. pagesize: pageSize
  135. },
  136. async: true,
  137. dataType: 'json',
  138. type: 'get', //HTTP请求类型
  139. success: function(data) {
  140. total = data.total;
  141. $(data.rows).each(function(i, n) {
  142. var States = n.State;
  143. console.log(States);
  144. var html=''
  145. var Html = '';
  146. if(States < 2) {
  147. Html = '<div class = "mui-slider-right mui-disabled" >' +
  148. '<a class = "mui-btn mui-btn-grey" > 处理 </a></div >' +
  149. '<div class = "mui-slider-handle" >'
  150. html='<h5 class="wait" style="text-align:right;"><span>待处理</span></h5>'
  151. }else{
  152. html='<h5 class="success" style="text-align:right;"><span>已完成</span></h5>'
  153. }
  154. $('<li class="mui-table-view-cell order" data-index="' + n.ID + '">' +
  155. '' + Html + '' +
  156. '<div class = "mui-table-cell mui-col-xs-10" > ' +
  157. '<h4 class = "mui-ellipsis" > ' + n.Detail + ' </h4> ' +
  158. '<h5 > <span>联系人:' + n.Customer + '</span>' +
  159. '</h5>' +
  160. '</div >' +
  161. '</div> ' +
  162. ''+html+''+
  163. '</li > ').appendTo('#OA_task_2 ');
  164. })
  165. //工单跳转
  166. $('.order').on('tap', function() {
  167. var index = $(this).attr('data-index');
  168. window.location.href = "Schedule.html?id=" + index;
  169. });
  170. },
  171. error: function(xhr, type, errorThrown) {
  172. //异常处理;
  173. }
  174. })
  175. }, 1000);
  176. }
  177. //获取数据
  178. function Ajax(keyw) {
  179. $(".order").remove();
  180. $.ajax({
  181. url: huayi.config.callcenter_url + 'WxLogin/GetList',
  182. data: {
  183. openid: helper.cookies.get("openid"), //微信openid ,
  184. // openid: "oKOqcv31fh76rtNmJDjKc39oIsfA",
  185. key: keyw,
  186. page: page,
  187. state:state,
  188. name:name, ///联系人
  189. tel:tel,//联系电话
  190. starttime:starttime, //
  191. endtime:endtime, //
  192. workid:workid,//工单编号
  193. source:source,//工单来源
  194. infotype:infotype, //信息分类
  195. pagesize: pageSize
  196. },
  197. async: true,
  198. dataType: 'json',
  199. type: 'get', //HTTP请求类型
  200. success: function(data) {
  201. total = data.total;
  202. $(data.rows).each(function(i, n) {
  203. var States = n.State;
  204. console.log(States);
  205. var html=''
  206. if(States < 2) {
  207. html='<h5 class="wait" style="text-align:right;"><span>待处理</span></h5>'
  208. }else{
  209. html='<h5 class="success" style="text-align:right;"><span>已完成</span></h5>'
  210. }
  211. $('<li class="mui-table-view-cell order" data-index="' + n.ID + '">' +
  212. '<div class = "mui-table-cell mui-col-xs-10" > ' +
  213. '<h4 class = "mui-ellipsis" > ' + n.Detail + ' </h4> ' +
  214. '<h5 > <span>联系人:' + n.Customer + '</span>' +
  215. '</h5>' +
  216. '</div >' +
  217. '</div> ' +
  218. ''+html+''+
  219. '</li > ').appendTo('#OA_task_2 ');
  220. })
  221. //工单跳转
  222. $('.order').on('tap', function() {
  223. var index = $(this).attr('data-index');
  224. window.location.href = "Schedule.html?id=" + index;
  225. });
  226. },
  227. error: function(xhr, type, errorThrown) {
  228. //异常处理;
  229. }
  230. })
  231. }
  232. $('.turnGo').on('tap',function(){
  233. window.location.href = "WorkSearch.html?";
  234. })
  235. </script>
  236. </body>
  237. </html>