userchat.html 48.9 KB

Edit Raw Blame History

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>{$userinfo.vipname}</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 rel="stylesheet" type="text/css" href="__STATIC__/css/chat_layer.css"/>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/chat.css?v=20180608"/>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/webiaoqing.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/mchat_global.js"></script>
    <script type="text/javascript" src="__STATIC__/js/layer.js"></script>
    <script type="text/javascript" src="__STATIC__/js/rem_JScript.js"></script>
    <script type="text/javascript" src="__STATIC__/js/webiaoqin.js"></script>

    <script type="text/javascript" src="__PUBLIC__/js/ajaxfileupload.js"></script>
    <style type="text/css">

        #loading {

            text-align: center;
            line-height: 25px;
            font-size: 12px;
            font-weight: bold;
            color: #F00;
            z-index: 1002;
        }
        #bg {
            display: none;
            position: absolute;
            top: 0%;
            left: 0%;
            width: 100%;
            height: 100%;
            background-color: black;
            z-index: 1001;
            -moz-opacity: 0.6;
            opacity: .60;
            filter: alpha(opacity=60);
        }


        /*增加连续两个链接之间的间距*/
        .sto_goods {
            margin-top: -5px;
            margin-bottom: 15px
        }

        .goods_chat .sto_goods {
            margin-bottom: 0;
            margin-top: 0;
        }

        a {
            color: #211b1c;
            text-decoration: none;
        }

        .bgtrans {
            position: fixed;
            left: 0;
            top: 0;
            z-index: 999;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.7);
            text-align: center;
        }
        .bgtrans.on{
            display: inline-table;
        }

        .bgtrans img {
            display: inline-block;
            vertical-align: middle;
            max-width: 100%;
            max-height: 100%;
        }

        .div_vm {
            width: 0;
            height: 100%;
            display: inline-block;
            vertical-align: middle;
        }

        .trans {
            position: fixed;
            left: 0;
            top: 0;
            z-index: 999;
            width: 100%;
            height: calc(100% - 173px);
        }
        .quick_list{ padding-top: 10px; width:100%; }
        .quick_list li{ float:left;width:65px;padding: 5px; text-align: center; line-height: 24px; color:#222; font-size: 14px; }
        .quick_list li img{ max-width:60px; width: 100%;}


        .inputbox  {
            vertical-align: middle;
            font-size: 14px;
            background-color: #fff;
            width: 85%;
            margin: 0 auto;
            float: left;
            height: 24px;
            line-height:24px;
            padding: 5px;
            font-family: "Microsoft Yahei";
            border-bottom: solid #eee 1px;

        }
        .delimg{ float: right; width: 15px; text-align: center;  vertical-align: middle; margin: 0 auto;
            line-height:24px;
            padding: 5px;}


        /*w用户资料*/
        .vipdata {
            padding: 20px;
            font-size: 14px;
        }
        .vipdata ul li {
            margin-bottom: 10px;
            height: 25px;
            line-height: 25px;
        }
        .vipdata img {
            display: inline-block;
            vertical-align: middle;
            margin-right: 10px;
        }

    </style>

</head>
<body >

<div class="dn">
    <div class="orderlistinfo">
<div class="viporder " id="orderlist" >


    <div class="gdtbox">
        <ul>

            <!--<li>-->
                            <!--<span class="order_info">-->
                                <!--<img src="__PUBLIC__/static/images/del/sc1.jpg" alt="">-->
                                <!--<div class="name ">-->
                                     <!--<div class="cut">4545645454545454</div>-->
                                      <!--<div class="cut">实付金额：<em class="cr">￥78.00</em></div>-->
                                     <!--<div class="cut" style="color: #999">2017.09.25  16:45</div>-->
                                      <!--<div class="cut">下单门店：中山店</div>-->
                                <!--</div>-->
                                <!--<div class="clear"></div>-->
                            <!--</span>-->
                <!--<span class="order_pro">-->
                                <!--查看详情 <img class="ml10" src="__PUBLIC__/static/images/msg/rr.png" alt="">-->
                            <!--</span>-->
            <!--</li>-->

        </ul>
    </div>

</div>
</div>
</div>
<!-- 用户资料 -->
<div class="dn">
    <div class="info_inner">
        <div class="vipdata ">
            <ul>
                <!--by 1019-->
                <li class="vip_info_nickname"><img src="/public/static/images/msg/zl1.png">{$userinfo.nickname}</li>
                <li class="vip_info_vipname"><img src="/public/static/images/msg/zl2.png">{$userinfo.vipname|default='未填写'}</li>
                <li class="vip_info_mobile"><img src="/public/static/images/msg/zl3.png">{$userinfo.mobile}</li>
                <li class="vip_info_birthday"><img src="/public/static/images/msg/zl4.png">
                    <if condition="$userinfo['birthday']">
                    {$userinfo.birthday|date='Y-m-d',###}
                        <else>
                            无
                        </if>
                </li>
                <li class="vip_info_pickname fgx"><img src="/public/static/images/msg/zl5.png">{$userinfo.pickup_name}</li>
                <!--<li class="fgx"><img src="/public/static/images/msg/zl6.png"/>2017-09-28</li>-->
                <!--<li> 最后购买时间&nbsp;:</li>-->
                <li class="vip_info_last_time">最后购买时间&nbsp;:&nbsp;{$userinfo_count.last_time}</li>
                <li class="vip_info_count">购买次数&nbsp;:&nbsp;{$userinfo_count.count}次</li>
                <li class="vip_info_avg">每单均价&nbsp;:&nbsp;{$userinfo_count.avg} 元</li>
                <li class="vip_info_sum">总消费&nbsp;:&nbsp;{$userinfo_count.sum} 元</li>
            </ul>
        </div>
        <div class="viporder dn">
            <div class="ordertit">
                <!--by 1019-->
                <span>历史订单</span>
                <span style="text-align: right"><a id="much_order" href="/index.php?m=Admin&amp;c=Order&amp;a=index&amp;keytype=2&amp;keywords=15805990095&amp;pay_status=1" target="_blank">更多</a></span>
                <div class="clear"></div>
            </div>
            <div class="gdtbox">
                <ul></ul>
            </div>
        </div>
    </div>


</div>

<!-- 商品查询 -->
<div class="picbox_img"  id="searchgoods" style="display: none">
    <div class="absbox">
        <div class="history_info">
            <div class="tit">
                                        <span class="tar" style="width: 100%">
                                    <em class="inputbox1" style="width: 70%">
                                        <img src="__PUBLIC__/static/images/msg/xxjl2.png" alt=""><input
                                            type="text" id='selgoods' placeholder="搜索关键字" style="width: 90%">
                                    </em>
                                    <a class="selmore" onclick='selgoods($("#selgoods").val());'>搜索</a>
                                         </span>
                <div class="clear"></div>
            </div>
            <div class="info1" style="padding-right: 10px;height:300px;overflow-y:auto;">
                <div class="sto_goods" >
                    <div class="rel" style="font-size:12px; text-align: center; padding: 10px;">
                        输入关键字搜索商品
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<!-- 历史记录 -->
<div class="picbox_img"   id="history_list" style="display: none">

    <div class="absbox">
        <div class="history_info">
            <div class="tit">

            <span class="tar" style="width: 100%">
                                    <em class="inputbox1" style="width: 70%">
                                                <img src="__PUBLIC__/static/images/msg/xxjl2.png" alt=""><input
                                            type="text" id="history_key" placeholder="内容关键字"  style="width: 200px">
                                            </em>
                                            <a class="selmore" onclick="sel_history_list1($('#history_key').val());">搜索</a>
                                        </span>
                <div class="clear"></div>
            </div>
            <div class="info">
                <div class="inner">
                </div>
            </div>
            <div class="bot">
                <div class="history_data">
                    <img src="__PUBLIC__/static/images/msg/data.png"/>
                    <!--<span class="data">2017-09-19</span>-->
                    <input type="date" class="h_date" id="search_hdate" onchange="sel_history_list1('','','',$(this).val());">
                    <img src="__PUBLIC__/static/images/msg/ll.png" class="first" title="首页" />
                    <img src="__PUBLIC__/static/images/msg/l.png"  class="prior" title="上一页"/>
                    <img src="__PUBLIC__/static/images/msg/rr.png" class="next" title="下一页"/>
                    <img src="__PUBLIC__/static/images/msg/r.png"  class="last" title="末页"/>
                </div>
            </div>
        </div>
    </div>

</div>

<div class="bgtrans dn">
    <img id="bigimg" src="" alt="">
    <div class="div_vm"></div>
</div>
<div class="main">
    <div class="stopro">
       <a hef="javascript:" onclick="userinfo()"> <img class="rad_50"  src="{$userinfo.head_pic}" alt="">{$userinfo.nickname}
        <img CLASS="arrow_down_off" src="__STATIC__/images/arrow_down_off.png" alt=""></a>
        <a hef="javascript:" onclick="orderinfo()"> <img class="chatreturn" src="__STATIC__/images/chat/order.png" alt=""></a>
    </div>
    <div class="center">

    </div>
    <div class="chatfoot" style="z-index: 999;">
        <div class="inner">
            <img class="footimg emotion" src="__STATIC__/images/chat/foot1.png" alt="">
            <a href="#upimg"><img class="footimg"  src="__STATIC__/images/chat/foot2.png" alt="" id="morepic"></a>
            <div contentEditable="true" class="chatinput" id="show_msg" name="show_msg" style='' onkeydown="myInput.listen(this, event);"  onfocus="setfoucs()" onblur="outfoucs()">
            </div>
            <span class="chat_sumb" onclick="if($('#show_msg').html()!='')send_msg(1,'');">发送</span>


            <div class="adadad" style="height: 0;overflow: hidden;">
                <div class="page_emotion box_swipe" id="page_emotion">
                    <dl id="list_emotion" class="list_emotion pt_10"></dl><!-- 表情框 -->
                    <dt>
                    <ol id="nav_emotion" class="nav_emotion"></ol>
                    </dt><!-- 分页提示点 -->
                </div>

            </div>

            <!--快捷图标-->
            <div id="quick_pic" style="height: 0;overflow: hidden;">
              <ul class="quick_list">
                 <a href="#upimg" target="_blank" id="pic1" style="display: none;"><li><img src="__STATIC__/images/chat/fstp.jpg"><br>发送图片</li></a>
                 <li id="ftou"><img src="__STATIC__/images/chat/fstp.jpg"><br>发送图片</li>
                  <li  onclick="replys(this);"><img src="__STATIC__/images/chat/kjhf.jpg"><br>快捷回复</li>
                  <li onclick="open_historylist();"><img src="__STATIC__/images/chat/ltjl.jpg"><br>聊天记录</li>
                  <li  onclick="sel_goods_list();"><img src="__STATIC__/images/chat/czsp.jpg"><br>发送商品</li>
              </ul>

            </div>


        </div>

        <form action="{:U('Mbchat/save_image')}" method="post" name="form_img" enctype="multipart/form-data"
              style="height: 0px;width: 0px;display: none">
            <input type="file" name="imgfile" id="imgfile" accept="image/*" onchange="imgChange(this);">
            <!--stoid问题-->
            <input type="text" readonly="readonly" hidden="hidden" name="stoid" value="{$userinfo.store_id}">
        </form>
    </div>
</div>
<div class="trans dn"></div>


<div id="overlay" onclick="overlay_click();"></div>


</body>

<script type="text/javascript">


    var flag = 0;
    var r = 0;
    var socket = null; //初始为null
    var admin_ip = '';//全局变量
    var admin_id = '';//全局变量
    var user_id = "{$userinfo.user_id}";
    var user_ip = "";
    var stoid = "{$userinfo.store_id}";
    var QCLOUD = '{:QCLOUD_IMGURL}';
    var head_pic = "{$userinfo.head_pic}";
    var store_logo = "{$store_logo}";

    var init_centerhei=0;


//安卓判断输入框获得
    function  setfoucs() {

        if (isAndroid()) {
            var cenh = $("body").height() - $(".stopro").outerHeight() - $(".chatfoot").outerHeight() - 1;
            $(".center").css("height", cenh / 2 - 20);
            $(".chatfoot").css('position', 'static');
            $(".trans").css("height", cenh / 2 - 20);
        }

    }
//初始调试
    function initheight()
    {

        $(".center").css("height", init_centerhei);
        $('.center').scrollTop($('.center')[0].scrollHeight);
    }
    //离开焦点
    function outfoucs() {

        if (isAndroid()) {
            initheight();
            $(".chatfoot").css('position', 'fixed');
        }
    }

//是否安卓
    function isAndroid()
    {
       // return true;
        var u = navigator.userAgent;
        var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
       return isAndroid;
    }


    //判断安卓机的话跟APP那里相关联
    var ua = navigator.userAgent.toLowerCase();
    if (/iphone|ipad|ipod/.test(ua)) {
        $("#pic1").hide();
        $("#ftou").show();
    } else if (ua.indexOf("android")>0) {
        $("#pic1").show();
        $("#ftou").hide();
    }else{
        $("#pic1").hide();
        $("#ftou").show();
    }
    $("#ftou").click(function () {

        document.getElementById("imgfile").click();
    });

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

        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()
    {

        $("#searchgoods").hide();
        $("#history_list").hide();
        $('#overlay').removeAttr('style');
    }

    //用户历史订单
    function sel_order_list() {
        var data = {
            'url': '{:url("Getinfo/sel_order_list")}',
            'user_id':{$userinfo.user_id},
        };
        $('div.gdtbox ul').html('');
        // var r = ajax_return(data['url'], data, false,'post',2);
        $.ajax({
            type : 'post',  //提交方式
            url  : '{:url("Getinfo/sel_order_list")}',
            data : data,
            dataType : 'json',
            success: function(r) {
                if (r){
                    for (var i=0;i<r.length;i++){
                        $('div.gdtbox ul').append(
                            '<li>'+
                            '<span class="order_info">'+
                            '<img src="'+QCLOUD+ r[i]['original_img'] + '">' +
                            '<div class="name">' +
                            '<div class="cut">' + r[i]['order_sn'] +'</div>' +
                            '<div class="cut">实付金额：<em class="cr">￥' + r[i]['total_amount'] + '</em></div>'+
                            '<div class="cut">' + r[i]['add_time'] + '</div>' +
                            '<div class="cut">下单门店：'  + r[i]['pickup_name'] + '</div>' +
                            '</div>'+
                            '<div class="clear"></div>'+
                            '</span>'+
                            '</li>'
                        );
                    }
                }
            },
        });
    }
    //'<span class="order_pro"><a target="_blank" href="/index.php/admin/order/detail/order_id/'+r[i]['order_id']+'.html">查看详情</span>'+

    /*查询历史记录*/
    function sel_history_list1(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 = '%';

            $('#search_hdate').val(getNowFormatDate('date'));
        }
        //按日期搜索时，不使用关键字搜索
        if (date!=''){
            $('#history_key').val('');
        }
        var admin_id = '{$admin_id}';
        var user_id ="{$userinfo.user_id}";
        var user_name ="{$userinfo.nickname}";
        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 = '';
                        $('#history_list .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>';
                        };

                        $('#history_list .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_list1(keyword,1,pagecount,date)
                        });
                        $('.bot .history_data .prior').bind('click',function () {
                            sel_history_list1(keyword,prior,pagecount,date)
                        });
                        $('.bot .history_data .next').bind('click',function () {
                            sel_history_list1(keyword,next,pagecount,date)
                        });
                        $('.bot .history_data .last').bind('click',function () {
                            sel_history_list1(keyword,data['pages'],pagecount,date)
                        });


                    }
                }
            });

        }

    }

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


    /*订单*/
    function orderinfo(){


        sel_order_list();

        var html='';
        html=$(".orderlistinfo").html();
       // alert(html);
        layer.open({
            type: 1
            , title: [
                '最新订单',
                'background-color: #e1e1e1; '
            ]
            ,content:html
            ,anim: 'up'
            ,style: 'width:95%;max-width:700px;'
        });


    }

    /*显示个人资料*/
    function userinfo(){

        var html='';
        html=$(".info_inner").html();
        layer.open({
            type: 1
            , title: [
                '用户资料',
                'background-color: #e1e1e1; '
            ]
            ,content:html
            ,anim: 'up'
            ,style: 'width:95%;max-width:700px;'
        });


    }
