@{
    Layout = "~/Views/Shared/_AMESLayout.cshtml";
}

<div class="layui-card">
    <div class="layui-card-header">
        <div class="layui-form">
            <div class="layui-form-item">
                <div class="layui-inline"><i class="fa fa-file-text-o fa-fw"></i>錫膏管制作業</div>
            </div>
        </div>
    </div>
    <div class="layui-card-body">
        <div class="layui-form">
            <div class="layui-row">
                <div class="layui-form-item">
                    <div class="layui-col-sm4">
                        <div class="layui-inline">
                            <label class="layui-form-label">錫膏編號</label>
                            <div class="layui-input-inline" style="width:150px">
                                <input id="solderPasteNo" name="solderPasteNo" autocomplete="off" oninput="let p=this.selectionStart;this.value=this.value.toUpperCase();this.setSelectionRange(p, p);" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-sm4">
                        <div class="layui-inline">
                            <label class="layui-form-label">收貨日期</label>
                            <div class="layui-input-inline" style="width:80px">
                                <input id="strDate" name="strDate" autocomplete="off" class="layui-input" readonly="">
                            </div>
                            <div class="layui-form-mid">～</div>
                            <div class="layui-input-inline" style="width:80px">
                                <input id="endDate" name="endDate" autocomplete="off" class="layui-input" readonly="">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-sm3">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width:60px">錫膏狀態</label>
                            <div class="layui-input-inline" style="width:120px;">
                                <select id="status" name="status" lay-filter="status" lay-submit>
                                    <option value="">全部</option>
                                    <option value="WO">未使用</option>
                                    <option value="I">入冰箱</option>
                                    <option value="O">出冰箱</option>
                                    <option value="U">開封</option>
                                    <option value="C">使用完</option>
                                    <option value="X">報廢</option>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="layui-col-sm1">
                        <div class="layui-inline layui-show-xs-block">
                            <button class="layui-btn layui-btn-sm layui-btn-normal" lay-submit lay-filter="querysubmit">
                                <i class="layui-icon layui-icon-sm">&#xe615;</i>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <table class="layui-hide" id="query" lay-filter="query"></table>
    </div>
</div>

@section Scripts{
    <script type="text/javascript">

        layui.use(['form', 'layer', 'laydate'], function () {
            form = layui.form;
            laydate = layui.laydate;
            laydate.render({
                elem: '#strDate'
                , trigger: 'click'
                , format: 'yyyy/MM/dd'
                , theme: 'grid'
            });

            laydate.render({
                elem: '#endDate'
                , trigger: 'click'
                , format: 'yyyy/MM/dd'
                , theme: 'grid'
            });
        });
        //监听表单提交事件
        hg.form.onsubmit('querysubmit', function (data) {
            hg.msghide("重新載入資料..");
            table && table.reload(data);
        });
        var tableCols = [[
            {
                field: 'solderPasteNo',
                title: '錫膏編號',
                sort: true,
                width: 100,
                fixed: 'left',
            },
            {
                field: 'statusName',
                title: '狀態',
            },
            {
                field: 'vendor',
                title: '廠商',
                width: 150,
            },
            {
                field: 'description',
                title: '規格',
                width: 150,
            },
            {
                field: 'alloy',
                title: '合金',
                width: 150,
            },
            {
                field: 'lot',
                title: 'LOT',
            },
            {
                field: 'manufactoringDate',
                title: '製造日期',
                width: 95,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.manufactoringDate, "yyyy/MM/dd") }}</div>'
            },
            {
                field: 'effectiveDate',
                title: '有效日期',
                width: 95,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.effectiveDate, "yyyy/MM/dd") }}</div>'
            },
            {
                field: 'receiptDate',
                title: '收貨日期',
                width: 95,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.receiptDate, "yyyy/MM/dd") }}</div>'
            },
            {
                field: 'inTime',
                title: '入冰箱時間',
                width: 145,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.inTime, "yyyy/MM/dd HH:mm:ss") }}</div>'
            },
            {
                field: 'inUserName',
                title: '人員',
                width: 100,
            },
            {
                field: 'outTime',
                title: '出冰箱時間',
                width: 145,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.outTime, "yyyy/MM/dd HH:mm:ss") }}</div>'
            },
            {
                field: 'outUserName',
                title: '人員',
                width: 100,
            },
            {
                field: 'useTime',
                title: '開封時間',
                width: 145,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.useTime, "yyyy/MM/dd HH:mm:ss") }}</div>'
            },
            {
                field: 'useUserName',
                title: '人員',
                width: 100,
            },
            {
                field: 'completedTime',
                title: '用完時間',
                width: 145,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.completedTime, "yyyy/MM/dd HH:mm:ss") }}</div>'
            },
            {
                field: 'completedUserName',
                title: '人員',
                width: 100,
            },
            {
                field: 'scrapTime',
                title: '報廢時間',
                width: 145,
                sort: true,
                templet: '<div>{{ layui.util.toDateString(d.scrapTime, "yyyy/MM/dd HH:mm:ss") }}</div>'
            },
            {
                field: 'scrapUserName',
                title: '人員',
                width: 100,
            }]
        ];

        //新增按鈕
        var toolbar = [{
            text: '新增管制作業',
            layuiicon: '&#xe608;',
            class: 'layui-btn',
            handler: function () {
                hg.open('新增錫膏管制作業', '/PCB/PCB017C', 400, 400);

            }
        }];
        //基本資料表格
        var table = hg.table.datatable('query', '錫膏紀錄', '/PCB/PCB017Query', {}, tableCols, toolbar, true, 'full-100', ['filter', 'print', 'exports']);

    </script>


}