index.html 43.3 KB

Edit Raw Blame History

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>我的客户</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>
    <meta name="format-detection" content="address=no;">
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="default"/>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/kwj-m-lib.min.css"/>
    <link type="text/css" rel="stylesheet" href="__PUBLIC__/static/css/m_conversation.css?v=2018060804"/>
    <script type="text/javascript" src="__PUBLIC__/js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/global.js"></script>

    <link rel="stylesheet" type="text/css" href="__STATIC__/css/chat_layer.css"/>
    <script type="text/javascript" src="__STATIC__/js/layer.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/mchat_global.js"></script>
</head>
<style type="text/css">
    .comment {
        width: 680px;
        margin: 20px auto;
        position: relative
    }
    .comment h3 {
        height: 28px;
        line-height: 28px
    }

    .com_form {
        width: 100%;
        position: relative
    }

    .input {
        width: 101%;
        height: 60px;
        border: 1px solid #ccc
    }

    .com_form p {
        height: 28px;
        line-height: 28px;
        position: relative
    }

    span.emotion {
        width: 42px;
        height: 20px;
        background: url(icon.gif) no-repeat 2px 2px;
        padding-left: 20px;
        cursor: pointer
    }

    span.emotion:hover {
        background-position: 2px -28px
    }

    .qqFace {
        margin-top: 4px;
        background: #fff;
        padding: 2px;
        border: 1px #dfe6f6 solid;
    }

    .qqFace table td {
        padding: 0px;
    }

    .qqFace table td img {
        cursor: pointer;
        border: 1px #fff solid;
    }

    .qqFace table td img:hover {
        border: 1px #0066cc solid;
    }

    #show {
        width: 680px;
        margin: 20px auto
    }

    .left_middle .user_list li .close{
        float: right;
        /*padding: 32px 0px;*/
        /*width: 16px;*/
        /*height: 17px;*/
        width: 36px;
        height: 40px;
        display: block;
        /*background-image: url("__PUBLIC__/static/images/msg/close.png");*/
        /*background-repeat: no-repeat;*/
        /*background-position: center center;*/
        opacity: 0;
    }

    .left_middle .user_list li .close img{
        padding: 11.5px 10px;
    }

    /*链接*/
    .sto_goods {
        max-width: 350px;
        margin:10px auto;
    }

    .sto_goods .rel .chat_goods_img {
        position: absolute;
        left: 0;
        top: 10px;
        margin-top: -8px;
        z-index: 10;
        width: 82px;
        height: 82px;
    }

    .sto_goods .rel {
        padding-left: 100px;
        font-size: 14px;
        height: 82px;
        position: relative;
        text-align: left;
    }

    .chat_goods_name {
        height: 40px;
        line-height: 20px;
        margin-bottom: 10px;
        overflow: hidden;
    }

    .return_href {
        float: right;
        display: inline-block;
        padding: 2px 5px;
        font-size: 12px;
        border: 1px #c4182e solid;
        color: #c4182e;
        -moz-border-radius-bottomleft: 24px;
        -moz-border-radius-bottomright: 24px;
        -webkit-border-bottom-left-radius: 24px;
        -webkit-border-bottom-right-radius: 24px;
        border-bottom-left-radius: 24px;
        border-bottom-right-radius: 24px;
        -moz-border-radius-topleft: 24px;
        -moz-border-radius-topright: 24px;
        -webkit-border-top-left-radius: 24px;
        -webkit-border-top-right-radius: 24px;
        border-top-left-radius: 24px;
        border-top-right-radius: 24px;
    }
     .s_name .online{
        display: inline-block;
    vertical-align: middle;
    width: 10px;
    height: 10px;
    background: #83E145;
    border-radius: 50%;
    margin-top: 3px;
    margin-right: -5px;
    }
    .s_name select{
    background-color: #2b2526;
    border: #2b2526;
    color: #fff;
    display: inline-block;
    vertical-align: middle;
    }
    .s_name .online .on {
        background-color: #418a5b;
    }
    .s_name {
        display: inline-block;
    }
    select {
        /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
        border: solid 1px #000;
        /*很关键：将默认的select选择框样式清除*/
        appearance:none;
        -moz-appearance:none;
        -webkit-appearance:none;
        /*将背景改为红色*/
        background:red;
        /*加padding防止文字覆盖*/
        padding-right: 14px;
    }
    /*清除ie的默认选择框样式清除，隐藏下拉箭头*/
    select::-ms-expand { display: none; }
    .qqFace table td img {
        cursor: pointer;
        border: 1px #fff solid;
        width: 24px;
    }