//    查找商品
    function sel_goods_list(){

        $('.info1').html('<div class="sto_goods" > <div class="rel" style="font-size:12px; text-align: center; padding: 10px;">输入关键字搜索商品 </div> </div>');
        $("#searchgoods").show();

        $('#searchgoods').css('z-index','6000');
        overlay();


    }


    //搜索商品
    function selgoods(keyword)
    {
        var data = {
            'url': '{:url("Mindex/sel_goods_list")}',
            'keyword': keyword,
            'store_id': "{$store_id}",
        };
        var r = ajax_return(data['url'], data, false,'post',2);
        r=JSON.parse(r);
        var p='';
        if(r.length>0)
        {
            for(var i=0;i<r.length;i++)
            {
                var  info=JSON.stringify(r[i]);
                p+='<div class="sto_goods"><div class="rel"><img class="chat_goods_img" src="'+QCLOUD+r[i]['original_img']+'" alt=""><div class="chat_goods_name">'+r[i]['goods_name']+'</div><div style="color: #c4182e">￥'+r[i]['shop_price']+'<a class="return_href moz_b24 moz_t24" onclick=\'chagegoods(this);send_msg(3,'+info+');\'>发送商品链接</a></div></div></div>';
            }
        }else{
            p='<div class="sto_goods" ><div class="rel" style="padding-left: 135px;margin-top: 80px;">查无类似商品</div></div>';
        }
        $('.info1').html("");
        $('.info1').append(p);
        $('.info1').scrollTop($('.info1')[0].scrollHeight );
    }

    /*历史消息记录*/
    function open_historylist()
    {
        sel_history_list1("@#$%");
        $("#history_list").show();
        $('#history_list').css('z-index','6000');
        overlay();
    }


    //初始化加载
    $(function () {


        $(".emotion").click(function () {


           if ($(".adadad").css('height')=="0px")
            {
                $("#quick_pic").addClass("dn");
                $("#quick_pic").css("height", "0");

                $(".trans").removeClass("dn");
                $("#quick_pic").addClass("dn");
                $(".adadad").css("height", "132px");
                var cenh = $("body").height() - $(".stopro").outerHeight() - $(".chatfoot").outerHeight() - 1;
                $(".trans").height(cenh);
            }else
            {
                initheight();
                $(".trans").addClass("dn");
                $(".adadad").css("height", "0");

                $("#quick_pic").addClass("dn");
                $("#quick_pic").css("height", "0");
            }
        });

        $(".trans").click(function () {

            initheight();
            $(".trans").addClass("dn");
            $(".adadad").css("height", "0");

            $("#quick_pic").addClass("dn");
            $("#quick_pic").css("height", "0");


        });
        $(".bgtrans").click(function () {


            $("#quick_pic").addClass("dn");
            $("#quick_pic").css("height", "0");


            $(this).addClass("dn");
            $(this).removeClass("on");
        });

        // 更多
        $("#morepic").click(function () {
            $(".trans").removeClass("dn");
            $(".adadad").css("height", "0");
            if ($("#quick_pic").css('height')=="0px") {
                $("#quick_pic").removeClass("dn");
                $("#quick_pic").css("height", "");

            }else
            {
                $("#quick_pic").addClass("dn");
                $("#quick_pic").css("height", "0");
            }
        });


        var ordh;
        ordh = $("body").height() - 50;
        $(".viporder .gdtbox").css("height", ordh);


    })

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

                sel_history_list();

                setTimeout(function () {
                    $('.center').scrollTop($('.center')[0].scrollHeight);
                }, 1000)
                layer.closeAll('loading');

                init_centerhei= $('.center').height();


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


    }


