中鑫之宝5.0前端

main.js 20KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636
  1. 
  2. var ws, n = 0, timer;
  3. var lockReconnect = false;//避免重复连接
  4. var obj = {};
  5. var cls = 0;
  6. var lasttime = new Date().getTime();
  7. //创建scoket连接
  8. function createWebSocket() {
  9. try {
  10. $("#top-search li i").removeClass("active");
  11. ws = new WebSocket("ws://" + huayi.config.socket_ip + ":" + huayi.config.socket_port);
  12. Connect();
  13. } catch (e) {
  14. reconnect();
  15. }
  16. }
  17. //连接
  18. function Connect() {
  19. try {
  20. ws.onopen = function () {
  21. console.log(new Date() + " " + "建立连接");
  22. //心跳检测重置
  23. heartCheck.reset().start();
  24. cls = 0;
  25. $(".Login").addClass("active");
  26. //自动签入
  27. //lasttime = new Date().getTime();
  28. //obj.Type = "Login";
  29. //obj.AgentType = "0";
  30. Send();
  31. };
  32. //接收到消息的回调方法
  33. ws.onmessage = function (evt) {
  34. //如果获取到消息,心跳检测重置
  35. //拿到任何消息都说明当前连接是正常的
  36. heartCheck.reset().start();
  37. var myDate = new Date();
  38. console.log(myDate + " " + evt.data);
  39. var data = JSON.parse(evt.data)[0];
  40. if (data) {
  41. var rlt = data.Result;
  42. if (rlt == true) {
  43. var type = data.Type;
  44. switch (type.toLowerCase()) {
  45. //case "heart": HeartBack(); break;//心跳
  46. case "login": LoginBack(); break;//签入
  47. case "logout": LogoutBack(); break;//签出
  48. case "dropcall": DropCallBack(); break;//挂断
  49. case "makecall": MakeCallBack(); break;//外呼
  50. case "setstate": SetState(data); break;//置忙置闲
  51. //case "saybusy": SayBusyBack(data); break;
  52. //case "sayfree": SayFreeBack(data); break;
  53. case "meeting": MeetingBack(); break;//多方通话
  54. case "transfer": TransferBack(); break;//转移
  55. case "hold": HoldBack(); break;//保持
  56. case "retrieve": RetrieveBack(); break;//接回
  57. case "incoming": IncomingBack(data); break;//来电
  58. case "subscribe": SubScribeBack(); break;//监测
  59. case "subscribecancel": SubScribeCancelBack(); break;//停止监测
  60. case "agentstate": AgentStateBack(data); break;//坐席状态
  61. case "linestate": LineStateBack(data); break;//线路状态
  62. case "motorsetstate": SayFreeBack(); break;//班长置闲
  63. case "linestateagent": LineStateAgentBack(data); break;//线路状态通知
  64. case "callid": CallIDBack(data); break;//获取callid
  65. case "recordpath": RecordPathBack(data); break;//录音返回
  66. }
  67. }
  68. else {
  69. if (rlt == false) {
  70. //layer.confirm('操作失败!', {
  71. // btn: ['确定']
  72. //});
  73. $(".hwzt").text('操作失败!');
  74. }
  75. else {
  76. $(".hwzt").text(rlt);
  77. //layer.confirm(rlt, {
  78. // btn: ['确定']
  79. //});
  80. }
  81. }
  82. }
  83. };
  84. //连接关闭的回调方法
  85. ws.onclose = function (evt) {
  86. if (cls == 0) {
  87. cls = 1;
  88. //console.log("连接关闭!");
  89. //layer.confirm('连接关闭!', {
  90. // btn: ['确定']
  91. //});
  92. $(".hwzt").text('连接关闭!');
  93. $("#top-search li i").removeClass("active");
  94. reconnect();
  95. }
  96. };
  97. //连接发生错误的回调方法
  98. ws.onerror = function (evt) {
  99. //产生异常
  100. $(".hwzt").text('连接出现异常!');
  101. console.log(ws);
  102. if (ws==null||ws.readyState != ws.OPEN) {
  103. console.log(new Date() + "开始重连");
  104. reconnect();
  105. }
  106. };
  107. }
  108. catch (ex) {
  109. $(".hwzt").text('连接关闭 try-catch!');
  110. $("#top-search li i").removeClass("active");
  111. reconnect();
  112. }
  113. }
  114. //重连
  115. function reconnect() {
  116. if (lockReconnect) return;
  117. lockReconnect = true;
  118. //没连接上会一直重连,设置延迟避免请求过多
  119. setTimeout(function () {
  120. console.log(new Date() + " " + "重连中……");
  121. createWebSocket("ws://" + huayi.config.socket_ip + ":" + huayi.config.socket_port);
  122. lockReconnect = false;
  123. }, 2000);
  124. }
  125. //发送
  126. function Send() {
  127. if (ws.readyState != ws.OPEN) {
  128. reconnect();
  129. }
  130. if (ws.readyState == ws.OPEN) {
  131. ws.send(JSON.stringify(obj));
  132. }
  133. }
  134. //心跳检测
  135. var heartCheck = {
  136. timeout: 25000,//25秒
  137. timeoutObj: null,
  138. serverTimeoutObj: null,
  139. reset: function () {
  140. clearTimeout(this.timeoutObj);
  141. clearTimeout(this.serverTimeoutObj);
  142. return this;
  143. },
  144. start: function () {
  145. var self = this;
  146. this.timeoutObj = setTimeout(function () {
  147. //这里发送一个心跳,后端收到后,返回一个心跳消息,
  148. //onmessage拿到返回的心跳就说明连接正常
  149. obj.Type = "Heart";
  150. Send();
  151. self.serverTimeoutObj = setTimeout(function () {//如果超过一定时间还没重置,说明后端主动断开了
  152. ws.close();//如果onclose会执行reconnect,我们执行ws.close()就行了.如果直接执行reconnect 会触发onclose导致重连两次
  153. }, self.timeout)
  154. }, this.timeout)
  155. }
  156. }
  157. //签入
  158. function LoginBack() {
  159. $("#top-search li i").removeClass("active");
  160. $(".Logout").addClass("active");
  161. $(".SayBusy").addClass("active");
  162. $(".MakeCall").addClass("active");
  163. $(".zxzt").removeClass("br").addClass("bl");
  164. $(".fwzt").removeClass("br").addClass("bl");
  165. $(".hwzt").text('');
  166. }
  167. //签出
  168. function LogoutBack() {
  169. $("#top-search li i").removeClass("active");
  170. $(".Login").addClass("active");
  171. $(".zxzt").removeClass("bl").addClass("br");
  172. $(".fwzt").removeClass("bl").addClass("br");
  173. $(".hwzt").text('');
  174. }
  175. //来电
  176. function IncomingBack(data) {
  177. $(".hidTel").val(data.Number);
  178. $(".tel").text(data.Number);
  179. $("#zxdh_").val(data.Number);
  180. $("#tsdh").val(data.Number);
  181. $(".ldtime").text(getNowFormatDate());
  182. $(".thsc").text("00:00");
  183. //获取callid
  184. $.ajaxSettings.async = false;
  185. $.getJSON(huayi.config.callcenter_url + 'CallInScreen/GetCallIdByPhone', { "tel": $(".hidTel").val(), "token": $.cookie("token") }, function (result) {
  186. $.ajaxSettings.async = true;
  187. if (result.state.toLowerCase() == "success") {
  188. $(".hidCallID").val(result.data.CallId);
  189. }
  190. })
  191. //获取电话所属地
  192. $.getJSON(huayi.config.callcenter_url + 'CallInScreen/GetPhoneLocation', { "tel": $(".hidTel").val(), "token": $.cookie("token") }, function (result) {
  193. if (result.state.toLowerCase() == "success") {
  194. $(".khgsd").text(result.data);
  195. }
  196. })
  197. //获取客户信息
  198. $(".ldtel").text($(".hidTel").val());
  199. $("#tsdh").val($(".hidTel").val());
  200. $(".ldtel1").val($(".hidTel").val());
  201. $.getJSON(huayi.config.callcenter_url + 'CallInScreen/GetCustomerByTel', { "tel": $(".hidTel").val(), "token": $.cookie("token") }, function (result) {
  202. if (result.state.toLowerCase() == "success") {
  203. if (result.data.length > 0) {
  204. $("#zxr_").val(result.data[0].F_CustomerName);
  205. $("#tskh").val(result.data[0].F_CustomerName);
  206. $("#khid").val(result.data[0].F_CustomerId);
  207. $(".khbh").val(result.data[0].F_CustomerCode);
  208. $(".ldtel1").val(result.data[0].F_Telephone);
  209. $(".ldtel2").val(result.data[0].F_Mobile);
  210. $(".ldtel3").val(result.data[0].F_ChargeTelephone);
  211. }
  212. }
  213. })
  214. loadOld();
  215. $('.maxOpen').trigger("click");
  216. $('.head-pic .lahei .la-before').show();
  217. $('.head-pic .lahei .la-after').hide();
  218. $(".Bacha").hide();
  219. }
  220. function CallIDBack(data) {
  221. //$(".hidCallID").val(data.CurrID);
  222. }
  223. //挂断
  224. function DropCallBack() {
  225. $("#top-search li i").removeClass("active");
  226. $(".Logout").addClass("active");
  227. $(".SayBusy").addClass("active");
  228. $(".MakeCall").addClass("active");
  229. $(".td-call").hide();
  230. //$('.ldtp-con').css("display", 'none');
  231. }
  232. function LineStateAgentBack(data) {
  233. //0分机不可用,1空闲,2摘机等待拨号,3正在拨号,4呼出振铃,5来电振铃,6通话中,7播放忙音中,8移除IP分机,9通话保持中
  234. if (data.State == '0') {
  235. $(".hwzt").text('分机不可用');//左下角状态显示
  236. }
  237. if (data.State == '1') {
  238. $(".hwzt").text('空闲');//左下角状态显示
  239. $(".fwzt").removeClass("br").addClass("bl");
  240. clearInterval(timer);
  241. if ($(".hidTel").val() && $(".hidCallID").val()) {
  242. $.post(huayi.config.callcenter_url + 'CallInScreen/UpdateGJ', { callid: $(".hidCallID").val(), "token": $.cookie("token") }, function (result) {
  243. result = JSON.parse(result);
  244. if (result.state.toLowerCase() == "success") {
  245. }
  246. })
  247. }
  248. $("#top-search li i").removeClass("active");
  249. $(".Logout").addClass("active");
  250. $(".SayBusy").addClass("active");
  251. $(".MakeCall").addClass("active");
  252. $(".td-call").hide();
  253. $(".Bacha").show();
  254. //$(".hidTel").val("");
  255. //$(".hidCallID").val("");
  256. }
  257. if (data.State == '2') {
  258. $(".hwzt").text('摘机等待拨号');//左下角状态显示
  259. }
  260. if (data.State == '3') {
  261. $(".hwzt").text('正在拨号');//左下角状态显示
  262. }
  263. if (data.State == '4') {
  264. $(".hwzt").text('呼出振铃');//左下角状态显示
  265. }
  266. if (data.State == '5') {
  267. $(".hwzt").text('来电振铃');//左下角状态显示
  268. $(".fwzt").removeClass("bl").addClass("br");
  269. if ($(".hidTel").val() && $(".hidCallID").val()) {
  270. $.post(huayi.config.callcenter_url + 'CallInScreen/UpdateZL', { callid: $(".hidCallID").val(), "token": $.cookie("token") }, function (result) {
  271. result = JSON.parse(result);
  272. if (result.state.toLowerCase() == "success") {
  273. }
  274. })
  275. }
  276. }
  277. if (data.State == '6') {
  278. $(".hwzt").text('通话中');//左下角状态显示
  279. $(".fwzt").removeClass("bl").addClass("br");
  280. if ($(".hidTel").val() && $(".hidCallID").val()) {
  281. $.post(huayi.config.callcenter_url + 'CallInScreen/UpdateZJ', { callid: $(".hidCallID").val(), "token": $.cookie("token") }, function (result) {
  282. result = JSON.parse(result);
  283. if (result.state.toLowerCase() == "success") {
  284. }
  285. })
  286. }
  287. $(".td-call").show();
  288. n = 0;
  289. $("#top-search li i").removeClass("active");
  290. $(".DropCall").addClass("active");
  291. $(".Hold").addClass("active");
  292. $(".Transfer").addClass("active");
  293. $(".Meeting").addClass("active");
  294. clearInterval(timer);
  295. timer = setInterval(function () {
  296. n++;
  297. var m = parseInt(n / 60 % 60);
  298. var s = parseInt(n % 60);
  299. $(".thsc").text(toDub(m) + ":" + toDub(s));
  300. }, 1000);
  301. }
  302. if (data.State == '7') {
  303. $(".hwzt").text('播放忙音中');//左下角状态显示
  304. }
  305. if (data.State == '8') {
  306. $(".hwzt").text('移除IP分机');//左下角状态显示
  307. }
  308. if (data.State == '9') {
  309. $(".hwzt").text('通话保持中');//左下角状态显示
  310. }
  311. }
  312. function toDub(i) {
  313. return i < 10 ? "0" + i : "" + i;
  314. }
  315. //外呼
  316. function MakeCallBack() {
  317. $("#top-search li i").removeClass("active");
  318. $(".DropCall").addClass("active");
  319. }
  320. //置忙置闲
  321. function SetState(obj) {
  322. if (obj.State == '5') {
  323. $(".SayBusy").removeClass("active");
  324. $(".SayFree").addClass("active");
  325. $(".zxzt").removeClass("bl").addClass("br");
  326. $(".hwzt").text('置忙');
  327. }
  328. if (obj.State == '2') {
  329. $(".SayBusy").addClass("active");
  330. $(".SayFree").removeClass("active");
  331. $(".zxzt").removeClass("br").addClass("bl");
  332. $(".hwzt").text('空闲');
  333. }
  334. }
  335. //置忙
  336. function SayBusyBack() {
  337. $(".SayBusy").removeClass("active");
  338. $(".SayFree").addClass("active");
  339. }
  340. //置闲
  341. function SayFreeBack() {
  342. $(".SayBusy").addClass("active");
  343. $(".SayFree").removeClass("active");
  344. }
  345. //多方通话
  346. function MeetingBack() {
  347. }
  348. //转移
  349. function TransferBack() {
  350. $("#top-search li i").removeClass("active");
  351. $(".Logout").addClass("active");
  352. $(".SayBusy").addClass("active");
  353. $(".MakeCall").addClass("active");
  354. }
  355. //保持
  356. function HoldBack() {
  357. $(".Hold").removeClass("active");
  358. $(".Retrieve").addClass("active");
  359. }
  360. //接回
  361. function RetrieveBack() {
  362. $(".Hold").addClass("active");
  363. $(".Retrieve").removeClass("active");
  364. }
  365. //监测
  366. function SubScribeBack() {
  367. var obj = $("iframe:visible")
  368. if (obj.attr("data-id") == "./TelCall/SeatMonitor.html") {
  369. window.frames[obj.attr("name")].Start();
  370. }
  371. }
  372. //取消监测
  373. function SubScribeCancelBack() {
  374. var obj = $("iframe:visible")
  375. if (obj.attr("data-id") == "./TelCall/SeatMonitor.html") {
  376. window.frames[obj.attr("name")].Stop();
  377. }
  378. }
  379. //班长监测返回状态
  380. //坐席状态
  381. function AgentStateBack(data) {
  382. var obj = $("iframe:visible")
  383. if (obj.attr("data-id") == "./TelCall/SeatMonitor.html") {
  384. window.frames[obj.attr("name")].UpdateAgentState(data.AgentID, data.State);
  385. }
  386. }
  387. //线路状态
  388. function LineStateBack(data) {
  389. var obj = $("iframe:visible")
  390. if (obj.attr("data-id") == "./TelCall/SeatMonitor.html") {
  391. window.frames[obj.attr("name")].UpdateLineState(data.AgentID, data.State);
  392. }
  393. }
  394. //录音返回
  395. function RecordPathBack(data) {
  396. //if ($(".hidTel").val() && $(".hidCallID").val()) {
  397. // $.post(huayi.config.callcenter_url + 'CallInScreen/UpdateLY', { callid: $(".hidCallID").val(),path:data.RecPath, "token": $.cookie("token") }, function (result) {
  398. // result = JSON.parse(result);
  399. // if (result.state.toLowerCase() == "success") {
  400. // }
  401. // })
  402. //}
  403. if ($(".hidTel").val()) {
  404. $.post(huayi.config.callcenter_url + 'CallInScreen/UpdateLY', { callid: data.CallID, path: data.RecPath, "token": $.cookie("token") }, function (result) {
  405. result = JSON.parse(result);
  406. if (result.state.toLowerCase() == "success") {
  407. }
  408. })
  409. }
  410. }
  411. //获取当前的日期时间 格式“yyyy-MM-dd HH:mm:ss”
  412. function getNowFormatDate() {
  413. var date = new Date();
  414. var seperator1 = "-";
  415. var seperator2 = ":";
  416. var month = date.getMonth() + 1;
  417. var strDate = date.getDate();
  418. if (month >= 1 && month <= 9) {
  419. month = "0" + month;
  420. }
  421. if (strDate >= 0 && strDate <= 9) {
  422. strDate = "0" + strDate;
  423. }
  424. var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
  425. + " " + date.getHours() + seperator2 + date.getMinutes()
  426. + seperator2 + date.getSeconds();
  427. return currentdate;
  428. }
  429. //来电弹屏
  430. laydate.skin('molv');
  431. laydate({
  432. elem: '#old_startTime',
  433. event: 'focus'
  434. });
  435. laydate({
  436. elem: '#old_endTime',
  437. event: 'focus'
  438. });
  439. laydate({
  440. elem: '#con_startTime',
  441. event: 'focus'
  442. });
  443. laydate({
  444. elem: '#con_endTime',
  445. event: 'focus'
  446. });
  447. //弹屏右侧切换效果
  448. $(".ldtp-cr ul.ld-service li").click(function () {
  449. $(this).addClass("cr-click").siblings().removeClass("cr-click");
  450. loadOld();
  451. });
  452. $('.pre-add').click(function () {
  453. var par = $(this).parent().parent();
  454. par.hide().siblings().show();
  455. })
  456. //最大化 最小化效果
  457. //最小化
  458. $('.minClosed').click(function () {
  459. $('.ldtp-con').removeClass('fadeInDown');
  460. $('.ldtp-con').addClass('fadeOutUp');
  461. $('.ldtp-con').css("display", "none");
  462. $('.maxOpen').show();
  463. $('.maxOpen').addClass('fadeInDown');
  464. });
  465. //最大化
  466. $('.maxOpen').click(function () {
  467. $('.ldtp-con').removeClass('fadeOutUp');
  468. $('.ldtp-con').addClass('fadeInDown');
  469. $('.ldtp-con').css("display", "block");
  470. $('.maxOpen').hide();
  471. $('.maxOpen').removeClass('fadeInDown');
  472. $('.maxOpen').addClass('fadeInDown');
  473. $('.first').removeClass('first');
  474. $('.ldtp-con').addClass('first');
  475. })
  476. //关闭弹框
  477. $(".Bacha").click(function () {
  478. $('.ldtp-con').removeClass('fadeInDown');
  479. $('.ldtp-con').addClass('fadeOutUp');
  480. $('.ldtp-con').css("display", "none");
  481. obj.Type = "SayFree";
  482. Send();
  483. })
  484. //顶部小头像
  485. var little_pic = $('.head-pic .hp-box img').attr("src");
  486. $('.maxOpen li .photo img').attr("src", little_pic);
  487. //点击左侧菜单来电弹屏显示
  488. $('.tantan').click(function () {
  489. $('.maxOpen').trigger("click");
  490. $('.head-pic .lahei .la-before').show();
  491. $('.head-pic .lahei .la-after').hide();
  492. loadOld();
  493. })
  494. //点击挂断
  495. $('.head-pic .td-call .take').click(function () {
  496. obj.Type = "DropCall";
  497. Send();
  498. });
  499. //点击拉黑事件
  500. $('.head-pic .lahei .la-before').click(function () {
  501. if (!$(".hidTel").val()) {
  502. layer.confirm('来电号码为空!', {
  503. btn: ['确定']
  504. });
  505. return;
  506. }
  507. $("#time-word").val('');
  508. $('.ldtp-con .hei-list').show();
  509. })
  510. //拉黑输入框事件
  511. $('.hei-list .bacha').click(function () {
  512. $('.ldtp-con .hei-list').hide();
  513. $("#time-word").val('');
  514. })
  515. var reg = /^\+?[1-9][0-9]*$/;
  516. $('#bc').click(function () {
  517. var n = $("#time-word").val();
  518. var val = $("input[name='time']:checked").val();
  519. if (n) {
  520. if (!(reg.test(n))) {
  521. layer.confirm('请输入整数时间!', {
  522. btn: ['确定']
  523. });
  524. return;
  525. }
  526. }
  527. else {
  528. if (val == '4') {
  529. n = 0;
  530. }
  531. else {
  532. layer.confirm('请输入整数时间!', {
  533. btn: ['确定']
  534. });
  535. return;
  536. }
  537. }
  538. $.post(huayi.config.callcenter_url + 'CallInScreen/AddBlack', { tel: $(".hidTel").val(), num: n, type: val, "token": $.cookie("token") }, function (result) {
  539. result = $.parseJSON(result);
  540. if (result.state.toLowerCase() == "success") {
  541. layer.msg("拉入黑名单成功");
  542. $('.la-shichang .blackTime').html(result.data);
  543. $('.ldtp-con .hei-list').hide();
  544. $('.head-pic .lahei .la-before').hide();
  545. $('.head-pic .lahei .la-after').show();
  546. $('.head-pic .lahei .retur').show();
  547. }
  548. })
  549. })
  550. $('.la-after').click(function () {
  551. if (!$(".hidTel").val()) {
  552. layer.confirm('来电号码为空!', {
  553. btn: ['确定']
  554. });
  555. return;
  556. }
  557. $("#time-word").val('');
  558. $('.ldtp-con .hei-list').show();
  559. $('.ldtp-con .hei-list').removeClass('bounceOutUp');
  560. $('.ldtp-con .hei-list').addClass('bounceIn');
  561. })
  562. $('.head-pic .lahei .retur').click(function () {
  563. $.getJSON(huayi.config.callcenter_url + 'CallInScreen/DelBlack', { tel: $(".hidTel").val(), "token": $.cookie("token") }, function (result) {
  564. if (result.state.toLowerCase() == "success") {
  565. layer.msg("取消黑名单成功");
  566. $('.head-pic .lahei .retur').hide();
  567. $('.head-pic .lahei .la-after').hide();
  568. $('.head-pic .lahei .la-before').show();
  569. }
  570. })
  571. })