@using Mini.Web.WebHelper;
@{
    ViewBag.Title = "Index";
    Layout = "~/Areas/Admin/Views/Shared/_content.cshtml";
}
<link href="~/Content/commes.css" rel="stylesheet" />
<div class="layui-fluid" style="padding-left:0px;padding-top:10px;">
    <div class="layui-card" id="topcard" style="width:100%;padding-top:10px;">
        <div class="layui-card-header layui-self-header">
            <div style="float:left;position:relative;">
                朋友圈
            </div>
            <div style="float:right;position:relative;">
                @*@Html.Action("ToolBarNew", "Control",
                    new {
                        tool= ViewBag.ToolBar as ToolBar,
                        otherToolBars = new Mini.Web.WebHelper.ToolBarNew[] {}
                    }
                    )*@
                @await Component.InvokeAsync("ToolBarNew", new { ToolBar = ViewBag.ToolBar as ToolBar, otherToolBars = new Mini.Web.WebHelper.ToolBarNew[] {
                new ToolBarNew(){ btnColor="", btnName="聊天记录" }
                } })
                @*<input class="layui-btn layui-btn-sm layui-btn-normal" data-method="update" type="reset" value="测试" />*@
                @*<input class="layui-btn layui-btn-sm layui-btn-ok" data-method="add" type="button" value="+新增" />
                    <input class="layui-btn layui-btn-sm layui-btn-normal" data-method="update" type="reset" value="修改" />
                    <input class="layui-btn layui-btn-sm layui-btn-reset" data-method="delete" type="reset" value="删除" />*@
            </div>
            <div class="hrclass" style="position:relative;float: left;"></div>
        </div>
        <div class="layui-card-body " id="contentBody">
            <form class="layui-form selftopwhere" id="myform">
                <div class="layui-form-item">
                    企业：
                    <div class="layui-inline">
                        @Html.DropDownList("corp", ViewBag.Select as List<SelectListItem>)
                    </div>
                    名称：
                    <div class="layui-inline">
                        <input type="text" style="width:130px;" name="name" required lay-verify="required" placeholder="ID/名称/号码/邮箱" autocomplete="off" class="layui-input">
                    </div>

                    <div class="layui-inline">
                        <input class="layui-btn layui-btn-sm layui-btn-ok" data-method="search" type="button" value="查询" /><input class="layui-btn layui-btn-sm layui-btn-reset" type="reset" value="清空" />
                    </div>
                </div>
            </form>
            <table class="layui-hide" id="tab_kefuzhuangtaiyi1" lay-filter="wochao"></table>
        </div>
    </div>

</div>
<!--确定宽度-->
<style type="text/css">
    /*<!--设置单元格行高-->*/
    .layui-table-cell {
        height: auto;
        line-height: 35px;
    }

    .bofang {
        float: right !important;
        z-index: 1000;
        position: absolute;
        width: 48px !important;
        height: 45px !important;
    }
</style>
<script>
    var table;
    $(function () {
    });
