<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="seatmonitoringlist.aspx.cs" Inherits="HySoft.BaseCallCenter.Web.telmanage.seatmonitoringlist" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <link href="../scripts/ui/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
    <script src="../scripts/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
    <script src="../scripts/ui/js/core/base.js" type="text/javascript"></script>
    <script src="../scripts/ui/js/ligerui.min.js" type="text/javascript"></script>
    <link href="../scripts/ui/skins/Tab/css/tab.css" rel="stylesheet" type="text/css" />
    <link href="../scripts/ui/skins/Tab/css/grid.css" rel="stylesheet" type="text/css" />
    <script src="../scripts/ui/js/plugins/ligerGrid.js" type="text/javascript"></script>
    <link href="../scripts/ui/skins/ligerui-icons.css" rel="stylesheet" type="text/css" />
    <link href="../images/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
        var stime;
        var currentSelectUserNo; //当前选中的坐席工号
        var userlist = new Array();
        function StartMonitor() {
            top.document.getElementById("ismonitoring").value = "true";
            var usercount = userlist.length;
            document.getElementById("txtTimes").value = "0";
            document.getElementById("spanStartMonitorTime").innerHTML = CurentTime();
            document.getElementById("btnStart").disabled = true;
            document.getElementById("btnEnd").disabled = false;
            stime=window.setInterval("GetTimes()", 1000);
            GetTimes(); //刷新时间
            for (var i = 0; i < usercount; i++) {
                top.OCX_SubscribeData("0", userlist[i]);  //根据工号订阅坐席状态
                top.OCX_SubscribeData("1", userlist[i]);  //根据工号订阅线路状态
            }
            //top.OCX_SubscribeData("2","-1");//空闲
            //top.OCX_SubscribeData("3","-1");//忙
//            top.OCX_SubscribeData("4","-1");//来电振铃
            //top.OCX_SubscribeData("5","-1");//通话中
        }
        function StopMonitor() {
            top.document.getElementById("ismonitoring").value = "false";
            document.getElementById("btnStart").disabled = false;
            document.getElementById("btnEnd").disabled = true;
            clearInterval(stime);

            top.OCX_CancelSubscribeData("0", "-1"); //根据工号取消订阅坐席状态
            top.OCX_CancelSubscribeData("1", "-1"); //根据工号取消订阅线路状态
            //top.OCX_CancelSubscribeData("2","-1");//空闲
            //top.OCX_CancelSubscribeData("3","-1");//忙
//            top.OCX_CancelSubscribeData("4","-1");//来电振铃
            //top.OCX_CancelSubscribeData("5","-1");//通话中
        }

        function GetSeatStateCount() {
            try {
                var wdl = 0; //未签入
                var kx = 0; //空闲
                var zl = 0; //振铃
                var thz = 0; //通话中
                var ms = 0; //忙
                var hhcl = 0; //话后处理
                var usercount = userlist.length;
                for (var i = 0; i < usercount; i++) {
                    var userNo = userlist[i];
                    var state = document.getElementById("txtSeatState_" + userNo).value;
                    switch (state) {
                        case "0":
                            wdl++;
                            break;
                        case "1":
                            wdl++;
                            break;
                        case "2":
                            kx++;
                            break;
                        case "4":
                            hhcl++;
                            break;
                        case "3":
                            thz++;
                            break;
                        case "5":
                            ms++;
                            break;
                        case "9":
                            zl++;
                            break;
                        default:
                            break;
                    }
                }
                document.getElementById("oninsert").innerHTML = wdl;
                document.getElementById("kongxian").innerHTML = kx;
                document.getElementById("zhenling").innerHTML = zl;
                document.getElementById("tonghuazhong").innerHTML = thz;
                document.getElementById("mangs").innerHTML = ms;
                document.getElementById("huahouchuli").innerHTML = hhcl;
            }
            catch (e) {
            }
        }

        /*  
		 
        坐席状态
        0, // 未签入
        1, // 登录中
        2, // 空闲
        3, // 通话中
        4, // 话后处理
        5, // 小休
        7 , // 注销
        9, //来电振铃
        */

        function GetState(userNo, state) {
            if (document.getElementById(userNo) != null) {
                var selectsatus = document.getElementById("DropClass").value;
                var img_userinfo = document.getElementById("img_" + userNo);
                var span_userState = document.getElementById("span_state_" + userNo);
                var div_userState = document.getElementById("div_" + userNo);
                var txt_userState = document.getElementById("txtSeatState_" + userNo);
                txt_userState.value = state;
                switch (state) {
                    case "0":
                        img_userinfo.src = "../images/seatimgs/weiqianru.jpg";
                        span_userState.style.color = "#cccccc";
                        span_userState.innerHTML = "未签入";

                        if (selectsatus != "" && selectsatus != "wqr") {
                            div_userState.style.display = "none";

                        }
                        else {
                            div_userState.style.display = "block";

                        }
                        break;
                    case "1":
                        if (selectsatus != "" && selectsatus != "wqr") {

                            div_userState.style.display = "none";

                        } else {
                            div_userState.style.display = "block";

                        }
                        break;
                    case "2":
                        img_userinfo.src = "../images/seatimgs/kongxian.jpg";
                        span_userState.style.color = "Green";
                        span_userState.innerHTML = "空闲";
                        if (selectsatus != "" && selectsatus != "kogxian") {

                            div_userState.style.display = "none";

                        } else {
                            div_userState.style.display = "block";

                        }
                        break;
                    case "4":
                        img_userinfo.src = "../images/seatimgs/mang.jpg";
                        span_userState.style.color = "Yellow";
                        span_userState.innerHTML = "话后处理";
                        if (selectsatus != "" && selectsatus != "hhcl") {

                            div_userState.style.display = "none";

                        } else {
                            div_userState.style.display = "block";

                        }
                        break;
                    case "3":
                        img_userinfo.src = "../images/seatimgs/tonghua.jpg";
                        span_userState.style.color = "Green";
                        span_userState.innerHTML = "通话中";
                        if (selectsatus != "" && selectsatus != "thz") {

                            div_userState.style.display = "none";

                        } else {
                            div_userState.style.display = "block";

                        }
                        break;
                    case "5": 
                        img_userinfo.src = "../images/seatimgs/mang.jpg";
                        span_userState.style.color = "Red";
                        span_userState.innerHTML = "忙";
                        if (selectsatus != "" && selectsatus != "mang") {

                            div_userState.style.display = "none";

                        } else {
                            div_userState.style.display = "block";

                        }
                        break;
                    case "9":
                        img_userinfo.src = "../images/seatimgs/zhenglin.jpg";
                        span_userState.style.color = "Green";
                        span_userState.innerHTML = "振铃";
                        if (selectsatus != "" && selectsatus != "zl") {

                            div_userState.style.display = "none";

                        } else {
                            div_userState.style.display = "block";

                        }
                        break;
                    default:
                        if (selectsatus != "" && selectsatus != "wqr") {

                            div_userState.style.display = "none";

                        } else {
                            div_userState.style.display = "block";

                        }
                        break;
                }
            }
            if (userNo == currentSelectUserNo) {
                showSelectAgentInfo(state);
            }
        }


        //显示选中坐席的信息
        function showSelectAgentInfo(state) {
            try {
                var imgFree = document.getElementById("img1"); //置闲
                var imgQChai = document.getElementById("img4"); //强拆
                var imgQz = document.getElementById("img3"); //强插
                var imgDj = document.getElementById("img8"); //代接
                var imglj = document.getElementById("imglj");  //拦截
                var imgListen = document.getElementById("imgListen"); //监听
                imgFree.disabled = true;
                imgQChai.disabled = true;
                imgQz.disabled = true;
                imgDj.disabled = true;
                var imgState = document.getElementById("img_State");
                var span_UserState = document.getElementById("span_UserState");
                switch (state) {
                    case "0":
                    case "1":
                        imgFree.src = "../images/seatimgs/Mtzx1.png";
                        imgQChai.src = "../images/seatimgs/qz1.png";
                        imgQz.src = "../images/seatimgs/qc1.png";
                        imgDj.src = "../images/seatimgs/dj1.png";
                        imglj.src = "../images/seatimgs/lj1.png";
                        imgListen.src = "../images/seatimgs/jt1.png";
                        imgState.src = "../images/seatimgs/weiqianru.jpg";
                        span_UserState.style.color = "#cccccc";
                        span_UserState.innerHTML = "未签入";
                        imgFree.disabled = true;
                        imgQChai.disabled = true;
                        imgQz.disabled = true;
                        imgDj.disabled = true;
                        imglj.disabled = true;
                        imgListen.disabled = true;
                        break;
                    case "2":
                        imgFree.src = "../images/seatimgs/Mtzx1.png";
                        imgQChai.src = "../images/seatimgs/qz1.png";
                        imgQz.src = "../images/seatimgs/qc1.png";
                        imgDj.src = "../images/seatimgs/dj1.png";
                        imglj.src = "../images/seatimgs/lj1.png";
                        imgListen.src = "../images/seatimgs/jt1.png";
                        imgState.src = "../images/seatimgs/kongxian.jpg";
                        span_UserState.style.color = "Green";
                        span_UserState.innerHTML = "空闲";
                        imgFree.disabled = true;
                        imgQChai.disabled = true;
                        imgQz.disabled = true;
                        imgDj.disabled = true;
                        imglj.disabled = true;
                        imgListen.disabled = true;
                        break;
                    case "9":
                        imgFree.src = "../images/seatimgs/Mtzx1.png";
                        imgQChai.src = "../images/seatimgs/qz1.png";
                        imgQz.src = "../images/seatimgs/qc1.png";
                        imgDj.src = "../images/seatimgs/dj2.png";
                        imglj.src = "../images/seatimgs/lj1.png";
                        imgListen.src = "../images/seatimgs/jt1.png";
                        imgState.src = "../images/seatimgs/zhenglin.jpg";
                        span_UserState.style.color = "Green";
                        span_UserState.innerHTML = "振铃";
                        imgFree.disabled = true;
                        imgQChai.disabled = true;
                        imgQz.disabled = true;
                        imgDj.disabled = false;
                        imglj.disabled = true;
                        imgListen.disabled = true;
                        break;
                    case "3":
                        imgFree.src = "../images/seatimgs/Mtzx1.png";
                        imgQChai.src = "../images/seatimgs/qz2.png";
                        imgQz.src = "../images/seatimgs/qc2.png";
                        imgDj.src = "../images/seatimgs/dj1.png";
                        imglj.src = "../images/seatimgs/lj2.png";
                        imgListen.src = "../images/seatimgs/jt2.png";
                        imgState.src = "../images/seatimgs/tonghua.jpg";
                        span_UserState.style.color = "Green";
                        span_UserState.innerHTML = "通话中";
                        imgFree.disabled = true;
                        imgQChai.disabled = false;
                        imgQz.disabled = false;
                        imgDj.disabled = true;
                        imglj.disabled = false;
                        imgListen.disabled = false;
                        break;
                    case "4":
                        imgFree.src = "../images/seatimgs/Mtzx2.png";
                        imgQChai.src = "../images/seatimgs/qz1.png";
                        imgQz.src = "../images/seatimgs/qc1.png";
                        imgDj.src = "../images/seatimgs/dj1.png";
                        imglj.src = "../images/seatimgs/lj1.png";
                        imgListen.src = "../images/seatimgs/jt1.png";
                        imgState.src = "../images/seatimgs/mang.jpg";
                        span_UserState.style.color = "Yellow";
                        span_UserState.innerHTML = "话后处理";
                        imgFree.disabled = true;
                        imgQChai.disabled = false;
                        imgQz.disabled = false;
                        imgDj.disabled = true;
                        imglj.disabled = false;
                        imgListen.disabled = false;
                        break;
                    case "5":
                        imgFree.src = "../images/seatimgs/Mtzx2.png";
                        imgQChai.src = "../images/seatimgs/qz1.png";
                        imgQz.src = "../images/seatimgs/qc1.png";
                        imgDj.src = "../images/seatimgs/dj1.png";
                        imglj.src = "../images/seatimgs/lj1.png";
                        imgListen.src = "../images/seatimgs/jt1.png";
                        imgState.src = "../images/seatimgs/mang.jpg";
                        span_UserState.style.color = "Red";
                        span_UserState.innerHTML = "忙";
                        imgFree.disabled = false;
                        imgQChai.disabled = true;
                        imgQz.disabled = true;
                        imgDj.disabled = true;
                        imglj.disabled = true;
                        imgListen.disabled = true;
                        break;
                    default:
                        break;
                }
            }
            catch (e) {
                alert(e.Message);
            }
        }
        //选择操作
        function GetOneState(userNo, username) {
            document.getElementById("span_UserNo").innerHTML = userNo;
            document.getElementById("span_UserName").innerHTML = username;
            currentSelectUserNo = userNo;
            var txt_userState = document.getElementById("txtSeatState_" + userNo);
            showSelectAgentInfo(txt_userState.value);

        }

        function CurentTime() {
            var now = new Date();

            var year = now.getFullYear();       //年
            var month = now.getMonth() + 1;     //月
            var day = now.getDate();            //日

            var hh = now.getHours();            //时
            var mm = now.getMinutes();          //分
            var ss = now.getSeconds();          //秒

            var clock = year + "-";

            if (month < 10)
                clock += "0";

            clock += month + "-";

            if (day < 10)
                clock += "0";

            clock += day + " ";

            if (hh < 10)
                clock += "0";

            clock += hh + ":";
            if (mm < 10) clock += '0';
            clock += mm + ":";

            if (ss < 10) clock += "0";
            clock += ss;
            return (clock);
        }

        function Init() {
            try {
                document.getElementById("img1").disabled = true; //置闲
                document.getElementById("img4").disabled = true; //强拆
                document.getElementById("img3").disabled = true; //强插
                document.getElementById("img8").disabled = true; //代接
                document.getElementById("imglj").disabled = true; //拦截
                document.getElementById("imgListen").disabled = true; //监听
                LoadingData(); //加载坐席数据
            }
            catch (e) {
                alert(e.message);
            }
        }

        function LoadingData() {
            var usersns = new Array();
            var gropid = document.getElementById("Drop_Groups").value;
            try {
                $.ajax({
                    type: 'get',
                    url: 'ajax/seatmonitoring.ashx?action=getseatnewlist',
                    data: { userid: '' },
                    dataType: 'html',
                    async: false,
                    cache: false,
                    success: function (res) {
                        var arr = res.split('~');
                        userlist = arr[0].split(',');
                        document.getElementById("divDataItems").innerHTML = arr[1];
                        $("#pageloading").hide();
                    }
                });
            }
            catch (e) {
                alert(e.Message);
            }
        }

        //监控时间
        function GetTimes() {
            try {
                var times = document.getElementById("txtTimes").value;
                times = Number(times) + 1;
                document.getElementById("spanTimes").innerHTML = ChangeValue(times);
                document.getElementById("txtTimes").value = times;

            }
            catch (e) {
            }
        }
        //计算监控时间
        function ChangeValue(times) {
            try {
                GetSeatStateCount();
                if (times < 60) {
                    return "" + times + "秒";
                }
                else if (times < 3600) {
                    return "" + parseInt(times / 60) + "分" + parseInt(times % 60) + "秒";
                }
                else if (times < 86400) {
                    return "" + parseInt(times / 3600) + "时" + parseInt((times % 3600) / 60) + "分" + parseInt((times % 3600) % 60) + "秒";
                }
                else {
                    return "" + parseInt(times / 86400) + "天" + parseInt((times % 86400) / 3600) + "时" + parseInt(((times % 86400) % 3600) / 60) + "分" + parseInt(((times % 86400) % 3600) % 60) + "秒";
                }
            }
            catch (e)
            { }
        }
        function Exit() {
            try {
                StopMonitor();
            }
            catch (e) { }
        }


        //强插
        function ztqc0() {
            var userNo = document.getElementById("span_UserNo").innerHTML;
            var rtn = Phone.InsertEx(userNo, 5);
            if (rtn == 0) {
                alert("强插成功");
            }
            else {
                alert("强插失败");
            }
        }
        //置忙
        function ztzm() {
            var userNo = document.getElementById("span_UserNo").innerHTML;
            var rtn = top.OCX_ForceAgentState(userNo, "5");
        }

        //置闲
        function ztzx() {
            var userNo = document.getElementById("span_UserNo").innerHTML;
            var rtn = top.OCX_ForceAgentState(userNo, "2");
        }
        //强拆
        function ztqz() {
            var userNo = document.getElementById("span_UserNo").innerHTML;
            Phone.QueryCallIDOnAgentEx(userNo);
            if (Phone.CallIDNum > 0) {
                var _CallId;
                for (i = 0; i < Phone.CallIDNum; i++) {
                    _CallId = Phone.GetCallIDByIdx(i)
                }
                var rtn = Phone.DisconnectCall(_CallId);
                if (rtn == 0) {
                    alert("强拆成功");
                }
                else {
                    //测试时可用下面的语句，查看具体出错提示，将出错代码转为出错信息
                    //alert(Phone.GetPromptByErrorCode(rtn));
                    alert("强拆失败");
                }
            }
            else {
                alert("该坐席没有处于通话中");
            }
        }
        //拦截
        function ztlj() {
            var userNo = document.getElementById("span_UserNo").innerHTML;
            var rtn = Phone.QueryCallIDOnAgentEx(userNo);
            if (Phone.IsTalking) {
                var rtn = Phone.Intercept(1000, userNo);
                if (rtn == 0) {
                    alert("拦截成功");
                }
                else {
                    alert("拦截失败");
                }
            }
            else {
                alert("该坐席没有处于通话中");
            }
        }
        //监听
        function bzListen() {
            var userNo = document.getElementById("span_UserNo").innerHTML;
            var rtn = Phone.QueryCallIDOnAgentEx(userNo);
            if (Phone.IsTalking) {
                var rtn = Phone.Listen(1000, userNo);
                if (rtn == 0) {
                    alert("监听成功");
                }
                else {
                    alert("监听失败");
                }
            }
            else {
                alert("该坐席没有处于通话中");
            }
        }

        //代接
        function ztdj() {
            var userNo = document.getElementById("span_UserNo").innerHTML;
            var rtn = Phone.QueryCallIDOnAgentEx(userNo);

            if (Phone.CallIDNum > 0) {
                var _CallId;
                for (i = 0; i < Phone.CallIDNum; i++) {
                    _CallId = Phone.GetCallIDByIdx(i)
                }

                rtn = Phone.PickupCallEx(_CallId);
                if (rtn == 0) {
                    alert('代接成功！');
                }
                else {
                    //alert(Phone.GetPromptByErrorCode(rtn));
                    alert("代接失败");
                }
            }
            else {
                alert("该坐席没有电话呼叫！");
            }
        }
    </script>
    <style type="text/css">
        .style1
        {
            height: 35px;
        }
        /**坐席**/
