$(() => {
    $(".datepicker").datepicker({
        changeMonth: true,
        changeYear: true,
        format: 'yyyy-mm-dd hh:mm:ss',
        showButtonPanel: true,
        showOtherMonths: true,
        //selectOtherMonths: true,
        showSecond: true
    });
    $("#DateFromOptDate").val(page.ValueDate);
    $("#DateToOptDate").val(page.ValueDate);
    initListGrid();
    initEvent();
});

var g_grid = {};

function initListGrid() {
    var PostData = {};
    var grid = jQuery('#listGrid').jqGrid({
        url: "/Datatrace/ClientCashChangeSearch",
        datatype: 'local',
        height: 'auto',
        width: '96%',
        autowidth: false,
        multiselect: true,
        shrinkToFit: false,
        viewrecords: true,
        jsonReader: { repeatitems: false },
        caption: '',
        mtype: 'POST',
        cmTemplate: { align: 'center', width: 120 },
        postData: PostData,
        onSelectRow: rowclick,
        onSelectAll: allRowSelect,
        ondblClickRow: rowdblclick,
        colModel: colModelGrid,
        pager: jQuery('#pagerGrid'),
        pagerpos: 'left',
        rowNum: 200,
        rowList: [20, 30, 50, 200, 10000],
        viewrecords: false,
        footerrow: false,
        loadComplete: gridComplete,
        onPaging: function () {
            $("#listGrid").setGridWidth($("#infopage").width() - 30);
        },
        grouping: true,
        beforeRequest: function () {
            $('[data-toggle="popover"]').popover("hide");
        }
    });
    var g_grid = jQuery('#listGrid').jqGrid(grid);
    SearchClick(true);
}

var colModelGrid = [
    {
        name: 'id',
        hidden: true,
        optionHide: true
    }, {
        name: 'EncryptId',
        hidden: true,
        optionHide: true
    }, {
        name: 'EncryptTradeId',
        hidden: true,
        optionHide: true
    }, {
        name: 'Number',
        label: '资金编号',
        index: 'Number',
        width: 150,
        align: 'center',
    }, {
        name: 'OptDate',
        label: '变更时间',
        index: 'OptDate',
        width: 135,
        align: 'center'
    },
    {
        name: 'OptName',
        label: '操作人',
        index: 'OptName',
        width: 100,
        align: 'center',
    }, {
        name: 'TradeNumber',
        label: '相关交易',
        index: 'TradeNumber',
        width: 200,
        align: 'center',
        formatter: tradeNumberFormat,
    }, {
        name: 'Explain',
        label: '修改说明',
        index: 'Explain',
        width: 100,
        align: 'center',
        sortable: false
    }, {
        name: 'CashState',
        label: '资金状态',
        index: 'CashState',
        width: 150,
        align: 'center',
        sortable: false
    }, {
        name: 'DataInfo',
        label: '变更字段',
        index: 'DataInfo',
        width: 90,
        align: 'center',
        sortable: false,
        hidden: true
    }, {
        name: '',
        label: '变更详情',
        index: '',
        width: 90,
        align: 'center',
        sortable: false,
        formatter: showToolName,

    }, {
        name: 'DataInfoFiles',
        label: '变更字段',
        index: 'DataInfoFiles',
        width: 300,
        align: 'left',
        sortable: false,
        formatter: formatDataInfo
    }, {
        name: 'DirectionType',
        label: '方向类型',
        index: 'DirectionType',
        width: 90,
        align: 'center',
        sortable: false,
        hidden: true
    }, {
        name: 'ClientName',
        label: '客户名称',
        index: 'ClientName',
        width: 90,
        align: 'center',
        sortable: false,
        hidden: true
    }
];

function showToolName(cellValue, options, rowObject) {
    if (rowObject.DataInfo == "" || rowObject.DataInfo == null) {
        return "";
    }
    var html =
        "<input type=\"button\" class=\"wentiEdit\" title='查看'data-id='{0}' value=\"{1}\" data-toggle=\"modal\" data-target=\"#modalClientCashChange\" />"
            .template(rowObject.id, "查看");
    return html;
}

function formatDataInfo(cellValue, options, rowObject) {
    var html = "";
    if (rowObject.DataInfo != null) {
        var strResult = rowObject.DataInfo.split("；");
        for (var i = 0; i < strResult.length; i++) {
            var finallyResult = strResult[i].split("：");
            if (finallyResult[0] != "" && finallyResult[0] != null) {
                var frValue = finallyResult[0] == "出入金额" ? rowObject.DirectionType : finallyResult[0];
                //if ((i + 1) == strResult.length) {
                //    html += frValue;
                //} else {
                //    html += frValue + "；";
                //}
                html += frValue + "；";
            }
        }
        if (html.length > 0) {
            html = html.substring(0, html.length - 1);
        }
    }
    return html;
}

function showDetail(value, $modal) {
    var data = jQuery('#listGrid').getRowData(value);
    var html = HeaderMethod(data);
    html += ContentMethod(data.DataInfo, data.DirectionType);
    $modal.find('.modal-body').html(html)
}

function HeaderMethod(data) {
    return [
        '<h6 class="text-right"><small>变更时间: ' + data.OptDate + '</small></h6>',
        '<h6>',
        '<small class="item">资金编号: ' + data.Number + '</small>',
        '<small class="item">客户名称: ' + data.ClientName + '</small>',
        '</h6>'
    ].join('');
}

