<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layuiAdmin 后台管理员</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="decorator" content="base"/>
</head>
<body>

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <a href="${ctx}/bill/product/getList"><li class="layui-this">发单产品</li></a>
            </ul>
        </div>
        <div class="layui-card-body">
            <table class="layui-hide" lay-skin="row" id="test" lay-filter="test"></table>
            <script type="text/html" id="toolbarDemo">
                <div class="layui-btn-container">
                    <button class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon layui-icon-add-1"></i>添加
                    </button>
                </div>
            </script>
        </div>
    </div>
</div>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script src="${ctxPlugin}/lib/ueditor/1.4.3/third-party/jquery-1.10.2.js"></script>
<script>
    layui.use(['table', 'layer', 'laypage'], function () {
        $ = layui.$;
        table = layui.table;
        layer = layui.layer;
        laypage = layui.laypage;

        table.render({
            elem: '#test',
            height: 'full-150'
            , toolbar: '#toolbarDemo'
            , defaultToolbar: false
            , limits: [20, 50, 100]
            , limit: 20
            , page: true //开启分页
            , url: '${ctx}/bill/product/factoryProduct'
            , request: {
                pageName: 'pageNo' //页码的参数名称，默认：page
                , limitName: 'PageSize' //每页数据量的参数名，默认：limit
            }
            , cols: [[
                {filed: 'number', width: 100, type: 'numbers', title: '序号'}
                , {field: 'do', width: 200, title: '操作', sort: false, align: 'center', toolbar: '#barDemo'}
                , {field: 'brand', width: 200, title: '品牌', align: 'center'}
                , {field: 'category', width: 200, title: '品类', sort: false, align: 'center'}
                , {
                    field: 'model', minWidth: 300, title: '型号', align: 'center',
                    templet: '<div><span title="{{d.model}}">{{d.model}}</span></div>'
                }
            ]]
        });

        //头工具栏事件
        table.on('toolbar(test)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'add':
                    layer.open({
                        type: 2
                        , title: '新增'
                        , content: '${ctx}/bill/product/goAddProduct'
                        , area: ['800px', '460px']
                        , btn: ['确定', '取消']
                        , yes: function (index, layero) {
                            var iframeWindow = window['layui-layer-iframe' + index]
                                , submitID = 'LAY-user-front-submit'
                                , submit = layero.find('iframe').contents().find('#' + submitID);

                            //监听提交
                            iframeWindow.layui.form.on('submit(' + submitID + ')', function (data) {
                                var field = data.field; //获取提交的字段
                                if (isBlank(field.brandName)) {
                                    layer.msg("请填写品牌", {icon: 5, anim: 6});
                                    return false;
                                } else if (isBlank(field.categoryName)) {
                                    layer.msg("请填写品类", {icon: 5, anim: 6});
                                    return false;
                                } else if (isBlank(field.modelName)) {
                                    layer.msg("请填写型号", {icon: 5, anim: 6});
                                    return false;
                                } else {
                                    addMark(field, index);
                                }
                            });
                            submit.trigger('click');
                        },
                        success : function(layero) {
                            layero.find('.layui-layer-btn').css('text-align', 'center');
                            layero.find('.layui-layer-btn').find(".layui-layer-btn0").css("background-color","#009688");
                        }
                    });
                    break;
            }
            ;

        });

        table.on('tool(test)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                var editId = data.id;
                layer.open({
                    type: 2
                    ,
                    title: '编辑'
                    ,
                    content: '${ctx}/bill/product/goAddProduct?editId=' +editId
                    ,
                    area: ['800px', '460px']
                    ,
                    btn: ['确定', '取消']
                    ,
                    yes: function (index, layero) {
                        var iframeWindow = window['layui-layer-iframe' + index]
                            , submitID = 'LAY-user-front-submit'
                            , submit = layero.find('iframe').contents().find('#' + submitID);

                        //监听提交
                        iframeWindow.layui.form.on('submit(' + submitID + ')', function (data) {
                            var field = data.field; //获取提交的字段
                            editMark(field, index, editId);
                        });
                        submit.trigger('click');
                    },
                    success : function(layero) {
                        layero.find('.layui-layer-btn').css('text-align', 'center');
                        layero.find('.layui-layer-btn').find(".layui-layer-btn0").css("background-color","#009688");
                    }
                });
            } else if (obj.event === 'del') {
                var data = obj.data;
                layer.confirm('确认要删除选中数据吗？', {
                    btn: ['确定', '取消']//按钮
                    ,icon:3
                }, function (index) {
                    delData(data.id, index);
                });
            }
        });
    });


    var noRepeatAdd = false;

    function addMark(data, index) {
        if (noRepeatAdd) {
            return;
        }
        noRepeatAdd = true;
        $.ajax({
            url: '${ctx}/bill/product/productSave',
            type: 'post',
            data: {
                category: data.categoryName,
                brand: data.brandName,
                models: data.modelName
            },
            success: function (data) {
                if (data.code == "200") {
                    layer.msg("添加成功！", {icon: 1});
                    table.reload('test'); //数据刷新
                    layer.close(index); //关闭弹层
                } else if (data.code == "204") {
                    layer.msg("添加失败！", {icon: 2});
                    table.reload('test'); //数据刷新
                } else if (data.code == "205") {
                    layer.msg("品牌品类信息已存在！", {icon: 2});
                } else {
                    layer.msg("请刷新！");
                }
            },
            complete: function () {
                noRepeatAdd = false;
            }
        });
    }

    var noRepeat = false;

    function editMark(data, index, id) {
        if (noRepeat) {
            return;
        }
        noRepeat = true;

        $.ajax({
            url: '${ctx}/bill/product/productSave',
            type: 'post',
            data: {
                id: id,
                category: data.categoryName,
                brand: data.brandName,
                models: data.modelName
            },
            success: function (data) {
                if (data.code == "201") {
                    layer.msg("编辑成功！", {icon: 1});
                    table.reload('test'); //数据刷新
                    layer.close(index); //关闭弹层
                } else if (data.code == "204") {
                    layer.msg("编辑失败！", {icon: 2});
                } else if (data.code == "205") {
                    layer.msg("品牌品类信息已存在！", {icon: 2});
                } else{
                    layer.msg("请刷新！");
                }
            },
            complete: function () {
                noRepeat = false;
            }
        });
    }

    function delData(id, index) {
        $.ajax({
            url: '${ctx}/bill/product/productDel',
            type: 'post',
            data: {
                id: id
            },
            success: function (data) {
                if (data.code == "200") {
                    layer.msg("删除成功！", {icon: 1});
                    table.reload('test'); //数据刷新
                    layer.close(index); //关闭弹层
                } else if (data.code == "204") {
                    layer.msg("删除失败！", {icon: 2});
                } else {
                    layer.msg("请刷新！");
                }
            },
            complete: function () {
                noRepeat = false;
            }
        });
    }

    function isBlank(val) {
        if (val == null || val == '' || val == undefined) {
            return true;
        }
        return false;
    }
</script>
</body>
</html>

