Bez popisu

Tasks.html 4.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  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. <script src="../Script/Common/huayi.load.js"></script>
  9. <script src="../Script/Common/huayi.config.js"></script>
  10. <link href="../css/Table/table1.css" rel="stylesheet" />
  11. <script src="../js/laydate/laydate.js"></script>
  12. <style>
  13. .LY:hover {
  14. color: #fff;
  15. }
  16. .LY:active {
  17. color: #fff!important;
  18. }
  19. #Task thead td {
  20. color: #fff;
  21. background-color: #1ab394;
  22. text-align: center;
  23. }
  24. .table-head table thead {
  25. width: calc( 100% - 5px);
  26. }
  27. table thead,
  28. tbody tr {
  29. display: table;
  30. width: 100%;
  31. table-layout: fixed;
  32. text-align: center;
  33. }
  34. .table {
  35. margin-bottom: 0;
  36. }
  37. .table-body {
  38. width: 100%;
  39. height: 515px;
  40. overflow-y: scroll;
  41. overflow-x: scroll;
  42. }
  43. </style>
  44. </head>
  45. <body class="gray-bg">
  46. <div class="wrapper wrapper-content animated fadeInRight">
  47. <div class="daoHang clearfix">
  48. <div class="dhLeft">
  49. <sapn><i class="syIcon"></i>位置:
  50. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  51. <a href="javaScript:;">外呼管理</a>&gt;
  52. <a href="" style="color: #000;">外呼任务报表</a>
  53. </sapn>
  54. </div>
  55. </div>
  56. <div class="th-box">
  57. <div class="th-bar">
  58. <div class="seach-box fr">
  59. <ul>
  60. <li>
  61. <label for="">起止时间:</label>
  62. <input type="text" id="ss_kssj" class="photo laydate-icon" />
  63. </li>
  64. <li>任务列表:
  65. <select name="" id="cljg" class="x-color select">
  66. </select>
  67. </li>
  68. <li>
  69. <a class="sc_btn seach">搜索</a>
  70. </li>
  71. <li>
  72. <a class="sc_btn export">导出</a>
  73. </li>
  74. </ul>
  75. </div>
  76. </div>
  77. </div>
  78. <div style="width: 100%;padding: 10px;">
  79. <div class="table-head">
  80. <table id="Task" class="table table-hover table-striped table-bordered table-condensed">
  81. <colgroup>
  82. <col style="width: 80px;" />
  83. <col/>
  84. </colgroup>
  85. <thead>
  86. <tr>
  87. <td>问题</td>
  88. <td>选项</td>
  89. <td>数量</td>
  90. <td>比例</td>
  91. </tr>
  92. </thead>
  93. </table>
  94. </div>
  95. <div class="table-body">
  96. <table class="thTable hwbb table table-hover table-striped table-bordered table-condensed">
  97. <colgroup>
  98. <col style="width: 80px;" />
  99. <col/>
  100. </colgroup>
  101. <tbody>
  102. </tbody>
  103. </table>
  104. </div>
  105. <div>
  106. </div>
  107. </div>
  108. </div>
  109. <script>
  110. $(document).ready(function() {
  111. Task();
  112. laydate.render({
  113. elem: '#ss_kssj',
  114. range: '~',
  115. value: helper.DateFormat.getNowDate() + ' ~ ' + helper.DateFormat.getNowDate(),
  116. calendar: true,
  117. theme: '#1ab394',
  118. });
  119. GetColumnList();
  120. $(".sc_btn").click(function() {
  121. GetColumnList();
  122. });
  123. //导出功能
  124. $('.export').click(function() {
  125. dcexcel(this);
  126. })
  127. });
  128. ///查询条件中获取任务列表
  129. function Task() {
  130. $.ajax({
  131. type: "get",
  132. url: huayi.config.callcenter_url + "Questionnaire/GetTaskList",
  133. dataType: 'json',
  134. data: {
  135. token: $.cookie("token")
  136. },
  137. async: true,
  138. success: function(data) {
  139. var Count = data.data;
  140. $("<option value=''>--全部--</option>").appendTo($("#cljg"));
  141. for(var i = 0; i < Count.length; i++) {
  142. console.log(Count[i].F_UserName);
  143. $("<option value='" + Count[i].F_TaskName + "'>" + Count[i].F_TaskName + "</option>").appendTo($("#cljg"));
  144. }
  145. }
  146. });
  147. }
  148. //任务查询获取表头
  149. function GetColumnList() {
  150. // $("#Task tbody").empty();
  151. $(".hwbb tbody").empty();
  152. $.ajax({
  153. type: "get",
  154. url: huayi.config.callcenter_url + "/Questionnaire/GetReport",
  155. dataType: 'json',
  156. data: {
  157. startdate: $("#ss_kssj").val() && $("#ss_kssj").val().split(' ~ ')[0],
  158. enddate: $("#ss_kssj").val() && $("#ss_kssj").val().split(' ~ ')[1],
  159. taskname: $("#cljg").val(),
  160. token: $.cookie("token")
  161. },
  162. async: true,
  163. success: function(data) {
  164. var Count = data.data;
  165. $(".hwbb tbody").empty();
  166. for(var i = 0; i < Count.length; i++) {
  167. $('<tr><td>' + Count[i].wenti + ' </td>' +
  168. '<td> ' + Count[i].xuanxiang + ' </td>' +
  169. '<td> ' + Count[i].shuliang + ' </td>' +
  170. '<td> ' + Count[i].bili + ' </td>' +
  171. '</tr>').appendTo(".hwbb tbody");
  172. }
  173. console.log(Count)
  174. }
  175. });
  176. }
  177. function dcexcel(obj) {
  178. var url = huayi.config.callcenter_url + "/Questionnaire/GetReportExpt?token=" + $.cookie("token");
  179. url += "&startdate=" + ($("#ss_kssj").val() && $("#ss_kssj").val().split(' ~ ')[0]) + "&enddate=" + ($("#ss_kssj").val() && $("#ss_kssj").val().split(' ~ ')[1]);
  180. url += "&taskname=" + $("#cljg").val();
  181. obj.href = url;
  182. }
  183. </script>
  184. </body>
  185. </html>