@using ShwasherSys.Authorization.Permissions
@using ShwasherSys.Models.Layout
@using ShwasherSys.Models.Modal
@{
    /**/

    ViewBag.ActiveMenu = PermissionNames.PagesPackInfoToBePackageInfoMg; //The menu item will be active for this page.
    ViewBag.Title = "产品待包装信息";
    string employee = ViewBag.Employee;
    List<SelectListItem> productApplyStatus = ViewBag.ProductApplyStatus;
    List<SelectListItem> applyStatus = ViewBag.ApplyStatus;
    List<SelectListItem> closeStatus = new List<SelectListItem>()
{
new SelectListItem(){Text = @"未关闭",Value = "false",Selected = true},
new SelectListItem(){Text = @"已关闭",Value = "true"}
};
    var searchForm = new SearchFormViewModal(new List<SearchItem>()
{
new SearchItem("productionOrderNo","排产单号"),

    new SearchItem("productName","产品名称"),
    new SearchItem("model","规格"),
   new SearchItem("material","材质"),
    new SearchItem("applyDate", "申请日期",FiledType.Dnull,ExpType.GreaterOrEqual),
    new SearchItem("applyDate", "到",FiledType.Dnull,ExpType.LessOrEqual),
    new SearchItem("semiProductNo","半成品编码").SetSearchIcon("query_semiProduct_modal"),
new SearchItem("applyStatus","申请状态" )
.SetSearchItem(applyStatus),
new SearchItem("isClose","关闭状态" ,FiledType.B,ExpType.Equal)
.SetSearchItem(closeStatus),



}, false);
}
@section css{
    <link href="~/Content/Plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
}
<section style="display: none">
    @Html.DropDownList("hide-ApplyStatus", applyStatus)

    @Html.DropDownList("hide-ProductApplyStatus", productApplyStatus)
</section>
<style>
    .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;
    }

    .package-unit {
        border: 1px solid #583d9c;
        border-radius: 3px;
        padding: 10px 0 0;
        display: table;
        width: 96%;
        margin-left: 2%;
    }

        .package-unit:not(:last-of-type) {
            margin-bottom: 5px;
        }

        .package-unit .form-group-sm > div {
            margin-bottom: 10px;
        }

    #showZoreCheckBox + label::before, #showZoreCheckBox:not(.filled-in) + label::after {
        top: -10px;
        left: -5px;
        width: 18px;
        height: 18px;
    }

    #showZoreCheckBox:checked + label::before {
        top: -10px;
        left: -8px;
        width: 11px;
        height: 15px;
        border-top: 2px solid transparent;
        border-left: 2px solid transparent;
        border-right: 2px solid #26a69a;
        border-bottom: 2px solid #26a69a;
        transform: rotate(40deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }
</style>
<div class="table-box iwb-bootstrap-table">
    @Html.Action("ToolMenu", "Layout", new { pageName = ViewBag.ActiveMenu, searchForm })
    <table id="table"
           data-url="/api/services/app/PackInfoApply/GetAll" data-id-field="id" data-unique-id="id"
           data-striped="true" data-click-to-select="true" data-single-select="true"
           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-h-align="left" data-pagination-detail-h-align="right"
           data-query-params="QueryParams" data-response-handler="ResponseHandler">
        <thead>
            <tr class="row" id="header">
                <th data-field="state" data-checkbox="true"></th>
                <th data-align="center" data-field="processingNum" data-formatter="ProcessingNumFormatter">待处理明细</th>
                <th data-align="center" data-field="productionOrderNo">流转单编号</th>
                <th data-align="center" data-field="" data-formatter="PackageProductNoFormatter">包装前产品编码</th>
                <th data-align="center" data-field="applyQuantity">申请包装数量</th>
                <th data-align="center" data-field="remainApplyQuantity" data-formatter="RemainApplyQuantityFormatter">待包装数量</th>
                <th data-align="center" data-field="surfaceColor">表色</th>
                <th data-align="center" data-field="productName">产品名称</th>
                <th data-align="center" data-field="model">规格</th>
                <th data-align="center" data-field="material">材质</th>
                <th data-align="center" data-field="rigidity">硬度</th>
                <th data-align="center" data-field="partNo">零件号</th>
                <th data-align="center" data-field="remark">备注</th>
                <th data-align="center" data-field="applyDate" data-formatter="DateFormatter">申请时间</th>
                <th data-align="center" data-field="applyStatus" data-formatter="ApplyStatusFormatter">申请状态</th>
            </tr>
        </thead>
    </table>
