@{
    ViewBag.Title = "开户管理";
    Layout = "~/Views/Shared/_MainLayout.cshtml";
    var pageObj = new
    {
        isClientNew = CurUser.客户管理.客户新增,
        approvalList = CurUser.风险控制_接口审批列表,
        approvalMode = YLErp.PS.Config.ClientElement.InterfaceApprovalMode,
        isClientEdit = CurUser.客户管理.客户修改,
        roles = CurUser.Roles.Select(s => s.Id).ToList(),
        isZhaoZheng = YLErp.PS.Config.Company == CompanyEnum.招证,
        isDongWu = YLErp.PS.Config.Company == CompanyEnum.东吴,
        ViewTagPermission = CurUser.客户管理.客户标签查看权限,
    };
}
@section CSS{
    <link href="~/Style/Css/bankcardView.css" />
    <link href="~/Style/Css/clientsettag.css?v=@(HtmlUtil.JsVersion)" rel="stylesheet" />
    <style>
        .tag-item {
            height: 17px;
            line-height: 14px;
        }

        .tag-add {
            height: 17px;
            line-height: 14px;
        }

        .tag-context {
            padding: 0px;
        }

        .bootstrap-select.show-tick .dropdown-menu li a span.text {
            max-width: 300px;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    </style>
}
<style>
    .OptName-wrap, .date-wrap {
        display: none !important;
    }

    .spanNone {
        display: none;
    }

    .no-skin {
        position: initial !important;
    }
</style>
@section JS{
    <script>
        const page = @Json.Serialize(pageObj);
    </script>
    <script src="/front/clientEditConfig"></script>
    <script type="text/javascript">
        var g_grid = {};
        var query_data = {};
        var colModelGrid = [];
        $(function () {
            var PostData = {};
            $(".datepicker").datepicker({
                changeMonth: true,
                changeYear: true,
                showButtonPanel: true,
                showOtherMonths: true,
                selectOtherMonths: true
            });
            getColModelGrid();

        @Html.Raw(JqGridSimple.OutGrid("/client/clientOpeningProcessQuery", isMultiSelect: true, rowNum:500,height:"500px"));
            g_grid = jQuery('#listGrid');

            function keyEnter(event) {
                try {
                    var e = event ? event : (window.event ? window.event : null);
                    (e.keyCode == 13) && SearchClick(true);
                } catch (e) { }
            }

            document.onkeydown = keyEnter;
            SetAceDropDown();
        });

        function isAuthorize(roleId) {
            if (roleId === 'undefined') return false;
            var roleIdStr = roleId + "";
            if (roleIdStr === "") return false;
            var rolesArr = page.roles;
            var len = rolesArr.length;
            if (len <= 0) return false;
            for (var i = 0; i < len; i++) {
                if (rolesArr[i] == roleIdStr) {
                    return true;
                }
            }
            return false;
        }
        function getColModelGrid() {
            var actions = [];
            actions.push({
                name: 'operation',
                label: '操作',
                index: 'operation',
                width: '220',
                sortable: false,
                align: 'center',
                hidden: false
            });
            actions.push({
                name: 'ProcessStatus',
                label: '客户状态',
                index: 'ProcessStatus',
                width: '100',
                sortable: false,
                align: 'center',
                hidden: false
            });
            actions.push({
                name: 'ApprovalStatus',
                label: '审批状态',
                index: 'ApprovalStatus',
                width: '100',
                sortable: false,
                align: 'center',
                hidden: false
            });
            if (editConfig.openList == null) {
                main.alert("请配置开户管理列表！")
            } else {
                editConfig.openList = _.uniqBy(editConfig.openList, "name");
                if (editConfig.openList.length > 0) {
                    actions.forEach(a => {
                        colModelGrid.push(a);
                    });
                }
                editConfig.openList.forEach(a => {
                    var rowData = {
                        name: a.name,
                        label: a.label,
                        index: a.name,
                        width: a.width,
                        sortable: a.sortable,
                        align: a.align,
                        hidden: a.hidden,
                        optionHide: a.optionHide,
                    }
                    colModelGrid.push(rowData);
                });
                if (page.ViewTagPermission) {
                    colModelGrid.push({
                        name: 'Tags',
                        label: '标签值',
                        index: 'Tags',
                        width: 150,
                        align: 'left',
                        sortable: false
                    }, {
                        name: 'OutputTags',
                        label: 'OutputTags',
                        index: 'OutputTags',
                        width: 70,
                        align: 'center',
                        hidden: true,
                        optionHide: true
                    });
                }

                FormatColData(colModelGrid);
            }
        }

        function tagformat(cellvalue, options, rowObject) {
            var html = '<div class="tag-context">';
            var tagNames = "";
            if (rowObject.Tags != null && rowObject.Tags.length > 0) {
                for (var i = 0; i < rowObject.Tags.length; i++) {
                    if (i == rowObject.Tags.length - 1) {
                        tagNames += "[" + rowObject.Tags[i].Name + "]";
                    } else {
                        tagNames += "[" + rowObject.Tags[i].Name + "],";
                    }
                }
                if (rowObject.Tags.length > 2) {
                    for (var i = 0; i < 2; i++) {
                        html += '<span class="tag-item" data-id="' + rowObject.Tags[i].Id + '" data-name="' + rowObject.Tags[i].Name + '"><span class="tag-text" data-value="' + rowObject.Tags[i].Id + '">' + rowObject.Tags[i].Name + '</span></span>';
                    }
                    html += '<span class="tag-add" title="' + tagNames + '">...</span>';
                } else {
                    for (var i = 0; i < rowObject.Tags.length; i++) {
                        html += '<span class="tag-item" data-id="' + rowObject.Tags[i].Id + '" data-name="' + rowObject.Tags[i].Name + '"><span class="tag-text" data-value="' + rowObject.Tags[i].Id + '">' + rowObject.Tags[i].Name + '</span></span>';
                    }
                }
            }
            html += '</div>';
            return html;
        }


        Date.prototype.format = function (fmt) {
            var o = {
                "M+": this.getMonth() + 1, //月份
                "d+": this.getDate(), //日
                "h+": this.getHours(), //小时
                "m+": this.getMinutes(), //分
                "s+": this.getSeconds(), //秒
                "q+": Math.floor((this.getMonth() + 3) / 3), //季度
                "S": this.getMilliseconds() //毫秒
            };
            if (/(y+)/.test(fmt)) {
                fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
            }
            for (var k in o) {
                if (new RegExp("(" + k + ")").test(fmt)) {
                    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
                }
            }
            return fmt;
        }


        function dateformat(cellvalue, options, rowObject) {
            if (cellvalue == null || cellvalue == undefined) {
                return "";
            }
            return new Date(cellvalue).format("yyyy-MM-dd");
        }

        function FormatColData(colData) {
            colData.forEach(a => {
                switch (a.name) {
                    case 'Name':
                        a.formatter = nameFormat;
                        break;
                    case 'operation':
                        a.formatter = showToolName
                        break;
                    case 'MarginOptionType':
                        a.formatter = MarginOptionFormater;
                        break;
                    case 'PendingMarginCallPayment':
                    case 'IsIndustryConnectVariety':
                    case 'IsRealControl':
                    case 'IsEvaluate':
                    case 'IsRequireConversionTypes':
                    case 'IsAssessmentResultChange':
                    case 'IsDocShowParentName':
                    case 'IsCreditOn':
                    case 'IsTradeCredit':
                        a.formatter = boolFormater;
                        break;
                    case 'EvaluateDate':
                    case 'ProtocolSignDate':
                    case 'RightProtocolSignDate':
                    case 'OptDate':
                    case 'SupProtocolDate':
                        a.formatter = dateformat;
                        //a.formatter = "date";
                        break;
                    case 'IsCentralClearing':
                        a.formatter = IsCentralClearingFormater;
                        break;
                    case 'Tags':
                        a.formatter = tagformat;
                        break;
                    default:
                        a.formatter = 'text';
                        break;
                }

                if (a.name.indexOf("meta_") >= 0) {
                    var dicName = a.name.split("_")[1];
                    a.name = `MetaDic.${dicName}`;
                    a.index = `MetaDic.${dicName}`;
                    a.sortable = false;//自定义字段不支持排序
                }
            });
        }

        function MarginOptionFormater(cellValue, option, rowObject) {
            if (cellValue == undefined) {
                cellValue = 0;
            }
            switch (cellValue) {
                case 0: return "单向追保";
                case 1: return "双向追保";
                case 2: return "对手方单向追保";
                case 3: return "其他";
                default: return "单向追保";
            }
        }
        function IsCentralClearingFormater(cellValue, option, rowObject) {
            if (cellValue == undefined) {
                cellValue = "";
            }
            switch (cellValue) {
                case "Y": return "是";
                case "N": return "否";
                case "I": return "计划中央对手方清算";
                default: return "";
            }
        }

        function boolFormater(cellValue, options, rowObject) {
            if (cellValue == null) return "";
            var s = cellValue ? "是" : "否";
            var html = "<label>{0}</label>".template(s);
            return html;
        }

        window.reloadData = reloadclient2;
        function gridComplete() {
            main.setcolumnChooser(jQuery('#listGrid'), "@configcolumn_data.开户管理");
        }

        function rowdblclick(rowid) {
            var rowData = $(this).getRowData(rowid);
            startclientView(rowData.EncryptId);
        }

        function customButton(cellValue, options, rowObject) {
            var imageHtml = "<input type=\"button\" value=\"删除\" class=\"btn-warning\" onclick=\"deleteclient('" +
                rowObject.EncryptId +
                "');\" />";
            return imageHtml;
        }

        function deleteclient(encryptId) {
            if (confirm("确定删除吗?")) {
                $.ajax({
                    type: "Post",
                    url: "/client/Deleteclient",
                    data: { id: encryptId, d: new Date() },
                    success: function (data) {
                        showmiddlemessage(data.obj);

                        $('#listGrid').trigger('reloadGrid');
                    },
                    error: function (msg) {
                        alert("error:" + msg);
                    }
                });
            }
        }

        function ProcessOptDateFilter(cellValue, options, rowObject) {
            if (rowObject.ProcessStatus === '未提交') {
                return '';
            }
            return rowObject.ProcessOptDate;
        }

        function showToolName(cellValue, options, rowObject) {
            var html =
                "<input type=\"button\" class=\"wentiEdit\" title='查看客户信息' onclick=\"startclientView('{0}')\" value=\"{1}\" />"
                    .template(rowObject.EncryptId, "查看");
            if (rowObject.ProcessStatus === '未提交' || rowObject.ApprovalStatus === '已拒绝') {
                html = html +
                    "<input type=\"button\" class=\"wentiEdit\" title='删除'  onclick=\"deleteclient('{0}')\" value=\"{1}\" />"
                        .template(rowObject.EncryptId, "删除");
            }
            return html;
        }

        function approvalList(name) {
            main.open("审批记录", "/trade/InterfaceApprovalRecord?type=2&code=" + name, { area: ["1200px", "600px"] });
        }

        function nameFormat(c, o, r) {
            var html = r.Name;

            if (!r.HasDocuments) {
                html += "<img title='未上传任何文件' style='width:16px;' src='/images/light_yellow.png'/>";
            }
            return html;
        }

        function passorreject(eid) {
            var url = "/processlog/processlogListInner?eid=" + eid;
            main.open("审批", url, { area: ["60%", "65%"] });
        }

        function rowclick(id) {

        }

        function startAddclient() {
            var srcurl = "/client/clientEditV2";
            if (page.isClientNew) {
                var width = "1300px";
                if (page.isZhaoZheng) {
                    width = "1430px";
                } else if (page.isDongWu) {
                    width = "1550px";
                }
                main.open("新增客户", srcurl, { area: [width, '800px'] });
            }
            else {
                console.warn("InVaild Operation!");
            }

        }

        function startclientView(id) {
            var srcurl = "/client/clientEditV2?enid=" + id;
            var width = "1300px";
            if (page.isZhaoZheng) {
                width = "1430px";
            } else if (page.isDongWu) {
                width = "1550px";
            }
            main.open("查看客户信息", srcurl, { area: [width, '800px'] });
        }

        function reloadclient() {
            //重新加载
            SearchClick();
            window.layer.closeAll();
        }
        window.reloadData = reloadclient2;
        function reloadclient2() {
            //重新加载
            SearchClick();
        }

        function uploadClient(id) {
            var scrurl = "/client/clientUploadV2";
            if (page.isClientNew) {
                main.open("客户导入", scrurl, { area: ['650px', '450px'] });
            }
            else {
                console.warn("InVaild Operation!");
            }
        }

        function exportClientChoose() {
            var htmlContent =
                '<div style="padding:30px">' +
                '<input class="btn btn-primary  " type="button" style="width:auto;height:29px;border: none;border-radius: 3px;margin-right:20px" onclick="exprotChooseColumn();return false;" value="导出可选列">' +
                '<input class="btn btn-primary  " type="button" style="width:auto;height:29px;border: none;border-radius: 3px;margin-right:20px" onclick="exportClientMouldExcel();return false;" value="导出客户基本信息模板">' +
                '<input class="btn btn-primary  " type="button" style="width:auto;height:29px;border: none;border-radius: 3px;margin-right:20px" onclick="exportClientDutyMouldExcel();return false;" value="导出客户人员信息模板">' +
                '<input class="btn btn-primary  " type="button" style="width:auto;height:29px;border: none;border-radius: 3px;" onclick="exportClientBankcardMouldExcel();return false;" value="导出客户银行账号信息模板">' +
                '</div>';
            layer.open({
                type: 1,
                title: "导出客户列表",
                shadeClose: false,
                shade: 0.4,
                area: ['800px', '150px'],
                content: htmlContent
            });
        }
        function exprotChooseColumn() {
            var dateTemp = new Date().Format("yyyyMMddhhmmss");
            var fileName = "待开客户（配置列）_" + dateTemp;
            var openList = [];
            colModelGrid.forEach(a => {
                if (a.name == "Name") {
                    a.formatter = function (cellValue, options, rowObject) {
                        var index = cellValue.indexOf("<img");
                        if (index > 0) {
                            cellValue = cellValue.substr(0, index)
                        }
                        return cellValue;
                    }
                }
                if (a.label != "标签值") {
                    openList.push({
                        colName: a.label, formatter: a.formatter
                    });
                }
            });
            if (page.ViewTagPermission) {
                openList.push({
                    colName: "标签值",
                    formatter: function (cellValue, options, rowObject) {
                        return rowObject.OutputTags;
                    }
                });
            }

            main.toExcel("listGrid", fileName, "xls", null, "资金流向,履约协议编号,履约协议类型,席位,操作人,操作时间,操作", openList);

        }

        function exportClientMouldExcel() {
            window.open("../App_Docs/客户导入_基本信息模板.xlsx");
        }

        function exportClientDutyMouldExcel() {
            window.open("../App_Docs/客户导入_人员信息模板.xlsx");
        }

        function exportClientBankcardMouldExcel() {
            window.open("../App_Docs/客户导入_银行卡模板.xlsx");
        }

        $("#Name").change(function () {
            var value = $("#Name").val();
            $("#Name").attr("title", value);

        });

        function downCsv(fileName, exStrr) {
            var isIE = (navigator.userAgent.indexOf('MSIE') >= 0);
            if (isIE) {
                var strHTML = exStrr;
                var winSave = window.open();
                winSave.document.open("text", "utf-8");
                winSave.document.write(strHTML);
                winSave.document.execCommand("SaveAs", true, fileName + ".csv");
                winSave.close();
            } else {
                var mimeType = 'text/plain';
                $('#createInvote').attr('download', fileName + ".csv");
                //\uFEFF bom
                $('#createInvote').attr('href',
                    'data:' + mimeType + ';charset=utf-8,\uFEFF' + encodeURIComponent(exStrr));
                document.getElementById('createInvote').click();
            }
        }

        function SearchClick(isSearchclick) {
            var listGrid = $('#listGrid');

            listGrid.appendPostData({ Name: $("#Name").val() });
            listGrid.appendPostData({ LicenseCode: $("#LicenseCode").val() });
            listGrid.appendPostData({ ProcessStatus: $("#ProcessStatus").val() == null ? "" : $("#ProcessStatus").val().join(",") });
            listGrid.appendPostData({ ApprovalStatus: $("#ApprovalStatus").val() == null ? "" : $("#ApprovalStatus").val().join(",") });
            listGrid.appendPostData({ ParentIds: $("#ParentIds").val() == null ? "" : $("#ParentIds").val().join(",") });
            listGrid.appendPostData({ ProperClientClass: $("#ProperClientClass").val() == null ? "" : $("#ProperClientClass").val().join(",") });
            listGrid.appendPostData({ CustomerManagerIds: $("#CustomerManagerIds").val() });
            listGrid.appendPostData({ CustomerManagerString: $("#CustomerManagerString").val() });
            listGrid.appendPostData({ TagIds: $("#TagIds").val() });

            query_data = {
                Name: $("#Name").val(),
                ProcessStatus: $("#ProcessStatus").val() == null ? "" : $("#ProcessStatus").val().join(","),
                ProperClientClass: $("#ProperClientClass").val() == null ? "" : $("#ProperClientClass").val().join(","),
                CustomerManagerIds: $("#CustomerManagerIds").val(),
                CustomerManagerString: $("#CustomerManagerString").val()
            }

            if (typeof (isSearchclick) != "undefined" && isSearchclick) {
                //点击搜索时默认第一页
                listGrid.jqGrid('setGridParam', { page: 1 });
            }
            listGrid.trigger('reloadGrid');
        }

        function showcolumnChooser() {
            main.showcolumnChooser(jQuery('#listGrid'), "@configcolumn_data.开户管理");
        }

        $(function () {

            $("#OptName").parent().addClass("OptName-wrap");
            $("#DateFromOptDate").parent().addClass("date-wrap");
        });

        function BatchSetClientTag() {
            var jgrid = jQuery('#listGrid');
            var selIds = main.GetGridIds(jgrid);
            if (selIds.length === 0) { main.message("请选择至少一个客户"); return; }
            let srcurl = "/Tag/BatchSetClientTag/?ids=" + selIds.join(',');
            main.open("批量设置标签", srcurl, { area: ['778px', '257px'], scrollbar: false });
        }
        //导入客户信息
        function importClientInfo() {
            main.infopage('客户基本信息导入', "/client/ImportDongGuanClientView", { area: ['778px', '300px'], scrollbar: false });
        }
    </script>
}

<div class="searchdiv">
    <div>
        @Html.ShortInput("Name", "客户名称")
      
        @Html.MyAceDropdownInput("ProcessStatus", "客户状态", ClientDataModel.GetPendingStatusForQuery())
        @Html.MyAceDropdownInput("ApprovalStatus", "审批状态", ClientDataModel.GetOpenApprovalStatusForQuery())
        @Html.ShortInput("OptName", "操作人名")
        @Html.SearchDateRange("OptDate", "操作时间")

        @if (pageObj.ViewTagPermission)
        {
            @Html.MyAceDropdownInput("TagIds", "标签值", TagController.GetTradeTagList(CurUser, YLErp.Enums.TagTypeEnum.Customer))
        }
    </div>
    <div>
        @MyControls.SearchBtn()
        @if (pageObj.isClientNew)
        {
            @MyControls.Btn("新增客户", "startAddclient()")
            @MyControls.Btn("批量客户导入", "uploadClient()")
            @if (PS.Config.Is东莞)
            {
                @MyControls.Btn("导入客户基本信息", "importClientInfo()")
            }
        }

        @MyControls.Btn("导出可选列", "exprotChooseColumn()")

        <div style="width:30px;display:inline;" onclick="showcolumnChooser();return false;">
            <img src="~/Images/configure.png" />
        </div>
        @if (CurUser.客户管理.客户标签调整权限)
        {
            <div class="batch-tag" onclick="BatchSetClientTag();">
                <img src="~/Images/tag.jpg" /><span>标记</span>
            </div>
        }
    </div>
</div>
@Html.Raw(JqGridSimple.OutTable())