Нет описания

seaterMY.html 6.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192
  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="../css/laydate/laydate.js"></script>
  13. <script src="../My97DatePicker/WdatePicker.js"></script>
  14. <style>
  15. table td {
  16. word-break: break-all;
  17. word-wrap: break-word;
  18. }
  19. .ld-service li {
  20. float: left;
  21. font-size: 14px;
  22. color: #000;
  23. padding: 5px 15px;
  24. cursor: pointer;
  25. border-bottom: 1px solid #ccc;
  26. }
  27. .cr-click {
  28. border: 1px solid #ccc;
  29. background-color: #fff;
  30. border-bottom: none !important;
  31. border-bottom-left-radius: 5px;
  32. border-bottom-right-radius: 5px;
  33. }
  34. .Shows {
  35. display: block !important;
  36. }
  37. .complain {
  38. display: none;
  39. }
  40. th {
  41. padding: 5px;
  42. text-align: center;
  43. }
  44. td {
  45. padding: 5px;
  46. }
  47. .Borders {
  48. border: 1px solid #d7d7d7;
  49. }
  50. .cx {
  51. display: block;
  52. }
  53. .seach-box input {
  54. width: 200px;
  55. height: 34px;
  56. }
  57. </style>
  58. </head>
  59. <body class="gray-bg">
  60. <div class="wrapper wrapper-content animated fadeInRight">
  61. <div class="daoHang clearfix">
  62. <div class="dhLeft">
  63. <sapn>
  64. <i class="syIcon"></i>位置:
  65. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  66. <a href="javaScript:;">报表管理</a>&gt;
  67. <a href="" class="nowPosition">坐席接听满意度统计</a>
  68. </sapn>
  69. </div>
  70. <div class="dhRight">
  71. <a href="" title="刷新"><i class="fa fa-refresh"></i></a>
  72. </div>
  73. </div>
  74. <div class="Content_box">
  75. <!--待处理/-->
  76. <div class="complain Shows">
  77. <div class="th-box">
  78. <div class="th-bar">
  79. <div class="seach-box">
  80. <ul>
  81. <li>
  82. 创建时间:
  83. <input class="photo x-color inputs laydate-icon" type="text" id="startTimes" autocomplete="off" />-
  84. <input class="photo x-color inputs laydate-icon" type="text" id="endTimes" autocomplete="off" />
  85. </li>
  86. <li>
  87. <a class="sc_btn btns db" style="padding: 7px 10px;">搜索</a>
  88. <a class="sc_btn btns export">导出</a>
  89. </li>
  90. <li><span class="text-danger"
  91. style="padding-left: 10px;line-height: 30px;">默认显示当前月的信息</span></li>
  92. </ul>
  93. </div>
  94. </div>
  95. </div>
  96. <div style="width: 100%;padding: 10px;">
  97. <table id="workorderlist" data-row-style="rowStyle" data-query-params="queryParams"
  98. data-pagination="true">
  99. <thead>
  100. <tr>
  101. <th data-field="" data-formatter="serialNumber" data-align="center">序号</th>
  102. <th data-field="username" data-align="center">坐席姓名</th>
  103. <th data-field="count" data-align="center">接听量</th>
  104. <th data-field="satisfiedcount" data-align="center">满意量</th>
  105. <th data-field="normalcount" data-align="center">一般量</th>
  106. <th data-field="notsatisfiedcount" data-align="center">不满意总量</th>
  107. <th data-field="satisfiedrate" data-align="center">满意度</th>
  108. </tr>
  109. </thead>
  110. </table>
  111. </div>
  112. </div>
  113. </div>
  114. </div>
  115. <script>
  116. $(document).ready(function () {
  117. laydate.skin('blue');
  118. laydate({
  119. elem: '#startTimes',
  120. event: 'focus',
  121. istime: true,
  122. format: 'YYYY-MM-DD hh:mm:ss'
  123. });
  124. laydate({
  125. elem: '#endTimes',
  126. event: 'focus',
  127. istime: true,
  128. format: 'YYYY-MM-DD hh:mm:ss'
  129. });
  130. initTable();
  131. })
  132. function initTable() {
  133. $.ajax({
  134. url: huayi.config.callcenter_url + 'TalkTime/GetUserSatisfied',
  135. type: 'get',
  136. data: {
  137. start: $("#startTimes").val(),
  138. end: $("#endTimes").val(),
  139. token: $.cookie("token")
  140. },
  141. dataType: "json",
  142. async: true,
  143. success: function (returnValue) {
  144. //异步获取数据
  145. var resultData1 = returnValue.data.UserSatisfiedReport;
  146. $('#workorderlist').bootstrapTable('load', resultData1);
  147. }
  148. });
  149. $('#workorderlist').bootstrapTable('destroy').bootstrapTable({
  150. striped: true
  151. });
  152. }
  153. //序号
  154. function serialNumber(val, row, index) {
  155. return index + 1;
  156. }
  157. //代办搜索
  158. $(".db").click(function () {
  159. initTable();
  160. })
  161. //导出
  162. $('.export').click(function () {
  163. dcexcel(this);
  164. })
  165. function dcexcel(obj) {
  166. var url = huayi.config.callcenter_url + "TalkTime/GetUserSatisfied?token=" + $.cookie("token");
  167. url += "&start=" + $("#startTimes").val() + "&end=" + $("#endTimes").val() + "&isExport=true";
  168. obj.href = url;
  169. }
  170. </script>
  171. </body>
  172. </html>