SSM项目LayUI框架结合pagehelper插件实现分页查询

SSM+LayUI+pagehelper插件实现分页查询

运行效果

前提

在pom文件中导入pagehelper插件依赖

            <groupId>com.github.pagehelper</groupId>
            <artifactId>pagehelper</artifactId>
            <version>5.1.11</version>

在src/main/resources文件下新建mybatis-config.xml和applicationContext.xml配置文件

mybatis-config.xml

 <?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <!-- 引入 pageHelper插件 -->
    <!--注意这里要写成PageInterceptor, 5.0之前的版本都是写PageHelper, 5.0之后要换成PageInterceptor-->
    <plugins>
        <plugin interceptor="com.github.pagehelper.PageInterceptor"></plugin>
    </plugins>
</configuration>

需要在applicationContext.xml文件中设置pagehelper，这一步很重要，否则分页无法实现
applicationContext.xml(部分代码，别忘了在web.xml文件加载applicationContext.xml)

 <!-- spring 通过 sqlSessionFactoryBean 获取 sqlSessionFactory 工厂类 -->
    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="dataSource" ref="dataSource"></property>
        <!-- 扫描 po 包，使用别名 -->
        <property name="typeAliasesPackage" value="com.test.domain"></property>
        <!-- 扫描映射文件 -->
        <property name="mapperLocations" value="classpath:mapper/*.xml"></property>
        <!--设置pageHelper-->
        <property name="configLocation" value="classpath:mybatis-config.xml"></property>
    </bean>

前端代码

html代码在body引入自带分页的表格

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;">
            <table class="layui-hide" id="demo" lay-filter="test"></table>
            <script type="text/html" id="barDemo">
                <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
                <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>
        </div>
    </div>

JS代码

<script>
    layui.use('table', function(){
        var table = layui.table;
        table.render({
             elem: '#demo'
            ,url:'/rfid/query' //数据接口
            ,type:'GET'   //请求方式为GET请求
             ,page: true //开启分页
             ,toolbar: 'default'
             ,cols: [[ //表头
                 {field:'epc',title: 'epc'}
                ,{field:'type',title: 'type'}
                ,{field:'scanTime', title: 'scan_time', sort: true}
                ,{field:'count',title: 'count'}
                ,{fixed: 'right', width: 165, align:'center', toolbar: '#barDemo'}
            ]]
        });

    });
</script>

后台代码

Controller层

@RestController
@RequestMapping("/rfid")
public class TestController {
    @Autowired
    private TestService testService;
    /**
     * 带分页查询所有数据
     * @return
     */
    @RequestMapping(value = "query",method = RequestMethod.GET)
    public Map<String, Object> query(@RequestParam("page") Integer page,
                                     @RequestParam("limit") Integer limit){
        Map<String,Object> tableData =new HashMap<String,Object>();
        PageHelper.startPage(page,limit);
        List<TestPojo> list = testService.getTestPojo();
        PageInfo<TestPojo> pageInfo=new PageInfo<>(list);
        tableData.put("code",0);
        tableData.put("msg","操作成功");
        tableData.put("count",pageInfo.getTotal());
        tableData.put("data",pageInfo.getList());
        return tableData;
    }
}

ServiceImpl层

@Service
public class TestServiceImpl implements TestService {

    @Autowired
    private TestDao testDao;
    
    @Override
    public List<TestPojo> getTestPojo() {
        return testDao.getTestPojo();
    }
 }

Dao接口层

@Repository
public interface TestDao {
 List<TestPojo> getTestPojo();
}

Mapper文件 相当于Dao层的实现类

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.test.dao.TestDao">
        <!--定义数据库与实体类之间的映射关系	-->
        <resultMap id="testResultMap" type="com.test.domain.TestPojo">
        <id  property="epc" column="epc"  javaType="java.lang.String"/>
        <result property="type"  column="type" javaType="java.lang.String"/>
        <result property="scanTime" column="scan_time"  javaType="java.lang.String"/>
        <result property="count"  column="count" javaType="java.lang.Integer"/>
    </resultMap>`
    <select id="getTestPojo" resultMap="testResultMap">
         select * from test
    </select>
   </mapper>