</style>
<body >
<div class="chatbox">
    <div class="left">
        <div class="left_head">

            <input name="admin_id" value="{$admin_id}" hidden="hidden">
            <div class="selectbox">
                <div style="float: left;width:86%" >
               <div style="float: left;width:10%;" class="selectbox1"> <img src="__PUBLIC__/static/images/msg/select.png"/></div>
                    <div style="float: left;width:90%;"> <input type="text" class="disib vam" placeholder="搜索" id="keysearch"/></div>
             </div>
            <div style="float: left;width:8%;" class="imgiszx" onclick="login_change(this)" onlinesate="1">
                <img src="__PUBLIC__/static/images/msg/m/zx.png" id="onlineimg"/>
            </div>
            </div>
            <div style="clear: both"></div>

            <div class="nav">
                <span class="msg" onclick="show_user_list()">
                    <img src="__PUBLIC__/static/images/msg/m/msg_on.png" style="width: 23px;"></img>
                    <span class="tipbox">消息</span>
                    <div class="msg_count" style="visibility: visible">0</div>
                </span>
                <span class="history" onclick="show_history_list()">
                    <img src="__PUBLIC__/static/images/msg/m/history.png" style="width: 23px;"></img>
                    <span class="tipbox">历史</span>
                </span>
            </div>
        </div>


        <div class="left_middle">
            <!--消息-->
            <ul class="news user_list">

                <!--<li>-->
                <!--<img class="touxiang" src="__PUBLIC__/static/images/index/touxiang.png"/>-->
                <!--<div class="user_name">-->
                <!--<p>明月</p>-->
                <!--<p class="info">你好，我是明月</p>-->
                <!--</div>-->
                <!--<Div class="timeandcount">-->
                    <!--<p class="msg_count1">1</p>-->
                    <!--<p class="time">114:23</p>-->
                <!--</Div>-->

                <!--</li>-->


            </ul>
                <!--历史-->
            <ul class="h_record user_list dn">
                <!--<li>-->
                    <!--<img class="touxiang" src="__PUBLIC__/static/images/index/touxiang.png"/>-->
                    <!--<div class="user_name">-->
                        <!--<p>明月</p>-->
                        <!--<p class="info">你好，我是明月</p>-->
                    <!--</div>-->
                    <!--<span class="time">14:23</span>-->
                <!--</li>-->

            </ul>
            <!--暂无消息-->
           <p class="nomsg dn">暂无消息</p>
        </div>


        <div class="left_foot">
            <p style="font-size: 14px;text-align: left;">接待中：&nbsp;<span class="cr" id="nrecive_um">0</span>&nbsp;人
            </p>
            <!--<div class="btn" onclick="">全部关闭</div>-->
        </div>

    </div>


</div>


 <script>

    //图片放大
 function cli_img_big(url,e)
 {
        layer.open({
        type: 1,
        title: false,
        closeBtn: 0,
        shadeClose: true,
        area: ['auto','auto'], //宽高
        content: "<div><img style='height:720px;' src="  + url + " /></div>"
        });
  }

