@using Microsoft.Ajax.Utilities
@using ShwasherSys.Authorization.Permissions
@using ShwasherSys.Models.Layout
@using ShwasherSys.Models.Modal

@{
    /**/
    ViewBag.ActiveMenu = PermissionNames.PagesFinshedStoreInfoEnterOutStoreHouseQueryMg; //The menu item will be active for this page.
    ViewBag.Title = "进出库数量查询";
    List<SelectListItem> storeHouseList = ViewBag.StoreHouseList;
    var searchForm = new SearchFormViewModal(new List<SearchItem>()
{

    new SearchItem("productName","产品名称"),
new SearchItem("model","规格"),
new SearchItem("surfaceColor","表色"),
new SearchItem("material","材质"),
new SearchItem("rigidity","硬度"),
    new SearchItem("dateTiem","记录时间",FiledType.Dnull,ExpType.GreaterOrEqual),
    new SearchItem("dateTiem","至",FiledType.Dnull,ExpType.LessOrEqual),
    new SearchItem("productNo","成品编号").SetSearchIcon("query_Product_modal"),
    new SearchItem("productionOrderNo","批次号"),
}, false);
}
@section css{
    <link href="~/Content/Plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />

}
<div id="exportCss">
    <style>
        /*.trProduct td {
            height: 30px;
            padding: 5px 0 1px !important;
            text-align: left !important;
            background: #f8e8eb;
            font-size: 1.5rem !important;
            color: red;
            border-left: none;
        }
             .trProduct td span {
                 color: #632d32;
                 margin: 0 3px;
                 font-weight: 500;
             }
             .trProduct td span.left{

                 margin-left: 15px;
             }
        #table td {
            text-align: center;
        }*/
        .tool-radio {
            display: inline-block;
            margin-left: 10px;
        }

        [type="radio"]:not(:checked) + label, [type="radio"]:checked + label {
            padding-left: 25px;
            font-size: 1.5rem;
            color: #dad9db;
        }

            [type="radio"]:not(:checked) + label::before, [type="radio"]:not(:checked) + label::after {
                border: 2px solid #fff;
            }
    </style>
</div>
<div class="table-box mr-4  iwb-bootstrap-table">
    @Html.Action("ToolMenu", "Layout", new { pageName = ViewBag.ActiveMenu, searchForm })
    <table id="table" data-url="/api/services/app/StoreStatistics/QueryEnterOutRecord"
           data-striped="true" data-id-field="id" data-unique-id="id"
           data-method="post"
           data-side-pagination="server"
           data-content-type="application/x-www-form-urlencoded; charset=UTF-8"
           data-cache="false"
           data-pagination="true" data-page-size="30" data-page-number="1" data-page-list="[30,50,100,200]" data-pagination-detail-h-align="right" data-pagination-h-align="left"
           data-query-params="QueryParams"
           data-response-handler="ResponseHandler"
           data-click-to-select="true"
           data-single-select="true">
        <thead>
            <tr class="row">
                <th data-align="center" data-field="productionOrderNo">批次号</th>
                <th data-align="center" data-field="productName">名称</th>
                <th data-align="center" data-field="model">规格</th>
                <th data-align="center" data-field="rigidity">硬度</th>
                <th data-align="center" data-field="material">材质</th>
                <th data-align="center" data-field="surfaceColor">表色</th>
                <th data-align="center" data-field="enterOutFlag" data-formatter="FlagFormatter">标志</th>
                <th data-align="center" data-field="quantity">数量(千件)</th>
                <th data-align="center" data-field="storeHouseId" data-formatter="StoreHouseIdFormatte">仓库</th>
                <th data-align="center" data-field="dateTiem">日期</th>
                <th data-align="center" data-field="customerId">客户编号</th>
                <th data-align="center" data-field="customerName">客户名称</th>
                <th data-align="center" data-field="productNo">编号</th>

            </tr>
        </thead>
    </table>
</div>

@section modal{
    @Html.Partial("Modals/Query/_Product", "KeyWords-8")
}
<section style="display: none">
    <select id="hid-type">
        <option value=""></option>
    </select>
    @Html.DropDownList("hid-storeHouse", storeHouseList)