#zx{ width:98%; height:100%; overflow:hidden; padding:10px;}
#zx .z_lanmu{border:1px solid #bed5f3;}
#zx .z_lanmu span{ padding-left:20px;}
#zx .z_nr{ padding-top:8px;}
#zx .z_nr .z_left{ width:8%; height:420px; border:1px solid #bed5f3; padding-top:20px; background:#F2FAFD;}
#zx .z_nr .z_left li{ height:36px; line-height:36px; display:block; padding-left:48px; background:url(../images/zx.png) no-repeat}
#zx .z_nr .z_left li.wj{background-position: 10px -5px;}
#zx .z_nr .z_left li.xs{background-position: 10px -41px; color:#09F;}
#zx .z_nr .z_left li.ms{background-position: 10px -77px; color:#C30;}
#zx .z_nr .z_left li.jt{background-position: 10px -110px; color:#6C0;}
#zx .z_nr .z_right{width:89%; height:420px; border:1px solid #bed5f3;padding:20px 10px; }
#zx .z_nr .z_right .r_h1{ height:100px;}
#zx .z_nr .z_right .r_h1 .h1_l{ width:10%; height:100px;}
#zx .z_nr .z_right .r_h1 .h1_l span ,#zx .z_nr .z_right .r_h2 .h2_text span{ display:block; width:90px; height:90px; margin:0 auto;border:1px solid #bed5f3; background:url(../images/zx_b.png) no-repeat 25px 23px;}
#zx .z_nr .z_right .r_h1 .h1_l span .h_zi1 ,#zx .z_nr .z_right .r_h2 .h2_text span .h2_zi1{ height:28px; line-height:28px; text-align:center;}
#zx .z_nr .z_right .r_h1 .h1_l span .h_zi2 ,#zx .z_nr .z_right .r_h2 .h2_text span .h2_zi2{height:28px; line-height:28px; text-align:center; padding-top:30px;}
#zx .z_nr .z_right .r_h1 .h1_r ul{ list-style:none; width:220px; height:100px;}
#zx .z_nr .z_right .r_h1 .h1_r li{ width:82px; height:30px; line-height:30px; text-align:center;float:left; margin-right:20px; margin-top:10px; display:block; background:url(../images/anniu1.png) no-repeat;}
#zx .z_nr .z_right .r_h1 .h1_r li.hui{ background-position:-90px -5px;}
#zx .z_nr .z_right .r_h1 .h1_r li.jh{background-position:0 -6px;}

