@{
    ViewBag.Title = "微信聊天记录";
    Layout = "~/Areas/Admin/Views/Shared/_workLayout2.cshtml";
}
<link href="~/layui-v2.5.4/css/common.css" rel="stylesheet" />
<style type="text/css">
    .mycolor {
        color: red;
    }

    .displayLi {
        display: none;
    }

    .displayBody {
        display: none;
    }

    .redColor {
        color: red;
    }

    .divcontent {
        width: 230px;
    }
</style>
<style type="text/css">
    .headstyle {
        font-family: MicrosoftYaHei-Bold;
        font-size: 14px;
        color: #333333;
        /*font-weight: bold;*/
        padding: 12px 0 0 10px;
    }

    .layui-dl .toptitlechose a {
        font-weight: 500;
    }

    .menuleft {
        padding-left: 0px;
    }


    .mytree .layui-tree {
        margin-left: 0;
    }

    .mytree .layui-tree-set .layui-tree-txt {
        /*color: #333;*/
        color: black;
        font-size: 15px;
        font-weight: 400;
        font-family: "Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","PingFang SC","Microsoft YaHei","微软雅黑",SimSun,"宋体",Heiti,"黑体",sans-serif;
    }

    .mytree .layui-tree-lineExtend .layui-tree-txt {
        color: #666;
        font-size: 14px;
        font-weight: 400;
        font-family: "Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","PingFang SC","Microsoft YaHei","微软雅黑",SimSun,"宋体",Heiti,"黑体",sans-serif;
    }

    .mytree .layui-tree-entry {
        height: 30px;
        line-height: 30px;
    }

    .mytree .layui-tree-spread .layui-tree-iconArrow:after {
        border-width: 5px;
        border-style: solid;
        border-color: #999ca2 transparent transparent transparent;
        margin-top: 3px;
    }

    .mytree .layui-tree-lineExtend .layui-tree-set:hover {
        box-sizing: border-box;
        border-right: 3px red solid !important;
    }

        .mytree .layui-tree-lineExtend .layui-tree-set:hover .layui-tree-txt {
            color: black;
        }

    .treeClick {
        box-sizing: border-box;
        border-right: 3px red solid !important;
    }

        .treeClick .layui-tree-txt {
            color: black !important;
        }
    /*.mytree .layui-tree-lineExtend .layui-tree-iconClick {
            margin: 0 5px;
        }*/
    .mytree .layui-tree-txt {
        width: 180px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mysort {
        background: url(/image/sort.png) no-repeat center;
        width: 22px;
        height: 22px;
        font-size: 22px;
        background-size: 100%;
        cursor: pointer;
    }

    .mydorp .layui-form-select dl {
        left: -120px;
        top: 35px;
    }

    .mydrp li {
        padding: 5px 10px 5px 10px;
    }

    .mydrp .choose {
        color: red;
    }

    .mydrp li:hover {
        background-color: #eaf2ff;
        border: 1px solid #d2d2d2;
        border-radius: 2px;
    }
</style>
@{
    //List<object> rcontact1 = new List<object>();
    List<object> rcontact2 = new List<object>();
    List<object> rcontact3 = new List<object>();
    List<object> rcontact4 = new List<object>();
    //List<Wx_WorkGroupRcontact> groupList = ViewBag.grouplist as List<Wx_WorkGroupRcontact>;
    string isShowGroupMsg = ViewBag.isShowGroupMessage as string;
    foreach (Mini.Model.ViewModel.WX_WorkRCONTACT rcontact in ViewBag.rcontactList as List<Mini.Model.ViewModel.WX_WorkRCONTACT>)
    {
        if (rcontact.USERNAME.StartsWith("fake_") || rcontact.USERNAME == "filehelper" || rcontact.NICKNAME == "微信团队")
        {
            continue;
        }
        string txt = Mini.Web.WebHelper.WxMessageHandler.GetRcontactNickName(rcontact);
        string title = "昵     称：" + rcontact.NICKNAME;
        title += "\n用 户 名：" + rcontact.USERNAME;
        title += "\n备     注：" + rcontact.CONREMARK;
        title += "\n" + "最近聊天：" + (rcontact.LASTCHARTIME == 0 ? "" : Mini.Common.DateTimeTool.GetTimeFromLinuxTime(Convert.ToInt64(rcontact.LASTCHARTIME)).ToString("yyyy-MM-dd"));
        if (rcontact.isblacklist == 1)
        {

            rcontact4.Add(new { title = txt, id = rcontact.PKID, username = rcontact.USERNAME, txt = title });
        }
        else if (!string.IsNullOrEmpty(rcontact.WUSERNAME) || !string.IsNullOrEmpty(rcontact.NUSERNAME) || rcontact.NICKNAME.IndexOf("懂牛") > -1 || rcontact.NICKNAME.IndexOf("千本嘉") > -1 || rcontact.NICKNAME.IndexOf("东方高圣") > -1)
        {
            rcontact3.Add(new { title = txt, id = rcontact.PKID, username = rcontact.USERNAME, txt = title });
        }
        //else if (!string.IsNullOrEmpty(rcontact.FUSERNAME))
        //{
        //    //rcontact1.Add(rcontact);
        //    rcontact1.Add(new { title = txt, id = rcontact.PKID, username = rcontact.USERNAME, txt = title });
        //}
        else
        {
            //rcontact2.Add(rcontact);
            rcontact2.Add(new { title = txt, id = rcontact.PKID, username = rcontact.USERNAME, txt = title });
        }
    }

    var obj = new List<object>
{
//new { title = "被加  ("+rcontact1.Count+"人)", id = 1,children=rcontact1 },
new { title = "好友  ("+rcontact2.Count+"人)", id = -2,children=rcontact2 },
new { title = "拉黑/删除  ("+rcontact4.Count+"人)", id = -3,children=rcontact4 },
new { title = "同事  ("+rcontact3.Count+"人)", id = -4,children=rcontact3 }
};
    if (isShowGroupMsg == "true")
    {
        List<object> grouplist = new List<object>() { };
        List<Mini.Model.ViewModel.Wx_WorkGroupRcontact> groupList = ViewBag.grouplist as List<Mini.Model.ViewModel.Wx_WorkGroupRcontact>;
        foreach (var group in groupList)
        {
            if (group.chatRoomName.StartsWith("fake_") || group.chatRoomName == "filehelper" || group.chatRoomName == "微信团队")
            {
                continue;
            }
            string txt = string.IsNullOrEmpty(group.groupName) ? group.shortName : group.groupName;
            string title = "群 名 称：" + group.groupName;
            title += "\n群号：" + group.chatRoomName;
            title += "\n备注：" + group.shortName;
            title += "\n" + "最近聊天：" + (group.LASTCHARTIME == 0 ? "" : Mini.Common.DateTimeTool.GetTimeFromLinuxTime(Convert.ToInt64(group.LASTCHARTIME)).ToString("yyyy-MM-dd"));
            grouplist.Add(new { title = txt, id = group.chatRoomName, username = group.chatRoomName, txt = title });
        }
        obj.Add(new { title = "微信群  (" + grouplist.Count + "个)", id = -5, children = grouplist });
    }
}
<script>
    var leftmenudata =@Html.Raw(Mini.Web.WebHelper.JsonHelper.ObjDivertToJson(obj));
    var tree;
    //console.log(leftmenudata);
    $(function () {
        $(".downpanel").on("click", ".layui-select-title", function (e) {
            $(".layui-form-select").not($(this).parents(".layui-form-select")).removeClass("layui-form-selected");
            $(this).parents(".downpanel").toggleClass("layui-form-selected");
            layui.stope(e);
        }).on("click", "dl i", function (e) {
            layui.stope(e);
        });

        $("#slt_showr").change(function () {
            ShowLeftMenu();
        });
    });

    //JavaScript代码区域
    layui.use(['element', 'form', 'tree', 'layedit', 'laydate'], function () {
        tree = layui.tree;
        var element = layui.element;
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate;


        ShowLeftMenu();//显示左边好友菜单
        var rcontactval=$(".mydrp .choose").attr("value");
        $("#classtree li").click(function () {
            var nowvalue=$(this).attr("value");
            if (rcontactval != nowvalue) {
                var workusername = "@Html.Raw(ViewBag.workusername)";
                var columnsort = nowvalue;
                var column = "";
                var sort = "";
                if (columnsort !== "") {
                    var columnsortArr = columnsort.split('_');
                    column = columnsortArr[0];
                    sort = columnsortArr[1];
                }
                window.location.href = "MyMessage?weixincrmaccount=@Html.Raw(ViewBag.weixincrmaccount)&workusername=" + workusername + "&column=" + column + "&sort=" + sort;
            }
        });
        $("#btnSearch").click(function () {
            var txt = $("#findTxt").val();
            if (txt == "") {
                $(".displayLi").each(function (i, n) {
                    $(this).removeClass("displayLi");
                });
                $(".addclass").remove();
                return;
            } else {
                $("#test13 .layui-tree-set[title]").addClass("displayLi");
            }
            $(leftmenudata).each(function (aindex, adata) {
                $(adata.children).each(function (bindex, bdata) {
                    if (bdata.title.indexOf(txt) > -1) {
                        var aphtml = '<div data-id="' + bdata.id + '" class="layui-tree-set addclass" title="' + bdata.txt + '" username="' + bdata.username +'" nickname="' + bdata.title +'">'+
                            '<div class="layui-tree-entry" >'+
                            '<div class="layui-tree-main">'+
                            '<span class="layui-tree-iconClick" > '+
                            '<i class="layui-tree-iconArrow layui-hide" ></i > '+
                                '</span > '+
                            '<span class="layui-tree-txt">' + bdata.title.replace(txt, "<b ntitle=\"" + txt + "\" class=\"redColor\">" + txt + "</b>"); +'</span></div></div ></div > ';
                        $("[data-id='" + adata.id + "'] .layui-tree-pack").append(aphtml);
                    }
                });
            });
            $(".addclass").click(function (a) {
                $(".treeClick").removeClass("treeClick");
                $(this).addClass("treeClick");
                ShowMessage($(this).attr("username"), $(this).attr("nickname"));
            });
            //$("#test13 .layui-tree-set[title] .layui-tree-txt").each(function (as, ba) {
            //    //console.log(ba);
            //    var html = $(ba).html();
            //    html = html.replace(txt, "<b ntitle=\"" + txt + "\" class=\"redColor\">" + txt + "</b>");
            //    $(ba).html(html);
            //    if (html.indexOf("redColor") == -1) {
            //        $(this).parent().parent().parent().addClass("displayLi");
            //    }
            //});

        });
    });
    var isAeadl = false;
    function ShowLeftMenu() {
        var mdata = [];
        var showvalue = $("#slt_showr").val();
        if (showvalue == "200") {
            $(leftmenudata).each(function (aindex, adata) {
                var lidata = {
                    title: adata.title, id: adata.id, children: []
                };
                if (adata.id == -2 && adata.children.length > 80) {//普通好友默认显示80人
                    lidata.title = "好友  (80/" + adata.children.length + "人)";
                    $(adata.children).each(function (bindex, bdata) {
                        if (bindex < 80) {
                            lidata.children[bindex] = bdata;
                        } else {
                            return false;
                        }
                    });
                } else if (adata.id == -3 && adata.children.length > 20) {//普通好友默认显示20人
                    lidata.title = "拉黑/删除  (20/" + adata.children.length + "人)";
                    $(adata.children).each(function (bindex, bdata) {
                        if (bindex < 20) {
                            lidata.children[bindex] = bdata;
                        } else {
                            return false;
                        }
                    });
                } else if (adata.id == -4 && adata.children.length > 20) {//同事好友默认显示20人
                    lidata.title = "同事  (20/" + adata.children.length + "人)";
                    $(adata.children).each(function (bindex, bdata) {
                        if (bindex < 20) {
                            lidata.children[bindex] = bdata;
                        } else {
                            return false;
                        }
                    });
                } else if (adata.id == -4 && adata.children.length > 10) {//微信群默认显示10个
                    lidata.title = "微信群   (10/" + adata.children.length + "个)";
                    $(adata.children).each(function (bindex, bdata) {
                        if (bindex < 20) {
                            lidata.children[bindex] = bdata;
                        } else {
                            return false;
                        }
                    });
                } else {//
                    lidata = adata;//数据量
                }
                mdata[aindex] = lidata;//数据量
            });
        } else {
            mdata = leftmenudata;
        }
        if (isAeadl == false) {
            isAeadl = true;
            tree.render({
                  id: 'TreeDemoId' //定义索引
                ,elem: '#test13'
                , data: mdata
                , showLine: false  //是否开启连接线
                , accordion: false
                , click: function (obj) {
                    if (obj.data.id < 0) {

                    } else {
                        $(".treeClick").removeClass("treeClick");
                        $(obj.elem).addClass("treeClick");
                        ShowMessage(obj.data.username, obj.data.title);

                    }
                }

            });
        } else {
            tree.reload('TreeDemoId', {
                data: mdata
            });
        }
        $(leftmenudata).each(function (ax, asd) {
            $(asd.children).each(function (a, b) {
                $("[data-id='" + b.id + "']").attr("title", b.txt).attr("username", b.username).attr("nickname", b.title);
            });
        });

    }

    function ShowMessage(username,nickname) {
        $("#myframe").attr("src", "MessageDetial?weixincrmaccount=@Html.Raw(ViewBag.weixincrmaccount)&type=MessageList&workusername=@Html.Raw(ViewBag.workusername)&workAccountName=@Html.Raw(ViewBag.workAccountName)&username=" + username + "&nickname=" + nickname);
    }
</script>

@section leftmenu{

    <div class="headstyle">
        <form class="layui-form" action="">
            <div class="layui-form-item">
                <div class="layui-inline" style="margin-right:0px;">
                    <div class="layui-input-inline" style="width:130px;vertical-align: middle;margin-right: 5px;">
                        <input type="text" class="layui-input" id="findTxt" style="height:32px;" value="" placeholder="用户名昵称">
                    </div>
                    <div class="layui-input-inline" style="width:50px;margin-right: 0px;">
                        <input type="button" class="layui-btn layui-btn-sm layui-btn-ok" lay-filter="btnSearch" id="btnSearch" value="查找" />
                    </div>
                    <div class="layui-input-inline mydorp" style="width:20px;">
                        <div class="layui-unselect layui-form-select downpanel">
                            <div class="layui-select-title">
                                <i class="self_icon mysort" title="排序"></i>
                            </div>
                            <dl class="layui-anim layui-anim-upbit">
                                <dd style="padding:0px;">
                                    @{
                                        string myvalue = ViewBag.column;
                                        string sort = ViewBag.sort;
                                        string allstr = string.Format("{0}_{1}", myvalue, sort);
                                    }
                                    <ul id="classtree" class="mydrp">
                                        <li value="ctime_asc" class="@Html.Raw(allstr=="ctime_asc"?"choose":"")">客户添加时间倒序↓</li>
                                        <li value="ctime_desc" class="@Html.Raw(allstr=="ctime_desc"?"choose":"")">客户添加时间顺序↑</li>
                                        <li value="lastchattime_asc" class="@Html.Raw(allstr=="lastchattime_asc"?"choose":"")">最后聊天时间倒序↓</li>
                                        <li value="lastchattime_desc" class="@Html.Raw(allstr=="lastchattime_desc"?"choose":"")">最后聊天时间顺序↑</li>
                                    </ul>
                                </dd>
                            </dl>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <hr class="menuhr" style="margin-top:0px;" />
    <div class="layui-side-scroll myscrolcss" style="width:100%;height:calc(100% - 125px);overflow-y:auto;">
        <div id="test13" class="demo-tree-more mytree" style="width:227px;position: absolute;"></div>
    </div>
    <div style="margin-bottom:0;border-top: 1px solid #dad5d5;">
        <div style="margin:10px;">
            显示<select id="slt_showr" style="margin-top:5px;">
                <option value="200" title="
显示数量分别是
好友：80
拉黑：20
同事：20
微信群：10">
                    部分好友
                </option>
                <option value="-1" title="将显示所有好友">全部好友</option>
            </select>
        </div>
    </div>
}
@section rightcontent{
    <iframe id="myframe" frameborder="0" scrolling="no" src="MessageDetial?weixincrmaccount=@Html.Raw(ViewBag.weixincrmaccount)&workusername=@Html.Raw(ViewBag.workusername)&workAccountName=@Html.Raw(ViewBag.workAccountName)" style="width:100%;height:100%;" />
}