@{
    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 class="layui-form-item layui-layout-left">
                <div class="layui-inline">
                    <label class="layui-form-label">請選擇群組</label>
                    <div class="layui-input-inline">
                        <select id="errorGroup" lay-filter="errorGroup" lay-verify="required" lay-submit asp-items="@ViewBag.ErrorGroupList">
                            <option value="*">全部</option>
                        </select>
                    </div>
                    <input id="errorGroupNo" type="hidden" name="errorGroupNo" value="*" />
                    <label class="layui-form-label">請選擇類別</label>
                    <div class="layui-input-inline">
                        <select id="errorClass" lay-filter="errorClass" lay-verify="required" lay-submit asp-items="@ViewBag.ErrorClassList">
                            <option value="*">全部</option>
                        </select>
                    </div>
                    <input id="errorClassNo" type="hidden" name="errorClassNo" value="*" />
                </div>
                <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 class="layui-card-body">
        <table class="layui-hide" id="test" lay-filter="test"></table>
    </div>
</div>

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

        function getErrorClassList(data)
        {
            $.ajax(
                {
                    url: "@Url.Action("GetErrorClassJson", "PPS")",
                    dataType: 'json',
                    data: { "group_no": $("#errorGroupNo").val()},
                    //contentType: "application/json",
                    type: 'post',
                    success: function (result)
                    {
                        console.info(result.data);
                        $("#errorClass").empty();//清空下拉框的值
                        $.each(result.data, function (index, item) {
                            $("#errorClass").append(new Option(item.text, item.value));// 下拉菜单里添加元素
                            //$("#errorClass").append($("<option>").text(item.text).val(item.value))
                        });
                        
                        layui.form.render("select");//重新渲染 固定写法
                    },
                    error: function (result)
                    {
                        alert(result);
                    }
                });
        };

        layui.use(['form', 'layer'], function () {
            form = layui.form;

            form.on('select(errorGroup)', function (data) {
                $("#errorGroupNo").val(data.value);

                getErrorClassList(data.value);

                var qs = $('button[lay-filter="querysubmit"]');
                qs.click();
            });

            form.on('select(errorClass)', function (data) {
                $("#errorClassNo").val(data.value);

                var qs = $('button[lay-filter="querysubmit"]');
                qs.click();
            });
        });

        //监听表单提交事件
        hg.form.onsubmit('querysubmit', function (data) {
            table && table.reload(data);
        });
        var tableCols = [[
            {
                field: 'reasonNo',
                width: 200,
                title: '異常原因代碼'
            },
            {
                field: 'reasonDesc',
                title: '異常原因描述'
            },
            {
                field: 'errorType',
                title: '內外部損耗分類'
            },
            {
                field: 'right',
                width: 200,
                title: '操作',
                fixed: 'right',
                templet: function (d) {
                    return '<a class="layui-btn layui-btn-normal layui-btn-xs layui-icon layui-icon-edit" lay-event="edit">修改</a> <a class="layui-btn layui-btn-danger layui-btn-xs layui-icon layui-icon-delete" lay-event="del">删除</a>'
                }
            }]
        ];

        //通过行tool编辑,lay-event="edit"
        function edit(obj) {
            if (obj.data.reasonNo) {
                var no = errorGroupNo.value;
                hg.open('修改異常原因', '/PPS/PPS007U/' + obj.data.reasonNo + ',' + no, 800, 640);
            }
        }

        //通过行tool删除,lay-event="del"
        function del(obj) {
            if (obj.data.reasonNo) {
                hg.confirm("異常原因:" + obj.data.reasonDesc + ",确定要删除吗?", function () {
                    $.ajax({
                        url: '/PPS/PPS007D',
                        data: { id: obj.data.reasonNo },
                        type: 'POST',
                        success: function (data) {
                            if (data.success) {
                                obj.del(); //只删本地数据
                                hg.msghide("删除成功!");
                            }
                            else {
                                hg.msg(data.msg);
                            }
                        },
                        error: function () {
                            hg.msg("网络请求失败!");
                        }
                    });
                });
            }
        }
        var toolbar = [{
            text: '新增',
            layuiicon: '&#xe608;',
            class: 'layui-btn-normal',
            handler: function () {
                var id = errorClassNo.value;
                var no = errorGroupNo.value;
                hg.open('新增異常原因', '/PPS/PPS007C/' + id + ',' + no, 800, 640);

            }
        }
        ];
        //基本数据表格
        var table = hg.table.datatable('test', '異常原因維護', '/PPS/GetErrorReasonsByClass/' + errorClassNo.value, {}, tableCols, toolbar, true, 'full-100', ['filter', 'print', 'exports']);
    </script>
}