#zx .z_nr .z_right .r_h2{height: auto; overflow:hidden; margin-top:10px; border-top:1px solid #bed5f3; padding-top:10px;}
#zx .z_nr .z_right .r_h2 .h2_text{width:10%; height:100px;}
.bg2{ background:url(../images/tools_bg.gif) repeat-x 0 -150px; height:26px; line-height:26px;}
.lb_bg1{ background:#f7f7f7;}
.lb_bg1:hover,.lb_bg2:hover{background:#F2F8FB;}
 
.bian4{border-top:1px solid #7fbee1;}
    </style>
</head>
<body onload="Init();" onunload="Exit();">
    <form id="form1" runat="server">
    <input id="txtIsWin" runat="server" value="false" style="display: none" />
    <input id="txtTimes" runat="server" value="0" style="display: none" />
    <div class="bg2 z_lanmu">
        <span class="f_left">坐席状态图例</span> <span class="f_right p_right">持续时间：<span id="spanTimes"
            style="color: Red;" class="red zi_w" runat="server">0秒</span></span> <span class="f_right">
                监控开始时间：<span id="spanStartMonitorTime" style="color: Red;" class="red zi_w" runat="server"></span></span>
    </div>
    <table class="stdTable" cellspacing="0" cellpadding="0" width="100%" style="height: 100%;">
        <tr height="100%">
            <td>
                <table class="stdTable" style="background-color:White;" cellspacing="0" cellpadding="0"
                    width="100%">
                    <tr>
                        <td style="padding-right: 1px; border-top: #A0A2AF 1px solid; padding-left: 1px;
                            width: 250px; padding-bottom: 1px; border-left: #A0A2AF 1px solid; padding-top: 0px;
                            border-bottom: #A0A2AF 1px solid" valign="top">
                            <table id="main" height="100%" cellspacing="0" cellpadding="1" width="170px">
                                <tr valign="top">
                                    <td valign="top">
                                        <%-- <div class="tab" id="searchDiv" style="display: inline; margin-top:5px;">--%>
                                        <table cellspacing="3" cellpadding="0" width="100%" style="margin-top: 5px;">
                                            <tr style="height: 28px;">
                                                <td id="td0" style="padding-left: 8px;">
                                                    <div style="float: left;">
                                                        <img id="img0" src="../images/seatimgs/weiqianru.jpg" /></div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px; color: #cccccc; width: 56px;">
                                                        未签入</div><div style="float: right; padding-right: 8px; padding-top: 4px; color: #cccccc; width: 56px; font-weight:bold;"><span id="oninsert">0</span></div>
                                                </td>
                                            </tr>
                                            <tr style="height: 28px;">
                                                <td id="td1" style="padding-left: 8px;">
                                                    <div style="float: left;">
                                                        <img id="img5" src="../images/seatimgs/kongxian.jpg" /></div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px; color: Green;">
                                                        空闲</div><div style="float: right; padding-right: 8px; padding-top: 4px; color: Green; width: 56px; font-weight:bold;"><span id="kongxian">0</span></div>
                                                </td>
                                            </tr>
                                            <tr style="height: 28px;">
                                                <td id="td2" style="color: Red; padding-left: 8px;">
                                                    <div style="float: left;">
                                                        <img id="img6" src="../images/seatimgs/mang.jpg" /></div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px;">
                                                        忙</div><div style="float: right; padding-right: 8px; padding-top: 4px; color: Red; width: 56px; font-weight:bold;"><span id="mangs">0</span></div>
                                                </td>
                                            </tr>
                                            <tr style="height: 28px;">
                                                <td id="td3" style="color: Green; padding-left: 8px;">
                                                    <div style="float: left;">
                                                        <img id="img33" src="../images/seatimgs/zhenglin.jpg" /></div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px;">
                                                        振铃</div><div style="float: right; padding-right: 8px; padding-top: 4px; color: Green; width: 56px; font-weight:bold;"><span id="zhenling">0</span></div>
                                                </td>
                                            </tr>
                                            <tr style="height: 28px;">
                                                <td id="td4" style="color: Green; padding-left: 8px;">
                                                    <div style="float: left;">
                                                        <img id="img7" src="../images/seatimgs/tonghua.jpg" /></div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px;">
                                                        通话中</div><div style="float: right; padding-right: 8px; padding-top: 4px; color: Green; width: 56px; font-weight:bold;"><span id="tonghuazhong">0</span></div>
                                                </td>
                                            </tr>
                                            <tr style="height: 28px;">
                                                <td id="td5" style="color:Yellow; padding-left: 8px;">
                                                    <div style="float: left;">
                                                        <img id="img9" src="../images/seatimgs/mang.jpg" /></div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px;">
                                                        话后处理</div><div style="float: right; padding-right: 8px; padding-top: 4px; color: Yellow; width: 56px; font-weight:bold;"><span id="huahouchuli">0</span></div>
                                                </td>
                                            </tr>
                                             <tr style="height: 8px;">
                                                <td align="center">
                                                     &nbsp;
                                                </td>
                                            </tr>
                                          <tr style="height: 38px;">
                                                <td align="center">
                                                     <input id="btnStart" type="button" class="btnSubmit" value="开始监测" onclick="StartMonitor();" />
                                                </td>
                                            </tr><tr style="height: 38px;">
                                                <td align="center">
                                                     <input id="btnEnd" type="button" class="btnSubmit" disabled value="停止监测" onclick="StopMonitor();" />
                                                </td>
                                            </tr>
                                        </table>
                                       
                                    </td>
                                </tr>
                                </table>
                                <table id="Table1" height="100%" cellspacing="0" cellpadding="1" width="170px" style=" display:none;">
                                   <tr style="height: 28px;">
                                                <td id="td4" style=" padding-left: 8px;">
                                                    <div style="float: left;">
                                                       坐席组</div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px;">
                                                        <asp:DropDownList ID="Drop_Groups" Width="120px" CssClass="select" runat="server">
                                                        <asp:ListItem Value="">--全部--</asp:ListItem>
                                                        
                                                        </asp:DropDownList> </div>
                                                </td>
                                            </tr>
                                            <tr style="height: 28px; ">
                                            
                                                                                                <td id="td6" style=" padding-left: 8px;">
                                                    <div style="float: left;">
                                                       监控类型</div>
                                                    <div style="float: left; padding-left: 8px; padding-top: 4px;">
                                                        <asp:DropDownList ID="DropClass" Width="120px" CssClass="select" runat="server">
                                                        <asp:ListItem Value="">--全部--</asp:ListItem>
                                                        
                                                        </asp:DropDownList> </div>
                                                </td>
                                            </tr>
                                            <tr style="height: 28px; ">
                                                <td id="td5" style="text-align: center;">
                                                    <button title="刷新状态" style="width: 60px;" onclick="LoadingData();" class="btn" tabindex="5"
                                                        id="btnSelect">
                                                        刷新状态</button>
                                                </td>
                                            </tr>
                            </table>
                        </td>
                        <td valign="top" style="padding-right: 1px; border: #A0A2AF 1px solid; padding-left: 1px;
                            padding-bottom: 1px; background-color: White; padding-top: 1px;" width="100%">
                            <table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
                                <tr>
                                    <td style="height: 110px;">
                                        <table style="table-layout: fixed; border: 1px solid #A0A2AF;" cellspacing="0" cellpadding="0"
                                            width="100%" height="100%">
                                            <tbody>
                                                <tr>
                                                    <td style="width: 120px; padding: 10px;">
                                                        <div style="height: 90px; border: 1px solid #CCCCCC; padding: 3px; text-align: center;"
                                                            onmouseover="this.style.border='1px solid #3A8BDC'" onmouseout="this.style.border='1px solid #CCCCCC'">
                                                            <table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%" style="text-align: center;">
                                                                <tr>
                                                                    <td>
                                                                        <span id="span_UserNo" style="color: #000000;">工号</span>(<span id="span_UserName"
                                                                            style="color: #000000;">姓名</span>)
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td>
                                                                        <img id="img_State" src="../images/seatimgs/weiqianru.jpg" />
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td>
                                                                        <span id="span_UserState" style="color: #cccccc;">未登录</span>
                                                                    </td>
                                                                </tr>
                                                            </table>
                                                        </div>
                                                    </td>
                                                    <td style="width: 20px;">
                                                        &nbsp;
                                                    </td>
                                                    <td>
                                                        <table>
                                                            <tr>
                                                                <td>
                                                                    <table border="0" cellspacing="0" cellpadding="0" width="100%" height="70px" style="text-align: center;">
                                                                        <tr>
                                                                            <td style="width: 100px">
                                                                                <img id="img1" src="../images/seatimgs/Mtzx1.png" title="置闲" alt="对自己置闲无效" onclick="ztzx()"
                                                                                    style="cursor: hand;" />
                                                                            </td>
                                                                            <td style="width: 100px">
                                                                                <img id="imgListen" src="../images/seatimgs/jt1.png" title="监听" onclick="bzListen()" style="cursor: hand;" />
                                                                            </td>
                                                                            <td style="width: 100px">
                                                                                <img id="img8" src="../images/seatimgs/dj1.png" title="代接" onclick="ztdj()" style="cursor: hand;" />
                                                                                <img id="img2" src="../images/seatimgs/Mtzm1.png" title="置忙" onclick="ztzm()" style="cursor: hand;
                                                                                    display: none" />
                                                                            </td>
                                                                        </tr>
                                                                        <tr>
                                                                            <td class="style1">
                                                                                <img id="img3" src="../images/seatimgs/qc1.png" onclick="ztqc0()" title="强插" style="cursor: hand;" />
                                                                            </td>
                                                                            <td class="style1">
                                                                                <img id="imglj" src="../images/seatimgs/lj1.png" title="只有在监听或插入状态下才能进行拦截" onclick="ztlj()"
                                                                                    style="cursor: hand;" />
                                                                            </td>
                                                                            <td class="style1">
                                                                                <img id="img4" src="../images/seatimgs/qz1.png" title="强拆" onclick="ztqz()" style="cursor: hand;" />
                                                                                <%-- <img id="img10" src="images/qzlx1.png" title="强制离席"    style="cursor: hand;" />--%>
                                                                            </td>
                                                                            <%-- <td>
                                                                            &nbsp;
                                                                        </td>--%>
                                                                        </tr>
                                                                    </table>
                                                                </td>
                                                                <td>
                                                                </td>
                                                            </tr>
                                                        </table>
                                                    </td>
                                                </tr>
                                        </table>
                                    </td>
                                </tr>
                                <tr>
                                    <td style="height: 100%; overflow-y: auto; scrollbar-face-color: #DBEBFE; scrollbar-shadow-color: #B8D6FA;
                                        scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #DBEBFE; scrollbar-darkshadow-color: #458CE4;
                                        scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #458CE4;">
                                        <div id="divDataItems" style="width: 100%; height: 100%; text-align: center; cursor: text;
                                            overflow-y: auto; scrollbar-face-color: #DBEBFE; scrollbar-shadow-color: #B8D6FA;
                                            scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #DBEBFE; scrollbar-darkshadow-color: #458CE4;
                                            scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #458CE4;" runat="server">
                                          
                                        </div>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
    </form>
</body>
</html>
