当前位置: 首页 > 工具软件 > layPage > 使用案例 >

layui中table.render与laypage的配合使用

鲜于德业
2023-12-01

layui中table.render与laypage的配合使用

window.onload=function (){
    layui.use(['table','laypage'],function (){
        let table=layui.table;
        let laypage=layui.laypage;
        let rule_id=$.cookie("rule_id");
        let page=1;
        let limit=10;
        table.render({
            elem:'#file_save_info',
            title:'文件存储列表',
            url:'',
            where:{
                page:page,
                ruleid:rule_id
            },
            id:'ruleFileSave',
            cols:[].length,
            done:function (res,curr,count){
                let my_cols=[
                    {field:'id',title:'ID', sort:true, /*hide:true,*/fixed:'left'},
                    {field: 'path',title: '文件的存放路径',},
                    {field: 'up_time',title: '上传时间',sort:true,},
                    {field: 'server_name',title: '服务器名称',},
                    {field: 'file_name',title: '文件名称',},
                    {
                        field: 'opt',
                        // minWidth:150,
                        title: '操作',
                        fixed: 'right',
                        templet:function (d){
                            return `<button  id="file_preview" class="layui-btn layui-btn-sm " lay-event="file_preview">文件预览</button>`;
                        }
                    }
                ];
                table.init('fileSaveInfo',{
                   cols: my_cols,
                   data:res.data,
                   limit:limit,
                   count:res.count,
                });
                laypage.render({
                    elem: 'file_save_info_page',
                    count:res.count,
                    curr:page,
                    limit:limit,
                    layout:['prev','next'],
                    jump:function (obj,first){
                        page=obj.curr;
                        limit=obj.limit;
                        table.reload('ruleFileSave',{
                            where: {
                                page:page,
                                ruleid:rule_id
                            }
                        })
                    }
                })
            }

        })
    })
}
 类似资料: