@using WX.CRM.WebHelper;
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_content.cshtml";
}
<script src="/Scripts/jquery.easyui.min.js" type="text/javascript"></script>
<link href="/Content/themes/blue/easyui.css" rel="stylesheet" />
<link href="/Content/Site.css" rel="stylesheet" />
<script src="/Scripts/common.js"></script>
<link href="/Content/data_grid_list.css" rel="stylesheet" />
<script src="/Scripts/op/jquery.rewrite.js"></script>
<style type="text/css">
    .xm-option {
        line-height: 30px;
    }

    .layui-btn-red {
        background: #FF4D4D;
    }

    .keyword {
        color: #ff6a00 !important;
    }
</style>
<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 ToolBarNew[] {
               new ToolBarNew(){ btnColor="", btnName="人工标记" },
               new ToolBarNew(){ btnColor="", btnName="修改状态" },
               new ToolBarNew(){ btnColor="", btnName="批量分配员工" },
               new ToolBarNew(){ btnColor="", btnName="导出" }
              }

           })
            </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" style="width:300px">
            <div id="deptid"></div>
        </div>*@
                    <div class="layui-inline" style="width:500px">
                        @Html.Action("UserSSOComBox", "Control", new { currentRight = WX.CRM.WebHelper.InitRights.CONST_风险客户列表 })
                    </div>
                    客户编号：
                    <div class="layui-inline" style="width:150px;">
                        <input type="text" name="ResId" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                    客户姓名：
                    <div class="layui-inline" style="width:120px;">
                        <input type="text" name="UName" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                    潜在投诉内容：
                    <div class="layui-inline">
                        <input class="layui-input" name="Content" id="content" autocomplete="off">
                    </div>
                    来源：
                    <div class="layui-inline">
                        <select name="Source" style="height:35px;">
                            <option value="">全部</option>
                            <option value="1">官网</option>
                            <option value="2">公众号投诉</option>
                            <option value="3">企微客服名片投诉</option>
                            <option value="4">PC软件</option>
                            <option value="5">企微聊天记录</option>
                            <option value="6">合规提交</option>
                            <option value="7">业务人员提交</option>
                            <option value="8">软件app</option>
                            <option value="9">标为水军</option>
                        </select>
                    </div>
                    标记类型：
                    <div class="layui-inline" style="width:150px;">
                        <select name="SignWay" style="height:35px;">
                            <option value="">全部</option>
                            <option value="1">人工标记-标记水军</option>
                            <option value="2">系统标记-违规关键词</option>
                            <option value="3">客户投诉-投诉链接</option>
                        </select>
                        <input name="SignType" type="hidden" value="" />
                    </div>
                    状态：
                    <div class="layui-inline">
                        <select name="Status" style="height:35px;">
                            <option value="">全部</option>
                            <option value="0">待跟进</option>
                            <option value="1">跟进中</option>
                            <option value="2">已完结</option>
                            <option value="-1">待跟进(已超时)</option>
                        </select>
                    </div>
                    成交状态：
                    <div class="layui-inline">
                        <select name="HasOrder" style="height:35px;">
                            <option value="">全部</option>
                            <option value="false">未成交</option>
                            <option value="true">已成交</option>
                        </select>
                    </div>
                    分配状态：
                    <div class="layui-inline">
                        <select name="HasAssign" style="height:35px;">
                            <option value="">全部</option>
                            <option value="false">未分配</option>
                            <option value="true">已分配</option>
                        </select>
                    </div>
                    标记时间：
                    <div class="layui-inline">
                        <input class="layui-input" placeholder="开始日" name="STime" id="start" style="width:120px;" autocomplete="off">
                    </div>
                    <div class="layui-inline">
                        <input class="layui-input" placeholder="截止日" name="ETime" id="end" style="width:120px;" autocomplete="off">
                    </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" id="reset" type="button" value="清空" />
                        <input class="layui-btn layui-btn-sm layui-btn-reset" style="display:none" id="onreset" type="reset" value="" />
                    </div>
                </div>
            </form>
            <table class="layui-hide" id="tabl1" lay-filter="tabl1"></table>
            <iframe id="BillOpen" width="0" height="0" scrolling="no" frameborder="0" style="display:none;"></iframe>
        </div>
    </div>
