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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<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/json2.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>
    <script src="../scripts/ui/js/plugins/ligerLayout.js" type="text/javascript"></script>
    <script src="../scripts/ui/js/plugins/ligerTree.js" type="text/javascript"></script>
    <script src="../scripts/ui/js/plugins/ligerMenu.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" />
    <style type="text/css">
    /**电话拨号**/
#tel{height:271px;}
#tel .te_lanmu{height:27px; background:url(../images/telphoto_03.gif) no-repeat; line-height:27px; padding-left:15px;}
#tel .te_lanmu span{color:#FFF;}
#tel .te_text{ width:283px; height:211px; background:url(../images/telphoto_07.gif) no-repeat; margin:10px auto 0 auto; padding:6px;}
#tel .te_text .te_sr{ width:260px; height:26px; margin:10px auto 0 auto;}
#tel .te_text .te_sr input{ width:255px; height:26px;}
#tel .te_text .te_menu{width:253px; height:160px; margin:10px auto 0 auto;}
#tel .te_text .te_menu ul{line-height:none;}
#tel .te_text .te_menu li{ float:left; width:52px; height:29px; line-height:29px; margin:0px 6px 10px 5px; background:url(../images/tel_menu2.png) no-repeat; text-align:center;}
#tel .te_text .te_menu li a{ font-size:18px; font-weight:bold;}
#tel .te_text .te_menu li:hover{ background:url(../images/tel_menu1.png) no-repeat;}
    </style>
    <script type="text/javascript">
        function MM_swapImgRestore() { //v3.0
            var i, x, a = document.MM_sr; for (i = 0; a && i < a.length && (x = a[i]) && x.oSrc; i++) x.src = x.oSrc;
        }

        function MM_preloadImages() { //v3.0
            var d = document; if (d.images) {
                if (!d.MM_p) d.MM_p = new Array();
                var i, j = d.MM_p.length, a = MM_preloadImages.arguments; for (i = 0; i < a.length; i++)
                    if (a[i].indexOf("#") != 0) { d.MM_p[j] = new Image; d.MM_p[j++].src = a[i]; }
            }
        }

        function MM_findObj(n, d) { //v4.01
            var p, i, x; if (!d) d = document; if ((p = n.indexOf("?")) > 0 && parent.frames.length) {
                d = parent.frames[n.substring(p + 1)].document; n = n.substring(0, p);
            }
            if (!(x = d[n]) && d.all) x = d.all[n]; for (i = 0; !x && i < d.forms.length; i++) x = d.forms[i][n];
            for (i = 0; !x && d.layers && i < d.layers.length; i++) x = MM_findObj(n, d.layers[i].document);
            if (!x && d.getElementById) x = d.getElementById(n); return x;
        }

        function MM_swapImage() { //v3.0
            var i, j = 0, x, a = MM_swapImage.arguments; document.MM_sr = new Array; for (i = 0; i < (a.length - 2); i += 3)
                if ((x = MM_findObj(a[i])) != null) { document.MM_sr[j++] = x; if (!x.oSrc) x.oSrc = x.src; x.src = a[i + 2]; }
        }
