@using CRM.Core.Model.Entity
@using Core.Web.WebHelper
@using CRM.Core.BLL.Util
@{
    /**/

    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<style>
    .self-table-click td {
        background-color: #f3ebbc;
    }

    .showMsg {
        margin-left: 20px;
        cursor: pointer;
    }

    .hidden {
        display: none;
    }

    .layui-table-cell {
        height: auto !important;
        font-size: 14px;
        padding: 0 5px;
        overflow: visible;
        text-overflow: inherit;
        white-space: normal;
        word-break: break-all;
    }
</style>
<div class="x-body">
    <div class="layui-btn-group" style="padding-bottom:10px;">
        @Html.Action("ToolBar", "Home",
         new
         {
             area = "",
             rightcode = (ViewBag.rightCode as string),
             otherToolBars = new ToolBar[]
             {
                    new  Core.Web.WebHelper.ToolBar(ToolBarConfig.CONST_Add, "添加", " " ,"",true),
                    new  Core.Web.WebHelper.ToolBar(ToolBarConfig.CONST_Details, "查看", " " ,"",true),
                    new  Core.Web.WebHelper.ToolBar(ToolBarConfig.CONST_Edit, "编辑", "" ,"",true),
                    new  Core.Web.WebHelper.ToolBar(ToolBarConfig.CONST_Export, "导出", " " ,"",true)

             }
         })
    </div>
    <form id="mytoolbar">
        事业部：
        <div class="layui-inline">
            <select name="txt_deptid" style="height:35px;">
                <option value="">全部</option>
                @{
                    var list = ViewBag.companyList as List<DeptmentDto>;
                    foreach (var item in list)
                    {
                        <option value="@item.Id">@item.Title</option>
                    }
                }
            </select>
        </div>
        内诉渠道：
        <div class="layui-inline">
            <select name="txt_inComplaintChannel" style="height:35px;">
                <option value="">全部</option>
                <option value="1">400申诉热线</option>
                <option value="2">投诉留言</option>
                <option value="4">业务部反馈</option>
                <option value="8">微信后台</option>
            </select>
        </div>
        投诉原因：
        <div class="layui-inline">
            <select name="txt_reason" style="height:35px;">
                <option value="">全部</option>
                <option value="1">亏损</option>
                <option value="2">宣传不符</option>
                <option value="4">服务不满</option>
                <option value="8">产品不合适</option>
                <option value="16">个人原因</option>
                <option value="32">拖延退款</option>
                <option value="64">5个工作日无理由</option>
            </select>
        </div>
        内诉状态：
        <div class="layui-inline">
            <select name="txt_inComplaintStatus" style="height:35px;">
                <option value="">全部</option>
                <option value="1">跟进中</option>
                <option value="2">暂安抚</option>
                <option value="4">已办结</option>
            </select>
        </div>
        业务处理状态：
        <div class="layui-inline">
            <select name="txt_businessStatus" style="height:35px;">
                <option value="">全部</option>
                <option value="1">待处理</option>
                <option value="2">到期未处理</option>
                <option value="4">委托合规处理</option>
                <option value="8">已办结</option>
            </select>
        </div>
        到期状态：
        <div class="layui-inline">
            <select name="txt_dueStatus" style="height:35px;">
                <option value="">请选择</option>
                <option value="1">未到期</option>
                <option value="2">已到期</option>
            </select>
        </div>
        投诉单号：
        <div class="layui-inline">
            <input type="text" name="txt_complaintId" placeholder="" autocomplete="off" class="layui-input" style="width:120px;">
        </div>
        客户ID：
        <div class="layui-inline">
            <input type="text" name="txt_UMID" placeholder="" autocomplete="off" class="layui-input" style="width:150px;">
        </div>
        @*<div class="layui-inline">
            <input type="text" name="txt_resid" placeholder="" autocomplete="off" class="layui-input" style="width:150px;">
        </div>*@
        客户姓名：
        <div class="layui-inline">
            <input type="text" name="txt_cname" placeholder="" autocomplete="off" class="layui-input" style="width:120px;">
        </div>
        成交客服/工号：
        <div class="layui-inline">
            <input type="text" name="txt_eid" placeholder="" autocomplete="off" class="layui-input" style="width:120px;">
        </div>
        退款：
        <div class="layui-inline">
            <select name="txt_refundStatus" style="height:35px;">
                <option value="">全部</option>
                <option value="1">未退款</option>
                <option value="2">已退款</option>
            </select>
        </div>
        已退订单号:
        <div class="layui-inline">
            <input type="text" name="txt_orderid" placeholder="" autocomplete="off" class="layui-input" style="width:120px;">
        </div>
        <div class="layui-inline">
            <select name="txt_personType" style="height:35px;">
                <option value="1">创建人</option>
                <option value="2">更新人</option>
                <option value="3">核查人</option>
            </select>
        </div>
        <div class="layui-inline">
            <input type="text" name="txt_creaetOrUpdateUser" placeholder="" autocomplete="off" class="layui-input" style="width:120px;">
        </div>
        <div class="layui-inline">
            <select name="txt_dateType" style="height:35px;">
                <option value="1">客户内诉日期</option>
                <option value="2">创建日期</option>
                <option value="4">更新日期</option>
                <option value="32">核查日期</option>
            </select>
        </div>
        <div class="layui-inline">
            <input class="layui-input" placeholder="" name="txt_dateFrom" id="dateFrom" style="width:120px;">
        </div>
        <div class="layui-inline">
            <input class="layui-input" placeholder="" name="txt_dateTo" id="dateTo" style="width:120px;">
        </div>
        <button class="layui-btn" type="button" id="search" data-type="reload">搜索</button>
        <button class="layui-btn layui-btn-reset" id="reset" type="reset">清空</button>
        @Html.Action("SettingList", "Control", new { eid = ViewBag.eid, module = "InComplaint" })
    </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 id="Dialog" class="x-body" style="display:none;">
        <form class="layui-form" action="" lay-filter="formTest">
            <input type="hidden" id="id" name="id" value="" />
            <input type="hidden" id="eid" name="eid" value="@ViewBag.eid" />
            <input type="hidden" id="operator" name="operator" value="@ViewBag.userName" />
            <div class="layui-form-item">
                <label class="layui-form-label"><span style="color: red">*</span>内诉状态：</label>
                <div class="layui-input-inline">
                    <select name="inComplaintStatus" id="inComplaintStatus" lay-verify="required" lay-filter="inComplaintStatus">
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block" style="float: right">
                    <button class="layui-btn layui-btn-sm layui-btn-normal" type="button" lay-submit="" id="save" lay-filter="save" onclick="return false;">保存</button>
                </div>
            </div>
        </form>
    </div>
</div>
<script src="~/Scripts/layui_ext/xm-select/xm-select.js"></script>
<script>
    var winindex;
    var selectRow = {};
    var table;
    var tableCols;
    var hgcrmHost = "@Html.Raw(ViewBag.hgServiceHost)";
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        laydate.render({
            elem: '#dateFrom'
        });
        laydate.render({
            elem: '#dateTo'
        });
    });
    layui.use(['table', 'form', 'laydate', 'layer'], function () {
        table = layui.table;
        var form = layui.form;
        var layer = layui.layer;
        var param2 = GetParams("mytoolbar");

        $.ajax({
            type: "GET",
            url: '/Control/GetTableFieldSettings?module=InComplaint&eid=' + @Html.Raw(ViewBag.eid),
            dataType: "json",
            contentType: "application/json",
            success: function (da) {
                if (da.result) {
                    tableCols = [da.data];
                    table.render({
                        id: 'testReload',//列表别名ID
                        elem: '#tabl1',//表ID
                        url: '/InComplaint/InComplaintHtml',
                        even: true, //开启隔行背景
                        method: 'get'
                        , dataType: 'json'
                        , cols: tableCols,
                        height: 'full-200'
                        //, request: {
                        //    pageName: 'pageIndex' //页码的参数名称，默认：page
                        //    , limitName: 'pageSize' //每页数据量的参数名，默认：limit
                        //}
                        , response: {
                            statusName: 'code' //规定数据状态的字段名称，默认：code
                            , statusCode: 0 //规定成功的状态码，默认：0
                            , msgName: 'message' //规定状态信息的字段名称，默认：msg
                        }
                        , parseData: function (res) { //res 即为原始返回的数据
                            console.log(res.data);
                            if (!res.data) {
                                return {
                                    "code": 0, //解析接口状态
                                    "msg": res.msg, //解析提示文本
                                    "count": 0, //解析数据长度
                                    "data": [] //解析数据列表
                                };
                            }
                            return {
                                "code": res.code, //解析接口状态
                                "msg": res.msg, //解析提示文本
                                "count": res.data.Total, //解析数据长度
                                "data": res.data.Data //解析数据列表
                            };
                        }
                        , done: function (res, curr, count) {
                            //// 保存行高的数组
                            //var height = [];
                            //// 遍历行，将所有行的高度保存到数组中
                            //$(".layui-table-body tr").each(function (index, val) {
                            //    console.log("height-VAL" + index + $(val).height());

                            //    height.push($(val).height());
                            //});

                            //console.log("height" + height);

                            //// 数组排序
                            //height.sort((a, b) => { return a - b });
                            //// 将行高设置为数组中最大的高度
                            //$(".layui-table-body tr").height(height[height.length - 1]);

                            //// 遍历表头，将表头的高度保存到数组中
                            //$(".layui-table-header th").each(function (index, val) {
                            //    height.push($(val).height());
                            //});
                            //// 数组排序
                            //height.sort((a, b) => { return a - b });
                            //// 将表头的高度设置为数组中最大的高度
                            //$(".layui-table-header th").height(height[height.length - 1]);


                            //动态监听表头高度变化，冻结行跟着改变高度
                            $(".layui-table-header  tr").resize(function () {
                                $(".layui-table-header  tr").each(function (index, val) {
                                    $($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
                                });
                            });
                            //初始化高度，使得冻结行表头高度一致
                            $(".layui-table-header  tr").each(function (index, val) {
                                $($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
                            });
                            //动态监听表体高度变化，冻结行跟着改变高度
                            $(".layui-table-body  tr").resize(function () {
                                $(".layui-table-body  tr").each(function (index, val) {
                                    $($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
                                });
                            });
                            //初始化高度，使得冻结行表体高度一致
                            $(".layui-table-body  tr").each(function (index, val) {
                                $($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
                            });
                        }
                        , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                        , limit: 10
                        , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                            layout: ['limit', 'count', 'prev', 'page', 'next', 'skip', 'refresh'] //自定义分页布局
                            //,curr: 5 //设定初始在第 5 页
                            , groups: 5 //只显示 1 个连续页码

                        }
                        , where: param2
                    });
                } else {
                    layer.msg(da.message, { icon: 2 });
                }
            },
            error: function () {
                layer.msg('操作失败！', { icon: 2 });
            }
        });


        $('#mytoolbar #search').on('click', function (data) {
            selectRow = {};
            var param = GetParams("mytoolbar");
            var hastime = $("#hastime").is(':checked');
            console.log("hastime:" + hastime);
            if (hastime) {
                param["hastime"] = 1;
            }
            else {
                param["hastime"] = 0;
            }
            //console.log("hastime:" + hastime);
            console.log(param);
            var mobile = param.mobile;
            table.reload('testReload', {
                page: {
                    layout: ['limit', 'count', 'prev', 'page', 'next', 'skip', 'refresh'],
                    curr: 1 //重新从第 1 页开始
                },
                where: param
            });
        });

        //监听行单击事件
        table.on('row(tabl1)', function (obj) {
            var data = obj.data;
            //console.log(data);
            //标注选中样式
            obj.tr.addClass('self-table-click').siblings().removeClass('self-table-click');

            selectRow = data;
        });
        form.on('submit(save)', function (data) {
            var confirm = layer.confirm('是否确认更新该内诉状态?', { icon: 3, title: '提示' }, function (index) {
                $.ajax({
                    type: "POST",
                    url: '/InComplaint/UpdateInComplaintStatus',
                    data: JSON.stringify(data.field),
                    dataType: "json",
                    contentType: "application/json",
                    success: function (da) {
                        if (da.code == 0) {
                            parent.layer.msg('操作成功！', { icon: 1 });
                            TableReload();
                            Closed();
                        } else {
                            layer.msg(da.retmsg, { icon: 2 });
                        }
                        layer.close(confirm);
                    },
                    error: function () {
                        layer.msg('操作失败！', { icon: 2 });
                    }
                });
            });
        });
    });
    layui.use('layer', function () {
        var layer = layui.layer;
        var active = {
            add: function () {
                ShowEidt();
            },
            detail: function () {
                if (selectRow.id === "undefined" || selectRow.id == null) {
                    layer.alert("请先选中一条记录！", { title: '提示' });
                    return;
                }
                ShowEidt(selectRow.id, true);
            },
            edit: function () {
                if (selectRow.id === "undefined" || selectRow.id == null) {
                    layer.alert("请先选中一条记录！", { title: '提示' });
                    return;
                }
                ShowEidt(selectRow.id);
            },
            export: function () {
                var param = GetParams("mytoolbar");

                layer.open({
                    title: '<i class="layui-icon layui-icon-export" style="font-size: 20px; color: #1E9FFF;"></i>&nbsp;导出',
                    type: 2,
                    content: "/Control/ExcelExport_cookie?Query=" + encodeURIComponent("/InComplaint/ExportData?param=" + JSON.stringify(param)),
                    area: ['850px', '400px']
                });
            },
        };



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

    });
    $(".layui-table-header tr").resize(function () {
        $(".layui-table-header tr").each(function (index, val) {
            $($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
        });
    });
    function ShowEidt(id, read) {
        var title = "添加内部投诉";
        if (id != null) title = "编辑内部投诉";
        if (read) title = "查看内部投诉";
        layui.use('layer', function () {
            var layer = layui.layer;
            winindex = layer.open({
                title: title,
                type: 2,
                content: '/InComplaint/InComplaintEdit?id=' + id + '&read=' + read,
                area: ['40%', '70%']
            });
        });
    }
    function ShowRestore(id, read) {
        var title = "添加回复";
        if (read) title = "查看回复";
        layui.use('layer', function () {
            var layer = layui.layer;
            winindex = layer.open({
                title: title,
                type: 2,
                content: '/InComplaint/InComplaintRestoreEdit?id=' + id + '&read=' + read,
                area: ['40%', '65%']
            });
        });
    }
    function ShowFollowUp(id) {
        var title = "查看跟进记录";
        layui.use('layer', function () {
            var layer = layui.layer;
            winindex = layer.open({
                title: title,
                type: 2,
                content: '/InComplaint/InComplaintFollowUp?id=' + id,
                area: ['70%', '50%']
            });
        });
    }
    function ShowFollowUpEidt(id) {
        var title = "添加跟进记录";
        layui.use('layer', function () {
            var layer = layui.layer;
            winindex = layer.open({
                title: title,
                type: 2,
                content: '/InComplaint/InComplaintFollowUpEdit?id=' + id,
                area: ['650px', '380px']
            });
        });
    }
    function ShowUpdateStatus(id, inComplaintStatus) {
        console.log(inComplaintStatus)
        document.getElementById("id").value = id;
        layui.use(['layer', 'form'], function () {
            var layer = layui.layer,
                form = layui.form;
            var options = [
                { value: 1, name: "跟进中" },
                { value: 2, name: "暂安抚" },
                { value: 4, name: "已办结" }
            ]
            $("#inComplaintStatus").html("");
            $(options).each(function (index, val) {
                if (inComplaintStatus && val.value == inComplaintStatus) {
                    $("#inComplaintStatus").append(new Option(val.name, val.value, true, true));
                } else {
                    $("#inComplaintStatus").append(new Option(val.name, val.value));
                }
            });
            form.render('select');
            winindex = layer.open({
                title: '更新内诉状态',
                type: 1,
                content: $('#Dialog'),
                area: ['450px', '250px']
            });
        });
    }

    function TableReload() {
        selectRow = {};
        table.reload('testReload', {
            page: {
                curr: 1 //重新从第 1 页开始
            }
        });
    }
    function Closed() {
        layer.close(winindex);
    }


    //获取datagrid头部及字段
    function getDataGridHeader() {
        var newcolumns = [];
        var columns = tableCols[0];
        for (var i = 0; i < columns.length; i++) {
            if (columns[i].field != "id" && columns[i].field != "operator") {
                newcolumns.push(columns[i])
            };
        }
        return newcolumns;
    }
</script>


<script type="text/html" id="resIdTpl">
    <span> <a href="javascript:void(0)" style="color:blue" onclick="parent.AddNewTab('客户信息','@Html.Raw(ViewBag.hgServiceHost)Csvr/CustomerInfo/CustomerDetail?hgCustomer=1&isFromHg=1&resid={{d.UMID}}')">{{d.UMID}}</a></span>
</script>
<script type="text/html" id="inComplaintChannelStrTpl">
    {{# for(var i=0;i<d.inComplaintChannelList.length;i++) { }}
    <span>{{d.inComplaintChannelList[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="reasonTpl">
    {{# for(var i=0;i<d.reasonList.length;i++) { }}
    <span>{{d.reasonList[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="ordersTpl">
    {{# for(var i=0;i<d.orderList.length;i++) { }}
    <span>{{d.orderList[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="pricesTpl">
    {{# for(var i=0;i<d.priceList.length;i++) { }}
    <span>{{d.priceList[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="productsTpl">
    {{# for(var i=0;i<d.products.length;i++) { }}
    <span>{{d.products[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="orderIdsTpl">
    {{# for(var i=0;i<d.orderIds.length;i++) { }}
    <span>{{d.orderIds[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="oTimesTpl">
    {{# for(var i=0;i<d.oTimes.length;i++) { }}
    <span>{{d.oTimes[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="arrivalPaysTpl">
    {{# for(var i=0;i<d.arrivalPays.length;i++) { }}
    <span>{{d.arrivalPays[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="arrivalStatusTpl">
    {{# for(var i=0;i<d.arrivalStatus.length;i++) { }}
    <span>{{d.arrivalStatus[i]}}</span>
    <br />
    {{# } }}
</script>

<script type="text/html" id="operatorTpl">
    <a class="operator" href="javascript:void(0)" onclick="ShowUpdateStatus({{d.id}}, {{d.inComplaintStatus}})">更新内诉状态</a>
    <br />
    <a class="operator" href="javascript:void(0)" onclick="ShowFollowUpEidt({{d.id}})">添加跟进记录</a>
    {{# if(d.followUpCount > 1) { }}
    <br />
    <a class="operator" href="javascript:void(0)" onclick="ShowFollowUp({{d.id}})">查看跟进记录</a>
    {{# } }}
    {{# if(d.restoreCount > 0) { }}
    <br />
    <a class="operator" href="javascript:void(0)" onclick="ShowRestore({{ d.id }}, true)">查看回复</a>
    {{# } }}
    {{# if(d.needRestoreCount > 0) { }}
    <br />
    <a class="operator" href="javascript:void(0)" onclick="ShowRestore({{d.id}})">添加回复</a>
    {{# } }}
</script>