济源12345的前端

dayHuaWu.html 5.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  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. <link href="../css/init.css" rel="stylesheet" />
  8. <link href="../css/Table/table1.css" rel="stylesheet" />
  9. <script src="../Script/Common/huayi.load.js"></script>
  10. <script src="../Script/Common/huayi.config.js"></script>
  11. <script src="../My97DatePicker/WdatePicker.js"></script>
  12. <script src="../css/laydate/laydate.js"></script>
  13. <style>
  14. body {
  15. font-family: "微软雅黑";
  16. font-size: 14px;
  17. }
  18. ul li {
  19. list-style: none;
  20. float: left;
  21. }
  22. .fr {
  23. float: right;
  24. }
  25. /*标头*/
  26. .th-box {
  27. width: 100%;
  28. padding: 5px;
  29. border-bottom: 1px solid #e7eaec;
  30. }
  31. .th-bar {
  32. height: 40px;
  33. }
  34. #list thead tr th{
  35. background: #01a1cb;
  36. color: #fff;
  37. }
  38. </style>
  39. </head>
  40. <body class="gray-bg">
  41. <div class="wrapper wrapper-content animated fadeInRight">
  42. <div class="daoHang clearfix">
  43. <div class="dhLeft">
  44. <sapn><i class="syIcon"></i>位置:<a href="javaScript:;" id="ReIndex">首页</a>&gt;<a href="javaScript:;">报表管理</a>&gt;<a href="" class="nowPosition">话务受理日周月报表</a></sapn>
  45. </div>
  46. <div class="dhRight">
  47. <a href="" title="刷新"><i class="fa fa-refresh"></i></a>
  48. </div>
  49. </div>
  50. <div class="th-box">
  51. <div class="th-bar">
  52. <!--<a class="sc_btn btn-info" id="moves">批量删除</a>-->
  53. <div class="seach-box fr">
  54. <ul>
  55. <li>开始时间:<input id="start" class="photo x-color laydate-icon" type="text" /></li>
  56. <li>结束时间:<input id="end" class="photo x-color laydate-icon" type="text" /></li>
  57. <li>
  58. 时间类型:
  59. <select style="width: 100px;" class="select_ dataType">
  60. <option value="0" selected="selected">日</option>
  61. <option value="1">周</option>
  62. <option value="2">月</option>
  63. </select>
  64. </li>
  65. <li>
  66. <button class="btns search">查询</button>
  67. <a class="btns export">导出</a>
  68. </li>
  69. </ul>
  70. </div>
  71. </div>
  72. </div>
  73. <div style="width: 100%;padding: 10px;">
  74. <table id="list" class="table table-hover table-striped table-bordered table-condensed">
  75. <thead>
  76. <tr>
  77. </tr>
  78. </thead>
  79. <tbody>
  80. </tbody>
  81. </table>
  82. <!--高级搜索框-->
  83. </div>
  84. </div>
  85. <script>
  86. $(document).ready(function () {
  87. var start=$('#start').val();//开始时间
  88. var end=$('#end').val();//结束时间
  89. var usercode;//工号
  90. var type=$('.dataType').val();//时间类型
  91. laydate.skin('blue');
  92. laydate({
  93. elem: '#start',
  94. event: 'focus'
  95. });
  96. laydate({
  97. elem: '#end',
  98. event: 'focus'
  99. });
  100. //表头
  101. $.ajax({
  102. type:"get",
  103. url:huayi.config.callcenter_url +"TelWOReport/GetColumnList",
  104. async:true,
  105. dataType:'json',
  106. data:{
  107. token:$.cookie("token")
  108. },
  109. success:function(data){
  110. var con=data.data;
  111. if(data.state.toLowerCase()=='success'){
  112. $(con).each(function(i,n){
  113. $('<th>'+n +'</th>').appendTo('#list thead tr')
  114. })
  115. }
  116. }
  117. });
  118. tableAjax(start,end,type)
  119. //表内数据
  120. function tableAjax(start,end,type){
  121. $('#list tbody').html('');
  122. $.ajax({
  123. type:"get",
  124. url:huayi.config.callcenter_url +"TelWOReport/GetTrafficReport",
  125. async:true,
  126. dataType:'json',
  127. data:{
  128. token:$.cookie("token"),
  129. btime:start,
  130. etime:end,
  131. type:type
  132. // usercode:usercode
  133. },
  134. success:function(data){
  135. var con=data.data;
  136. if(data.state.toLowerCase()=='success'){
  137. $(con).each(function(i,n){
  138. $('<tr><td>' + n.日期 + '</td><td>' + n.接听来电 + '</td><td>' + n.有效来电 + '</td><td>' + n.受理 + '</td><td>' + n.在线办结 + '</td><td>' + n.转派工单 + '</td><td>' + n.办结 + '</td></tr>').appendTo('#list tbody')
  139. })
  140. }
  141. }
  142. });
  143. }
  144. $('.search').click(function(){
  145. start=$('#start').val();
  146. end=$('#end').val();
  147. type=$('.dataType').val();
  148. tableAjax(start,end,type)
  149. })
  150. $('.export').click(function(){
  151. dcexcel(this);
  152. })
  153. function dcexcel(obj) {
  154. var url = huayi.config.callcenter_url + "TelWOReport/ExptList?token=" + $.cookie("token");
  155. url += "&btime=" + $("#start").val() + "&etime=" + $("#end").val()+ "&type=" + $(".dataType").val();
  156. obj.href = url;
  157. }
  158. })
  159. </script>
  160. </body>
  161. </html>