/** * 坐席监控 * */ var groupLists = []; //坐席組数组 var postSeatsLists = []; //post的参数 var seatRealSateTimer = null; //定时器 var isTimerOn = false;//定时器是否开启 $(function() { getGroups().then(function() { getSeatLists(); //获取全部坐席 }); //tab切换 $('#tab_head_left li').click(function() { var tabIndex = $(this).attr('data-index'); $(this).addClass('tab_head_active').siblings().removeClass('tab_head_active'); $('#tab_contents .seat_lists_all').eq(tabIndex).addClass('show_lists').siblings().removeClass('show_lists'); }); //监测 $('#HY_monitor').on('click', function() { switch($(this).val()) { case "开始监测": // if(top.$('#navbarTopLinks').find('i.Login').hasClass('active')) { // layer.confirm('您还没有签入,请签入后再试...', { // icon: 7, // btn: ['确定'] //按钮 // }); // return; // } getSeatsRealStates(); $(this).val("停止监测"); if(seatRealSateTimer){ clearInterval(seatRealSateTimer); //停止刷新数据 } isTimerOn = true; refreshDatas(huayi.config.monitorPlatformTime); //开始刷新数据 break; case "停止监测": $(this).val("开始监测"); isTimerOn = false; clearInterval(seatRealSateTimer); //停止刷新数据 getSeatLists(); break; } }); }); //获取全部坐席 function getSeatLists() { var loadIndex; $.ajax({ type: "get", url: huayi.config.callcenter_url + "signtokenapi/api/useraccount/getseatlist", dataType: 'json', async: true, beforeSend: function() { //触发ajax请求开始时执行 loadIndex = layer.load(); }, success: function(data) { layer.close(loadIndex); if(data.state.toLowerCase() === "success") { data = data.data; $('#seat_lists').html(''); if(data && data.length > 0) { $.each(data, function(i, v) { postSeatsLists.push({ "group_id": v.group, // 坐席所在组ID // "agent_id": v.usercode - 0 // 坐席ID "agent_id": Number(v.usercode) // 坐席ID }); $('#seat_lists').append('
' + '
' + '
' + '
' + '头像' + '
' + '
' + '
' + '

' + v.username + '

' + '

工号:' + v.usercode + '

' + '

分机号:未知

' + '

坐席组:' + formatterGroups(groupLists, v.group) + '

' + '

' + '

'+ '
' + '

' + '' + '

' + '
' + '
'); //头像 var ipUrl = v.head_small_img; if(ipUrl) { $('#headImg_' + v.id).attr('src', ipUrl); } else { $('#headImg_' + v.id).attr('src', '../img/pro_default_user.png'); } }); updateTable1(data); //更新表格 calculatCount(); } else { $('#seat_lists').html('

没有找到您想要的记录呢!我会努力的...

