themeleaf实现分页操作以及显示后台数据

kk小宁

已于 2023-07-26 11:41:21 修改

阅读量31

点赞数

分类专栏： ssm学习文章标签： java mvc

于 2023-07-26 11:40:28 首次发布

本文链接：https://blog.csdn.net/m0_62054686/article/details/131935545

版权

ssm学习专栏收录该内容

1 篇文章 0 订阅

订阅专栏

利用分页插件实现的分页功能

在mybatis配置文件中导入插件
<plugins>
    <!--配置分页插件-->
    <plugin interceptor="com.github.pagehelper.PageInterceptor"></plugin>
</plugins>

Controller层

@RequestMapping(value = "/emps",method = RequestMethod.GET)
public  String getEmps(@RequestParam(value = "pn",defaultValue = "1") Integer pn ,Model model){
    PageHelper.startPage(pn,10);
    List<Emp> list = empService.getall();
    PageInfo page=new PageInfo(list,5);
    model.addAttribute("pageinfo",page);
    return "emplist";

}

Service实现类

@Service
@Transactional
public class empServiceimpl implements empService {
@Autowired
private EmpMapper empMapper;
    public List<Emp> getall() {
        return empMapper.selectByExamplewithDept(null);
    }
}

Mapper.xml以及实体类

在数据库内建立数据后利用mybatis逆向工程生成

创建generatorConfig.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE generatorConfiguration
        PUBLIC "-//mybatis.org//DTD MyBatis Generator Configuration 1.0//EN"
        "http://mybatis.org/dtd/mybatis-generator-config_1_0.dtd">
<generatorConfiguration>
    <!--
    targetRuntime: 执行生成的逆向工程的版本
    MyBatis3Simple: 生成基本的CRUD（清新简洁版）
    MyBatis3: 生成带条件的CRUD（奢华尊享版）
    -->

    <context id="DB2Tables" targetRuntime="MyBatis3">
        <!--防止生成重复代码-->
        <plugin type="org.mybatis.generator.plugins.UnmergeableXmlMappersPlugin"/>

        <commentGenerator>
            <property name="suppressAllComments" value="true"/>
        </commentGenerator>
        <!-- 数据库的连接信息 -->
        <jdbcConnection driverClass="com.mysql.cj.jdbc.Driver"
                        connectionURL="jdbc:mysql://127.0.0.1:3306/#?serverTimezone=UTC"
                        userId="#"
                        password="#">
            <property name="nullCatalogMeansCurrent" value="true" />
        </jdbcConnection>
        <!-- javaBean的生成策略-->
        <javaModelGenerator targetPackage="com.crm.pojo"
                            targetProject=".\src\main\java">
            <property name="enableSubPackages" value="true" />
            <property name="trimStrings" value="true" />
        </javaModelGenerator>
        <!-- SQL映射文件的生成策略 -->
        <sqlMapGenerator targetPackage="com.crm.mapper"
                         targetProject=".\src\main\resources">
            <property name="enableSubPackages" value="true" />
        </sqlMapGenerator>
        <!-- Mapper接口的生成策略 -->
        <javaClientGenerator type="XMLMAPPER"
                             targetPackage="com.crm.mapper" targetProject=".\src\main\java">
            <property name="enableSubPackages" value="true" />
        </javaClientGenerator>
        <!-- 逆向分析的表 -->
        <!-- tableName设置为*号，可以对应所有表，此时不写domainObjectName -->
        <!-- domainObjectName属性指定生成出来的实体类的类名 -->
        <table tableName="emp" domainObjectName="Emp"/>
        <table tableName="dept" domainObjectName="Dept"/>
    </context>
</generatorConfiguration>

最后附上html页面代码

<body>
<div class="container">
<!--    标题行-->
    <div class="row">
        <div class="col-md-12">
            <h1>SSM-CRM</h1>
        </div>
    </div>
<!--    按钮-->
    <div class="row">
        <div class="col-md-4 offset-md-12">
            <button class="btn btn-info ">新增</button>
            <button class="btn btn-danger ">删除</button>
        </div>

    </div>
    <!--    显示信息-->
    <div class="row">
        <table class="table table-hover table-dark">
            <tr>
                <th>流水号</th>
                <th>员工姓名</th>
                <th>年龄</th>
                <th>性别</th>
                <th>邮箱</th>
                <th>部门</th>
                <th>操作</th>
            </tr>

        <tr th:each="Emp: ${pageinfo.list}">
            <td th:text="${Emp.empId}"></td>
            <td th:text="${Emp.name}"></td>
            <td th:text="${Emp.age}"></td>
            <td th:text="${Emp.gender}"></td>
            <td th:text="${Emp.email}"></td>
            <td th:text="${Emp.dept.deptName}"></td>
            <td>
                <button class="btn btn-primary btn-sm">
                    <i class="bi bi-pencil-fill"></i>编辑
                </button>
                <button class="btn btn-danger btn-sm">
                    <i class="bi bi-trash-fill"></i>删除
                </button>
            </td>

        </tr>


        </table>
    </div>



<!--    分页-->
    <div class="row">
            <div class="col-md-6" >当前 [[${pageinfo.pageNum}]]页,总[[${pageinfo.pages }]]
                页,总[[ ${pageinfo.total }]] 条记录
            </div>
        <div class="col-md-6">
            <nav aria-label="Page navigation example">
                <ul class="pagination">
                    <li class="page-item"><a th:href="@{/emps?pn=1}" class="page-link" >首页</a></li>
                    <li class="page-item"><a th:if="${pageinfo.hasPreviousPage}" class="page-link"  th:href="@{'/emps?pn='+${pageinfo.prePage}}">上一页</a></li>
                    <span th:each="page_Num:${pageinfo.navigatepageNums}">
                    <li  class="page-item"><a th:if ="${pageinfo.pageNum!=page_Num}"class="page-link" th:href="@{'/emps?pn='+${page_Num}}" th:text="${page_Num}" ></a></li>
                    <li  class="page-item active" aria-current="page"><a th:if ="${pageinfo.pageNum==page_Num}"class="page-link" href="" th:text="${page_Num}" ></a></li>
                    </span>

                    <li class="page-item"><a th:if="${pageinfo.hasNextPage}" class="page-link" th:href="@{'/emps?pn='+${pageinfo.nextPage}}">下一页</a></li>
                    <li class="page-item"><a class="page-link" th:href="@{'/emps?pn='+${pageinfo.pages}}">末页</a></li>
                </ul>
            </nav>
        </div>

    </div>
</div>
</body>