12345市长热线标准版-前端

seatsCheck.html 4.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  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 href="../css/WorkOrder/Search.css" rel="stylesheet">
  10. <link href="../css/init.css" rel="stylesheet" />
  11. <!--<script src="../css/laydate/laydate.js"></script>-->
  12. <script src="../js/laydate/laydate.js"></script>
  13. <style type="text/css">
  14. .time-box{
  15. display: inline-block;
  16. position: relative;
  17. }
  18. .toolRight input{
  19. padding-right: 30px;
  20. }
  21. .tub{
  22. position: absolute;
  23. right: 8px;
  24. top: 5px;
  25. font-size: 18px;
  26. color: #00a0ca;
  27. }
  28. #table1 thead th{
  29. background: #00a0cd;
  30. color: #fff;
  31. }
  32. </style>
  33. </head>
  34. <body class="gray-bg">
  35. <div class="wrapper wrapper-content animated fadeInRight">
  36. <div class="daoHang clearfix">
  37. <div class="dhLeft">
  38. <sapn>
  39. <i class="syIcon"></i>位置:
  40. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  41. <a href="javaScript:;">报表管理</a>&gt;
  42. <a href="javaScript:;" class="nowPosition">坐席考勤</a>
  43. </sapn>
  44. </div>
  45. <div class="dhRight">
  46. <a href="" title="刷新"><i class="fa fa-refresh"></i></a>
  47. </div>
  48. </div>
  49. <div class="Content_box">
  50. <!--待处理/-->
  51. <div class="complain Shows">
  52. <div class="th-box">
  53. <div class="toolBar clearfix">
  54. <div class="toolRight">
  55. 开始时间: <span class="time-box"><i class="tub fa fa-calendar"></i><input type="text" id="startTime" /></span>
  56. 结束时间: <span class="time-box"><i class="tub fa fa-calendar"></i><input type="text" id="endTime" /></span>
  57. <a class="search btns">搜索</a>
  58. <a class="btns export">导出</a>
  59. </div>
  60. </div>
  61. </div>
  62. <div style="width: 100%;padding: 10px;">
  63. <table id="table1" class="table table-hover table-striped table-bordered table-condensed">
  64. <thead>
  65. <tr>
  66. <th >工号</th>
  67. <th>姓名</th>
  68. <th>分机号</th>
  69. <th>空闲时长</th>
  70. <th>置忙时长</th>
  71. <th>通话时长</th>
  72. <th>话后处理时长</th>
  73. <th>置忙次数</th>
  74. <th>登录次数</th>
  75. <th>签入时间</th>
  76. <th>签出时间</th>
  77. <th>签入总时长</th>
  78. <th>呼入量</th>
  79. <th>呼出量</th>
  80. </tr>
  81. </thead>
  82. <tbody>
  83. </tbody>
  84. </table>
  85. </div>
  86. </div>
  87. </div>
  88. </div>
  89. <script>
  90. var table1=$('#table1');
  91. var dates=new Date();
  92. var time=dates.getFullYear()+"-"+(dates.getMonth()+1)+"-"+(dates.getDate());
  93. $(document).ready(function() {
  94. $('#startTime').val(time)
  95. //年月选择器
  96. laydate.render({
  97. elem: '#startTime'
  98. ,format: 'yyyy-MM-dd',
  99. // type: 'month',
  100. theme: '#00a1cb'
  101. // value: new Date()
  102. });
  103. $('#endTime').val(time)
  104. //年月选择器
  105. laydate.render({
  106. elem: '#endTime'
  107. ,format: 'yyyy-MM-dd',
  108. // type: 'month',
  109. theme: '#00a1cb'
  110. // value: new Date()
  111. });
  112. initTable1();
  113. //返回首页
  114. $('#ReIndex').click(function(){
  115. top.home_index();
  116. })
  117. //搜索
  118. $('.search').click(function(){
  119. initTable1();
  120. })
  121. })
  122. function initTable1() {
  123. $.ajax({
  124. type:"get",
  125. url:huayi.config.callcenter_url+"SeatMonitoring/GetReportList",
  126. async:true,
  127. dataType:'json',
  128. data:{
  129. token: $.cookie("token"),
  130. stime: $('#startTime').val(),
  131. etime:$('#endTime').val()
  132. },
  133. success:function(data){
  134. if(data.state.toLowerCase()=='success'){
  135. $('#table1 tbody').html('');
  136. $(data.data).each(function(i,n){
  137. // console.log(n)
  138. $('<tr>'+
  139. '<td>'+ n.UserCode +'</td>'+
  140. '<td>'+ n.UserName +'</td>'+
  141. '<td>'+ n.ExtNumber +'</td>'+
  142. '<td>'+ n.free +'</td>'+
  143. '<td>'+ n.repose +'</td>'+
  144. '<td>'+ n.talking +'</td>'+
  145. '<td>'+ n.postprocess +'</td>'+
  146. '<td>'+ n.reposeconut +'</td>'+
  147. '<td>'+ n.logcount +'</td>'+
  148. '<td>'+ n.logintime +'</td>'+
  149. '<td>'+ n.logouttime +'</td>'+
  150. '<td>'+ n.logintimes +'</td>'+
  151. '<td>'+ n.callincount +'</td>'+
  152. '<td>'+ n.calloutcount +'</td>'+
  153. '</tr>').appendTo('#table1 tbody')
  154. })
  155. }
  156. }
  157. });
  158. }
  159. //导出
  160. $('.export').click(function() {
  161. dcexcel(this);
  162. })
  163. function dcexcel(obj) {
  164. var dpt = "";
  165. var url = huayi.config.callcenter_url + "SeatMonitoring/ExptList?token=" + $.cookie("token");
  166. url += "&stime=" + $('#startTime').val() + "&etime=" + $('#endTime').val();
  167. obj.href = url;
  168. }
  169. </script>
  170. </body>
  171. </html>