</script>
<script>
    var httpurl = "@Html.Raw(Mini.Common.Utility.GetSettingByKey("HHMessageFile"))";
    var innerhttp = "@Html.Raw(Mini.Common.Utility.GetSettingByKey("InnerFile"))";//内网获取json必须使用内网地址
    var nowlocation = window.location.href;
    if (nowlocation.indexOf("192.168.1.") > -1 || nowlocation.indexOf("192.168.11.") > -1 || nowlocation.indexOf("localhost") > -1) {//内网无疑
        httpurl = innerhttp;
    }
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#start' //指定元素
        });
        //执行一个laydate实例
        laydate.render({
            elem: '#end' //指定元素
        });
    });
    var selectRow = {};
    var winindex;
    var layer;
    var rowid;
    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
    layui.use('element', function () {
        var element = layui.element;
        element.on('tab(tonghuajiankong)', function (n) {
            $(".bodytable").addClass("hidden");
            $("#kefuzhuangtai" + (n.index + 1)).removeClass("hidden");
        });
        element.on('tab(maintab)', function (n) {
            if (n.index == 0)
                $("#bottomcard").removeClass("hidden");
            else
                $("#bottomcard").addClass("hidden");
        });
    });
    layui.use(['laypage', 'layer', 'table', 'laydate'], function () {
        var laydate = layui.laydate;
        layer = layui.layer;
        table = layui.table;
        table.render({
            id: 'listReload'//列表别名ID
            , elem: '#tab_kefuzhuangtaiyi1'
            , url: 'GetMomentHtmlList?weixincrmaccount=@Html.Raw(ViewBag.weixincrmaccount)'
            , method: 'POST'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , page: true
            , limit: 30
            , height: "full-160"
            //, size:"sm"
            , cols: [[
                { field: 'numbers', type: 'numbers' }
                , { field: 'corpname', title: '企业号' }
                , { field: 'creator', title: 'ID' }
                , {
                    field: 'exinfo', title: '头像', templet: function (d) {
                        return "<img src='" + d.exinfo + "' style='height:35px;width:35px;'/>";
                    }
                }
                , { field: 'uname', title: '名称' }
                , { field: 'text', title: '内容' }
                , {
                    field: 'ntype', title: '类型', templet: function (d) {
                        if (d.image != "[]" && d.image != "")
                            return "图片";
                        else if (d.video != "[]" && d.video != "")
                            return "视频";
                        else
                            return "文本";
                    }
                }

                //, { field: 'image', title: '图片' }
                //, { field: 'video', title: '视频' }
                , { field: 'create_time', title: '时间' }
                , {
                    field: 'visible_type', title: '谁可以看', templet: function (d) {
                        if (d.visible_type == 0) {
                            return "部分可见";
                        } else if (d.visible_type == 1) {
                            return "公开";
                        }
                    }
                }
                , { field: 'location', title: '地址' }
            ]], where: $("#myform").serializeFormJSON()
        });
        //监听行单击事件（单击事件为：rowDouble）
        table.on('row(wochao)', function (obj) {
            var data = obj.data;
            //console.log(data);
            //标注选中样式
            obj.tr.addClass('self-table-click').siblings().removeClass('self-table-click');
            selectRow = data;
        });


        var active = {
            other1: function () {
                console.log(selectRow);
                if (selectRow.userid == "undefined" || selectRow.moment_id == null) {
                    //layer.alert("请先选中一条记录！", { title: '提示' });
                    layer.msg("请先选中一条记录！", { icon: 7 });
                    return;
                }
                var width = 800;
                var height = $(window).height() * 0.9;
                var img = "";
                if (selectRow.image != "[]" && selectRow.image != "") {
                    var imgjson = jQuery.parseJSON(selectRow.image);
                    $(imgjson).each(function (bs, ax) {
                        var url = httpurl + "web_mediafile?corpid=" + selectRow.corpid + "&fname=" + ax.media_id;
                        img += '<figure>\
                        <a href="'+ url + '" target="_blank" data-size="800x1142">\
                            <img src="'+ url + '" />\
                        </a>\
                    </figure>';
                    });

                } else if (selectRow.video != "[]" && selectRow.video != "") {
                    var imgjson = jQuery.parseJSON(selectRow.video);
                    var url = httpurl + "web_mediafile?corpid=" + selectRow.corpid + "&fname=" + imgjson.media_id;
                    var videothumur = httpurl + "web_mediafile?corpid=" + selectRow.corpid + "&fname=" + imgjson.thumb_media_id;
                        img += '<figure>\
                        <a href="'+ url + '" target="_blank" data-size="800x1142">\
                            <img src="'+ videothumur + '"   ntype="videohumurl" onload="MoveBofang()"/>\
                            <img src="/images/bofang.png" class="bofang" />\
                        </a>\
                    </figure>';
                }
                var kejian = "";
                if (selectRow.visible_type == 0) {
                    kejian = '<div class="fx_address" style="margin-top: auto;">谁可以看：部分可见</div>';
                } else if (selectRow.visible_type == 1) {
                    kejian = '<div class="fx_address" style="margin-top: auto;">谁可以看：公开</div>';
                }

                var html ='<div class="container">\
        <!--用户头像-->\
        <div class="header">\
            <div><img src="'+ selectRow.exinfo +'" /></div>\
        </div>\
        <div class="right_con">\
            <div class="demo">\
                <!--用户名and发布时间-->\
                <div class="use">\
                    <div class="usename"><span>'+ selectRow.uname+'</span></div>\
                </div>\
                <!--分享的内容-->\
                <p class="fx_content">'+ selectRow.text +'</p>\
                <!--分享的图片-->\
                <div class="my-gallery">\
                    '+ img+'\
                </div>\
                <!--显示的位置-->\
                <div class="fx_address">'+ (selectRow.location ? selectRow.location+'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;':'') + selectRow.create_time +'</div>\
                '+kejian+'\
            </div>\
        </div>\
    </div>';
                layer.open({
                    type: 1 //此处以iframe举例
                    , title: '朋友圈详细'
                    , area: ['' + width + 'px', '' + height+'px']
                    , shade: 0
                    , maxmin: true
                    , content: '<div style="padding: 15px;">' + html + '</div>'
                    , btn: [ '关闭'] //只是为了演示
                    , yes: function () {
                        layer.closeAll();
                    }
                });
                //window.parent.ChildAddTab('朋友圈明细--' + selectRow.uname, '/Admin/HHuser/Message?userid=' + selectRow.moment_id + "&uname=" + encodeURIComponent(selectRow.uname) + "&corp=" + selectRow.corpid, "icon-detail");
            },
            update: function () {
                var width = 800;
                var height = $(window).height() * 0.9;
                winindex = layer.open({
                    type: 2,
                    content: '/Admin/Moment/Test',
                    title: '朋友圈详细',
                    area: ['' + width + 'px', '' + height + 'px']
                    , btn: ['关闭'] //只是为了演示
                    , yes: function () {
                        layer.closeAll();
                    }

                });
            },
            search: function () {
                //alert($("#myform").serialize());
                //console.log($("#myform").serialize());
                //console.log($("#myform").serializeFormJSON());
                var param = $("#myform").serializeFormJSON();
                table.reload('listReload', {

                    where: param
                });
            }
        };
        $('.layui-btn').on('click', function () {
            var othis = $(this), method = othis.data('method');
            console.log(method);
            active[method] ? active[method].call(this, othis) : '';

        });
    });
    function MoveBofang() {
        var mm = $('[ntype="videohumurl"]');
        console.log(mm);
        if (mm.length > 0) {
            var imgwidth = $(mm).width();
            var imgheight = $(mm).height();
            console.log(imgwidth);
            console.log(imgheight);
            $(".bofang").attr("style", "padding-left:" + (imgwidth / 2 - 24) + "px;padding-top:" + (imgheight / 2 - 22) + "px;");
        }
    }
    function Closed() {
        layer.close(winindex);
    }
    function TableReload() {
        table.reload('listReload', {

        });
    }

</script>
<script type="text/html" id="agentTpl">
    {{#  if(d.ISOUTERAGENT == '1'){ }}
    是
    {{#  } else if(d.ISOUTERAGENT == '0') { }}
    否

    {{#  } }}
</script>