</div>

<div id="fpUser" style="display: none;">
    <div style="padding:15%;display:flex;">
        <div class="layui-inline" style="width:150px;">
            <input type="text" id="fpeid" placeholder="请输入员工编号" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-inline" style="margin-left:10px;">
            <input type="button" value="确认" id="fp-subBtn" class="layui-btn layui-btn-sm layui-btn-normal" />
        </div>
    </div>
</div>

<div id="modalwindow" class="easyui-window" data-options="modal:true,closed:true,minimizable:false,shadow:false"></div>

<!--确定宽度-->
<script>
    var apiPath = '@ViewBag.apiPath';
    var appid = '@ViewBag.Appid';
    var selectRow = {};
    var checkRows = [];
    var table;
    var winindex;
    var tableCols;
   var optionsChannel = {
        el: '#deptid',
        name: 'deptid',//表单的name属性
        layVerify: '',
        tips: '请选择事业部',
        toolbar: {//工具条,全选,清空,反选,自定义
            show: true,
            list: [
                'CLEAR'
            ]
        },
        data: []
    };
    var selectChannel = xmSelect.render(optionsChannel);
    var allChannel = @Html.Raw(ViewBag.AllChannel);
    selectChannel.update({ data: allChannel });
    var allDept = "";
    if (allChannel != '') {
        for (var i = 0; i < allChannel.length; i++) {
            allDept += allChannel[i].value + ","
        }
        allDept = allDept.substring(0, allDept.length-1);
    }
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({ elem: '#start' });
        //执行一个laydate实例
        laydate.render({ elem: '#end' });
    });
    layui.use(['table', 'form','layer'], function () {
        table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        var param2 = GetParams("mytoolbar");
        tableCols = [[
            { type: 'checkbox', fixed: 'left', align: 'left', unresize: true, width: 50, },

            {
                field: 'deptName', fixed: 'left', title: '事业部', width: 120
            }
            , {
                field: 'umid', title: '客户ID', width: 180, fixed: 'left', templet: function (res) {
                    if (res.resId != '' && res.resId != null) {
                        var url = "Csvr/CustomerInfo/CustomerDetail?hgCustomer=1&isFromHg=1&isFromComplaint=1&resid=" + res.umid + "&name=" + encodeURIComponent(res.uname);
                        var title = "客户明细";
                        if (res.CNAME) {
                            title = res.CNAME + "--客户明细";
                        }
                        return "<a href=\"javascript:void(0)\" style=\"color:blue\" onclick=\"parent.ChildAddTab('" + title + "','" + url + "')\">" + res.umid + "</a>";
                    } else {
                        return ""
                    }
                }
            },
            {
                field: 'belongEname', fixed: 'left', title: '跟进员工', width: 100
            }
            , { field: 'uname', title: '客户姓名', width: 100 }
            , { field: 'signWayStr', title: '标记方式', width: 100 }
            , { field: 'signTypeStr', title: '标记类型', width: 120 }
            , { field: 'sourceStr', title: '来源', width: 120 }
            , {
                field: 'content', title: '潜在投诉内容', width: 220, templet: function (res) {

                    if (res.keywords != null && res.keywords != '') {
                        var kw = res.keywords.split(';');
                        $.each(kw, function (i, e) {
                            res.content = res.content.replace(e, "<span class='keyword'>" + e + "</span>");
                        });
                    }
                    return res.content;
                }
            }
            , { field: 'ctime', title: '标记时间', width: 180 }
            , {
                field: 'statusStr', title: '状态ID', width: 100, templet: function (res) {
                    if (res.statusStr == "待跟进") {
                        return "<span style='color:orange'>" + res.statusStr + "</span>"
                    } else if (res.statusStr == "跟进中") {
                        return "<span style='color:yellow'>" + res.statusStr + "</span>"
                    } else if (res.statusStr == "已完结") {
                        return "<span style='color:blue'>" + res.statusStr + "</span>"
                    } else {
                        return "<span style='color:red'>" + res.statusStr + "</span>"
                    }
                    return res.statusStr;

                }
            }
            , { field: 'countDown', title: '倒计时', width: 150 }
            , { field: 'followContent', title: '跟进工单内容', width: 220 }
            , { field: 'followTime', title: '跟进时间', width: 180 }
            , { field: 'eName', title: '跟进人', width: 100 }
            , { field: 'clue', title: '销售线索', templet: '#clueTpl', fixed: 'right', width: 88 }
            , { field: 'orderlist', title: '订单情况', fixed: 'right', templet: '#orderTpl', width: 88 }
            , { field: 'other', templet: '#other', fixed: 'right', title: '详情', width: 60 }
        ]];

        table.render({
            id: 'testReload',//列表别名ID
            elem: '#tabl1',//表ID
            url: apiPath +'/Complaint/page',
            method: 'Get',
            headers: { appid },
            request: {
                pageName: 'PageIndex' //页码的参数名称，默认：page
                ,limitName: 'PageSize' //每页数据量的参数名，默认：limit
            },
            response: {
                statusName: 'code' //规定数据状态的字段名称，默认：code
                , statusCode: 0 //规定成功的状态码，默认：0
                , msgName: 'message' //规定状态信息的字段名称，默认：msg
            },
            parseData: function (res) { //res 即为原始返回的数据
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.message, //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": res.data.data //解析数据列表
                };
            },
            cols: tableCols
            , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip', 'refresh'] //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                , groups: 5 //只显示 1 个连续页码

            }
            , where: param2
        });

        $('#mytoolbar #search').on('click', function (data) {
            var param = GetParams("mytoolbar");
            table.reload('testReload', {
                page: {
                    curr: 1 //重新从第 1 页开始
                },
                where: param
            });
        });
        $('#reset').on('click', function () {
            document.getElementById("onreset").click();
            clear();
        });
        //清空
        $("#clear").on('click', function (e) {
            selectChannel.reset();
            allChannel.forEach(function (item) {
                item.selected = false;
            })
            selectChannel = xmSelect.render(optionsChannel);
            selectChannel.update({ data: allChannel });
            $("#mytoolbar input[type='text']").val("");
            $("#mytoolbar select").val("");
            form.render("select");
        });
        //监听行单击事件
        table.on('row(tabl1)', function (obj) {
            var data = obj.data;
            //console.log(data);
            //标注选中样式
            obj.tr.addClass('self-table-click').siblings().removeClass('self-table-click');
            //console.log(obj);
            selectRow = data;
            //复选框
        });

        //点击事件
        var active = {
            //标记客户
            other1: function () {
                layer.open({
                    title: '人工标记',
                    type: 2,
                    content: '/HgComplaint/Add',
                    area: ['850px', '600px']
                });
            },
            //修改状态
            other2: function () {
                if (selectRow.id === "undefined" || selectRow.id == null) {
                    layer.alert("请先选中一条记录！", { title: '提示' });
                    return;
                }
                winindex = layer.open({
                    title: '修改状态',
                    type: 2,
                    content: '/HgComplaint/ChangeStatus?udid=' + selectRow.id,
                    area: ['600px', '400px']
                });
            },//修改状态
            other3: function () {
                var checkrows = layui.table.checkStatus('testReload').data;
                console.log(checkrows);
                if (checkrows.length==0 || checkrows == null) {
                    layer.alert("请先选中一条记录！", { title: '提示' });
                    return;
                }
                winindex = layer.open({
                    title: '批量分配员工',
                    type: 1,
                    content: $('#fpUser'),
                    area: ['300px', '200px']
                });
            },//导出
            other4: function () {
                var param = $("#myform").serializeFormJSON();
                console.log("param===");
                console.log(param);

                var queryString = "";
                for (var key in param) {
                    if (queryString != "") queryString += "&";
                    queryString += key + "=" + encodeURIComponent(param[key]);
                }
                console.log("queryString===");
                console.log(queryString);

                $("#modalwindow").html(GetIframeHtml("/Control/ExcelExport?Query=" + encodeURIComponent("/HgComplaint/Export?" + queryString)));
                $("#modalwindow").window({ title: '导出', width: 480, height: 300, iconCls: 'icon-export' }).window('open');
            }

            , search: function () {
                TableReload();
            }, reset: function () {
                $("#deptid").val("");
                selectChannel.reset();
                allChannel.forEach(function (item) {
                    item.selected = false;
                })
                selectChannel = xmSelect.render(optionsChannel);
                selectChannel.update({ data: allChannel });
            }
        };
        $('.layui-btn').on('click', function () {

            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });
        //批量绑定员工
        $("#fp-subBtn").click(function () {
            var fpeid = $("#fpeid").val();
            if (fpeid == "") {
                layer.msg("请输入员工工号");
                return false;
            }
            var checkrows = layui.table.checkStatus('testReload').data;
            var ids = [];
            $.each(checkrows, function (i, e) {
                ids.push(e.id);
            });
            var data = {
                ids,
                eid: fpeid
            };
            console.log(data);
            $.ajax({
                type: "Post",
                url: apiPath + '/Complaint/BatchAssign',
                data: JSON.stringify(data),
                dataType: "json",
                contentType: "application/json",
                headers: { appid },
                success: function (msg) {
                    console.log(msg);
                    if (msg.code == 0) {
                        layer.msg("操作成功！");
                        TableReload();
                    }
                    else {
                        layer.msg(msg.message);
                    }
                },
                error: function () {
                    layer.msg('创建失败！', { icon: 2 });
                }
            });

        });
    });
   function GetParams() {
       var paraJson = $("#myform").serializeFormJSON();
       if (paraJson.deptid == '') {
           paraJson.deptid = allDept
       }
       return paraJson;
    }
    function TableReload() {
        layer.close(winindex);
        var param = GetParams("mytoolbar");
        param.SignType = param.SignWay === '1' ? '4' : param.SignWay;
        console.log(param);
        table.reload('testReload', {
            page: {
                curr: Number($(".layui-laypage-em").next().html())//的前页面
            },
            where: param
        });
    }
    function show(resid) {
        var url = "WeiXin/JZOrder/OrderList?resid=" + resid;

        parent.ChildAddTab("订单列表", url);
    }
    function showInfo(id) {
        layui.use('layer', function () {
            var layer = layui.layer;
            layer.open({
                title: '查看情况',
                type: 2,
                content: '/HgComplaint/ComplaintInfo?complaintLogId=' + id,
                area: ['80%', '80%']
            });
        });
    }
    function showClue(appid, appuserid) {
        $.r_ajax({
            url: "/Csvr/CustomerUC/GetSalesLeadUrl",
            type: "Post",
            data: { appid: appid, appuserid: appuserid },
            dataType: "json",
            loading: true,
            success: function (rep) {
                if (rep.result) {
                    if (rep.retmsg != null && rep.retmsg.length > 0) {
                        layui.use('layer', function () {
                            var layer = layui.layer;
                            layer.open({
                                title: '销售线索',
                                type: 2,
                                content: rep.retmsg,
                                area: ['450px', '80%']
                            });
                        });
                    }
                }
                else {
                    alert("失败了！");
                }
            }
        });

    }

    function onLoadSucced() {
    }

    function GetIframeHtml(src) {
        return "<iframe width='100%' height='98%' scrolling='no' frameborder='0'' src='" + src + "'></iframe>";
    }

     function getDataGridHeader() {
         var newcolumns = [];
         var columns = tableCols[0];
         for (var i = 0; i < columns.length; i++) {
             if (columns[i].type != "checkbox" && columns[i].field != "clue" && columns[i].field != "orderlist" && columns[i].field != "other") {
                 newcolumns.push(columns[i])
             };
         }
         return newcolumns;
    }
</script>
<script type="text/html" id="orderTpl">
    {{# if(d.resId != null && d.resId !='' && d.hasOrder != null && d.hasOrder == true){ }}
    <a href="javascript:void(0)" onclick="show('{{d.resId}}')" style="color:blue">查看订单</a>
    {{# } }}
</script>
<script type="text/html" id="clueTpl">
    {{# if(d.appuserid != null && d.appuserid !=''&& d.appid!=''&& d.appid!=null){ }}
    <a href="javascript:void(0)" onclick="showClue('{{d.appid}}','{{d.appuserid}}')" style="color:blue">查看</a>
    {{# } }}
</script>

<script type="text/html" id="other">
    <a href="javascript:void(0)" onclick="showInfo('{{d.id}}')" style="color:blue">查看</a>
</script>