dlhmaster/app/admin/view/new_goods/lists.html

{layout name="layout1" /}
<style>
    .layui-table-cell {
        height: auto;
        white-space: normal;
    }
</style>
<div class="wrapper">
    <div class="layui-card">
        <div class="layui-tab layui-tab-card" lay-filter="tab-all">
            <div class="layui-tab-item layui-show">
                <div class="layui-card">
                    <div class="layui-card-body">
                        <button type="button" id="add-mail-news" class="layui-btn layui-btn-normal layui-btn-sm layEvent">添加</button>
                        <table id="like-table-lists" lay-filter="like-table-lists"></table>
                        <script type="text/html" id="operation">
                            <a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="audit">编辑</a>
                            <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del">删除</a>
                        </script>
                        <!-- 商品名称 -->
                        <script type="text/html" id="goods-name">
                            <div >
                              {{d.goods.name}}
                            </div>
                        </script>
                        <!-- 商品图片 -->
                        <script type="text/html" id="goods-image">
                            <div>
                                <img src="{{d.goods.image}}" style="height:60px;width: 60px;margin-right: 5px;" class="image-show">
                            </div>
                        </script>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>
<script>
    layui.use(['table', 'laydate', 'form'], function () {
        var $ = layui.$
            , table = layui.table
            , element = layui.element
            , form = layui.form
            , status = 'all';


        form.on("submit(search)", function(data){
            table.reload("like-table-lists", {
                where: data.field,
                page: {
                    curr: 1
                }
            });
        });

        form.on("submit(clear-search)", function(){
            $("#goods_name").val("");
            $("#shop_id").val("");
            form.render();
            table.reload("like-table-lists", {
                where: {},
                page: {
                    curr: 1
                }
            });
        });

        getList();
        element.on('tab(tab-all)', function (data) {
            status = $(this).attr('data-type');
            getList();
        });

        function getList() {
            like.tableLists("#like-table-lists", '{:url("newGoods/lists")}', [
                {field: 'id', width: 80, title: 'ID', sort: true, hide: true}
                , {field: 'name', title: '商品名称', width: 300,templet: '#goods-name'}
                , {field: 'image', title: '商品图片', width: 200, align: 'center',templet: '#goods-image'}
                , {field: 'sort', title: '排序', width: 320, align: 'center'}
                , {fixed: 'right', title: '操作', width: 400, align: 'center', toolbar: '#operation'}
            ]);
        }

        //添加商品
        $(document).on('click', '#add-mail-news', function () {
            layer.open({
                type: 2
                , title: '添加商品'
                , content: '{:url("newGoods/add")}'
                , area: ['90%', '90%']
                ,btn: ['确定', '取消']
                , yes: function (index, layero) {
                    var iframeWindow = window['layui-layer-iframe' + index]
                        , submitID = 'addSubmit'
                        , submit = layero.find('iframe').contents().find('#' + submitID);
                    iframeWindow.layui.form.on('submit(' + submitID + ')', function (data) {
                        var field = data.field;
                        like.ajax({
                            url: '{:url("newGoods/add")}',
                            data: field,
                            type: "post",
                            success: function (res) {
                                if (res.code === 1) {
                                    layui.layer.msg(res.msg, {offset: '15px', icon: 1, time: 1000});
                                    layer.close(index);
                                    table.reload('like-table-lists');
                                }
                            }
                        });
                    });
                    submit.trigger('click');
                }
            });
        });

        //事件
        var active = {
            audit: function (obj) {
                layer.open({
                    type: 2
                    , title: '编辑'
                    , content: '{:url("newGoods/audit")}?id=' + obj.data.id
                    , area: ['90%', '90%']
                    ,btn: ['确定', '取消']
                    , yes: function (index, layero) {
                        var iframeWindow = window['layui-layer-iframe' + index]
                            , submitID = 'addSubmit'
                            , submit = layero.find('iframe').contents().find('#' + submitID);
                        iframeWindow.layui.form.on('submit(' + submitID + ')', function (data) {
                            var field = data.field;
                            like.ajax({
                                url: '{:url("newGoods/audit")}',
                                data: field,
                                type: "post",
                                success: function (res) {
                                    if (res.code === 1) {
                                        layui.layer.msg(res.msg, {offset: '15px', icon: 1, time: 1000});
                                        layer.close(index);
                                        table.reload('like-table-lists');
                                    }
                                }
                            });
                        });
                        submit.trigger('click');
                    }
                });
            },
            // 删除
            del: function (obj) {
                layer.confirm('确定要删除该商品吗？', function (index) {
                    like.ajax({
                        url: '{:url("newGoods/del")}',
                        data: {id: obj.data.id},
                        type: "post",
                        success: function (res) {
                            if (res.code === 1) {
                                layui.layer.msg(res.msg, {offset: '15px', icon: 1, time: 1000});
                                layer.close(index);
                                obj.del();
                            }
                        }
                    });
                    layer.close(index);
                })
            }
        };

        // 监听表格右侧工具条
        table.on('tool(like-table-lists)', function (obj) {
            var type = obj.event;
            active[type] ? active[type].call(this, obj) : '';
        });

        // 绑定点击按钮事件
        $('.layui-btn.layuiadmin-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
</script>