@{
    ViewData["Title"] = "外包廠工時大表查詢";
    Layout = "~/Views/Shared/_AMESLayout.cshtml";
}

<div class="layui-card">
    <div class="layui-card-header">
        <div class="layui-inline"><i class="fa fa-file-text-o fa-fw"></i> @ViewBag.Title</div>
    </div>
    <div class="layui-form">
        <div class="layui-form">
            <div class="layui-form-item">
                <div class="layui-inline" style="margin-right:0px;">
                    <label class="layui-inline layui-form-label" style="width:80px;">製程單位</label>
                    <div class="layui-input-inline" style="width: 90px; margin-right: 5px;">
                        @if (@ViewBag.FactoryUnitNo != null)
                        {
                            <select style="width:90px;" lay-filter="unitNo" lay-submit id="unitNo" lay-search name="unitNo">
                                @foreach (var indexFactoryUnit in @ViewBag.FactoryUnit)
                                {
                                    @if (indexFactoryUnit.Value == @ViewBag.FactoryUnitNo)
                                    {
                                        <option value="@ViewBag.FactoryUnitNo" selected>@indexFactoryUnit.Text</option>
                                    }
                                    else
                                    {
                                        <option value="@indexFactoryUnit.Value">@indexFactoryUnit.Text</option>
                                    }
                                }
                            </select>
                        }
                        else
                        {
                            <select style="width:90px;" lay-filter="unitNo" lay-submit id="unitNo" lay-search name="unitNo" asp-items="@ViewBag.FactoryUnit">
                            </select>
                        }
                    </div>
                    <input id="unitId" type="hidden" name="unitId" />
                </div>
                <div class="layui-inline" style="margin-right:5px;">
                    <label class="layui-inline layui-form-label">料號</label>
                    <div class="layui-input-inline">
                        <input type="text" name="modelname" id="modelname" placeholder="请输入料號" autocomplete="off" class="layui-input" value=@ViewBag.modelname>
                    </div>
                </div>
                <div class="layui-inline" style="margin-left:0px;">
                    <button id="btnSearch" class="layui-btn">
                        <i class="layui-icon">&#xe615;</i>搜索
                    </button>
                </div>
            </div>
        </div>
        <table id="MydataTable" class="layui-table">
            <thead id="MyTabletHead">
                <tr>
                    <th style="width:5%;">#</th>

                </tr>
            </thead>
            <tbody id="MyTableTbody">
            </tbody>
        </table>
    </div>


</div>
@section Scripts{
    <script type="text/javascript">
        var rdoUnitTypeValue = null;
        var modelname = null;
        var unit = null;
        var lineID = null;
        var meditID = null;
        layui.use(['form', 'layer', 'laydate'], function () {
            form = layui.form;
            form.on('select(unitNo)', function (data) {
                var data = $("#unitNo").val();
                //console.log(data);
                getableHeader(data);
            
            });
        });

        ////搜索
        $('#btnSearch').click(function () {
            hg.msghide("刷新数据！");
            var ModelName = $("#modelname").val();
            var UnitNo = $("#unitNo").val();
            var UserId = @ViewBag.UserID;
            seachtableData(UnitNo, ModelName, UserId);
        });

        function getableHeader(sUnitNo) {
            $.ajax({
                url: '/WHS/WHS022ColumnNameQuery',
                data: { sUnitNo: sUnitNo },
                type: 'GET',
                success: function (res) {
                    //console.log(res);
                    var tableHeaders;
                    $.each(res.data, function (i, val) {
                        tableHeaders += '<th id="COLUMN_' + (res.count - 1 - i) + '" name="' + (i+1) + '">' + val.columN_NAME + '</th>';
                    });
                    $("#MyTabletHead").empty();
                    $("#MyTableTbody").empty();
                    $("#MyTabletHead").append('<tr>' + tableHeaders + '</tr>');
                },
                error: function () {
                    hg.msg("网络请求失败！");
                }
            });
        }

        function seachtableData(UnitNo, ModelName, UserId) {
            $.ajax({
                url: '/WHS/WHS023OWByQuery',
                cache: false,
                data: {
                    sUnitNo: UnitNo,
                    sItemNo: ModelName,
                    sUserId: UserId
                },
                type: 'GET',
                success: function (res) {
                    var tableColumn = "";
                    $("#MyTableTbody").empty();
                    const HeadCount = document.getElementById('COLUMN_0').getAttribute("name")
                    $.each(res.data, function (i, val) {
                        tableColumn += '<td><input class="layui-input" ';
                        tableColumn += ' disabled="enabled"';
                        var tabColData = val.outsourcE_VALUE
                        if (tabColData == null)
                            tabColData = '';
                        tableColumn += ' value="' + tabColData + '"></td>';
                        if ((i+1) % HeadCount == 0) {
                            $("#MyTableTbody").append('<tr>' + tableColumn + '</tr>');
                            tableColumn = "";
                        }
                    });
                },
                error: function () {
                    hg.msg("网络请求失败！");
                }
            });
        }
    </script>

}