Brak opisu

XL.html 9.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278
  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. <link rel="stylesheet" href="../js/zTree/zTreeStyle.css" />
  12. <script src="../css/laydate/laydate.js"></script>
  13. <script src="../js/zTree/jquery.ztree.core.js"></script>
  14. <style>
  15. table td {
  16. word-break: break-all;
  17. word-wrap: break-word;
  18. }
  19. .Shows {
  20. display: block !important;
  21. }
  22. .complain {
  23. display: none;
  24. }
  25. .toolLeft input {
  26. width: 200px;
  27. }
  28. th {
  29. padding: 5px;
  30. text-align: center;
  31. }
  32. td {
  33. padding: 5px;
  34. }
  35. .Borders {
  36. border: 1px solid #d7d7d7;
  37. }
  38. .daoHang {
  39. margin-bottom: 15px;
  40. }
  41. .inpBox {
  42. border: 1px solid #e5e6e7;
  43. height: 32px;
  44. width: 200px;
  45. display: inline-block;
  46. position: relative;
  47. vertical-align: middle;
  48. }
  49. .inpBox .inps1 {
  50. width: 100%;
  51. height: 30px;
  52. outline: none;
  53. border: 0;
  54. border-image-width: 0;
  55. padding: 0;
  56. padding-left: 3px;
  57. }
  58. .xl {
  59. display: inline-block;
  60. background: url(../img/dropDown.png) no-repeat;
  61. height: 100%;
  62. background-position: center center;
  63. width: 20px;
  64. position: absolute;
  65. right: 0;
  66. top: 0px;
  67. background-color: #f7bc8b;
  68. cursor: pointer;
  69. }
  70. .xl:hover {
  71. background-color: #e6d523;
  72. }
  73. .addTree {
  74. background: #fff;
  75. position: absolute;
  76. width: 100%;
  77. border: 1px solid darkgrey;
  78. right: 0;
  79. top: 30px;
  80. display: none;
  81. height: 350px;
  82. overflow-y: auto;
  83. z-index: 10;
  84. text-align: center;
  85. }
  86. .addTree .list li:hover {
  87. background: #ebebeb;
  88. color: #717171;
  89. }
  90. </style>
  91. </head>
  92. <body class="gray-bg">
  93. <div class="wrapper wrapper-content animated fadeInRight">
  94. <div class="daoHang clearfix">
  95. <div class="dhLeft">
  96. <sapn>
  97. <i class="syIcon"></i>位置:
  98. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  99. <a href="javaScript:;">业务统计</a>&gt;
  100. <a href="" class="nowPosition">单位绩效统计</a>
  101. </sapn>
  102. </div>
  103. <div class="dhRight">
  104. <a href="" title="刷新"><i class="fa fa-refresh"></i></a>
  105. </div>
  106. </div>
  107. <div class="Content_box">
  108. <div class="complain Shows">
  109. <div class="toolBar clearfix">
  110. <div class="toolLeft">
  111. 开始时间:
  112. <input class="photo x-color inputs laydate-icon" type="text" id="squeryTime" />
  113. 结束时间:
  114. <input class="photo x-color inputs laydate-icon" type="text" id="equeryTime" />
  115. 部门:
  116. <div class="inpBox">
  117. <input class="inps inps1">
  118. <input type="hidden" id="deptid" />
  119. <i class="xl xl_two"></i>
  120. <div class="addTree xlAdd_two">
  121. <ul id="deptTree" class="ztree"></ul>
  122. </div>
  123. </div>
  124. <button class="btns search_1">查询</button>
  125. <a class="btns" id="exportPublicSentiments">导出</a>
  126. </div>
  127. </div>
  128. <!--table1-->
  129. <div style="width: 100%;padding: 10px;">
  130. <table id="workorderlist" class="tables" data-row-style="rowStyle" data-query-params="queryParams"
  131. data-pagination="true">
  132. <thead>
  133. <tr>
  134. <th data-field="deptname" data-align="center">单位名称</th>
  135. <th data-field="Totalcheck" data-align="center">应查收总量</th>
  136. <th data-field="Checkontime" data-align="center">按时查收量</th>
  137. <th data-field="Recoveryrate" data-align="center">按时查收率</th>
  138. <th data-field="Refundrate" data-align="center">重复退单率</th>
  139. <th data-field="handlecount" data-align="center">办理总量</th>
  140. <th data-field="Finishontime" data-align="center">按时办结数量</th>
  141. <th data-field="Finishontimerate" data-align="center">按时办结率</th>
  142. <th data-field="increasespeed" data-align="center">办结提速率</th>
  143. <th data-field="satisfied" data-align="center">满意</th>
  144. <th data-field="basicsatisfied" data-align="center">基本满意</th>
  145. <th data-field="nosatisfied" data-align="center">不满意</th>
  146. </tr>
  147. </thead>
  148. </table>
  149. </div>
  150. </div>
  151. </div>
  152. </div>
  153. <script>
  154. $(document).ready(function () {
  155. laydate.skin('blue');
  156. laydate({
  157. elem: '#squeryTime',
  158. event: 'focus'
  159. });
  160. laydate({
  161. elem: '#equeryTime',
  162. event: 'focus'
  163. });
  164. initTable();
  165. bindtree();
  166. });
  167. //表格
  168. function initTable() {
  169. $.ajax({
  170. url: huayi.config.callcenter_url + 'WorkOrderReport/GetDeptAchievements',
  171. type: 'get',
  172. data: {
  173. start: $('#squeryTime').val(),
  174. end: $('#equeryTime').val(),
  175. deptid: $("#deptid").val(),
  176. token: $.cookie("token")
  177. },
  178. dataType: "json",
  179. async: true,
  180. success: function (returnValue) {
  181. //异步获取数据
  182. var resultData = returnValue.data.DeptDeptAchievements;
  183. $('#workorderlist').bootstrapTable('load', resultData);
  184. }
  185. });
  186. $('#workorderlist').bootstrapTable('destroy').bootstrapTable({
  187. striped: true,
  188. pagination: false,
  189. });
  190. }
  191. //搜索
  192. $(".search_1").click(function () {
  193. initTable();
  194. });
  195. $(".inps").focus(function () {
  196. $(this).siblings(".addTree").css("display", "block");
  197. });
  198. $(".xl").click(function () {
  199. var xl = $(this).siblings(".addTree");
  200. if (xl.css("display") == "block") {
  201. xl.css("display", "none");
  202. } else {
  203. xl.css("display", "block");
  204. }
  205. });
  206. $(".addTree").mouseleave(function () {
  207. $(this).css("display", "none");
  208. });
  209. function bindtree() {
  210. $.getJSON(
  211. huayi.config.callcenter_url + "Department/GetDeptList", {
  212. token: $.cookie("token")
  213. },
  214. function (result) {
  215. if (result.state.toLowerCase() == "success") {
  216. $.fn.zTree.init($("#deptTree"), setting, result.data);
  217. }
  218. }
  219. );
  220. }
  221. //获取所属部门
  222. var setting = {
  223. data: {
  224. key: {
  225. name: "F_DeptName",
  226. },
  227. simpleData: {
  228. enable: true,
  229. idKey: "F_DeptId",
  230. pIdKey: "F_PartentId",
  231. rootPId: 0,
  232. },
  233. },
  234. callback: {
  235. onClick: zTreeOnClick,
  236. },
  237. };
  238. function zTreeOnClick(event, treeId, treeNode) {
  239. $(".inps1").val(treeNode.F_DeptName);
  240. $("#deptid").val(treeNode.F_DeptId);
  241. }
  242. //导出
  243. $('#exportPublicSentiments').click(function () {
  244. dcexcelDispath(this);
  245. });
  246. function dcexcelDispath(obj) {
  247. var url = huayi.config.callcenter_url + "WorkOrderReport/GetDeptAchievements?token=" + $.cookie("token");
  248. url += "&start=" + $('#squeryTime').val() + "&end=" + $('#equeryTime').val() + "&deptid=" + $('#deptid').val() + "&isExport=true";
  249. obj.href = url;
  250. }
  251. </script>
  252. </body>
  253. </html>