</section>
@section scripts
{
    <script src="~/Content/Scripts/MyScript/ExportExcel.js"></script>
    <script src="~/Content/Plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
    <script src="~/Content/Plugins/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
    <script type="text/javascript">
        var datePickerOpt = {
            language: 'zh-CN',
            format: "yyyy-mm-dd",
            todayBtn: true,
            autoclose: true,
            startView: 2,
            minView: 2,
            maxView: 4,
            //showSecond: true,
            //showHours: true,
            //minuteStep: 10
        };

        $(function () {
            $("#tableTool").css("min-height", "40px");
            $("#KeyWords-6").datetimepicker(datePickerOpt);
            $("#KeyWords-7").datetimepicker(datePickerOpt);
            var nowDate = new Date();
            $("#KeyWords-6").val(new Date(nowDate.getTime() - 30 * 24 * 60 * 60 * 1000).Format("yyyy-MM-dd"));
            LoadTable();
            //BtnSearch();
            funs["btnExportExcel"] = function (url) {
                BtnExportExcel(url);
            }
            $("#Tool1").append(
                '<div class="tool-radio"><input name="proType" type="radio" id="allFlag" checked value="" /><label for="allFlag">全部</label></div>' +
                '<div class="tool-radio"><input name="proType" type="radio" id="enterFlag" value="-1" /><label for="enterFlag">出库</label></div>' +
                '<div class="tool-radio"><input name="proType" type="radio" id="outFlag" value="1" /><label for="outFlag">入库</label></div>');

            $(".tool-radio input[type='radio']").on('click',
                function (e) {

                    GetSearchList();
                    RefreshTable();
                });
        });
        //function BtnSearch() {
        //    GetSearchList();
        //    console.log(JSON.stringify(_searchList));
        //    SaveAjax({
        //        url: window.appUrl + "StoreStatistics/QueryEnterOutRecord",
        //        data: JSON.stringify(_searchList),
        //        contentType:"application/json",
        //        isValidate: false,
        //        isAlert: false,
        //        success: function (res) {
        //            $("#table tbody").empty();
        //            if (res && res.length > 0) {
        //                var curProductNo = "";
        //                var index = 1;
        //                res.forEach(function(r) {
        //                    var tr = "";
        //                    if (r.productNo !== curProductNo) {
        //                        index = 1;
        //                        curProductNo = r.productNo;
        //                        tr += '<tr class="trProduct"><td >';
        //                        tr += '<span class="left">编号:[ </span> ' + r.productNo + '<span> ]</span></td><td>';
        //                        tr += '<span class="left">名称:[ </span> ' + r.productName + '<span> ]</span></td><td>';
        //                        tr += '<span class="left">表色:[ </span> ' + r.surfaceColor + '<span> ]</span></td><td>';
        //                        tr += '<span class="left">规格:[ </span> ' + r.model + '<span> ]</span></td><td>';
        //                        tr += '<span class="left">材质:[ </span> ' + r.material + '<span> ]</span></td><td>';
        //                        tr += '<span class="left">硬度:[ </span> ' + r.rigidity + '<span> ]</span></td><td>';
        //                        //tr += '</td></tr>';
        //                        //tr += '<tr class="trProduct"><td colspan="5">';
        //                        tr += '<span class="left">当前库存:</span>' + r.allQuantity + '<span> 千件</span></td><td>';
        //                        tr += '<span class="left">冻结库存:</span>' + r.allFreezeQuantity + '<span> 千件</span>';
        //                        tr += '</td></tr>';
        //                    }
        //                    tr += '<tr>' +
        //                        '<td>' + index +'</td>' +
        //                        '<td>' + (r.enterOutFlag===1?'入库':'出库')+'</td>' +
        //                        '<td  colspan="3">' + r.quantity +'</td>' +
        //                        '<td  colspan="2">' + r.dateTiem +'</td>' +
        //                        '<td>' + r.userIDLastMod+'</td>' +
        //                        '</tr>';
        //                    index++;
        //                    $("#table tbody").append(tr);
        //                });
        //            }
        //        }
        //    });
        //}
        function BtnExportExcel(url) {
            //ExportExcel('table', '库存出入库记录', 'exportCss');
            SaveAjax({
                url: window.appUrl + 'StoreStatistics/ExportExcel',
                data: JSON.stringify(_searchList),
                contentType: "application/json",
                isValidate: false,
                isAlert: false,
                success: function(res) {
                    window.location.href = "/" + res;
                }
            });
        }

        function GetSearchList() {
            var count = $("#SearchForm").find(".KeyWords").length;
            window._searchList = [];
            var outType = $('input[name="proType"]:checked').val();
            if (outType) {
                window._searchList.push({
                    KeyWords: outType,
                    KeyField: "EnterOutFlag",
                    FieldType: "1",
                    ExpType: "0"
                });
            }
            for (var i = 1; i <= count; i++) {
                var keyWords = $("#KeyWords-" + i).val();
                if (keyWords) {
                    var keyField = $("#KeyField-" + i).val();
                    var fieldType = $("#FieldType-" + i).val();
                    var expType = $("#ExpType-" + i).val();
                    if (keyField === 'dateTiem' && expType === "5") {
                        var endDate = new Date(keyWords);
                        keyWords = new Date(endDate.getTime() + 24 * 60 * 59 * 1000).Format("yyyy-MM-dd");
                    }
                    _searchList.push({
                        KeyWords: keyWords,
                        KeyField: keyField,
                        FieldType: fieldType,
                        ExpType: expType
                    });
                }
            }
        }
        function StoreHouseIdFormatte(v, r) {
            return '<span class="table-action">' + $("#hid-storeHouse option[value=" + v + "]").html() + '</span>';
        }
        function FlagFormatter(v, r) {
            if (v === 1) {
                return '<span class="label label-info">入库</span>';
            } else {
                return '<span class="label label-danger">出库</span>';
            }

        }
    </script>

}