//上下线
 function login_change(e) {

     //下线
     if ($(e).attr("onlinesate") == 1) {
         $('#onlineimg').attr("src", '__PUBLIC__/static/images/msg/m/lx.png');
         $(e).attr("onlinesate", 0)
         var data = {
             'admin_id': "{$admin_id}",
             'state': "1"
         };
         var r = ajax_return('{:url("index/out_line")}', data, false, 'post', 2);
     } else {
         window.location.href = location.href;//页面重新刷新
     }
 }


     var QCLOUD= '{:QCLOUD_IMGURL}';
        window.onload = function()
        {

            //loading带文字
            var t=layer.open({
                type: 2
                ,content: '加载中'
            });
		    //先让自己上线
            var data66={
                'admin_id':"{$admin_id}",
                'state':"0"
            };
            var r = ajax_return('{:url("index/out_line")}', data66, false,'post',2);
            //检测是否有未接入的会员
            $.ajax({
                type : 'post',  //提交方式
                url  : '{:url("index/not_recive")}',
                success: function(r) {
                    connectServer();
                    refresh_user_list();
                    layer.closeAll('loading');
                },
                complete:function()
                {

                },
                error:function () {
                   alert('检测未接入会员错误');
                }
            });

        }
        //定义一个连服务的函数
        function connectServer(){
           var username ="{$admin_id}111";
           //socket = new WebSocket("ws://workerman.vipzhuang.cn");
           //socket = new WebSocket("wss://workerman.yolipai.net");
           socket = new WebSocket("wss://ali-workerman.yolipai.net");
            socket.onopen = function() {
                socket.send('admin_login:' + username);
                //定时服务
                setInterval(function () {
                    $.ajax({
                        url: "/index.php/mchat/Getinfo/updata_login_outtime",
                        dataType:'json',
                        success: function (v) {
                            switch (socket.readyState) {
                                case WebSocket.CLOSING:
                                case WebSocket.CLOSED:
                                    connectServer();
                                    break;
                            }
                        }});
                },30000);
            };
            //获取workman发送过来的消息
            socket.onmessage = function(e) {
            var getMsg = e.data;
            if(isJSON(getMsg))
            {

               var htm= $.trim($(".news.user_list").html());
			   if(msgtype==1 || htm==''){ setTimeout(function () {
                   show_user_list();
               },600);  return;}
               getMsg= JSON.parse(getMsg);
               var dt=getMsg['part_time'];
               var msg=getMsg['msg'];
               var part_time=timetrans(dt);
               var msg_right=0;
               //获取左上角计数
                var msg_uc =$('.nav .msg .msg_count').text();
                var arr='';
                $('.news').find('li').each(function(){
                arr+=$(this).attr('user_id')+',';
                if($(this).attr('user_id')==getMsg['user_id'])
                {
                    if(!$(this).hasClass('on'))
                    {
                    if($(this).find('.msg_count1').length==0)
                    {
                        var insertHtml='<p class="msg_count1">0</p>';
                        $(this).find('.time').before(insertHtml);
                    }
                    }
                    //改变内容
                    if(getMsg['msg'].indexOf('goods_name')>=0)
                    {
                    getMsg['msg']='[商品链接]';
                    $(this).find('div p:last-child').text(getMsg['msg']);
                    }
                    if(getMsg['msg'].indexOf('/public/upload/mchat/temp/')>=0)
                    {
                       getMsg['msg']='[图片]';
                    $(this).find('div p:last-child').text(getMsg['msg']);
                    }
                    if(getMsg['msg'].indexOf('/public/upload/mchat/temp/')<0&&getMsg['msg'].indexOf('original_img')<0)
                    {
                    $(this).find('div p:last-child').html(replace_em(getMsg['msg']));
                    }
                    //改变时间
                    $(this).find('div.time').text(part_time);
                    //改变消息计数
                    if(!$(this).hasClass('on'))
                    {
                    $('.nav .msg .msg_count').text(Number(msg_uc)+1).show();
                        $('.nav .msg .msg_count').css('visibility','visible');
                    }
                    msg_right =$(this).find('.msg_count1').text();
                    $(this).find('.msg_count1').text(Number(msg_right)+1).show();
                    //判断是否当前正在聊天
                    if($(this).hasClass('on'))
                    {
                    var user_png = $(this).children('img').attr("src");
                    var user_name = $(this).find('.user_name p:eq(0)').text();
                    get_msg(msg,user_png);
                    update_uc_sql(this);
                    }
                }
                 });
                var  brr='';

             var is_exit = arr.indexOf(getMsg['user_id']);
             var brr_exit = brr.indexOf(getMsg['user_id']);
             if(is_exit<0)
             {
                var flag=$('#nrecive_um').html();
                $('.left_foot .cr').text(Number(flag)+1);
                re_user_list(getMsg);
             }


            }
          }
        }
        //接收到消息
        function get_msg(msg,user_png)
        {
            var link=msg.indexOf('original_img');
            var img=msg.indexOf('/public/upload/mchat/temp/');
            if(link>=0)
            {
            var msg = JSON.parse(msg);
            msg='<div class="sto_goods">'+
                '<div class="rel">'+
                '<img class="chat_goods_img" src="'+ '{:QCLOUD_IMGURL}'+ msg['original_img'] +'">'+
                '<div class="chat_goods_name"> '+ msg['goods_name']+' </div>'+
                '<div style="color: #c4182e">￥'+ msg['shop_price'] +'<a class="return_href moz_b24 moz_t24" target="_blank" href="'+msg['url']+'">查看商品详情</a></div>'+
                '</div>'+
                '</div>';
            }
            if(img>=0)
            {
                msg='<img style="max-width: 100%;max-height: 300px;"  onclick="cli_img_big(this.src,this);" src="'+QCLOUD+msg+'" />';
            }
            if(img<0&&link<0)
            {
                msg=replace_em(msg);
            }
             var p='<div class="left_msg"><img class="touxiang" src="'+user_png+'"/><div class="msg_text"><div class="l_sanjiao_b"><div class="l_sanjiao"></div></div>'+msg+'</div></div>';
            $('#messages').append(p);
            $('#messages').scrollTop($('#messages')[0].scrollHeight );
        }


        //是否是json
        function isJSON(str) {
        if (typeof str == 'string') {
            try {
                var obj=JSON.parse(str);
                if(str.indexOf('{')>-1){
                    return true;
                }else{
                    return false;
                }

            } catch(e) {
                return false;
            }
        }
}
        //刷新用户列表
        function   re_user_list(getMsg)
        {
                if(getMsg['msg'].indexOf('goods_name')>=0)
                {
                getMsg['msg']='[商品链接]';
                }
                if(getMsg['msg'].indexOf('/public/upload/mchat/temp/')>=0)
                {
                   getMsg['msg']='[图片]';
                }
                if(getMsg['msg'].indexOf('/public/upload/mchat/temp/')<0&&getMsg['msg'].indexOf('original_img')<0)
                {
                getMsg['msg']=replace_em(getMsg['msg'])

                }
                var msg_uc =$('.nav .msg .msg_count').text();
                $('.nav .msg .msg_count').css('visibility','visible');
                $('.nav .msg .msg_count').text(parseInt(msg_uc)+1);
                var dt=getMsg['part_time'];
                var part_time=timetrans(dt);
                   $('.nomsg').hide();
                var p=' <li user_id='+getMsg['user_id']+' user_ip='+getMsg['user_ip']+'><img class="touxiang" src="'+getMsg['head_pic']+'"/><div class="user_name"><p>'+getMsg['nickname']+'</p><p class="info">'+getMsg['msg']+'</p></div><div class="timeandcount"><p class="msg_count1">1</p><p class="time">'+part_time+'</p><div class="close" style="display: none;"><img onclick="update_receive_state(this,'+ getMsg['user_id'] +')" src="__PUBLIC__/static/images/msg/close.png"></div></div></li>';
                $('.news').append(p);

                $("ul.news li").click(function (e) {

                  var user_id = $(this).attr('user_id');


                //更新未读消息计数（页面）
                update_uc_page(this);

                //更新未读消息计数（数据库）
                update_uc_sql(this);

                location.href="userchat/userid/"+user_id;

            });

            //添加鼠标移动时，打叉按钮hover事件
            $(".left_middle .news li").hover(
                function(){
                   $(this).find(".msg_count").hide();
                   $(this).find(".time").hide();
                   $(this).find(".close").css({'opacity':1});
                    $(this).find(".close").show();
                },
                function(){
                    $(this).find(".msg_count").show();
                    $(this).find(".time").show();
                    $(this).find(".close").css({'opacity':0});
                    $(this).find(".close").hide();
                }
            );
        }

        function timetrans(date){
    var date = new Date(date);//如果date为10位不需要乘1000
    var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
    var m = (date.getMinutes() <10 ? '0' + date.getMinutes() : date.getMinutes());
    return h+m;
}
    </script>


