ZZDianXin_UI - 郑州电信 演示

TaskResult.html 7.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247
  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/Table/table1.css" rel="stylesheet" />
  10. <link href="../css/init.css" rel="stylesheet" />
  11. </head>
  12. <body class="gray-bg">
  13. <div class="wrapper wrapper-content animated fadeInRight">
  14. <div class="daoHang clearfix">
  15. <div class="dhLeft">
  16. <sapn><i class="syIcon"></i>位置:
  17. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  18. <a href="javaScript:;">外呼管理</a>&gt;
  19. <a href="" style="color: #000;">任务结果</a>
  20. </sapn>
  21. </div>
  22. </div>
  23. <div class="th-box">
  24. <div class="th-bar">
  25. <div class="seach-box ">
  26. <ul>
  27. <li style="position: relative;">
  28. 调查时间:
  29. <i class="tub fa fa-calendar"></i>
  30. <input type="text" id="s_time" class="photo laydate-icon" placeholder="请选择调查时间" />
  31. </li>
  32. <li>呼叫结果:
  33. <select name="" class="photo" id="hjjgid"></select>
  34. </li>
  35. <!--<li>用户反馈:
  36. <select name="" class="photo" id="yhfkid"></select>
  37. </li>-->
  38. <li>坐席:
  39. <select name="" class="photo" id="zx"></select>
  40. </li>
  41. <li>电话号码:<input class="photo x-color" type="text" id="key" placeholder="请输入电话号码" /></li>
  42. <li>
  43. <a class="sc_btn Block" id="sc_btns">搜索</a>
  44. </li>
  45. </ul>
  46. </div>
  47. </div>
  48. </div>
  49. <div style="width: 100%;padding: 10px;">
  50. <table id="list" data-click-to-select="true" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
  51. <thead>
  52. <tr>
  53. <th data-formatter="formatterOperation" data-align="center">操作</th>
  54. <!--<th data-field="state" data-checkbox="true"></th>-->
  55. <th data-field="F_Phone" data-align="center" data-formatter="Code">电话号码</th>
  56. <th data-field="F_CusName" data-align="center">姓名</th>
  57. <!--<th data-field="ExpandVchField4" data-align="center">乡镇或单位</th>-->
  58. <th data-field="ExpandVchField3" data-align="center">住址</th>
  59. <th data-field="F_UserName" data-align="center">分配坐席</th>
  60. <th data-field="F_HJJGName" data-align="center">呼叫结果</th>
  61. <th data-field="ExpandDatField1" data-align="center">调查时间</th>
  62. <!--<th data-field="F_YHFKName" data-align="center">用户反馈</th>-->
  63. </tr>
  64. </thead>
  65. </table>
  66. </div>
  67. </div>
  68. <script src="../js/laydate/laydate.js"></script>
  69. <script>
  70. $(document).ready(function() {
  71. laydate.render({
  72. elem: '#s_time',
  73. range: '~',
  74. theme: '#1ab394',
  75. calendar: true,
  76. });
  77. initTable();
  78. GetHJJG(); //呼叫结果
  79. //GetYHFK();//用户反馈
  80. $("#sc_btns").click(function() {
  81. initTable();
  82. });
  83. //回车搜索
  84. $('#key').on('keypress',function(e){
  85. if(e.keyCode==13){
  86. initTable();
  87. }
  88. })
  89. $('#ReIndex').click(function() {
  90. top.home_index();
  91. })
  92. //坐席
  93. $.ajax({
  94. type: "get",
  95. url: huayi.config.callcenter_url + "UserAccount/GetSeatList",
  96. dataType: 'json',
  97. async: true,
  98. data: {
  99. token: $.cookie("token")
  100. },
  101. success: function(data) {
  102. var Count = data.data;
  103. $("<option value=''>--全部--</option>").appendTo($("#zx"));
  104. for(var i = 0; i < Count.length; i++) {
  105. //console.log(Count[i].F_UserName);
  106. $("<option value='" + Count[i].F_UserId + "'>" + Count[i].F_UserName + "</option>").appendTo($("#zx"));
  107. }
  108. }
  109. });
  110. })
  111. function initTable() {
  112. //先销毁表格
  113. $('#list').bootstrapTable('destroy');
  114. //初始化表格,动态从服务器加载数据
  115. $("#list").bootstrapTable({
  116. method: "get", //使用get请求到服务器获取数据
  117. url: huayi.config.callcenter_url + "CallOutPlan/GetResultList", //获取数据的Servlet地址
  118. contentType: 'application/x-www-form-urlencoded',
  119. striped: true, //表格显示条纹
  120. pagination: true, //启动分页
  121. pageSize: 10, //每页显示的记录数
  122. pageNumber: 1, //当前第几页
  123. pageList: [10, 20, 50, 100], //记录数可选列表
  124. search: false, //是否启用查询
  125. showColumns: false, //显示下拉框勾选要显示的列
  126. showRefresh: false, //显示刷新按钮
  127. sidePagination: "server", //表示服务端请求
  128. //设置为undefined可以获取pageNumber,pageSize,searchText,sortName,sortOrder
  129. //设置为limit可以获取limit, offset, search, sort, order
  130. queryParamsType: "undefined",
  131. queryParams: function queryParams(params) { //设置查询参数
  132. var param = {
  133. pageindex: params.pageNumber,
  134. pagesize: params.pageSize,
  135. sdate: $('#s_time').val() && $('#s_time').val().split(' ~ ')[0],
  136. edate: $('#s_time').val() && $('#s_time').val().split(' ~ ')[1],
  137. key: $("#key").val(),
  138. hjjgid: $("#hjjgid").val(), //呼叫结果ID
  139. //yhfkid:$("#yhfkid").val(), //用户反馈ID
  140. userid: $("#zx").val(),
  141. token: $.cookie("token")
  142. };
  143. return param;
  144. },
  145. onLoadSuccess: function() { //加载成功时执行
  146. //layer.msg("加载成功");
  147. },
  148. onLoadError: function() { //加载失败时执行
  149. //layer.msg("加载数据失败", { time: 1500, icon: 2 });
  150. }
  151. });
  152. }
  153. //获取呼叫结果
  154. function GetHJJG() {
  155. $.ajax({
  156. type: "get",
  157. url: huayi.config.callcenter_url + "Dictionary/GetDicValueListByFlag",
  158. dataType: 'json',
  159. data: {
  160. flag: 'HJJG',
  161. token: $.cookie("token")
  162. },
  163. async: true,
  164. success: function(data) {
  165. var Count = data.data;
  166. $("<option value=''>--全部--</option>").appendTo($("#hjjgid"));
  167. for(var i = 0; i < Count.length; i++) {
  168. console.log(Count[i].F_UserName);
  169. $("<option value='" + Count[i].F_DictionaryValueId + "'>" + Count[i].F_Name + "</option>").appendTo($("#hjjgid"));
  170. }
  171. }
  172. });
  173. }
  174. //用户反馈
  175. function GetYHFK() {
  176. $.ajax({
  177. type: "get",
  178. url: huayi.config.callcenter_url + "Dictionary/GetDicValueListByFlag",
  179. dataType: 'json',
  180. data: {
  181. flag: 'YHFK',
  182. token: $.cookie("token")
  183. },
  184. async: true,
  185. success: function(data) {
  186. var Count = data.data;
  187. $("<option value=''>--全部--</option>").appendTo($("#yhfkid"));
  188. for(var i = 0; i < Count.length; i++) {
  189. console.log(Count[i].F_UserName);
  190. $("<option value='" + Count[i].F_DictionaryValueId + "'>" + Count[i].F_Name + "</option>").appendTo($("#yhfkid"));
  191. }
  192. }
  193. });
  194. }
  195. function Code(val, row) {
  196. return '<div><a onclick="XX(' + row.F_Id + ')">' + row.F_Phone + '</a></div>'
  197. }
  198. //格式化操作
  199. function formatterOperation(val,row){
  200. //ExpandSintField1 1为已存在工单,0为不存在工单
  201. if(row.ExpandSintField1 == '1'){
  202. return '-';
  203. }else if(row.ExpandSintField1 == '0'||row.ExpandSintField1==null){
  204. return '<div class="imgs" ><a class="xg" href="javascript:;" onclick= createOrder("' + row.F_Id + '")>新建工单</a></div>';
  205. }else{
  206. return '-';
  207. }
  208. }
  209. //新建工单
  210. function createOrder(tid){
  211. layer.open({
  212. type: 2,
  213. content: "../WorkOrder/addwork.html?tid=" + tid, //iframe的url,no代表不显示滚动条
  214. title: '新建工单',
  215. maxmin: true,
  216. area: ['86%', '88%'], //宽高
  217. });
  218. }
  219. //详情
  220. function XX(str) {
  221. layer.open({
  222. type: 2,
  223. content: "../OutboundMessage/LookMessages.html?Str=" + str, //iframe的url,no代表不显示滚动条
  224. title: '任务信息',
  225. maxmin: true, //开启最大化最小化按钮
  226. id: 'LAY_layuipro', //防止重复弹出
  227. area: ['86%', '88%'], //宽高
  228. });
  229. }
  230. </script>
  231. </body>
  232. </html>