</script>
    <script type="text/javascript">
        $(function () {
            $("#layout1").ligerLayout({
                rightWidth: 310
            });
        });
        function getValue(obj) {

            var txtvalue = document.getElementById("temphone");
//            var cursurPosition = -1;
//            if (txtvalue.selectionStart) {//非IE浏览器
//                cursurPosition = txtvalue.selectionStart;
//            } else {//IE
//                var range = document.selection.createRange();
//                range.moveStart("character", -txtvalue.value.length);
//                cursurPosition = range.text.length;
//            }
//            //alert(cursurPosition);
//            var str = txtvalue.value.toString();
//            var pre = "";
//            var next = "";
//            if (cursurPosition == 0) {
//                pre = str;
//            }
//            else {
//                pre = str.substring(0, cursurPosition);
//                next = str.substring(cursurPosition, str.length - 1 - cursurPosition);
//            }
            txtvalue.value = txtvalue.value + obj;
        }
        function backvalue() {
            var txtvalue = document.getElementById("temphone");
            txtvalue.value = txtvalue.value.toString().substring(0, txtvalue.value.toString().length - 1);
        }
        function closewin() {
            parent.AgentFree();
            dialog.close();
        }
        var dialog = frameElement.dialog;
        function ok() {
            var txtvalue = document.getElementById("temphone").value;
            switch (document.getElementById("hfOtype").value) {
                case "1":
                    parent.PhoneCallOut(1, txtvalue);
                    break;
                case "2":
                    parent.PhoneCallZY(txtvalue);
                    break;
                case "3":
                    parent.PhoneCallDFTH(txtvalue);
                    break;
            }
            dialog.close();
        }
        document.onkeyup = click;
        function click() {
            if (event.keyCode == 13) {
                ok();
            }
        }
        var selecttabid = 0;
        function tabs(tabId) {
            for (var i = 0; i <= 2; i++) {
                if (tabId == i) {
                    document.getElementById("tabli" + i).className = "selected";
                }
                else {
                    document.getElementById("tabli" + i).className = "";
                }
            }
            if (selecttabid != tabId) {
                switch (tabId) {
                    case 0:
                        document.getElementById("frameTelList").src = "selectcallrecord.aspx";
                        break;
                    case 1:
                        document.getElementById("frameTelList").src = "selectcalluser.aspx";
                        break;
                    case 2:
                        document.getElementById("frameTelList").src = "selectcallcustomer.aspx";
                        break;
                }
            }
            selecttabid = tabId;
        }
        function SetTelphone(phone) {
            document.getElementById("temphone").value = phone;
        }
    </script>
</head>
<body style="overflow: hidden;">
    <form id="form1" runat="server"><asp:HiddenField ID="hfOtype" Value="1" runat="server"></asp:HiddenField>
    <div id="layout1">
        <div position="right" title="号码信息" style="overflow: auto; height: 100%;">
        <div id="tel">
    <div class="te_text">
        <div class="te_sr"><input type="text" id="temphone" /></div>
        <div class="te_menu">
            <ul>
                <li onclick="getValue('1')"><a href="javascript:void(null);">1</a></li>
                <li onclick="getValue('2')"><a href="javascript:void(null);">2</a></li>
                <li onclick="getValue('3')"><a href="javascript:void(null);">3</a></li>
                <li onclick="backvalue();"><a href="javascript:void(null);">←</a></li>
                <li onclick="getValue('4')"><a href="javascript:void(null);">4</a></li>
                <li onclick="getValue('5')"><a href="javascript:void(null);">5</a></li>
                <li onclick="getValue('6')"><a href="javascript:void(null);">6</a></li>
                <li onclick="closewin();"><a href="javascript:void(null);">取消</a></li>
                <li onclick="getValue('7')"><a href="javascript:void(null);">7</a></li>
                <li onclick="getValue('8')"><a href="javascript:void(null);">8</a></li>
                <li onclick="getValue('9')"><a href="javascript:void(null);">9</a></li>
                <li onclick="ok();"><a href="javascript:void(null);">确定</a></li>
                <li onclick="getValue('0')"><a href="javascript:void(null);">0</a></li>
                <li onclick="getValue('*')"><a href="javascript:void(null);">*</a></li>
                <li onclick="getValue('#')"><a href="javascript:void(null);">#</a></li>
            </ul>
        </div>
    </div>
</div>
        </div>
        <div position="center" title="">
        <div id="contentTab" style="width:100%; height:auto;">
                            <ul class="tab_nav">
                                <li id="tabli0" class="selected"><a onclick="tabs(0);" href="javascript:;">最近通话</a></li>
                                <li id="tabli1"><a onclick="tabs(1);" href="javascript:;">公司电话</a></li>
                                <li id="tabli2"><a onclick="tabs(2);" href="javascript:;">客户电话</a></li>
                            </ul>
                            <div class="tab_con" style="height: 380px; display: block; text-align:center; ">
<iframe id="frameTelList" src="selectcallrecord.aspx" width="98%" height="380px" frameborder="0"></iframe>
                            </div>
                        </div>
        </div>
    </div>
    </form>
</body>
</html>