function ContentMethod(dataInfo, directionType) {
    var html = '<table class="table table-bordered"><tr>';
    html += '<th style="width:24%">变更字段</th><th style="width:38%">变更前</th><th style="width:38%">变更后</th></tr>';
    if (dataInfo != null) {
        var strResult = dataInfo.split("；");
        for (var i = 0; i < strResult.length; i++) {
            var fields = strResult[i].split("：");
            if (fields[0] != "" && fields[0] != null && fields[0] != undefined) {

                var frValue = fields[0] == "出入金额" ? directionType : fields[0];
                html += '<tr><td class="tdField">' + frValue + '</td>';
                if (fields[1] != "" && fields[1] != null && fields[1] != undefined) {
                    var values = fields[1].split("->");
                    if (values.length == 2) {
                        html += '<td class="tdField2">' + (values[0] == "“  ”" ? "空" : values[0]) + '</td><td class="tdField3">' + (values[1] == "“  ”" ? "空" : values[1]) + '</td>';
                    }
                }
                html += '</tr>';
            }
        }
    }
    html += '</table>';
    return html;
}


function closePopover(value) {
    $("#clientInfoChange_" + value).popover("hide");
}

function starttradeView(id) {
    let srcurl = "/trade/tradeView/?isOnlyCloseButton=true&enid=" + id;
    main.open("查看交易(机构方向)", srcurl, { area: ['1260px', '100%'], scrollbar: false });
}

function tradeNumberFormat(cellValue, options, rowObject) {
    return `<a href="javascript:void(0)" style="text-decoration:underline" onclick="starttradeView('${rowObject.EncryptTradeId}')">${cellValue}</a>`;
}

function moneyFormat(cellValue, options, rowObject) {
    if (rowObject.DirectionType == "出金") {
        return numeral(-1 * cellValue).format("0,0.00");
    }
    else {
        return numeral(cellValue).format("0,0.000");
    }
}

function rowclick(id) {
}

function allRowSelect(rowids, status) {
}

function rowdblclick(rowid) {
}

function SearchClick(isSearchclick) {
    $('[data-toggle="popover"]').popover("hide");
    var listGrid = $('#listGrid');

    listGrid.appendPostData({
        DirectionTypes: $("#DirectionType").val() == null || $("#DirectionType").val() == undefined ? "" : $("#DirectionType").val().join()
    });

    listGrid.appendPostData({ OptDateStart: $("#DateFromOptDate").val() });
    listGrid.appendPostData({ OptDateEnd: $("#DateToOptDate").val() });
    listGrid.appendPostData({ ClientIds: $("#ClientId").val() == null ? [] : $("#ClientId").val() });
    listGrid.appendPostData({ ClientNumber: $("#ClientNumber").val() });
    listGrid.appendPostData({ AssetIds: !$("#AssetId").val() ? null : $("#AssetId").val() });
    listGrid.appendPostData({ OptNames: !$("#OptNames").val() ? null : $("#OptNames").val() });
    listGrid.appendPostData({ HappenDateStart: $("#DateFromHappenDate").val() });
    listGrid.appendPostData({ HappenDateEnd: $("#DateToHappenDate").val() });
    listGrid.appendPostData({ Number: $("#Number").val() });
    listGrid.appendPostData({ TradeNumber: $("#TradeNumber").val() });

    listGrid.appendPostData({ Ids: null });

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

    listGrid.jqGrid('setGridParam', { datatype: 'json' });
    listGrid.trigger('reloadGrid');
}

function exportClientInfoChange() {
    var req;
    var selectedIds = $('#listGrid').jqGrid('getGridParam', 'selarrrow');
    if (selectedIds.length > 0) {
        var ors = [];
        for (var i = 0; i < selectedIds.length; i++) {
            var or = $('#listGrid').getRowData(selectedIds[i]).id;
            ors.push(or);
        }
        req = { Ids: ors };
    } else {
        req = {
            Ids: null,
            DirectionTypes: $("#DirectionType").val() == null || $("#DirectionType").val() == undefined
                ? "出金,入金,权利金支出,权利金收入,平仓/行权支出,平仓/行权收入,票息支出,票息收入,其他支出,其他收入,互换收入,互换支出"
                : $("#DirectionType").val().join(),
            OptDateStart: $("#DateFromOptDate").val(),
            OptDateEnd: $("#DateToOptDate").val(),
            ClientIds: !$("#ClientId").val() ? null : $("#ClientId").val(),
            ClientNumber: $("#ClientNumber").val(),
            AssetIds: !$("#AssetId").val() ? null : $("#AssetId").val(),
            OptNames: !$("#OptNames").val() ? null : $("#OptNames").val(),
            HappenDateStart: $("#DateFromHappenDate").val(),
            HappenDateEnd: $("#DateToHappenDate").val(),
            Number: $("#Number").val(),
            TradeNumber: $("#TradeNumber").val(),
        };
    }
    var url = "/Datatrace/ExportClientCashChange?" + $.param(req, true);
    window.open(url);
}

function initEvent() {
    $('#modalClientCashChange').on('show.bs.modal', function (evt) {
        var id = $(evt.relatedTarget).data('id');
        showDetail(id, $(this));
    })
}