@{
    ViewData["Title"] = "錫膏規格維護";
    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> @ViewBag.Title</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" style="width:80px">錫膏代碼</label>
                            <div class="layui-input-inline" style="width:150px">
                                <input id="serialNo" name="serialNo" autocomplete="off" class="layui-input">
                            </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:150px">
                                <input id="description" name="description" autocomplete="off" class="layui-input">
                            </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:150px">
                                <input id="vendor" name="vendor" autocomplete="off" class="layui-input">
                            </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'], function () {
            var form = layui.form;
        });

        // 監聽查詢
        hg.form.onsubmit('querysubmit', function (data) {
            hg.msghide("重新載入資料..");
            table && table.reload(data);
        });

        var tableCols = [[
            { field: 'serialNo', title: '錫膏代碼', sort: true },
            { field: 'description', title: '規格' },
            { field: 'alloy', title: '合金' },
            { field: 'vendor', title: '廠商' },
            { field: 'type', title: '種類' },
            {
                title: '操作', align: 'center', width: 160,
                templet: function (d) {
                    var btnEdit = `<a class='layui-btn layui-btn-xs layui-icon layui-icon-edit' lay-event='edit'>修改</a>`;
                    var btnStatus = "";
                    if (d.statusNo == 'A') {
                        btnStatus = `<a class='layui-btn layui-btn-danger layui-btn-xs layui-icon layui-icon-delete' lay-event='status'>停用</a>`;
                    } else {
                        btnStatus = `<a class='layui-btn layui-btn-normal layui-btn-xs layui-icon layui-icon-ok' lay-event='status'>啟用</a>`;
                    }
                    return btnEdit + btnStatus;
                }
            }
        ]];

        // 編輯
        function edit(obj) {
            if (obj.data.serialNo) {
                hg.open('修改錫膏規格', '/PCB/PCB020U?id=' + obj.data.serialNo, 500, 420);
            }
        }
        // 停用/啟用
        function status(obj) {
            var targetStatus = obj.data.statusNo == 'A' ? 'S' : 'A';
            var msg = targetStatus == 'S' ? '停用' : '啟用';
            hg.confirm("確定要" + msg + "錫膏代碼【" + obj.data.serialNo + "】嗎？", function () {
                $.ajax({
                    url: '/PCB/PCB020S',
                    data: { id: obj.data.serialNo, status: targetStatus },
                    type: 'POST',
                    success: function (data) {
                        if (data.success) {
                            hg.msghide(msg + "成功！");
                            var qs = $('button[lay-filter="querysubmit"]');
                            qs.click();
                        } else {
                            hg.msg(data.msg);
                        }
                    },
                    error: function () {
                        hg.msg("網路請求失敗！");
                    }
                });
            });
        }
        // 新增按鈕
        var toolbar = [{
            text: '新增',
            layuiicon: '&#xe608;',
            class: 'layui-btn',
            handler: function () {
                hg.open('新增錫膏規格', '/PCB/PCB020C', 500, 420);
            }
        }];
        // 表格
        var table = hg.table.datatable('query', '錫膏規格查詢', '/PCB/PCB020Query', {}, tableCols, toolbar, false, 'full-100', ['filter', 'print', 'exports']);
    </script>
}