鑫苑新版本前端代码

SeatMonitor.html 21KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <link href="../css/init.css" rel="stylesheet" />
  7. <script src="../Script/Common/huayi.load.js"></script>
  8. <script src="../Script/Common/huayi.config.js"></script>
  9. <title>坐席管理</title>
  10. <style>
  11. body {
  12. background-color: #EEEEEE;
  13. font-family: "微软雅黑";
  14. background-color: #fdfdfd;
  15. }
  16. ul li {
  17. float: left;
  18. }
  19. .zx-title {
  20. background-color: #2e4050;
  21. color: #FFFFFF;
  22. padding: 5px 20px;
  23. border-top-left-radius: 5px;
  24. border-top-right-radius: 5px;
  25. letter-spacing: 3px;
  26. }
  27. ul {
  28. overflow: hidden;
  29. }
  30. ul li {
  31. list-style: none;
  32. }
  33. .fenxian {
  34. list-style: none;
  35. width: 136px;
  36. padding: 0;
  37. height: 10px;
  38. }
  39. .fenxian li {
  40. width: 50%;
  41. list-style: none;
  42. height: 8px;
  43. float: left;
  44. }
  45. .left_red {
  46. background: #65c2ca;
  47. }
  48. .rg_green {
  49. background: #F95A83;
  50. }
  51. .zx-box {
  52. background: #F5F5F5;
  53. /*height: 200px;*/
  54. border-radius: 5px;
  55. box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
  56. margin-bottom: 30px;
  57. overflow: hidden;
  58. }
  59. .m-b {
  60. margin-bottom: 0;
  61. }
  62. /*坐席数量*/
  63. .zt-content ul {
  64. width: 100%;
  65. overflow: hidden;
  66. padding-left: 0px;
  67. padding-top: 20px;
  68. }
  69. .zt-content ul li {
  70. width: 40%;
  71. font-size: 14px;
  72. float: left;
  73. margin-bottom: 20px;
  74. /*text-align: center;*/
  75. margin-left: 10%;
  76. }
  77. .zt-content ul li i {
  78. display: inline-block;
  79. width: 20px;
  80. height: 21px;
  81. vertical-align: middle;
  82. margin-right: 10px;
  83. background: url(../img/zuoxiIcon.png) no-repeat;
  84. }
  85. .hc {
  86. background-position: 0 0 !important;
  87. }
  88. .ml {
  89. background-position: 0 -24px !important;
  90. }
  91. .kx {
  92. background-position: 0 -68px !important;
  93. }
  94. .zl {
  95. background-position: 0 -93px !important;
  96. }
  97. .qc {
  98. background-position: 0 -116px !important;
  99. }
  100. .lx {
  101. background-position: 0 -138px !important;
  102. }
  103. .hh {
  104. background-position: 0 -46px !important;
  105. }
  106. .th {
  107. background: url(../img/thz.png) no-repeat!important;
  108. }
  109. /*坐席监控*/
  110. .bg_person {
  111. background: url(../img/bg-person.png)no-repeat;
  112. width: 65px;
  113. height: 65px;
  114. text-align: -webkit-center;
  115. background-position: center center;
  116. margin: 0 auto;
  117. }
  118. .zx_people {
  119. padding: 0;
  120. }
  121. .zx_content ul:after {
  122. content: "";
  123. display: block;
  124. clear: both;
  125. }
  126. .people_list p {
  127. margin-bottom: 5px !important;
  128. }
  129. .zx_content ul {
  130. height: 800px;
  131. overflow: auto;
  132. }
  133. .zx_content ul li {
  134. width: 14%;
  135. text-align: center;
  136. float: left;
  137. cursor: pointer;
  138. }
  139. .zx_content ul li>div {
  140. width: 100%;
  141. position: relative;
  142. }
  143. .zx_content i {
  144. display: block;
  145. height: 22px;
  146. width: 20px;
  147. background: url(../img/zuoxiIcon.png) no-repeat;
  148. position: relative;
  149. right: -25px;
  150. top: 25px;
  151. }
  152. /*坐席状态*/
  153. .ztsm {
  154. width: 100%;
  155. overflow: hidden;
  156. padding-left: 0px;
  157. padding-top: 20px;
  158. }
  159. .ztsm b {
  160. padding: 3px 15px;
  161. border-radius: 10px;
  162. color: #FFFFFF;
  163. }
  164. .ztsm2 ul li {
  165. width: 33%;
  166. font-size: 14px;
  167. float: left;
  168. margin-bottom: 25px;
  169. text-align: center;
  170. cursor: pointer;
  171. }
  172. .zx {
  173. /*background: #989898;*/
  174. background: #61b960;
  175. }
  176. .jt {
  177. background: #5ed7b7;
  178. }
  179. .dj {
  180. background: #bed75b;
  181. }
  182. .qca {
  183. background: #d75e7c;
  184. }
  185. .lj {
  186. background: #5daed8;
  187. }
  188. .qc {
  189. background: #d8988f;
  190. }
  191. .kqc {
  192. background: #44af3c;
  193. }
  194. .jqc {
  195. background: #d91e06;
  196. }
  197. .dis {
  198. background: #989898;
  199. }
  200. /*坐席弹屏*/
  201. .zx_photo {
  202. padding: 10px;
  203. }
  204. .zx_photo p {
  205. text-align: center;
  206. }
  207. .zx-box_ul>ul {
  208. padding-left: 0px;
  209. }
  210. .zx-box_ul>ul>li {
  211. width: 33% !important;
  212. padding: 22px 13px;
  213. text-align: center;
  214. text-align: -webkit-center;
  215. font-size: 15px;
  216. cursor: pointer;
  217. }
  218. .zx-box_ul>ul>li b {
  219. padding: 7px 15px;
  220. border-radius: 10px;
  221. color: #FFFFFF;
  222. }
  223. .zxtp {
  224. position: absolute;
  225. display: none;
  226. z-index: 999;
  227. }
  228. .shows {
  229. display: block;
  230. }
  231. .hides {
  232. display: block;
  233. }
  234. </style>
  235. <script>
  236. var user; //所有用户
  237. var currentSelectUserNo; //当前选中的坐席工号
  238. var Phone = top.document.getElementById("Phone");
  239. var userlist = []; //坐席工号
  240. $(document).ready(function() {
  241. $(".wrapper").click(function() {
  242. if(!$('.zxtp').is(":hidden")) {
  243. $('.zxtp').hide();
  244. }
  245. })
  246. // //开始监测
  247. // $(".kqc").click(function() {
  248. // if(!$(this).hasClass("dis")) {
  249. // Init();
  250. // }
  251. // })
  252. // //停止监测
  253. // $(".jqc").click(function() {
  254. // if(!$(this).hasClass("dis")) {
  255. // Exit();
  256. // }
  257. // })
  258. })
  259. function Init() {
  260. try {
  261. // GetTimes(); //刷新时间
  262. LoadingData(); //加载坐席数据
  263. try {
  264. Phone.QCLoginToSpyEx(); //扩展签入质检模块
  265. // $(".kqc").addClass('dis');
  266. // $(".jqc").removeClass('dis');
  267. } catch(e) {
  268. alert("没有安装监控插件!");
  269. }
  270. } catch(e) {
  271. alert(e.message);
  272. }
  273. }
  274. function LoadingData() {
  275. var usersns = new Array();
  276. try {
  277. //获取坐席列表
  278. $.getJSON(huayi.config.callcenter_url + 'SeatMonitoring/getlist', {
  279. "token": $.cookie("token")
  280. }, function(result) {
  281. if(result.state.toLowerCase() == "success") {
  282. $(".zx_people").empty();
  283. user = result.data;
  284. $(".tjcount li").eq(6).find("b").text(user.length);
  285. $(user).each(function(i, n) {
  286. userlist.push(n.F_UserCode)
  287. var html = '<li class="people_list ' + n.F_UserCode + '">' +
  288. '<div>' +
  289. ' <div class="bg_person">' +
  290. ' <i class="lx" zx_item="0" xl_item="0"></i>' +
  291. ' </div>' +
  292. ' <p>' +
  293. ' <span>工号:</span>' +
  294. ' <span class="g-num">' + n.F_UserCode + '</span>' +
  295. ' </p>' +
  296. ' <p>' +
  297. ' <span>&nbsp;&nbsp;姓名:</span>' +
  298. ' <span class="g-name">' + n.F_UserName + '</span>' +
  299. ' </p>'
  300. +
  301. '</div>' +
  302. '</li>';
  303. $(html).appendTo($(".zx_people"));
  304. // $(html).appendTo($(".zx_people")).click(function(event) {
  305. // event.stopPropagation();
  306. // if(top.$('#userCode').val()!= $(this).find(".g-num").text()) {
  307. // GetOneState($(this))
  308. // } else {
  309. ////
  310. // layer.confirm('不能操作自己的坐席!', {
  311. // btn: ['确定']
  312. // });
  313. // }
  314. // })
  315. })
  316. // Phone = top.document.getElementById("Phone");
  317. showAllAgentState(); //显示坐席状态
  318. }
  319. })
  320. } catch(e) {
  321. alert(e.Message);
  322. }
  323. showAllAgentState(); //显示坐席状态
  324. }
  325. //显示所有坐席状态
  326. var tj;
  327. function showAllAgentState() {
  328. tj = { wdl: 0, dl: 0, kx: 0, zl: 0, thz: 0, ms: 0};
  329. // var wdl = 0; //未签入&& 离线
  330. // var dl = 0; //登录
  331. // var kx = 0; //空闲
  332. // var zl = 0; //振铃
  333. // var thz = 0; //通话中
  334. // var ms = 0; //忙碌
  335. if(userlist.length > 0) {
  336. for(i = 0; i < userlist.length; i++) {
  337. if(userlist[i] != "") {
  338. rtn = Phone.QueryAgentStatusEx(userlist[i]);
  339. var state = Phone.AgentInfoEx_CurState;
  340. switch(state) {
  341. case 0:
  342. tj.wdl++;
  343. break;
  344. case 1:
  345. tj.kx++;
  346. tj.dl++;
  347. break;
  348. case 2:
  349. tj.wdl++;
  350. break;
  351. case 3:
  352. tj.wdl++;
  353. break;
  354. case 4:
  355. tj.zl++;
  356. tj.dl++;
  357. break;
  358. case 5:
  359. tj.thz++;
  360. tj.dl++;
  361. break;
  362. case 6:
  363. tj.wdl++;
  364. break;
  365. case 7:
  366. tj.ms++;
  367. tj.dl++;
  368. break;
  369. case 8:
  370. tj.wdl++;
  371. break;
  372. case 9:
  373. tj.wdl++;
  374. break;
  375. case 10:
  376. tj.ms++;
  377. tj.dl++;
  378. break;
  379. default:
  380. // tj.wdl++;
  381. break;
  382. }
  383. }
  384. GetState(userlist[i], state);
  385. }
  386. }
  387. $(".tjcount li").eq(0).find("b").text(tj.dl);
  388. $(".tjcount li").eq(1).find("b").text(tj.wdl);
  389. $(".tjcount li").eq(2).find("b").text(tj.kx);
  390. $(".tjcount li").eq(3).find("b").text(tj.thz);
  391. $(".tjcount li").eq(4).find("b").text(tj.zl);
  392. $(".tjcount li").eq(5).find("b").text(tj.ms);
  393. var showState =setTimeout("showAllAgentState()", 3000);
  394. }
  395. /*坐席状态 AgentInfoEx_CurState
  396. NOT_LOGINED = 0, // 未签入
  397. IDLE = 1, // 空闲状态
  398. PREOCCUPY = 2, // 预占用状态
  399. OCCUPY = 3, // 占用状态
  400. ANSWERING = 4, // 应答状态
  401. TALKING = 5, // 通话状态
  402. WORKING = 6, // 工作状态
  403. SETBUSY = 7 , // 忙状态
  404. REST = 8, // 请假休息
  405. STUDING = 9, // 学习
  406. WORK_ADJUST = 10 // 调整态
  407. */
  408. function GetState(userNo, state) {
  409. console.log(userNo+"|"+state);
  410. var sts = "";
  411. switch(state) {
  412. case 0://未签入
  413. sts = "lx";
  414. break;
  415. case 1://空闲
  416. sts = "kx";
  417. break;
  418. case 2:
  419. case 3:
  420. case 4:
  421. sts = "zl";
  422. break;
  423. case 5://通话中
  424. sts = "th";
  425. break;
  426. case 6:
  427. case 7://忙
  428. sts = "ml";
  429. break;
  430. case 8:
  431. sts = "ml";
  432. break;
  433. case 9:
  434. sts = "ml";
  435. break;
  436. case 10:
  437. sts = "ml";
  438. break;
  439. default:
  440. break;
  441. }
  442. // }
  443. var ele = $("." +userNo).find("i");
  444. if(sts) {
  445. $("." +userNo).find("i").removeClass().addClass(sts);
  446. }
  447. if (userNo == currentSelectUserNo) {
  448. showSelectAgentInfo(state);
  449. }
  450. }
  451. //显示选中坐席的按钮信息
  452. function showSelectAgentInfo(state) {
  453. $(".zxtp b").addClass("dis");
  454. switch(state) {
  455. case 0: //未签入
  456. // $(".zxtp b").addClass("dis");
  457. break; break;
  458. case 1: //空闲
  459. // $(".zxtp b").addClass("dis");
  460. break; break;
  461. case 2:
  462. case 3:
  463. case 4: //振铃
  464. $(".zxtp .dj").removeClass("dis");
  465. break;
  466. case 5: //通话中
  467. $(".zxtp .qc").removeClass("dis");
  468. $(".zxtp .qca").removeClass("dis");
  469. $(".zxtp .lj").removeClass("dis");
  470. $(".zxtp .jt").removeClass("dis");
  471. break;
  472. case 6:
  473. case 7:
  474. case 8:
  475. case 9:
  476. case 10: //忙
  477. $(".zxtp .zx").removeClass("dis");
  478. break;
  479. default:
  480. break;
  481. }
  482. }
  483. //选择操作
  484. function GetOneState(thiss) {
  485. $(".zxtp .g_nums").text(thiss.find(".g-num").text());
  486. $(".zxtp .g_names").text(thiss.find(".g-name").text());
  487. $(".zxtp i").removeClass().addClass(thiss.find("i").attr("class"));
  488. Center($('.zxtp'));
  489. currentSelectUserNo = thiss.find(".g-num").text();
  490. rtn = Phone.QueryAgentStatusEx(thiss.find(".g-num").text());
  491. showSelectAgentInfo(Phone.AgentInfoEx_CurState);
  492. }
  493. //强插
  494. function ztqca() {
  495. var userNo = $(".zxtp .g_nums").text();
  496. var rtn = Phone.InsertEx(userNo, 5);
  497. alert("rtn:" + rtn + "|||" + Phone.GetPromptByErrorCode(rtn));
  498. if(rtn == 0) {
  499. alert("强插成功");
  500. } else {
  501. alert("强插失败");
  502. }
  503. }
  504. //置忙
  505. function ztzm() {
  506. var userNo = $(".zxtp .g_nums").text();
  507. var rtn = Phone.AgentForceBusy(userNo, 1000);
  508. alert("rtn:" + rtn + "|||" + Phone.GetPromptByErrorCode(rtn));
  509. if(rtn == 0) {
  510. alert("置忙成功");
  511. } else {
  512. alert("置忙失败,请检查坐席状态");
  513. }
  514. }
  515. //置闲
  516. function ztzx() {
  517. var userNo = $(".zxtp .g_nums").text();
  518. var rtn = Phone.AgentForceIdle(userNo, 1000);
  519. alert("rtn:" + rtn + "|||" + Phone.GetPromptByErrorCode(rtn));
  520. if(rtn == 0) {
  521. alert("置闲成功");
  522. } else {
  523. alert("置闲失败,请检查坐席状态");
  524. }
  525. }
  526. //强拆
  527. function ztqz() {
  528. var userNo = $(".zxtp .g_nums").text();
  529. Phone.QueryCallIDOnAgentEx(userNo);
  530. if(Phone.CallIDNum > 0) {
  531. var _CallId;
  532. for(i = 0; i < Phone.CallIDNum; i++) {
  533. _CallId = Phone.GetCallIDByIdx(i)
  534. }
  535. var rtn = Phone.DisconnectCall(_CallId);
  536. alert("rtn:" + rtn + "|||" + Phone.GetPromptByErrorCode(rtn));
  537. if(rtn == 0) {
  538. alert("强拆成功");
  539. } else {
  540. //测试时可用下面的语句,查看具体出错提示,将出错代码转为出错信息
  541. //alert(Phone.GetPromptByErrorCode(rtn));
  542. alert("强拆失败");
  543. }
  544. } else {
  545. alert("该坐席没有处于通话中");
  546. }
  547. }
  548. //拦截
  549. //2018-04-27 lihai 按照chenyang修改的更新到源代码里
  550. function ztlj() {
  551. var userNo = $(".zxtp .g_nums").text();
  552. var rtn = Phone.QueryCallIDOnAgentEx(userNo);
  553. //if (Phone.IsTalking) {
  554. if($(".zxtp i").hasClass('th')) {
  555. var rtn = Phone.Intercept(1000, userNo);
  556. alert("rtn:" + rtn + "|||" + Phone.GetPromptByErrorCode(rtn));
  557. if(rtn == 0) {
  558. alert("拦截成功");
  559. } else {
  560. alert("拦截失败");
  561. }
  562. } else {
  563. alert("该坐席没有处于通话中");
  564. }
  565. }
  566. //监听
  567. //2018-04-27 lihai 按照chenyang修改的更新到源代码里
  568. function bzListen() {
  569. var userNo = $(".zxtp .g_nums").text();
  570. var rtn = Phone.QueryCallIDOnAgentEx(userNo);
  571. //查询坐席正在处理的话务标识
  572. if(rtn == 0) {
  573. //if (Phone.IsTalking) {
  574. if($(".zxtp i").hasClass('th')) {
  575. //var rtn = Phone.Listen(1000, userNo);
  576. var rtn = Phone.Supervise(parseInt(userNo), 5);
  577. alert("rtn:" + rtn + "|||" + Phone.GetPromptByErrorCode(rtn));
  578. if(rtn == 0) {
  579. alert("监听成功");
  580. } else {
  581. alert("监听失败");
  582. }
  583. } else {
  584. alert("该坐席没有处于通话中");
  585. }
  586. }
  587. }
  588. //代接
  589. function ztdj() {
  590. var userNo = $(".zxtp .g_nums").text();
  591. var rtn = Phone.QueryCallIDOnAgentEx(userNo);
  592. if(Phone.CallIDNum > 0) {
  593. var _CallId;
  594. for(i = 0; i < Phone.CallIDNum; i++) {
  595. _CallId = Phone.GetCallIDByIdx(i)
  596. }
  597. rtn = Phone.PickupCallEx(_CallId);
  598. alert("rtn:" + rtn + "|||" + Phone.GetPromptByErrorCode(rtn));
  599. if(rtn == 0) {
  600. alert('代接成功!');
  601. } else {
  602. //alert(Phone.GetPromptByErrorCode(rtn));
  603. alert("代接失败");
  604. }
  605. } else {
  606. alert("该坐席没有电话呼叫!");
  607. }
  608. }
  609. //
  610. function Exit() {
  611. try {
  612. var isExit = Phone.QCLogoutFromSpyEx();
  613. $(".jqc").addClass("dis");
  614. $(".kqc").removeClass("dis");
  615. } catch(e) {}
  616. }
  617. //计算数量
  618. var tj;
  619. function tjcount() {
  620. tj = {
  621. hr: 0,
  622. tx: 0,
  623. kx: 0,
  624. lx: 0,
  625. zm: 0,
  626. dl: 0
  627. };
  628. $(".zx_people i").each(function() {
  629. var zx = $(this).attr("zx_item");
  630. var xl = $(this).attr("xl_item");
  631. switch(zx) {
  632. case "0":
  633. tj.lx = tj.lx + 1;
  634. break; //离线
  635. case "5":
  636. tj.zm = tj.zm + 1;
  637. break; //小休
  638. }
  639. switch(xl) {
  640. case "5":
  641. tj.hr = tj.hr + 1;
  642. break; //来电振铃
  643. case "6":
  644. tj.tx = tj.tx + 1;
  645. break; //通话中
  646. }
  647. if(zx == '2' && xl == '1') {
  648. tj.kx = tj.kx + 1;
  649. } //空闲
  650. if(zx != '0' && zx != '7' && xl != '0' && xl != '9') {
  651. tj.dl = tj.dl + 1;
  652. }
  653. })
  654. $(".tjcount li").eq(0).find("b").text(tj.dl);
  655. $(".tjcount li").eq(1).find("b").text(tj.lx);
  656. $(".tjcount li").eq(2).find("b").text(tj.kx);
  657. $(".tjcount li").eq(3).find("b").text(tj.tx);
  658. $(".tjcount li").eq(4).find("b").text(tj.hr);
  659. $(".tjcount li").eq(5).find("b").text(tj.zm);
  660. }
  661. /*居中*/
  662. function Center(obj) {
  663. var screenWidth = $(window).width(),
  664. screenHeight = $(window).height(); //当前浏览器窗口的 宽高
  665. var scrolltop = $(document).scrollTop(); //获取当前窗口距离页面顶部高度
  666. var objLeft = (screenWidth - obj.width()) / 2;
  667. var objTop = (screenHeight - obj.height()) / 2 + scrolltop;
  668. obj.css({
  669. left: objLeft + 'px',
  670. top: objTop + 'px'
  671. });
  672. obj.show();
  673. }
  674. </script>
  675. </head>
  676. <body onload="Init();" onunload="Exit();">
  677. <div class="wrapper wrapper-content animated fadeInRight">
  678. <div class="daoHang clearfix">
  679. <div class="dhLeft">
  680. <sapn><i class="syIcon"></i>位置:
  681. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  682. <a href="javaScript:;">话务管理</a>&gt;
  683. <a href="" style="color: #000;">坐席管理</a>
  684. </sapn>
  685. </div>
  686. <div class="dhRight">
  687. <a href="#" title="刷新"><i class="fa fa-refresh"></i></a>
  688. </div>
  689. </div>
  690. <div class="row" style="margin-top: 20px;">
  691. <!--左边-->
  692. <div class="col-sm-9">
  693. <div class="zx_top">
  694. <span class="zx-title">坐席监控系统</span>
  695. <ul class="fenxian">
  696. <li class="left_red"></li>
  697. <li class="rg_green"></li>
  698. </ul>
  699. </div>
  700. <div class="zx_content">
  701. <ul class="zx_people"></ul>
  702. </div>
  703. </div>
  704. <!--右边-->
  705. <div class="col-sm-3">
  706. <!--<div class="zx_top">
  707. <span class="zx-title">状态说明</span>
  708. <ul class="m-b fenxian" style="width:104px;">
  709. <li class="left_red"></li>
  710. <li class="rg_green"></li>
  711. </ul>
  712. <div class="zx-box">
  713. <div class="ztsm2 w_3">
  714. <ul class="ztsm">
  715. <li><b class="zx">置闲</b></li>
  716. <li><b class="jt">监听</b></li>
  717. <li><b class="dj">代接</b></li>
  718. <li><b class="qca">强插</b></li>
  719. <li><b class="lj">拦截</b></li>
  720. <li><b class="qc">强拆</b></li>
  721. <li style="width: 50%;"><b class="kqc">开始监测</b></li>
  722. <li style="width: 50%;"><b class="jqc dis">停止监测</b></li>
  723. </ul>
  724. </div>
  725. </div>
  726. </div>-->
  727. <div class="zx_top">
  728. <span class="zx-title">实时统计</span>
  729. <ul class="m-b fenxian" style="width:104px;">
  730. <li class="left_red"></li>
  731. <li class="rg_green"></li>
  732. </ul>
  733. <div class="zx-box">
  734. <div class="zt-content w_5">
  735. <ul class="tjcount">
  736. <li>登录坐席:<b>0</b></li>
  737. <li>离线人数:<b>0</b></li>
  738. <li>空闲人数:<b>0</b></li>
  739. <li>通话人数:<b>0</b></li>
  740. <li>系统呼入:<b>0</b></li>
  741. <li>置忙坐席:<b>0</b></li>
  742. <!--<li>签出坐席:<b>100</b></li>-->
  743. <li>全部坐席:<b>0</b></li>
  744. </ul>
  745. </div>
  746. </div>
  747. </div>
  748. <div class="zx_top">
  749. <span class="zx-title">状态说明</span>
  750. <ul class="m-b fenxian" style="width:104px;">
  751. <li class="left_red"></li>
  752. <li class="rg_green"></li>
  753. </ul>
  754. <div class="zx-box">
  755. <div class="zt-content w_5">
  756. <ul>
  757. <!--<li><i class="hc"></i>呼出</li>-->
  758. <li><i class="ml"></i>忙绿</li>
  759. <li><i class="kx"></i>空闲</li>
  760. <li><i class="zl"></i>振铃</li>
  761. <!--<li><i class="qc"></i>&nbsp;签出</li>-->
  762. <li><i class="lx"></i>离线</li>
  763. <!--<li><i class="hh"></i>话后处理</li>-->
  764. <li><i class="th"></i>通话中</li>
  765. </ul>
  766. </div>
  767. </div>
  768. </div>
  769. </div>
  770. </div>
  771. </div>
  772. <!--坐席弹屏-->
  773. <div class="zxT zxtp">
  774. <div class="zx-box" style="width: 400px;">
  775. <div class="zx_photo row zx_content">
  776. <div style="width: 400px;">
  777. <div class="bg_person"> <i class="lx"></i></div>
  778. <p>
  779. <span>工号:</span>
  780. <span class="g_nums" id="theChoce_nums"></span>
  781. </p>
  782. <p>
  783. <span>姓名:</span>
  784. <span class="g_names" id="theChoce_names"></span>
  785. </p>
  786. </div>
  787. </div>
  788. <div class="zx-box_ul row">
  789. <ul style="width: 100%;margin: 0 auto;">
  790. <li><b class="zx" id="ForceAgentState" onclick="ztzx()">置闲</b></li>
  791. <li><b class="jt" id="Listen" onclick="bzListen()">监听</b></li>
  792. <li><b class="dj" id="Instead" onclick="ztdj()">代接</b></li>
  793. <li><b class="qca" id="Insert" onclick="ztqca()">强插</b></li>
  794. <li><b class="lj" id="Intercept" onclick="ztlj()">拦截</b></li>
  795. <li><b class="qc" id="Break" onclick="ztqz()">强拆</b></li>
  796. </ul>
  797. </div>
  798. </div>
  799. </div>
  800. <input type="hidden" id="txtTimes" value="0" />
  801. <input type="hidden" id="continueTime" />
  802. </body>
  803. </html>