//发送
    function sendss(e) {
        var ee = document.getElementById("show_msg").innerHTML;
        if (ee != '') {
            send_msg(1, '');
        }
    }
    //定义一个连服务的函数
    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);
        };
        //获取workman发送过来的消息
        socket.onmessage = function(e) {
            var getMsg = e.data;
            if(isJSON(getMsg))
            {
               //alert(getMsg);

            //    {"user_id":"2723","admin_ip":"29111","user_ip":"2723","msg":"6666","part_time":1527068856098,"nickname":"Season","head_pic":"http://thirdwx.qlogo.cn/mmopen/vi_32/DYAIOgq83epKvUAbX1bZFwBzR1FCclvR4KfT19nyUmAyBbq2zWN7t7hicb1dlicIxwMOibzTFzFibnzBwdKEytgotw/132"}

                getMsg= JSON.parse(getMsg);
                var msg= getMsg['msg'];
                var type=0;
                //改变内容
                if(getMsg['msg'].indexOf('goods_name')>=0)//商品
                {
                    type=2;
                }
                if(getMsg['msg'].indexOf('/public/upload/mchat/temp/')>=0)
                {
                    type=1
                }
                if(getMsg['msg'].indexOf('/public/upload/mchat/temp/')<0&&getMsg['msg'].indexOf('original_img')<0)
                {
                    type=0;
                }
                get_msg(msg, type);
                //判断当前userid是否在聊天
                if (user_id==getMsg['user_id']) {

                    update_uc_sql(user_id);
                }

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


    //是否是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 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;
    }

    //手机聊天记录
    function sel_history_list() {
        $('.center').html("");

        var t=0;
        var data={
            'user_id':user_id,
            'admin_id':"{$admin_id}",
            'keyword':'%',
            'date':getNowFormatDate('date'),
            'curpage':1,
            'pagecount':1000,
        };
        var r = ajax_return('{:url("mindex/sel_history")}', data, false,'post',2);
        var p = '';
        if (r) {
            var data = JSON.parse(r);
                //会员 stochat
              //商家  vipchat
            var msg = '';
            for (var i = 0; i < data.length; i++) {

                if (data[i]['msg_type'] == 3) {
                    var link = JSON.parse(data[i]['msg']);
                    if (data[i]['chat_type'] == 1) {

                        msg += '<div class="vipchat"><div class="answer"><div class="inner goods_chat"><span class="chatsj"></span>' +
                            '<a class=" " target="_blank" href="'+link['url']+'"><div class="sto_goods">' +
                            '<div class="rel">' +
                            '<img class="chat_goods_img" src="' + link['original_img'] + '">' +
                            '<div class="chat_goods_name"> ' + link['goods_name'] + '</div>' +
                            '<div style="color: #c4182e">￥' + link['shop_price'] + '</div>' +
                            '</div>' +
                            '</div>' +
                            '</a></div><img class="rad_50" src="' + QCLOUD + store_logo + '" alt="' + link['url'] + '"></div></div>';


                    } else {
                        msg += '<div class="stochat "><div class="answer"><img class="rad_50" src="' + head_pic + '" alt="' + link['url'] + '"><div class="inner goods_chat"><span class="chatsj"></span>' +
                            '<a class=" " target="_blank" href="'+link['url']+'"><div class="sto_goods">' +
                            '<div class="rel">' +
                            '<img class="chat_goods_img" src="' + QCLOUD + link['original_img'] + '">' +
                            '<div class="chat_goods_name"> ' + link['goods_name'] + '</div>' +
                            '<div style="color: #c4182e">￥' + link['shop_price'] + '</div>' +
                            '</div>' +
                            '</div></a>' +
                            '</div></div></div>';
                        //console.log(link['url']);
                    }
                } else if (data[i]['msg_type'] == 2) {
                    p = '<img class="litimg" onclick="bigimg1(this.src)"; style="max-width: 100%;max-height: 2.8rem" src="' + QCLOUD + data[i]['msg'] + '">';
                } else if (data[i]['msg_type'] == 1) {
                    p = replace_em(data[i]['msg']);
                }
                if (data[i]['chat_type'] == 0) {
                    if (data[i]['msg_type'] != 3) {
                        msg += '<div class="stochat "><div class="answer"><img class="rad_50" src="' + head_pic + '" alt=""><div class="inner"><span class="chatsj"></span>' + p + '</div></div></div>';
                    }
                }
                else {

                    if (data[i]['msg_type'] != 3) {
                        msg += '<div class="vipchat"><div class="answer"><div class="inner"><span class="chatsj"></span>' + p + '</div><img class="rad_50" src="' + QCLOUD + store_logo + '" alt=""></div></div>';
                    }

                }
            }

            $('.center').append(msg);
        }


    }

    //点击商品详情 隐藏信息
    function dis_this(e)
    {
        $(e).parent().parent().parent().css("display","none");
    }

    //删除左边的空格
    function ltrim(str) {
        return str.replace(/(^\s*)/g, "");
    }


    //发送商品进行对按钮改变
    function chagegoods(obj) {
        $(obj).text("商品发送成功");
    }

//    获得类型进行显示消息
    function get_msg(msg, type) {


        is_connect();
        if (type == 0) {
            msg = replace_em(msg);
            var p = '<div class="stochat"><div class="answer"><img class="rad_50" src="' + head_pic + '" alt=""><div class="inner"><span class="chatsj"></span>' + msg + '</div></div>';
        }
        if (type == 1) {
            var p = '<div class="stochat"><div class="answer"><img class="rad_50" src="' + head_pic + '" alt=""><div class="inner"><span class="chatsj"></span><img class="chatboximg" onclick="bigimg1(this.src)"; src="' + QCLOUD + msg + '" alt=""></div></div></div>'
        }
        if (type == 2) {
            var link = JSON.parse(msg);
            var p = '<div class="stochat"><div class="answer"><img class="rad_50" src="' + head_pic+ '" alt="' + link['goods_name'] + '"><div class="inner goods_chat"><span class="chatsj"></span>' +
                '<a class=" "  href="'+ link['url'] + '"><div class="sto_goods">' +
                '<div class="rel">' +
                '<img class="chat_goods_img" src="' + QCLOUD + link['original_img'] + '">' +
                '<div class="chat_goods_name"> ' + link['goods_name'] + '</div>' +
                '<div style="color: #c4182e">￥' + link['shop_price'] + '</div>' +
                '</div>' +
                '</div>' +
                '</a></div></div></div>';
        }
        $('.center').append(p);
        $('.center').scrollTop($('.center')[0].scrollHeight);
    }
    //判断当前是否连接成功
    function is_connect() {
//         var connect_type=socket.readyState;
//         if(connect_type!=1){
//             connectServer();
//         }
//            socket.onopen = function () {
//             socket.send('user_login:' + user_id);
//         };
    }
    //图片上传
    function call_back(url) {
        var data = {
            'url': '{:url("Mindex/save_msg")}',
            'msg': url,
            'msg_type':type,
            'chat_type':1,
            'is_read':1,
            'user_id':user_id,
            'admin_id':admin_id,
        };
        var r = ajax_return(data['url'], data, false, 'post', 2);
        if (r['code'] == 1) {
            send_msg(2, url);
        }
    }

    function str_msg(ee) {
        ee=ee.replace(/\s/g, "");
        var b=(ee.split('<br>')).length-1;
        for(var i=0;i<b;i++)
        {
            ee=ee.replace('<br>','');
        }
        var n=(ee.split('-webkit-user')).length-1;
        if(n>0)
        {
            for(var i=0;i<n;i++)
            {
                ee=ee.replace('style="width:24px;-webkit-touch-callout:none;-webkit-user-select:none;";=""','');
            }
        }
        var m=(ee.split('style="width:24px;";=""')).length-1;
        //     var n=(ee.split('http://localhost')).length-1;
        if (m>0) {
            for(var i=0;i<m;i++)
            {
                // ee=ee.replace('http://localhost', "");
                ee=ee.replace('style="width:24px;";=""', "");
            }
        }
        var reg = new RegExp('<imgsrc="/public/static/images/arclist/', "g");
        var reg1 = new RegExp('.png">', "g");
        ee = ee.replace(reg, "[em_");
        ee = ee.replace(reg1, "]");
        return ee;
    }

    //消息发送
    function send_msg(type, url) {
       // $(".trans").addClass("dn");
       // $(".adadad").css("height", "0");
        flag = 1;
        var url = url ? url : '';
        var msg = '';
        var p = '';

        //会员 stochat
        //商家  vipchat

        switch (type) {
            case 1:
                msg = str_msg($('#show_msg').html());
                break;
            case 2:
                msg = '<img class="litimg" onclick="bigimg1(this.src)";  style="max-width: 100%;max-height: 2.8rem" src="' + QCLOUD + url + '">';
                break;
            case 3:
                msg = JSON.stringify({
                    'original_img': ''+QCLOUD+url['original_img']+'',
                    'shop_price': ''+url['shop_price']+'',
                    'store_id': ''+url['store_id']+'',
                    'goods_id': ''+url['goods_id']+'',
                    'goods_name': ''+url['goods_name']+'',
                    'url': '/Mobile/Goods/goodsInfo/stoid/'+url['store_id']+'/id/'+url['goods_id']+'.html',
                    'touxiang': ''+store_logo+'',

                });
                break;
        }
        if (type == 3) {

            p = '<div class="vipchat"><div class="answer"><div class="inner goods_chat"><span class="chatsj"></span>' +
                '<a class=" "  href="/Mobile/Goods/goodsInfo/stoid/'+url['store_id']+'/id/'+url['goods_id']+'.html"><div class="sto_goods">' +
                '<div class="rel">' +
                '<img class="chat_goods_img" src="'+QCLOUD+url['original_img']+'">' +
                '<div class="chat_goods_name">'+url['goods_name']+'</div>' +
                '<div style="color: #c4182e">￥'+url['shop_price']+'</div>' +
                '</div>' +
                '</div>' +
                '</a></div><img class="rad_50" src="' + QCLOUD+store_logo + '" alt=""></div></div>';
        } else if (type == 2) {
            p = '<div class="vipchat"><div class="answer"><div class="inner"><span class="chatsj"></span>' + msg + '</div><img class="rad_50" src="' + QCLOUD+store_logo + '" alt=""></div></div>';
        } else {
            p = '<div class="vipchat"><div class="answer"><div class="inner"><span class="chatsj"></span>' + replace_em(msg) + '</div><img class="rad_50" src="' + QCLOUD+store_logo + '" alt=""></div></div>';
        }
        $('.center').append(p);
        $('.center').scrollTop($('.center')[0].scrollHeight);
        $('#saytext1').val("");
        $('#show_msg').empty();
        if (msg != '') {
            if (type == 2) {
                msg='<img width="300px"; src="'+QCLOUD+url+'" alt="" onclick="cli_img_big(this.src,this);"/>';
            }


            var admin_id='{$admin_id}';
            // 提交聊天数据
            var data = {
                'url': '{:url("Mindex/save_msg")}',
                'msg':msg,
                'msg_type':type,
                'chat_type':1,
                'is_read':1,
                'user_id':user_id,
                'admin_id':admin_id,
            };
            ajax_return(data['url'], data, true,'post',2);
            //发送消息给workerman
            sends(msg);
        }

    }


    //发送消息到workerman
    function sends(getMsg) {

        var getMsg = getMsg ? getMsg : '';

        is_connect();

        socket.send('chat:<'+user_id+'>:'+getMsg);
       // socket.send(user);
    }

    //转换表情
    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 () {
        var cenh = $("body").height() - $(".stopro").outerHeight() - $(".chatfoot").outerHeight()-1;
        $(".center").css("height", cenh);
        /*qq表情*/
//        $('.emotion').qqFace({
//            assign: 'saytext1', //给输入框赋值
//            show_msg: 'show_msg', //给输入框赋值
//            path: '__PUBLIC__/static/images/arclist/'    //表情图片存放的路径
//        });
    })


    //发送图片
    function save_image() {

        return false;
        var ImgFile = DOM.files[0];
        var formData = new FormData();
        formData.append('imgfile', ImgFile);
        formData.append('stoid', '{$userinfo.store_id}');
        var ajax = new XMLHttpRequest();
        ajax.open("POST", "{:U('Mindex/save_image')}");
        ajax.send(formData);
        ajax.onreadystatechange = function () {
            // $('#center').append();
            if (ajax.readyState == 4) {
                if (ajax.status >= 200 && ajax.status < 300 || ajax.status == 304) {
                    var r = JSON.parse(ajax.responseText);
                    if (r['code'] == 1) {
                        send_msg(2, r['ypath']);
                        ajax_return("{:U('Mindex/del_image')}", {
                            'url': r['localpath']
                        }, true, 'post', 2);
                    }
                }
            }
        };
    }

    //安卓图片上传
    function android_upimg(imgurl) {


        var imgpath="{$imgpath}";
        imgpath=imgpath+imgurl+".jpg";

        send_msg(2, imgpath);
    }

    function imgChange(obj){

        $('#loading_gif').remove();
        $('.center').append('<div class="vipchat" id="loading_gif"><div class="answer"><div class="inner"><img src="__STATIC__/images/loading.gif" id="loading" alt=""><span class="chatsj"></span><img class="litimg" onclick="bigimg1(this.src)";style="max-width: 100%;max-height: 2.8rem" src=""></div><img class="rad_50" src="'+head_pic+'" alt=""></div></div>');
        $('.center').scrollTop($('.center')[0].scrollHeight);
        //上传图片

        var inputid = $(obj).attr("id");
        $.ajaxFileUpload({
            url: "{:U('Mindex/save_image')}",
            secureuri: false,
            fileElementId: inputid,
            dataType: 'json',
            complete: function () {
                $('#loading_gif').remove();
            },
            success: function (r) {
                $('#loading_gif').remove();
                if (r['code'] == 1) {
                    send_msg(2, r['ypath']);
                    ajax_return("{:U('Mindex/del_image')}", {
                        'url': r['localpath']
                    }, true, 'post', 2);
                }
                $('.center').scrollTop($('.center')[0].scrollHeight);
            },
            error: function (data, status, e) {
                layer.msg("");
            }

        });
    }

    function bigimg1(url) {
        $("#bigimg").attr("src", url);
        $(".bgtrans").removeClass("dn");
        $(".bgtrans").addClass("on");
    }


    //定时服务
    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);


    /*显示快捷回复*/
    function replys(e){

        var html='';


        $.ajax({
            type: 'post',
            url: "{:U('reply_list')}",
            data:{'admin_id':"{$admin_id}"},
            success: function (data) {
                if (data){
                    var p='';
                    p+=' <div class="textbox dn">';
                    p+='   <textarea placeholder="最多输入1000字"></textarea>';
                    p+=' </div>';

                    p+=' <div class="addbtn dn">';
                    p+='  <div class="add_ed" onclick="add_input();">关闭快捷回复</div>';
                    p+='  <div class="disib" onclick="sure_add(this);">确认添加</div>';
                    p+=' <div class="clear"></div>';
                    p+='   </div>';
                    for (var i = 0; i < data.length; i++) {

                     p+=' <Div id="relist_'+data[i]['id']+'"><div class="inputbox bzfont cut" onclick="add_msg(this);" style="cursor: pointer;" msgval="'+data[i]['msg']+'">'+data[i]['msg']+'</div>';
                     p+='<img src="/public/static/images/msg/del.png" onclick="del_reply(this);" alt="" class="delimg"  data_id="'+data[i]['id']+'"><div style="clear:both"></div> </Div>';
                    }


      p+='<div class="add" style="width: 100%;text-align:center;line-height:40px;font-size: 14px;" onclick="add_input();"><img class="mr10" src="/public/static/images/msg/addkjhf.png" alt=""><span class="addhtml">添加快捷回复</span></div>';

                    html=p;
                }

                layer.open({
                    type: 1
                   , title: [
                        '快捷回复列表',
                        'background-color: #e1e1e1; '
                    ]
                    ,content:html
                    ,anim: 'up'
                    ,style: 'width:95%;max-width:700px;'
                });

            }
        });


    }
    /*删除某个快捷回复*/
    function del_reply(e){
        var data_id = $(e).attr('data_id');
         $("#relist_"+data_id).remove();
        $.ajax({
            type: 'post',
            url: "{:U('del_reply')}",
            data:{'id':data_id},
        });
    }

    /*新增快捷语言*/
    function add_input(){
        $('.addbtn').toggleClass("dn");
        $('.textbox').toggleClass("dn");
        $('.add').toggleClass("dn");
        if ($(".addhtml").text()=="关闭添加快捷回复")
        {
            $(".addhtml").text("添加快捷回复");
        }
        else {
            $(".addhtml").text("关闭添加快捷回复");
        }

    }
    /*确认添加快捷框*/
    function sure_add(e)
    {

        $('.addbtn').toggleClass("dn");
        $('.textbox').toggleClass("dn");
        $('.add').toggleClass("dn");
        $(".addhtml").text("添加快捷回复");
        var val=$('.textbox').find('textarea').val();
        var admin_id ="{$admin_id}";
        var store_id ="{$store_id}";
        $.ajax({
            type: 'post',
            url: "{:U('add_reply')}",
            data:{'msg':val,'admin_id':admin_id,'store_id':store_id},
            success: function (data) {
                $('.textbox').find('textarea').val("");
                if(data['code']==1)
                {
                    var p='<div id="relist_'+data['id']+'"><div class="inputbox bzfont cut" onclick="add_msg(this);" style="cursor: pointer;" msgval="'+val+'">'+val+'</div>';
                    p+='<img src="/public/static/images/msg/del.png" onclick="del_reply(this);" alt="" class="delimg"  data_id="'+data['id']+'"><div style="clear:both"></div> </Div>';
                    $(e).parent().parent().prepend(p);
                }

            }
        });
    }


    /*点击快捷回复添加至聊天输入框*/
    function add_msg(e){

            var ee=document.getElementById("show_msg");
            a=ee.innerHTML;
            var msg=$(e).attr("msgval")
            ee.innerHTML=a+msg;
            layer.closeAll();
    }


    //防止键盘把当前输入框给挡住


</script>
</html>