'); } } }, error: function(textStatus) { layer.close(loadIndex); layer.confirm('网络繁忙,请稍后再试...', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 }); }, complete: function(XMLHttpRequest, textStatus) { layer.close(loadIndex); if(textStatus == 'timeout') { var xmlhttp = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp"); xmlhttp.abort(); layer.confirm('网络超时,请稍后再试...', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 });     } }, }); } /** * 获取坐席组 */ function getGroups() { var dtd = $.Deferred(); //在函数内部,新建一个Deferred对象 $.getJSON(huayi.config.callcenter_url + "callcenterapi/api/sysseatgroup/getlist", function(data) { if(data.state.toLowerCase() == "success") { var content = data.data; if(content && content.length > 0) { $(content).each(function(i, n) { groupLists.push({ 'id': n.id, 'names': n.zxzname }) }); } dtd.resolve(); // 改变Deferred对象的执行状态 } }) return dtd.promise(); // 返回promise对象 } /** * 监测坐席状态 坐席实时状态 */ function getSeatsRealStates() { $.ajax({ type: "post", url: huayi.config.callcenter_url + "callcenterapi/api/autocall/postsend", async: true, // ContentType: 'application/json', // data: JSON.stringify(postSeatsLists), //也可以不带参数名传递 // dataType: 'json', data: { posturl: huayi.config.callcenter_acd_url + "v1/acd/AgentlMgr/state", //(请求的连接) postobj: JSON.stringify(postSeatsLists), //(json数据) }, success: function(data) { data = JSON.parse(data); if(data.state.toLowerCase() === "success") { data = data.data; if(data.state.toLowerCase() === "success") { data = data.data; if(data && data.length > 0) { var seat_lists_usercodes = $('#seat_lists').find('.seat_usercode'); if(seat_lists_usercodes.length > 0) { $.each(seat_lists_usercodes, function(i, v) { $.each(data, function(j, k) { if(Number($(v).text().substring(3)) === k.agent_id) { $(v).siblings().find('.seat_userextid').text(k.extid === 0 ? '未知' : k.extid); //根据 agent_state 获取坐席状态对应的 class var real_sate_class = formatterSeatState(k.agent_state).agentStateClass; $(v).parent().parent().parent().attr('class', 'col-sm-2 seat_item_content ' + real_sate_class); //根据 class 名获取 对应的图标 var seatIcon = formatterSeatStateClass(real_sate_class).agentStateIcon; $(v).parent().siblings('.seat_state').html(''); $(v).parent().parent().parent().attr('data-agent_state', k.agent_state); //坐席状态 $(v).parent().parent().parent().attr('data-ext_state', k.ext_state); //线路状态 //通话中,获取电话号码 if(k.agent_state === 3) { getSeatsCallStates(k.agent_id, k.extid, $(v)); } else { $(v).siblings('.seat_callee').html(''); } // console.log('被监听状态:.............' + k.mon_state); //被监听状态 if(k.mon_state === 1){ $('#seat_listen_'+ k.agent_id).text('被监听中•••'); }else{ $('#seat_listen_'+ k.agent_id).text(''); } } }); }); //计算 实时状态的数量 calculatCount(); updateTable2(data); //更新表格 } } } } }, error: function(textStatus) { layer.confirm('网络繁忙,请稍后再试...', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 }); }, complete: function(XMLHttpRequest, textStatus) { if(textStatus == 'timeout') { var xmlhttp = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp"); xmlhttp.abort(); layer.confirm('网络超时,请稍后再试...', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 });     } }, }); } /** * 监测 坐席通话关联状态 * agent_id 坐席ID * ext_id 分机ID * el 坐席工号所在元素 */ function getSeatsCallStates(agent_id, ext_id, el) { var postCallJson = [{ "agent_id": agent_id, "ext_id": ext_id }]; $.ajax({ type: "post", url: huayi.config.callcenter_url + "callcenterapi/api/autocall/postsend", async: true, data: { posturl: huayi.config.callcenter_cti_url + "v1/cti/AgentlMgr/assoc/info", //(请求的连接) postobj: JSON.stringify(postCallJson), //(json数据) }, success: function(data) { data = JSON.parse(data); if(data.state.toLowerCase() === "success") { data = data.data; if(data.state.toLowerCase() === "success") { data = data.data; if(data && data.length > 0) { if(data[0].caller_flag === 1){//1-是主叫 if(data[0].callee){ el.siblings('.seat_callee').html('呼出:' + data[0].callee); //呼出 主叫 }else{ el.siblings('.seat_callee').html(''); } }else{ if(data[0].caller){ el.siblings('.seat_callee').html('呼入:' + data[0].caller); //呼入 被叫 }else{ el.siblings('.seat_callee').html(''); } } } } } }, error: function(textStatus) { layer.confirm('网络繁忙,请稍后再试...', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 }); }, complete: function(XMLHttpRequest, textStatus) { if(textStatus == 'timeout') { var xmlhttp = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp"); xmlhttp.abort(); layer.confirm('网络超时,请稍后再试...', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 });     } }, }); } //操作坐席 function btn_opareteSeats(event) { event.stopPropagation(); if($('#HY_monitor').val() === '开始监测') { layer.confirm('您还没有开始监测,请点击开始监测后再操作!', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 }); return } if(top.$('#navbarTopLinks').find('i.Login').hasClass('active')) { layer.confirm('您还没有签入,请签入后再操作!', { icon: 7, btn: ['确定'] //按钮 }); return; } var $el = $(event.currentTarget);//当前被点击的元素 .seat_item var real_sate_class = $el.parent().attr('class').split(' ')[2];//元素的状态class名 var agent_state_title = formatterSeatStateClass(real_sate_class).agentStateTitle;//坐席状态对应的名称 var oparate_agent_state = $el.parent().attr('data-agent_state'); //坐席状态 var oparate_ext_state = $el.parent().attr('data-ext_state'); //线路状态 var head_img = $el.find('.img-circle').attr('src'); //头像 var seat_name = $el.find('.seat_name').text(); //姓名 var seat_usercode = $el.find('.seat_usercode').text().split(':')[1]; //工号 var call_number = $el.find('.seat_callee').text(); //呼出或呼入 if(seat_usercode === window.localStorage.getItem('userCode')){ layer.confirm('您不能在坐席监控中对自己进行操作!', { icon: 7, closeBtn: 0, btn: ['确定'] //按钮 }); return; } if($('#seat_usercode_'+ window.localStorage.getItem('userCode')).parent().parent().parent().hasClass('seat_calling')){ layer.confirm('您当前在通话中不能对坐席进行操作!', { icon: 7, btn: ['确定'] //按钮 }); return; } var layerTitle = '';//弹出窗口的 title if(call_number){ layerTitle = '当前状态: ' + agent_state_title + '(' + call_number + ')'; }else{ layerTitle = '当前状态: ' + agent_state_title; } //(小休/空闲)置闲 (通话中/通话中)监听强插强拆拦截 (空闲/来电振铃)代接 // console.log('坐席:'+ oparate_agent_state + ', 线路:' + oparate_ext_state); if((oparate_agent_state === '5' && oparate_ext_state === '1') || (oparate_agent_state === '3' && oparate_ext_state === '6') || (oparate_agent_state === '2' && oparate_ext_state === '5')) { layer.open({ type: 2, content: "template/opareteSeats.html?oparate_agent_state=" + oparate_agent_state + "&oparate_ext_state=" + oparate_ext_state + "&head_img=" + head_img + "&seat_name=" + seat_name + "&seat_usercode=" + seat_usercode, //iframe的url,no代表不显示滚动条 title: layerTitle, closeBtn: 1, area: ['496px', '340px'], //宽高 }); }else{ layer.confirm('当前坐席无需操作!', { title: layerTitle, icon: 7, closeBtn: 0, btn: ['确定'] //按钮 }); } } //计算 实时状态的数量 function calculatCount() { var seat_items = $('#seat_lists').find('.seat_item_content'); var totalCount = seat_items.length; //全部坐席数量 var offlineCount = 0; //离线数量 var freeCount = 0; //空闲数量 var callingCount = 0; //通话中数量 var afterCallCount = 0; //话后处理数量 var busyCount = 0; //置忙数量(小休) $.each(seat_items, function(i, v) { var seat_state_class = $(v).attr('class').substring(27); switch(seat_state_class) { case 'seat_busy': offlineCount++; break; case 'seat_free': freeCount++; break; case 'seat_calling': callingCount++; break; case 'seat_after_call': afterCallCount++; break; case 'seat_ringing': busyCount++; break; default: break; } }); var onlineCount = freeCount + callingCount + afterCallCount + busyCount; //在线数量 $('#seat_sts').find('.total_count').text(totalCount); $('#seat_sts').find('.online_count').text(onlineCount); $('#seat_sts').find('.outline_count').text(offlineCount); $('#seat_sts').find('.free_count').text(freeCount); $('#seat_sts').find('.in_call_count').text(callingCount); $('#seat_sts').find('.call_in_count').text(afterCallCount); $('#seat_sts').find('.busy_count').text(busyCount); } /** * 刷新 数据 * monitorPlatformTime 刷新间隔 * */ function refreshDatas(monitorPlatformTime) { var objTime = { init: 0, time: function() { if(top.$("iframe:visible").contents().find('.layui-layer').length === 0) { objTime.init += 1000; //console.log(objTime.init); //当页面没有click、keydown、mousewheel 并且没有layer 弹窗时;每间隔 monitorPlatformTime 刷新数据; if(objTime.init == monitorPlatformTime) { getSeatsRealStates(); objTime.init = 0; } } }, eventFun: function() { clearInterval(seatRealSateTimer); objTime.init = 0; if(isTimerOn){ seatRealSateTimer = setInterval(objTime.time, 1000); } } } seatRealSateTimer = setInterval(objTime.time, 1000); var body = document.querySelector('html'); body.addEventListener("click", objTime.eventFun); body.addEventListener("keydown", objTime.eventFun); body.addEventListener("mousewheel", objTime.eventFun); } /** * 更新列表1 (用于检测之前) * tData 数据 */ function updateTable1(tData) { $('#list').html(''); $.each(tData, function(i, v) { var tr = '' + (i + 1) + '' + '' + v.username + '' + '' + v.usercode + '' + '未知' + '未知' + '' + formatterGroups(groupLists, v.group) + '' + '' + formatterGroupType(v.seat_right) + '' + '未知' + '0' + '0' + '0' + '0' + '0' + '0' + '0' + '未知' + '未知' + '未知'; $('#list').append(tr); }); } /** * 更新列表2(用于检测之后) * tData 数据 */ function updateTable2(tData) { var s_usercodes = $('#list').find('.seat_list_usercode'); $.each(s_usercodes, function(j, k) { $.each(tData, function(i, v) { if($(k).text() == v.agent_id) { $(k).siblings('.extid').text(v.extid === 0 ? '未知' : v.extid); //分机号 $(k).siblings('.agent_ip').text(v.agent_ip === '' ? '未知' : v.agent_ip); //坐席IP var time_logins = v.time_login === 0 ? '未知' : helper.DateFormat.timestampToTime(v.time_login); $(k).siblings('.time_login').text(time_logins); //签入时间 $(k).siblings('.login_times').text(v.login_times); //签入时长 $(k).siblings('.free_times').text(v.free_times); //空闲时长 $(k).siblings('.repose_times').text(v.repose_times); //休息时长 $(k).siblings('.talk_times').text(v.talk_times); //通话时长 $(k).siblings('.repose_num').text(v.repose_num); //休息次数 $(k).siblings('.answer_num').text(v.answer_num); //应答次数 $(k).siblings('.cur_state_times').text(v.cur_state_times); //当前状态时长 $(k).siblings('.agent_state').text(formatterSeatState(v.agent_state).agentStateName); //坐席状态 $(k).siblings('.ext_state').text(formatterExtState(v.ext_state)); //分机状态 $(k).siblings('.mon_state').text(formatterListenState(v.mon_state)); //被监听状态 } }); }); } /** * 格式化坐席组 角色 * option1 数组 * option2 id */ function formatterGroups(option1, option2) { var groupName = ''; $(option1).each(function(i, n) { if(option2 === n.id) { groupName = n.names; } }); return groupName; } /** * 格式化坐席类型 * typeVal 坐席类型的值 * 0 普通坐席 1 班长坐席 */ function formatterGroupType(typeVal) { var typeName = '-'; switch(typeVal) { case 0: typeName = '普通坐席'; break; case 1: typeName = '班长坐席'; break; default: break; } return typeName; } // 格式化 坐席状态的class名,获取 对应的状态名称和icon function formatterSeatStateClass(real_sate_class) { var agent_state_title = ''; var agent_state_icon = ''; switch(real_sate_class) { case 'seat_outline': agent_state_title = '未知'; agent_state_icon = 'icon-weizhi'; break; case 'seat_free': agent_state_title = '空闲中'; agent_state_icon = 'icon-kongxian'; break; case 'seat_busy': agent_state_title = '离线'; agent_state_icon = 'icon-zhuxiao'; break; case 'seat_after_call': agent_state_title = '话后处理中'; agent_state_icon = 'icon-kongxian1'; break; case 'seat_call_out': agent_state_title = '已签入'; agent_state_icon = 'icon-denglu'; break; case 'seat_ringing': agent_state_title = '小休'; agent_state_icon = 'icon-xiuxi'; break; case 'seat_calling': agent_state_title = '通话中'; agent_state_icon = 'icon-tonghuazhong'; break; case 'seat_requset': agent_state_title = '被请求中'; agent_state_icon = 'icon-qingqiu'; break; default: break; } return { 'agentStateTitle': agent_state_title, 'agentStateIcon': agent_state_icon, }; } /** * 格式化坐席状态 获取class 名称 和 状态名 * agent_state 坐席状态值 * 0x00 未知 0x01 已签入 0x02 空闲 0x03 通话中 0x04 话后处理 0x05 小休 0x06 被请求 0x07 离线 */ function formatterSeatState(agent_state) { var agent_state_class = ''; var typeName = '-'; switch(agent_state) { case 0x00: agent_state_class = 'seat_outline'; //未知 typeName = '未知'; break; case 0x01: agent_state_class = 'seat_call_out'; //已签入 typeName = '已签入'; break; case 0x02: agent_state_class = 'seat_free'; //空闲 typeName = '空闲'; break; case 0x03: agent_state_class = 'seat_calling'; //通话中 typeName = '通话中'; break; case 0x04: agent_state_class = 'seat_after_call'; //话后处理 typeName = '话后处理'; break; case 0x05: agent_state_class = 'seat_ringing'; //小休 typeName = '小休'; break; case 0x06: agent_state_class = 'seat_requset'; //被请求 typeName = '被请求'; break; case 0x07: agent_state_class = 'seat_busy'; //离线 typeName = '离线'; break; default: break; } return { "agentStateClass": agent_state_class, "agentStateName": typeName }; } /** * 格式化线路状态 * typeVal 线路状态的值 * 0x00,分机不可用 0x01,空闲 0x02,摘机等待拨号 0x03,正在拨号 0x04,呼出振铃 * 0x05,来电振铃 0x06,通话中 0x07,播放忙音中 0x08,移除IP分机 0x0100,通话保持中 */ function formatterExtState(typeVal) { var typeName = '-'; switch(typeVal) { case 0x00: typeName = '分机不可用'; break; case 0x01: typeName = '空闲'; break; case 0x02: typeName = '摘机等待拨号'; break; case 0x03: typeName = '正在拨号'; break; case 0x04: typeName = '呼出振铃'; break; case 0x05: typeName = '来电振铃'; break; case 0x06: typeName = '通话中'; break; case 0x07: typeName = '播放忙音中'; break; case 0x08: typeName = '移除IP分机'; break; case 0x0100: typeName = '通话保持中'; break; default: break; } return typeName; } /** * 格式化坐席监听状态 * typeVal 坐席监听的值 * 0 未被监听 1 被监听中 */ function formatterListenState(typeVal) { var typeName = '-'; switch(typeVal) { case 0: typeName = '未被监听'; break; case 1: typeName = '被监听中'; break; default: break; } return typeName; }