<script type="text/javascript">
 var down=0;

 var msgtype=0;///0为即时消息列表，1为历史消息列表

    $("#selgoods").focus(function(){
    document.onkeydown = function (e) {
            if (!e) e = window.event;
            if ((e.keyCode || e.which) == 13) {
                selgoods();
            }
        }
    });
       $("#history_key").focus(function(){
    document.onkeydown = function (e) {
            if (!e) e = window.event;
            if ((e.keyCode || e.which) == 13) {
            sel_history_list($('#history_key').val());
            }
        }
    });
         var woohecc = {
    placeCaretAtEnd : function(el) {
            el.focus();
            if (typeof window.getSelection != "undefined"
                && typeof document.createRange != "undefined") {
                var range = document.createRange();
                range.selectNodeContents(el);
                range.collapse(false);
                var sel = window.getSelection();
                sel.removeAllRanges();
                sel.addRange(range);
            }
            else if (typeof document.body.createTextRange != "undefined") {
                var textRange = document.body.createTextRange();
                textRange.moveToElementText(el);
                textRange.collapse(false);
                textRange.select();
            }
        },
    }
    $(document).keydown(function (e) {


    var e = e || window.event, ec = e.keyCode || e.which;
    if (!e.ctrlKey && 13 == ec) {
        //console.log('发送');
        sendss();
        return false;
    }else if (e.ctrlKey && 13 == ec) {
        if (browserType() == "IE" || browserType() == "Edge") {
            $("#show_msg").append("<div></div>");
        }
        else if (browserType() == "FF") {
            $("#show_msg").append("<br/><br/>");
        } else {
            $("#show_msg").append("<div><br/></div>");
        }

        //设置输入焦点
        var o = document.getElementById("show_msg").lastChild;
        var textbox = document.getElementById('show_msg');
        var sel = window.getSelection();
        var range = document.createRange();
        range.selectNodeContents(textbox);
        range.collapse(false);
        range.setEndAfter(o);//
        range.setStartAfter(o);//
        sel.removeAllRanges();
        sel.addRange(range);
    }else{
        if (browserType() == "FF") {
            var o = $("#show_msg").html();
            o = o.replace('<br><br>', '<br>');
            $("#show_msg").html(o);

            var o = document.getElementById("show_msg").lastChild;
            var textbox = document.getElementById('show_msg');
            var sel = window.getSelection();
            var range = document.createRange();
            range.selectNodeContents(textbox);
            range.collapse(false);
            range.setEndAfter(o);
            range.setStartAfter(o);
            sel.removeAllRanges();
            sel.addRange(range);
        }
    }
});

