三元财务UI

dynamic.html 8.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  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.css" rel="stylesheet" />
  10. <link href="../css/mui.picker.css" rel="stylesheet" />
  11. <link href="../css/mui.poppicker.css" rel="stylesheet" />
  12. <link href="../css/iconfont.css" rel="stylesheet" />
  13. <link href="css/dynamic.css" rel="stylesheet" />
  14. </head>
  15. <style>
  16. .tab_color{color: #2cc6a7 !important;}
  17. </style>
  18. <body>
  19. <div class="mui-content">
  20. <div id="slider" class="mui-slider">
  21. <div class="titdyna">
  22. <ul>
  23. <li class="tab_color" data-index="today">
  24. 今天
  25. </li>
  26. <li data-index="yesterday">
  27. 昨天
  28. </li>
  29. <li data-index="month">
  30. 本月
  31. </li>
  32. <li data-index="">
  33. 全部
  34. </li>
  35. </ul>
  36. </div>
  37. <div class="mui-slider-group" style="margin-top: 38px;">
  38. <div>
  39. <ul class="mui-table-view" id="folowtoday"></ul>
  40. </div>
  41. </div>
  42. </div>
  43. <div style="width: 100%; height: 60px;"></div>
  44. <nav class="mui-tabs">
  45. <a class="mui-tabs-item" href="client_index.html">
  46. <span class="mui-icon iconfont">
  47. <img src="../img/task.png" />
  48. </span>
  49. <span class="mui-tab-label">任务中心</span>
  50. </a>
  51. <a class="mui-tabs-item mui-active" href="dynamic.html">
  52. <span class="mui-icon iconfont">
  53. <img src="../img/dynamic_c.png" />
  54. </span>
  55. <span class="mui-tab-label font-color4">工作动态</span>
  56. </a>
  57. <a class="mui-tabs-item" href="Setting-1.html">
  58. <span class="mui-icon iconfont">
  59. <img src="../img/personage.png" />
  60. </span>
  61. <span class="mui-tab-label">我的</span>
  62. </a>
  63. </nav>
  64. <script src="../js/mui.min.js?"></script>
  65. <script src="../js/mui.picker.js"></script>
  66. <script src="../js/mui.poppicker.js"></script>
  67. <script src="../js/jquery.min.js"></script>
  68. <script src="../Script/Common/huayi.config.js"></script>
  69. <script src="../Script/Common/huayi.http.js"></script>
  70. <!--<script src="AddWorkolder.js"></script>-->
  71. <script>
  72. //工单跟踪
  73. var openid = helper.cookies.get("openid");
  74. var pageSize = 999; //每页显示条目
  75. var page = 1; //页数
  76. var datatype='today'
  77. flow(); //今天
  78. // flowyesday(); //昨天
  79. // flowmonth(); //本月
  80. // flow(); //今年
  81. mui.init({
  82. swipeBack: true //启用右滑关闭功能
  83. });
  84. //tab切换
  85. $(".titdyna ul li").click(function(){
  86. $(".titdyna ul li").removeClass("tab_color");
  87. $(this).addClass("tab_color");
  88. // alert($(this).attr('data-index'));
  89. datatype=$(this).attr('data-index');
  90. $.ajax({
  91. url: huayi.config.callcenter_url + '/WxLogin/GetWorkOrderItemList',
  92. data: {
  93. openid: openid, //微信openid,
  94. daytype:datatype,
  95. pagesize: pageSize,
  96. },
  97. async: true,
  98. dataType: 'json',
  99. type: 'get', //HTTP请求类型
  100. success: function(data) {
  101. if(data.state.toLowerCase() == "success") {
  102. //alert(JSON.stringify(data.rows[0].CreateTime));
  103. $("#folowtoday").empty();
  104. if(data.rows && data.rows.length > 0) {
  105. $(data.rows).each(function(i, n) {
  106. var str = '';
  107. if(n.Type==1&&n.IsLast) {
  108. str = str + n.CreateUserName + " 完结工单";
  109. } else if(n.Type==1&&n.DealTime) {
  110. str = str + n.CreateUserName + " 处理工单";
  111. } else if(n.Type==1&&n.SureUserName) {
  112. str = str + n.SureUserName + " 接单";
  113. } else if(n.Type==1&&n.ToDeptName) {
  114. //str = str + " 指派工单给 " + n.ToDeptName + " ";
  115. str = str + n.CreateUserName + " 指派给 " + n.ToDeptName + " ";
  116. if(n.Type==1&&n.ToUserName) {
  117. str = str + n.ToUserName;
  118. }
  119. str = str;
  120. }
  121. if (n.Type==2) {
  122. str = str + n.CreateUserName+"催办了工单";
  123. }
  124. if (n.Type==3) {
  125. str = str + n.CreateUserName+"评论了工单";
  126. }
  127. //else if(row.IsStart) {str = str + row.CreateUserName + " 重新开启工单";}
  128. $('<li class="mui-table-view-cell-line mui-tail-contail mui-table-view-li"><div class="mui-input-row mui-tail font-color4"><span>' + n.CreateTime +
  129. '</span></br><span>工单号为:'+n.WorkOrderID+
  130. '</span><span class="span3">' + str +
  131. '</span></div><div class="string"></div><div class="circular_h"></div></li>').appendTo('#folowtoday');
  132. });
  133. var num = data.rows.length - 1;
  134. $("#folowtoday li:eq(0)").children(".string").css("top", "20px");
  135. $("#folowtoday li:eq(" + num + ")").children(".string").css("height", "5px");
  136. $("#folowtoday li:eq(0)").children(".string").css("top", "20px");
  137. $("#folowtoday li:eq(0)").children(".circular_h").css({
  138. "background": "#2cc6a7",
  139. "left": "15px",
  140. "top": "20px",
  141. "width": "12px",
  142. "height": "12px",
  143. "border-radius": "6px"
  144. });
  145. $("#folowtoday li:eq(" + num + ")").children(".circular_h").css({
  146. "left": "15px",
  147. "width": "12px",
  148. "height": "12px",
  149. "border-radius": "6px"
  150. });
  151. }
  152. }
  153. },
  154. error: function(xhr, type, errorThrown) {
  155. //异常处理;
  156. }
  157. })
  158. })
  159. // 今天
  160. function flow() {
  161. $.ajax({
  162. url: huayi.config.callcenter_url + '/WxLogin/GetWorkOrderItemList',
  163. data: {
  164. openid: openid, //微信openid,
  165. daytype:'today',
  166. pagesize: pageSize,
  167. },
  168. async: true,
  169. dataType: 'json',
  170. type: 'get', //HTTP请求类型
  171. success: function(data) {
  172. if(data.state.toLowerCase() == "success") {
  173. //alert(JSON.stringify(data.rows[0].CreateTime));
  174. if(data.rows && data.rows.length > 0) {
  175. $(data.rows).each(function(i, n) {
  176. var str = '';
  177. if(n.Type==1&&n.IsLast) {
  178. str = str + n.CreateUserName + " 完结工单";
  179. } else if(n.Type==1&&n.DealTime) {
  180. str = str + n.CreateUserName + " 处理工单";
  181. } else if(n.Type==1&&n.SureUserName) {
  182. str = str + n.SureUserName + " 接单";
  183. } else if(n.Type==1&&n.ToDeptName) {
  184. //str = str + " 指派工单给 " + n.ToDeptName + " ";
  185. str = str + n.CreateUserName + " 指派给 " + n.ToDeptName + " ";
  186. if(n.Type==1&&n.ToUserName) {
  187. str = str + n.ToUserName;
  188. }
  189. str = str;
  190. }
  191. if (n.Type==2) {
  192. str = str + n.CreateUserName+"催办了工单";
  193. }
  194. if (n.Type==3) {
  195. str = str + n.CreateUserName+"评论了工单";
  196. }
  197. //else if(row.IsStart) {str = str + row.CreateUserName + " 重新开启工单";}
  198. $('<li class="mui-table-view-cell-line mui-tail-contail mui-table-view-li"><div class="mui-input-row mui-tail font-color4"><span>' + n.CreateTime +
  199. '</span></br><span>工单号为:'+n.WorkOrderID+
  200. '</span><span class="span3">' + str +
  201. '</span></div><div class="string"></div><div class="circular_h"></div></li>').appendTo('#folowtoday');
  202. });
  203. var num = data.rows.length - 1;
  204. $("#folowtoday li:eq(0)").children(".string").css("top", "20px");
  205. $("#folowtoday li:eq(" + num + ")").children(".string").css("height", "5px");
  206. $("#folowtoday li:eq(0)").children(".string").css("top", "20px");
  207. $("#folowtoday li:eq(0)").children(".circular_h").css({
  208. "background": "#2cc6a7",
  209. "left": "15px",
  210. "top": "20px",
  211. "width": "12px",
  212. "height": "12px",
  213. "border-radius": "6px"
  214. });
  215. $("#folowtoday li:eq(" + num + ")").children(".circular_h").css({
  216. "left": "15px",
  217. "width": "12px",
  218. "height": "12px",
  219. "border-radius": "6px"
  220. });
  221. }
  222. }
  223. },
  224. error: function(xhr, type, errorThrown) {
  225. //异常处理;
  226. }
  227. })
  228. }
  229. </script>
  230. </body>
  231. </html>