if(typeof console == "undefined") { this.console = { log: function(msg) {} }; } var callSeatState = echarts.init(document.getElementById("callSeatState")); // 如果浏览器不支持websocket,会使用这个flash自动模拟websocket协议,此过程对开发者透明 WEB_SOCKET_SWF_LOCATION = "./js/websocket/WebSocketMain.swf"; // 开启flash的websocket debug WEB_SOCKET_DEBUG = true; var ws, n = 0, timer; var lockReconnect = false; //避免重复连接 var obj = {}; var Statess; var cls = 0; var dataLength; //坐席数量 let distributionData = []; //话务数据统计数据 let callDate = []; //话务坐席数据 let hwcount; let jtcount; let daySeatName = ['登陆坐席数量', '呼叫排队数量', '话务量', '呼入接通量']; let callSeatStateName = ['等待', '通话中', '话后处理', '置忙', '空闲'] var lasttime = new Date().getTime(); let callSeatStateData; let locationNum = 0; //坐席数量 function agentCount() { $.ajax({ url: huayi.config.callcenter_url + "SeatMonitoring/getlist", data: { token: $.cookie("token"), }, async: false, dataType: 'json', success: function(res) { dataLength = res.data.length; } }) } //话务量接通量 function getPhoneCount() { $.ajax({ url: huayi.config.callcenter_url + "/InfoNew/GetTrafficCountByNow", data: { token: $.cookie("token"), }, async: false, dataType: 'json', success: function(res) { hwcount = res.data.hw[0].hwcount; jtcount = res.data.hw[0].jtcount } }) } //话务数据统计 function GetDistributionCount() { $.ajax({ url: huayi.config.callcenter_url + "InfoNew/GetDistributionCount", data: { token: $.cookie("token"), }, async: false, dataType: 'json', success: function(res) { distributionData = []; let hw = res.data.hw[0]; let gd = res.data.gd[0]; Object.keys(hw).forEach((key, n) => { if(key == 'hrjtcount') { distributionData.push({ name: '呼入接通数量', value: hw[key] }) } if(key == 'hcjtcount') { distributionData.push({ name: '呼出接通数量', value: hw[key] }) } if(key == 'hrtime') { distributionData.push({ name: '呼入通话时长', value: hw[key] }) } if(key == 'hctime') { distributionData.push({ name: '呼出通话时长', value: hw[key] }) } if(key == 'pjhrtime') { distributionData.push({ name: '平均呼入通时', value: hw[key] }) } if(key == 'pjhctime') { distributionData.push({ name: '平均呼出通时', value: hw[key] }) } if(key == 'fqcount') { distributionData.push({ name: '放弃呼叫量', value: hw[key] }) } if(key == 'hscount') { distributionData.push({ name: '日呼损量', value: hw[key] }) } if(key == 'sdhscount') { distributionData.push({ name: '时段呼损量', value: hw[key] }) } }) Object.keys(gd).forEach((key, n) => { if(key == 'dxcount') { distributionData.push({ name: '短信受理量', value: gd[key] }) } if(key == 'wxcount') { distributionData.push({ name: '微信受理量', value: gd[key] }) } if(key == 'wbcount') { distributionData.push({ name: '微博受理量', value: gd[key] }) } if(key == 'apcount') { distributionData.push({ name: 'APP受理量', value: gd[key] }) } if(key == 'xxcount') { distributionData.push({ name: '市长信箱受理量', value: gd[key] }) } }) distributionData.unshift({ name: '登陆坐席数量', value: 0 }) distributionData.unshift({ name: '呼叫排队数量', value: 0 }) } }) } Connect() //创建scoket连接 function createWebSocket() { try { Connect(); } catch(e) { reconnect(); } } //连接 function Connect() { // debugger ws = new WebSocket("ws://" + huayi.config.socket_ip + ":" + huayi.config.socket_port); ws.onopen = function() { console.log(new Date() + " " + "建立连接"); //心跳检测重置 heartCheck.reset().start(); cls = 0; $(".Login").addClass("active"); lasttime = new Date().getTime(); // debugger //话务坐席情况 obj = { "Type": 'GetAgentDetail', //话后处理时长设置,0代表一致话后处理,除非发送置闲 (按照历史习惯,字符串形式) }; Send(); }; //接收到消息的回调方法 ws.onmessage = function(evt) { //如果获取到消息,心跳检测重置 //拿到任何消息都说明当前连接是正常的 heartCheck.reset().start(); var myDate = new Date(); data = JSON.parse(evt.data)[0]; if(data.Type == "GetAgentDetail") { if(distributionData[0]){ distributionData[0].value = data.WaiteCallCount; distributionData[1].value = data.AgentOnlineCount let disStr = '' distributionData.forEach(function(v, n) { disStr += '
  • ' + parseInt(v.value % 100000 / 10000) + '' + parseInt(v.value % 10000 / 1000) + '' + parseInt(v.value % 1000 / 100) + '' + parseInt((v.value % 100) / 10) + '' + parseInt(v.value % 10) + '
  • ' }) $('.callTraffic .data_info').html(disStr) callDate = [Number(data.AgentOnlineCount), Number(data.WaiteCallCount), Number(hwcount), Number(jtcount)] const outLine = dataLength - data.AgentOnlineCount; callSeatStateData = [data.WaiteCallCount, data.AgentSpeakCount, data.AgentProcessingCount, data.AgentReposeCount, data.AgentFreeCount] hotThingsChartMain('callSeatState', callSeatStateName, callSeatStateData, 500) } } if(data) { var rlt = data.Result; if(rlt == true) { var type = data.Type; switch(type.toLowerCase()) { case "subscribe": SubScribeBack(); break; //监测 case "subscribecancel": SubScribeCancelBack(); break; //停止监测 case "agentstate": AgentStateBack(data); break; //坐席状态 case "linestate": // LineStateBack(data); break; //线路状态 } } else { if(rlt == false) { //layer.confirm('操作失败!', { // btn: ['确定'] //}); $(".hwzt").text('操作失败!'); } else { $(".hwzt").text(rlt); //layer.confirm(rlt, { // btn: ['确定'] //}); switch(data.Type.toLowerCase()) { case "waitcount": backstageQueue(data); break; //后台排队 } } } } } }; //连接关闭的回调方法 ws.onclose = function(evt) { if(cls == 0) { cls = 1; //console.log("连接关闭!"); //layer.confirm('连接关闭!', { // btn: ['确定'] //}); $(".hwzt").text('连接关闭!'); $("#top-search li i").removeClass("active"); reconnect(); } }; //连接发生错误的回调方法 ws.onerror = function(evt) { //产生异常 $(".hwzt").text('连接出现异常!'); console.log(ws); if(ws == null || ws.readyState != ws.OPEN) { console.log(new Date() + "开始重连"); reconnect(); } }; //} //重连 function reconnect() { if(lockReconnect) return; lockReconnect = true; //没连接上会一直重连,设置延迟避免请求过多 setTimeout(function() { console.log(new Date() + " " + "重连中……"); createWebSocket("ws://" + huayi.config.socket_ip + ":" + huayi.config.socket_port); lockReconnect = false; }, 2000); } //发送 function Send() { if(ws.readyState != ws.OPEN) { reconnect(); } if(ws.readyState == ws.OPEN) { console.log(new Date() + " send " + JSON.stringify(obj)); ws.send(JSON.stringify(obj)); } } //心跳检测 var heartCheck = { timeout: 25000, //25秒 timeoutObj: null, serverTimeoutObj: null, reset: function() { clearTimeout(this.timeoutObj); clearTimeout(this.serverTimeoutObj); return this; }, start: function() { var self = this; this.timeoutObj = setTimeout(function() { //这里发送一个心跳,后端收到后,返回一个心跳消息, //onmessage拿到返回的心跳就说明连接正常 obj.Type = "Heart"; Send(); self.serverTimeoutObj = setTimeout(function() { //如果超过一定时间还没重置,说明后端主动断开了 ws .close(); //如果onclose会执行reconnect,我们执行ws.close()就行了.如果直接执行reconnect 会触发onclose导致重连两次 }, self.timeout) }, this.timeout) } } //开始监测 function SubScribeBack() { $(".star_btn").css("background-color", 'rgb(1,216,235)'); $(".stop_btn").css("background-color", '#064695'); } //取消监测 function SubScribeCancelBack() { $(".people_list").show() $(".people_list i").hide() $(".stop_btn").css("background-color", 'rgb(1,216,235)'); $(".star_btn").css("background-color", '#064695'); $(".stop_btn").addClass("dis"); $(".star_btn").removeClass("dis"); $(".zx_people i").removeClass().addClass("lx"); $(".zx_people i").removeClass().addClass("lx").attr("zx_item", "0").attr("xl_item", "0"); } //班长监测返回状态 //坐席状态 function AgentStateBack(data) { // console.log(data) var sts = ""; switch(data.State) { case "0": sts = "lx"; break; //离线 case "1": break; //登录中 case "2": sts = "kx"; break; //空闲 case "3": sts = "th"; break; //通话中 case "4": sts = "hh"; break; //话后处理中 case "5": sts = "ml"; break; //小休 case "6": sts = "zl"; break; //被请求 case "7": sts = "lx"; break; //注销 } if(data.AgentID * 1 < 10) { data.AgentID = '0' + data.AgentID; } var ele = $("." + data.AgentID).find("i"); if(sts) { ele.removeClass().addClass(sts); } ele.attr("zx_item", data.State); if($(".zxtp .g_nums").text() == data.AgentID) { if(sts) { $(".zxtp i").removeClass().addClass(sts); } } if(data.State === "2") { // console.log(data.AgentID,data.State,data.Group,) } $(".people_list dl dt").each(function() { // console.log($(this).find("i").attr("zxGroup")) // if($(this).find("i").attr("class")==='lx'){ //// console.log($(this).find("i").attr("zxGroup")) //// console.log(data.AgentID,$(this).find("i").attr("zxGroup")) // if ($(this).find("i").attr("zxGroup")==data.Group) { // $(this).show() // $(this).find("i").show() // $(this).find("i").removeClass().addClass("dg"); // console.log($(this).find("i").attr("zxGroup")) // } // if($(this).find("i").attr("class")==='lx'){ // $(this).find("i").hide() // } // }else{ // $(this).find("i").show() // } // $(this).find("i").removeClass().addClass("dg"); $(this).find("i").show() }) // $(".people_list dl dt").eq(0).before($('.' + data.AgentID)) // $(document.getElementsByClassName('seatList')[locationNum]).before($('.' + data.AgentID)) } //线路状态 function LineStateBack(data) { //data.Type,data, // console.log(data.AgentID,data.State) if(data.State.indexOf("|") != -1) { arr = data.State.split("|"); data.State = arr[0]; } if(data.AgentID * 1 < 10) { data.AgentID = '0' + data.AgentID; } var ele = $("." + data.AgentID).find("i"); var sts = ""; switch(data.State) { case "0": sts = "lx"; break; //分机不可用 case "1": if(!(ele.hasClass("hh") || ele.hasClass("ml"))) { sts = "kx"; } break; //空闲 case "2": sts = "ml"; break; //摘机等待拨号 case "3": sts = "ml"; break; //正在拨号 case "4": sts = "zl"; break; //呼出振铃 case "5": sts = "zl"; break; //来电振铃 case "6": sts = "th"; break; //通话中 case "7": sts = "ml"; break; //播放忙音中 case "8": sts = "th"; break; //通话保持中 case "9": break; //话机移除 case "10": break; //保持/空闲 case "11": break; //保持/摘机等待拨号 case "12": break; //保持/正在拨号 case "13": break; //保持/呼出振铃 case "14": break; //保持/通话中 } if(sts) { ele.removeClass().addClass(sts); } ele.attr("xl_item", data.State); if($(".zxtp .g_nums").text() == data.AgentID) { if(sts) { $(".zxtp i").removeClass().addClass(sts); } } } function toDub(i) { return i < 10 ? "0" + i : "" + i; } //默认记忆上次是否签入,是否置忙置闲 0表示已签入 空闲,1表示签入置忙,2表示签出 function SetStateCookie(state) { $.cookie("socket_state", state); } function backstageQueue(data) { var obj = $("iframe:visible") // if (obj.attr("data-id") == "index_v1.html") { window.frames[obj.attr("name")].realTimeMonitorQueue(data.WaitCount); // } } //在线坐席信息 function GetAgentListBack(data) { $.ajax({ type: "get", url: huayi.config.callcenter_url + "SeatMonitoring/GetAgentList", async: true, dataType: 'json', data: { "token": $.cookie("token") }, success: function(result) { var user = result.data; $(user).each(function(j, m) { $(data.AgentList).each(function(k, g) { if(g.AgentID == m.UserCode) { g.userName = m.UserName; } }) }) $(data.AgentList).each(function(k, m) { var strr = ''; switch(m.State) { case "0": strr = "离线"; break; //离线 case "1": break; //登录中 case "2": strr = "空闲"; break; //空闲 case "3": strr = "通话中"; break; //通话中 case "4": strr = "话后处理中"; break; //话后处理中 case "5": strr = "忙碌"; break; //小休 case "6": strr = "振铃"; break; //被请求 case "7": strr = "注销"; break; //注销 } var html = '' + '' + (m.userName ? '' : m.userName) + '' //姓名 + '' + m.AgentID + '' //工号 + '' + m.AgentExten + '' //分机号 + '' + strr + '' //状态 + ''; $(html).appendTo("#zxTable tbody"); }) } }); } //获取当前的日期时间 格式“yyyy-MM-dd HH:mm:ss” function getNowFormatDate() { var date = new Date(); var seperator1 = "-"; var seperator2 = ":"; var month = date.getMonth() + 1; var strDate = date.getDate(); if(month >= 1 && month <= 9) { month = "0" + month; } if(strDate >= 0 && strDate <= 9) { strDate = "0" + strDate; } var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + " " + date.getHours() + seperator2 + date.getMinutes() + seperator2 + date.getSeconds(); return currentdate; } var iswebcloase = 1; window.onunload = function() { if(iswebcloase) { iswebcloase = 0; if(ws.readyState == ws.OPEN) { obj.Type = 'Logout'; Send(); ws.onclose(); } } } window.onbeforeunload = function() { if(iswebcloase) { iswebcloase = 0; if(ws.readyState == ws.OPEN) { obj.Type = 'Logout'; Send(); ws.onclose(); } } }