function browserType () {
        var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
        var isOpera = false;
        if (userAgent.indexOf('Edge') > -1) {
            return "Edge";
        }
        if (userAgent.indexOf('.NET') > -1) {
            return "IE";
        }
        if (userAgent.indexOf("Opera") > -1 || userAgent.indexOf("OPR") > -1) {
            isOpera = true;
            return "Opera"
        }; //判断是否Opera浏览器
        if (userAgent.indexOf("Firefox") > -1) {
            return "FF";
        } //判断是否Firefox浏览器
        if (userAgent.indexOf("Chrome") > -1) {
            return "Chrome";
        }
        if (userAgent.indexOf("Safari") > -1) {
            return "Safari";
        } //判断是否Safari浏览器
        if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
            return "IE";
        }; //判断是否IE浏览器
}


    /*保存聊天记录*/
    function save_chat_history()
    {
        var user_ip='';
        $('.news li').each(function(i){
            if($(this).hasClass("on"))
            {
                user_ip= $(this).attr('user_ip');
                var chat_list=$('#messages').html();
            }
        });
        return user_ip;
    }
    /*获取用户ip*/
    function get_user_ip(){
        var user_ip='';
        $('.news li').each(function(i){
            if($(this).hasClass("on"))
            {
                user_ip= $(this).attr('user_ip');

            }
        });
        return user_ip;
    }


    /*转换表情*/
    function replace_em(str){

        str = str.replace(/\</g,'<');
        str = str.replace(/\>/g,'>');
        str = str.replace(/\r\n/g,"<br/>");
        str = str.replace(/\[em_([0-9]*)\]/g,'<img style="width:24px;" src="__PUBLIC__/static/images/arclist/$1.png" border="0" />');
        return str;
    }


    /*查询历史记录*/
    function sel_history_list(keyword,curpage,pagecount,date)
    {
        var keyword = keyword ? keyword : '';
        var curpage = curpage ? curpage : 1;
        var pagecount = pagecount ? pagecount : 50;
        var date = date ? date : '';
        //点击图标【显示或隐藏】历史记录框
        if (keyword=='@#$%'){
            keyword = '%';
            $('.h_date').val(getNowFormatDate('date'));
            $('#history').siblings('.absbox').toggleClass('dn');
        }
        if ($('#history').siblings('.absbox').hasClass('dn')){
            return;
        }
        //按日期搜索时，不使用关键字搜索
        if (date!=''){
            $('#history_key').val('');
        }
        $('.nomsg').hide();
        var admin_id = '{$admin_id}';
        var user_id = $('.user_list li[class="on"]').attr('user_id');
        var user_name = $('.user_list li[class="on"] .user_name p:first').text();
        if ((user_id !== undefined) && (user_id !== '') && (admin_id !== ''))
        {
            //解除img分页事件,防止多次重复绑定
            $('.bot .history_data .first').prop("onclick",null).off("click");//jQuery1.7+
            $('.bot .history_data .prior').prop("onclick",null).off("click");//jQuery1.7+
            $('.bot .history_data .next').prop("onclick",null).off("click");//jQuery1.7+
            $('.bot .history_data .last').prop("onclick",null).off("click");//jQuery1.7+
            $.ajax({
                type: 'post',
                url: "{:U('sel_history_list')}",
                data:{
                    'user_id':user_id,
                    'keyword':keyword,
                    'date':date,
                    'admin_id':"{$admin_id}",
                    'curpage':curpage,
                    'pagecount':pagecount,
                },
                success: function (data) {
                    if (data){
                        var p ='';
                        var pclass ='';
                        var pname = '';
                        var msg = '';
                        $('.inner').html('');
                        for (var i =0;i<data['data'].length;i++){
                            if (data['data'][i]['chat_type']==1){
                                pname = '{$admin_name}';
                                pclass = 'vip';
                            } else {
                                pname = user_name;
                                pclass = 'kefu';
                            }

                            if (data['data'][i]['msg_type']==3){
                                var r = JSON.parse(data['data'][i]['msg']);
                                msg ='<div class="p10" style="background-color: white;">' +
                                    '<div class="sto_goods">'+
                                    '<div class="rel">'+
                                    '<img class="chat_goods_img" src="'+ '{:QCLOUD_IMGURL}'+ r['original_img'] +'">'+
                                    '<div class="chat_goods_name"> '+ r['goods_name']+' </div>'+
//                                            '<div style="color: #c4182e">￥'+ r['shop_price'] +'<a class="return_href moz_b24 moz_t24" onclick="send_msg(3)"></a></div>'+
                                    '<div style="color: #c4182e">￥'+ r['shop_price'] +'</div>'+
                                    '</div>'+
                                    '</div>' +
                                    '</div>';
                            } else if (data['data'][i]['msg_type']==2){
                                //图片
                                msg = '<img width="200px"; src="'+'{:QCLOUD_IMGURL}'+data['data'][i]['msg']+'" onclick="cli_img_big(this.src,this);"/>'
                            } else {
                                //文字或表情
                                msg = replace_em(data['data'][i]['msg']);
                            }
                            p+='<dl><dt class="'+pclass+'">'+ pname + ' : ' + getLocalTime(data['data'][i]['add_time']) +'</dt>' +
                                '<dd>'+msg+'</dd></dl>';
                        };
                        $('.inner').prepend(p);
                        //绑定img分页事件
                        var prior = curpage - 1;
                        var next = curpage + 1;
                        if (prior == 0){
                            prior = 1;
                        }
                        if (next > data['pages']){
                            next = data['pages'];
                        }
                        $('.bot .history_data .first').bind('click',function () {
                            sel_history_list(keyword,1,pagecount,date)
                        });
                        $('.bot .history_data .prior').bind('click',function () {
                            sel_history_list(keyword,prior,pagecount,date)
                        });
                        $('.bot .history_data .next').bind('click',function () {
                            sel_history_list(keyword,next,pagecount,date)
                        });
                        $('.bot .history_data .last').bind('click',function () {
                            sel_history_list(keyword,data['pages'],pagecount,date)
                        });


                    }
                }
            });
        $('#absbox').addClass('dn');
        $('#sel_goods').addClass('dn');
        $('#overlay').removeAttr('style');
        $('#history_list').parent().css('z-index','6000');
        overlay();
        }

    }

    function getLocalTime(DT) {
        return new Date(parseInt(DT) * 1000).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");
    }


    //获取user_id
    function get_user_id(){
        var user_id='';
        $('.news').find('li').each(function(){
            if($(this).hasClass("on"))
            {
                user_id= $(this).attr('user_id');
            }
        });
        return user_id;
    }

   //获取user_id
    function get_history(){
        var user_id='';
        $('.h_record').find('li').each(function(){
            if($(this).hasClass("on"))
            {
                user_id= $(this).attr('user_id');
            }
        });
        return user_id;
    }

    /*生成遮罩*/
    function  overlay()
    {

        $('#upload_img').css('z-index','6000');
        var docHeight = $(document).height(); //获取窗口高度
        $('#overlay')
            .height(docHeight)
            .css({
//                'opacity': .9, //透明度
                'position': 'absolute',
                'top': 0,
                'left': 0,
                'width': '100%',
                'height': '100%',
                'z-index': 5000,
                'background-color':'rgba(0,0,0,0.7)',
            });
    }


    /*点击遮罩促发*/
    function overlay_click()
    {
        $('#absbox').addClass('dn');
        $('#history_list').addClass('dn');
        $('#sel_goods').addClass('dn');
        $('#overlay').removeAttr('style');
        }

    $(function () {


        /*计算订单高度*/
        $(".titinfo ").click(function () {
            var ordh;
            ordh = $("body").height() - $(".right_head").height() - $(".right_info .info_tit").height() - $(".viporder .ordertit").height();
            $(".viporder .gdtbox").css("height", ordh);
        });


    });

 //by 1019：定位搜索 for 消息列表页、历史记录页
 $('div.selectbox input.vam').bind('input propertychange', function (input) {
     if ($("ul.news").hasClass('dn')){
         //历史记录页
         if (input.target.value == ''){
             //无关键值，全部显示
             $('ul.h_record li').each(function(index,li){
                 $(li).show();
             });
         } else {
             //按关键值显示
             if ($("ul.h_record").children('li').length>0){
                 $('ul.h_record li').each(function(index,li){
                     var name = $(li).find('div p:first-child').text();
                     if (name.indexOf(input.target.value)<0){
                         $(this).hide();
                     } else {
                         $(this).show();
                     }
                 });
             }
         }
     } else {
         //消息列表页
         if (input.target.value == ''){
             //无关键值，全部显示
             $('.news li').each(function(index,li){
                 $(li).show();
             });
             return;
         } else {
             //按关键值显示
             if ($("ul.news").children('li').length>0){
                 $('ul.news li').each(function(index,li){
                     var name = $(li).find('div p:first-child').text();
                     if (name.indexOf(input.target.value)<0){
                         $(this).hide();
                     } else {
                         $(this).show();
                     }
                 });
             }
         }
     }
 });

    //点击消息图标，刷新聊天列表
    function show_user_list() {
        close_hide();
        $(".news").removeClass("dn");
        $(".h_record").addClass("dn");
        $(".nav .msg img").attr("src", "__PUBLIC__/static/images/msg/m/msg_on.png");
        $(".nav .history img").attr("src", "__PUBLIC__/static/images/msg/m/history.png");

        $('ul.news').html('');
        msgtype=0;
        refresh_user_list();
    }

    //用户消息列表单击事件
    $(".news li").click(function () {

        $(".user_list li").removeClass("on");
        $(this).addClass("on");

        //更新未读消息计数（页面）
        update_uc_page(this);
        //同步用户资料
      //  sel_user_info(this);
        //同步用户历史订单
        //sel_order_list(this);
        //更新未读消息计数（数据库）
        update_uc_sql(this);

    });


    //历史记录列表
    function show_history_list() {
        close_hide();
        $(".news").addClass("dn");
        $(".h_record").removeClass("dn");
        $(".nav .msg img").attr("src", "__PUBLIC__/static/images/msg/m/msg.png");
        $(".nav .history img").attr("src", "__PUBLIC__/static/images/msg/m/history_on.png");
        $(".user_list li").removeClass("on");
        //消息记录的用户对应的历史记录的用户增加样式on
        msgtype=1;
        refresh_history_list();
    }


    //提示信息
    $(".nav img").mousemove(function () {
        $(this).siblings(".tipbox").css("display", "block");
    });
    $(".nav img").mouseout(function () {
        $(this).siblings(".tipbox").css("display", "none");
    });


    //消息记录-》历史记录
    function show_ms_record() {
        $(".news").addClass("dn");
        $(".h_record").removeClass("dn");
        $(".nav .msg img").attr("src", "__PUBLIC__/static/images/msg/msg.png");
        $(".nav .history img").attr("src", "__PUBLIC__/static/images/msg/history_on.png");
        $(".right_middle").removeClass("dn");
//        $(".right_foot").addClass("dn");
//        $(".right_foot_h").removeClass("dn");
        $(".right_head .name").removeClass("dn");
        $(".fanhui").css("visibility", "visible");
        $(".nomsgbox").addClass("dn");
        $(".user_list li").removeClass("on");

        //消息记录的用户对应的历史记录的用户增加样式on

    }
    //关闭消息框
    function close_hide() {
        $(".user_list li").removeClass("on");

    }


    //by 1019：定位搜索 for 消息列表页、历史记录页
      $("#keysearch").click(function () {

      })


	//搜索 for 用户列表页 use 数据库查询方式
    function refresh_user_list() {
        //刷新接入用户列表
        $('.nomsg').hide();
        $('ul.news').html('');
        $.ajax({
            type: 'post',
            url: '{:url("Getinfo/sel_user_list")}',
            success: function (data) {
                var r=data;
                if (r){
                    var str = '';
                    var msg = '';
                    var msg_uc = 0;
                    var num=0;
                    for (var i in r){
                        num++;
                        //未读消息数
                        if (r[i]['msg_uc'] !== 0){
                            msg_uc = msg_uc + r[i]['msg_uc'];
                            str = '<p class="msg_count1">' + r[i]['msg_uc'] + '</p>';
                        };

                        if (r[i]['msg_type']==3){
                            msg = '[商品链接]';
                        } else if (r[i]['msg_type']==2){
                            msg = '[图片]';
                        } else {
                            msg = replace_em(r[i]['msg']);
                        }
                        $('ul.news').append(
                            '<li user_id='+ r[i]['user_id'] +' user_ip='+ r[i]['user_ip'] +'>'+
                            '<img class="touxiang" src="'+ r[i]['head_pic'] +'">'+
                            '<div class="user_name">'+
                            '<p>'+ r[i]['nickname'] +'</p>'+
                            '<p class="info">'+ msg +'</p>'+
                            '</div><div class="timeandcount">'+ str +
                            '<p class="time">' + r[i]['part_time'] + '</p>'+
                            '<div class="close" style="display:None;"><img onclick="update_receive_state(this,'+ r[i]['user_id'] +')" src="__PUBLIC__/static/images/msg/close.png"></div>' +
                            '</div></li>'
                        );
                        str = ''
                    }


                    if ($('ul.news').html()=="")
                    {
                       $('.nomsg').show();
                    }
                    //接待数
                    $('.left_foot .cr').text(num);
                    //更新 未读消息 总数
                    if (msg_uc > 0){
                        $('.nav .msg .msg_count').css('visibility','visible');
                        $('.nav .msg .msg_count').show();
                        $('.nav .msg .msg_count').text(msg_uc);
                    } else {
                        $('div.nav span.msg div.msg_count').css('visibility','hidden');
                    }
                    $("ul.news li").click(function (e) {
                        var user_id = $(this).attr('user_id');
                        //更新未读消息计数（页面）
                        update_uc_page(this);
                        //更新未读消息计数（数据库）
                        update_uc_sql(this);

                       location.href="userchat/userid/"+user_id;

                    });

                    //添加鼠标移动时，打叉按钮hover事件
                    $(".left_middle .news li").hover(
                        function(){
                            $(this).find(".msg_count1").hide();
                            $(this).find(".time").hide();
                            $(this).find(".close").css({'opacity':1});
                            $(this).find(".close").show();
                        },
                        function(){
                            $(this).find(".msg_count1").show();
                            $(this).find(".time").show();
                            $(this).find(".close").css({'opacity':0});
                            $(this).find(".close").hide();

                        }
                    );
                }
            }
        });
    }


    //历史列表
    function refresh_history_list() {

        var data = {
            'url': '{:url("Getinfo/sel_history_list")}',
            'admin_id':"{$admin_id}",
        };
        $('ul.h_record').html('');
        var r = ajax_return(data['url'], data, false,'post',2);
        if (r){
            var msg = '';
            for (var i = 0;i<r.length;i++)
            {
                if (r[i]['msg_type']==3){
                    msg = '[商品链接]';
                } else if (r[i]['msg_type']==2){
                    msg = '[图片]';
                } else {
                    msg = replace_em(r[i]['msg']);
                }
                $('ul.h_record').append(
                    '<li user_id='+ r[i]['user_id'] +'>'+
                    '<img class="touxiang" src="'+ r[i]['head_pic'] +'">'+
                    '<div class="user_name">'+
                    '<p>'+ r[i]['nickname'] +'</p>'+
                    '<p class="info">'+ msg +'</p>'+
                    '</div>'+
                    '<span class="time">' + r[i]['part_time'] + '</span>'+
                    '</li>'
                );
            }

            if ($('ul.h_record').html()=="")
            {
                $('.nomsg').show();
            }
            else
            {
                $('.nomsg').hide();
            }
            $("ul.h_record li").click(function (e) {

                var user_id = $(this).attr('user_id');
                location.href="userchat/userid/"+user_id;

            });
        }
    }
             $(".left_middle .news li").hover(
                function(){
                   $(this).find(".msg_count1").hide();
                   $(this).find(".time").hide();
                   $(this).find(".close").css({'opacity':1,});
                },
                function(){
                    $(this).find(".msg_count1").show();
                    $(this).find(".time").show();
                    $(this).find(".close").css({'opacity':0,});
                }
            );

        function check_state(e)
        {
                var data={
                'user_id':get_history(),
                };
                var r = ajax_return('{:url("index/check_state")}', data, false,'post',2);
              if(r)
              {
                 //正在接待
                if(r['code']==1)
                {
                show_history_list();
                layer.msg('其他客服接待中。。。');
                return 1;
               }
              }

        }
    //结束会话
    function update_receive_state(obj,user_id)
    {

        event.stopPropagation();//阻止事件冒泡即可

        layer.open({
            title:'提示',
            content: '确定结束本次会话吗？',
            btn: ['确定', '取消'],
            yes: function(index, layero){
                var flag=$('#nrecive_um').html();
                $('.left_foot .cr').text(Number(flag)-1);
                $(".msg_count").text(Number(flag)-1);
                 close_hide();
                 socket.send('chat:<'+user_id+'>:'+'recive_again_flags');
                //按钮【按钮一】的回调
                $(obj).parent().parent().parent().remove();
                layer.closeAll();
                var data = {
                    'url': '{:url("Getinfo/update_data")}',
                    'table':'chat_receive',
                    'data':{'state':1},
//                  'data':{'state':1,'msg_uc':0},
                    'where':{'user_id':user_id,'admin_id':"{$admin_id}"},
                };
                var r = ajax_return(data['url'], data, true,'post',2);
            },
            btn2: function(index, layero){
                //按钮【按钮二】的回调
            },
        });
    }
    //更新未读消息计数（页面）
    function update_uc_page(obj) {
        if ($(obj).children('p.msg_count1')){
            //更新总计数
            if (parseInt($('.nav .msg .msg_count').text() - $(obj).children('p.msg_count1').text()) == 0){
                $('.nav .msg .msg_count').hide();
                $('.nav .msg .msg_count').text(0);
            } else {
                $('.nav .msg .msg_count').text($('.nav .msg .msg_count').text() - $(obj).children('p.msg_count1').text());
            }
            $(obj).children('p.msg_count1').remove();
        }
    }

    //更新未读消息计数（数据库）
    function update_uc_sql(obj)
    {
        var data = {
            'url': '{:url("Getinfo/update_data")}',
            'table':'chat_msg',
            'data':{'is_read':1},
            'where':{'user_id':$(obj).attr('user_id'),'admin_id':"{$admin_id}",'is_read':0},
        };
        var r= ajax_return(data['url'], data, true,'post',2);
    }


</script>
</body>
</html>