Ei kuvausta

SeatRecords.html 7.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205
  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.0">
  7. <script src="../Script/Common/huayi.load.js"></script>
  8. <script src="../Script/Common/huayi.config.js"></script>
  9. <link rel="stylesheet" href="../js/zTree/zTreeStyle.css" />
  10. <link href="../css/WorkOrder/Search.css" rel="stylesheet">
  11. <link href="../css/init.css" rel="stylesheet" />
  12. <script src="../My97DatePicker/WdatePicker.js"></script>
  13. <script src="../js/laydate/laydate.js"></script>
  14. <style>
  15. table td {
  16. word-break: break-all;
  17. word-wrap: break-word;
  18. }
  19. .toolBar input,
  20. .toolBar select {
  21. width: 200px;
  22. }
  23. th {
  24. padding: 5px;
  25. text-align: center;
  26. }
  27. .daoHang {
  28. margin-bottom: 15px;
  29. }
  30. </style>
  31. </head>
  32. <body class="gray-bg">
  33. <div class="wrapper wrapper-content animated fadeInRight">
  34. <div class="daoHang clearfix">
  35. <div class="dhLeft">
  36. <sapn>
  37. <i class="syIcon"></i>位置:
  38. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  39. <a href="javaScript:;">业务统计</a>&gt;
  40. <a href="" class="nowPosition">坐席记录报表</a>
  41. </sapn>
  42. </div>
  43. <div class="dhRight">
  44. <a href="" title="刷新"><i class="fa fa-refresh"></i></a>
  45. </div>
  46. </div>
  47. <div class="Content_box">
  48. <div class="complain">
  49. <div class="toolBar clearfix">
  50. <div class="toolLeft">
  51. 开始日期:
  52. <input class="photo x-color inputs" type="text" id="squeryTime" autocomplete="off" />
  53. 结束时间:
  54. <input class="photo x-color inputs" type="text" id="equeryTime" autocomplete="off" />
  55. <!-- 坐席工号:
  56. <input class="photo x-color inputs" type="text" id="usercode" autocomplete="off" />
  57. 坐席状态:
  58. <select class="photo x-color inputs" type="text" id="state">
  59. <option value="">请选择</option>
  60. <option value="0">签入</option>
  61. <option value="1">签出</option>
  62. <option value="2">置闲</option>
  63. <option value="3">置忙</option>
  64. </select> -->
  65. <button class="btns search">查询</button>
  66. <!-- <button class="btns exportFile">导出</button> -->
  67. </div>
  68. </div>
  69. <div class="tab-content">
  70. <div class="tab-pane fade active in" id="import_from_file">
  71. <div style="width: 100%;padding: 10px;">
  72. <table id="table1" class="tables" data-row-style="rowStyle" data-query-params="queryParams"
  73. data-pagination="true">
  74. <thead>
  75. <tr>
  76. <th data-field="" data-formatter="serialNumber" data-align="center">序号</th>
  77. <th data-field="AgentId" data-align="center">坐席工号</th>
  78. <th data-field="UserName" data-align="center">坐席姓名</th>
  79. <th data-field="签入" data-align="center" data-formatter="checkInList">签入</th>
  80. <th data-field="签出" data-align="center" data-formatter="checkOutList">签出</th>
  81. <th data-field="置闲" data-align="center" data-formatter="buyCarefreeList">置闲</th>
  82. <th data-field="置忙" data-align="center" data-formatter="buyBusyList">置忙</th>
  83. </tr>
  84. </thead>
  85. </table>
  86. </div>
  87. </div>
  88. </div>
  89. </div>
  90. </div>
  91. </div>
  92. <script>
  93. $(document).ready(function () {
  94. laydate.render({
  95. elem: '#squeryTime',
  96. theme: '#00a1cb',
  97. type: 'datetime',
  98. });
  99. laydate.render({
  100. elem: '#equeryTime',
  101. theme: '#00a1cb',
  102. type: 'datetime',
  103. });
  104. initTable();
  105. });
  106. //表格
  107. function initTable() {
  108. $.ajax({
  109. url: huayi.config.callcenter_url + 'WorkOrderReport/GetZuoXiState',
  110. type: 'get',
  111. data: {
  112. starttime: $("#squeryTime").val(),
  113. endtime: $("#equeryTime").val(),
  114. usercode: $("#usercode").val(),
  115. state: $("#state").val(),
  116. token: $.cookie("token")
  117. },
  118. dataType: "json",
  119. async: true,
  120. success: function (returnValue) {
  121. // if (returnValue.state.toLowerCase() == "success") {
  122. var resultData = returnValue;
  123. $('#table1').bootstrapTable('load', resultData);
  124. // }
  125. //异步获取数据
  126. }
  127. });
  128. $('#table1').bootstrapTable('destroy').bootstrapTable({
  129. striped: true
  130. });
  131. }
  132. //序号
  133. function serialNumber(val, row, index) {
  134. return index + 1;
  135. }
  136. // 签入
  137. function checkInList(val, row) {
  138. return '<div class="imgs" ><a class="" onclick="viewList(\'' + row.AgentId + '\', \'0\')" >' + val +
  139. '</a></div>';
  140. }
  141. // 签出
  142. function checkOutList(val, row) {
  143. return '<div class="imgs" ><a class="" onclick="viewList(\'' + row.AgentId + '\', \'1\')" >' + val +
  144. '</a></div>';
  145. }
  146. // 置闲
  147. function buyCarefreeList(val, row) {
  148. return '<div class="imgs" ><a class="" onclick="viewList(\'' + row.AgentId + '\', \'2\')" >' + val +
  149. '</a></div>';
  150. }
  151. // 置忙
  152. function buyBusyList(val, row) {
  153. return '<div class="imgs" ><a class="" onclick="viewList(\'' + row.AgentId + '\', \'3\')" >' + val +
  154. '</a></div>';
  155. }
  156. // 查看列表
  157. function viewList(usercode, state) {
  158. usercode = encodeURIComponent(usercode);
  159. state = encodeURIComponent(state);
  160. starttime = $("#squeryTime").val();
  161. endtime = $("#equeryTime").val();
  162. starttime = encodeURIComponent(starttime);
  163. endtime = encodeURIComponent(endtime);
  164. layer.open({
  165. type: 2,
  166. content: "./SeatRecordsList.html?usercode=" + usercode + "&state=" + state +
  167. "&starttime=" + starttime + "&endtime=" + endtime, //iframe的url,no代表不显示滚动条
  168. title: '坐席报表',
  169. area: ['90%', '90%'], //宽高
  170. });
  171. }
  172. //搜索
  173. $(".search").click(function() {
  174. initTable();
  175. });
  176. //导出
  177. $(".exportFile").click(function() {
  178. var start = $("#squeryTime").val();
  179. var end = $("#equeryTime").val();
  180. var url = huayi.config.callcenter_url + "WorkOrderReport/GetUserReturn?token=" + $.cookie("token");
  181. url += "&start=" + start + "&end=" + end + "&isExport=true";
  182. window.location.href = url;
  183. })
  184. </script>
  185. </body>
  186. </html>