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>