{extend name="frame"}

{block name="title"}彩蛋设置
数据列表{/block}
{block name="meta"}{:token_meta()}{/block}

{block name="body"}

<div class="layui-card">
    <div class="layui-card-header">{$page_name ?: '列表'}管理</div>
    <div class="layui-card-body">
        {:html_entity_decode($search ?? '')}
        <table class="layui-hide" id="test" lay-filter="test"></table>
    </div>
</div>

{/block}
{block name="js"}


<!-- table_head 模板-->
<script id='table_head' type='text/html'>
    <button type="button" lay-event="add" class="layui-btn layui-btn-sm"><i class="layui-icon layui-icon-add-1"></i>新增</button>
    <button type="button" lay-event="del" class="layui-btn layui-btn-sm layui-btn-danger"><i class="layui-icon layui-icon-delete"></i>批量删除</button>
    
    <button type="button" lay-event="search" class="layui-btn layui-btn-sm layui-btn-normal">
        <i class="layui-icon layui-icon-search"></i>更多</button>
    <div class="layui-inline"><input style="height: 30px" id="quick-search" type="text" placeholder="{$quick_search}" class="layui-input"></div>
</script>

<!-- table_line 模板-->
<script id='table_line' type='text/html'>
    <button type="button" lay-event="edit" class="layui-btn layui-btn-xs"><i class="layui-icon layui-icon-edit"></i>修改</button>
    <button type="button" lay-event="del" class="layui-btn layui-btn-xs layui-btn-danger"><i class="layui-icon layui-icon-delete"></i>删除</button>
</script>


<script>
    
    let primary = "{$primary ?: 'id'}";
    layui.use(['form', 'jquery', 'table'], function () {
        var form = layui.form, $ = layui.jquery, table = layui.table;
        
        function del(id){
            layer.confirm('确认删除吗？', {icon:3,title:'警告'}, function (index) {
                let load = custom.loading();
                $.ajax({
                    url: '{:url("del")}'
                    , type: 'post'
                    , data: {id:id}
                    , success:function (res) {
                        layer.close(load);
                        if (res.code === 200) {
                            layNotice.success('删除成功');
                            table.reload('test');
                        }else{
                            layNotice.warning(res.msg);
                        }
                    }
                    , error:function (err) {
                        console.log(err);
                    }
                });
            })
        }

        
        table.render({
            elem: '#test'
            ,url: "{:url('listData')}"
            ,toolbar: '#table_head'
            ,cellMinWidth: 80 
            ,page:true
            ,autoSort: false 
            , title: '{$page_name ?: "列表数据"}'
            ,limits:[10,20,30,40,50,100,200,1000]
            ,cols: [[
                {type:'checkbox'}
                ,{field:'id', title: 'id'}
                ,{field:'number', title: '彩蛋设定数'}
                ,{field:'page', title: '触发次数'}
                ,{field:'title', title: '标题'}
                ,{field:'admin_id', title: '用户'}
                ,{field:'create_time', title: '创建时间'}
                ,{field:'delete_time', title: '删除时间'}
                ,{field:'update_time', title: '修改时间'}
                ,{width:150, title: '操作',templet:'#table_line'}
            ]],
            done:function (res) {
                custom.enlarge(layer, $, '.layer-photos-demo');
                window.table = table;
            }
        });

        
        table.on('toolbar(test)', function (obj) {
            if(obj.event === 'add'){
                custom.frame('{:url("add")}', '添加{$page_name ?: ""}'); 
            }else if(obj.event === 'del'){
                    
                let checkStatus = table.checkStatus('test');
                if (checkStatus.data.length) {
                    let id = [];
                    for (let i in checkStatus.data) {
                        if (checkStatus.data.hasOwnProperty(i) && checkStatus.data[i].hasOwnProperty(primary)) {
                            id.push(checkStatus.data[i][primary])
                        }
                    }
                    del(id);
                } 
            }else if(obj.event === 'search'){
                $('#search-sd').toggleClass('layui-hide')  
            } 
        });
        table.on('tool(test)', function (obj) {
            if(obj.event === 'edit'){
                custom.frame('{:url("edit")}?id=' + obj.data[primary], '修改{$page_name ?: ""}'); 
            }else if(obj.event === 'del'){
            
                del(obj.data[primary]); 
            } 
        });
        
        
        document.onkeyup = (e) => {
            if (e.key === 'Enter') {
                let search = $('#quick-search').val();
                table.reload('test', {
                    where:{
                        quick_search:search
                    }
                    ,page:{
                        curr:1
                    }
                });
                $('#quick-search').val(search).focus();
            }
        };


        form.on('submit(search)', function (object) {
            table.reload('test', {
                where:{
                    search:object.field
                },
                  page:{
                    curr:1
                }
            });
            return false;
        });


    });
</script>
{/block}