</div>
 
@section modal{
    <!--Main Modal-->
     @Html.Partial("Modals/Query/_SemiProduct", "KeyWords-6")
    @Html.Partial("Modals/Query/_Product", "productNo,productName")

   
}

@section scripts
{
    <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">
    

        $(function () {
            $("#KeyWords-9").val("false").select2();
            $("#Tool1").append(
                '<div  class="tool-radio"><input name="packType" type="radio" id="sProduct" checked value="1"/><label for="sProduct">半成品包装</label></div>' +
                '<div  class="tool-radio"><input name="packType" type="radio" id="fProduct" value="2"/><label for="fProduct">成品包装</label></div>');
			 
            $(".tool-radio input[type='radio']").on('click',
                function (e) {
                   
                    //document.getElementById("SearchForm").reset();
                    GetSearchList();
                    RefreshTable(); 
                    
                    //$("#table").bootstrapTable('resetView', { height: 800 });
                });
            GetSearchList(); 
			LoadTable();
        });
        
		function GetSearchList() {
			var count = $("#SearchForm").find(".KeyWords").length;
			window._searchList = [];
			var packType = $('input[name="packType"]:checked').val();
			if (packType) {
				window._searchList.push({ KeyWords: packType, KeyField: "PackType", FieldType: "1", ExpType: "0" });
				window._searchList.push({ KeyWords: 0, KeyField: "RemainApplyQuantity", FieldType: "7", ExpType: "2" });
			}
			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();
					window._searchList.push({
						KeyWords: keyWords,
						KeyField: keyField,
						FieldType: fieldType,
						ExpType: expType
					});
				}
			}
		}
    </script>



    <script>
        function PackageProductNoFormatter(v, r) {
            var packType = $('input[name="packType"]:checked').val();

            if (packType === "1") {
                return '<span class="label label-info">' + r.semiProductNo + '</span>';
            } else {
                return '<span class="label label-danger">' + r.productNo + '</span>';
            }

        }

        function ProcessingNumFormatter(v, r) {

            if (v === 0) {
                //return '<span class="label label-info">' + v+ '</span>';
                return '';
            } else {
                return '<span class="label label-danger">待处理:' + v + '</span>';
            }

        }

        function ApplyStatusFormatter(v, r) {
            if (r.isClose) {
                return '<span class="label label-primary">已结束</span>';
            }
            var name = $("#hide-ApplyStatus option[value='" + v + "']").text();
            if (v === "1") {
                return '<span class="label label-info">' + name + '</span>';
            } else if (v === "2") {
                return '<span class="label label-success">' + name + '</span>';
            } else if (v === "3") {
                return '<span class="label label-danger">' + name + '</span>';
            }
            return '<span class="label label-info">' + name + '</span>';
        }

        function ProductApplyStatusFormatter(v, r) {
            if (r.isClose) {
                return '<span class="label label-primary">已结束</span>';
            }
            var name = $("#hide-ProductApplyStatus option[value='" + v + "']").text();
            if (v === 1) {
                return '<span class="label label-info">' + name + '</span>';
            } else if (v === 2) {
                return '<span class="label label-success">' + name + '</span>';
            } else if (v === 3) {
                return '<span class="label label-warning">' + name + '</span>';
            } else if (v === 4) {
                return '<span class="label label-danger">' + name + '</span>';
            } else if (v === 5) {
                return '<span class="label label-info">' + name + '</span>';
            }
            return '<span class="label label-info">' + name + '</span>';
        }

		function RemainApplyQuantityFormatter(v, r) {
            if (v > 0) {
				return '<span class="label label-danger" style="font-size:13px;">' + v + '</span>'
            }
        }
     
    </script>
}