springboot整合Beetl、BeetlSql实现ajax分页

Beetl是Bee Template Language的缩写，它绝不是简单的另外一种模板引擎，而是新一代的模板引擎，它功能强大，性能良好，超过当前流行的模板引擎。而且还易学易用。

BeetSql是一个全功能DAO工具， 同时具有Hibernate 优点 & Mybatis优点功能，适用于承认以SQL为中心，同时又需求工具能自动能生成大量常用的SQL的应用。

下面将实现其与springboot的整合，完成一个简单的分页功能：

1、新建一个springboot项目取名springboot-beetlsql

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.carry.beetl</groupId>
    <artifactId>springboot-beetlsql</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <packaging>jar</packaging>

    <name>springboot-beetlsql</name>
    <description>Demo project for Spring Boot</description>

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.0.3.RELEASE</version>
        <relativePath /> <!-- lookup parent from repository -->
    </parent>

    <properties>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
        <java.version>1.8</java.version>
        <ibeetl.version>1.1.40.RELEASE</ibeetl.version>
        <mysql.version>6.0.5</mysql.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-jdbc</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>com.ibeetl</groupId>
            <artifactId>beetl-framework-starter</artifactId>
            <version>${ibeetl.version}</version>
        </dependency>
        <dependency>
            <groupId>com.zaxxer</groupId>
            <artifactId>HikariCP</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <scope>runtime</scope>
        </dependency>
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>${mysql.version}</version>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>


</project>

2、整合BeetSql的相关配置修改application.properties文件，添加DataSourceConfig文件

#mysql数据库连接配置
spring.datasource.url=jdbc:mysql://192.168.68.110:3306/test?useUnicode=true&characterEncoding=UTF-8&serverTimezone=GMT%2B8
spring.datasource.username=root
spring.datasource.password=123456Abc!
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver

#beetelsql的配置
beetlsql.basePackage=com.carry.beetl.dao
beetl-beetlsql.dev=true

#热部署的配置
spring.devtools.restart.enabled=true

package com.carry.beetl.config;

import com.zaxxer.hikari.HikariDataSource;
import org.beetl.sql.ext.spring4.BeetlSqlDataSource;
import org.springframework.beans.factory.annotation.Qualifier;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.core.env.Environment;

import javax.sql.DataSource;

@Configuration
public class DataSourceConfig {
    
    @Bean(name = "dataSource")
    public DataSource dataSource(Environment env) {
        HikariDataSource ds = new HikariDataSource();
        ds.setJdbcUrl(env.getProperty("spring.datasource.url"));
        ds.setUsername(env.getProperty("spring.datasource.username"));
        ds.setPassword(env.getProperty("spring.datasource.password"));
        ds.setDriverClassName(env.getProperty("spring.datasource.driver-class-name"));
        return ds;
    }

    @Bean
    public BeetlSqlDataSource beetlSqlDataSource(@Qualifier("dataSource") DataSource dataSource) {
        BeetlSqlDataSource source = new BeetlSqlDataSource();
        source.setMasterSource(dataSource);
        return source;
    }
}

 3、整合Beetl相关配置

在项目启动文件SpringbootBeetlsqlApplication中加入以下内容：

@Bean(initMethod = "init", name = "beetlConfig")
    public BeetlGroupUtilConfiguration getBeetlGroupUtilConfiguration() {
        BeetlGroupUtilConfiguration beetlGroupUtilConfiguration = new BeetlGroupUtilConfiguration();
        ResourcePatternResolver patternResolver = ResourcePatternUtils.getResourcePatternResolver(new DefaultResourceLoader());
        try {
            // WebAppResourceLoader 配置root路径是关键
            WebAppResourceLoader webAppResourceLoader =
                    new WebAppResourceLoader(patternResolver.getResource("classpath:/").getFile().getPath());
            beetlGroupUtilConfiguration.setResourceLoader(webAppResourceLoader);
        } catch (IOException e) {
            e.printStackTrace();
        }
        //读取配置文件信息
        return beetlGroupUtilConfiguration;
    }

    @Bean(name = "beetlViewResolver")
    public BeetlSpringViewResolver getBeetlSpringViewResolver(@Qualifier("beetlConfig") BeetlGroupUtilConfiguration beetlGroupUtilConfiguration) {
        BeetlSpringViewResolver beetlSpringViewResolver = new BeetlSpringViewResolver();
        beetlSpringViewResolver.setPrefix("templates/");//配置页面路径前缀
        beetlSpringViewResolver.setContentType("text/html;charset=UTF-8");
        beetlSpringViewResolver.setOrder(0);
        beetlSpringViewResolver.setConfig(beetlGroupUtilConfiguration);
        return beetlSpringViewResolver;
    }

在resources目录新建文件beetl.properties

#配置模板引擎,如不配置可能会导致页面再次访问时报错
ENGINE=org.beetl.core.engine.DefaultTemplateEngine
#开始定界符
DELIMITER_STATEMENT_START=@
#结束定界符
DELIMITER_STATEMENT_END=

4、现在可以动手写代码了

新建实体类User

package com.carry.beetl.entity;
 
import java.io.Serializable;
import java.util.Date;
 
public class User implements Serializable {
    
    private static final long serialVersionUID = 1L;
    
    private Integer id;
    private Integer departmentId;
    private String name;
    private Date createTime;
 
    public Integer getId() {
        return id;
    }
 
    public void setId(Integer id) {
        this.id = id;
    }
 
    public Integer getDepartmentId() {
        return departmentId;
    }
 
    public void setDepartmentId(Integer departmentId) {
        this.departmentId = departmentId;
    }
 
    public String getName() {
        return name;
    }
 
    public void setName(String name) {
        this.name = name;
    }
 
    public Date getCreateTime() {
        return createTime;
    }
 
    public void setCreateTime(Date createTime) {
        this.createTime = createTime;
    }
}

对应的表user的DDL

CREATE TABLE `user` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(45) COLLATE utf8_bin DEFAULT NULL COMMENT '名称',
  `department_id` int(11) DEFAULT NULL,
  `create_time` date DEFAULT NULL COMMENT '创建时间',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=12 DEFAULT CHARSET=utf8 COLLATE=utf8_bin;

新建数据访问接口UserDao继承BaseMapper（BaseMapper中有很多内置的基础实现，具体可以查看官方文档）

package com.carry.beetl.dao;

import java.util.List;

import org.beetl.sql.core.mapper.BaseMapper;

import com.carry.beetl.entity.User;

public interface UserDao extends BaseMapper<User> {
    
}

 新建控制IndexController，由于功能简单直接在controller中注入dao无需service

package com.carry.beetl.controller;

import javax.servlet.http.HttpServletRequest;

import org.beetl.sql.core.engine.PageQuery;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

import com.carry.beetl.dao.UserDao;
import com.carry.beetl.entity.User;

@Controller
public class IndexController {
    
    @Autowired
    UserDao userDao;

    @RequestMapping("/index.html")
    public String index(HttpServletRequest req) {
        queryPage(req, 1);
        return "index.html";
    }
    
    @RequestMapping("/indexTopData.html")
    public String top10(HttpServletRequest req, Integer pageNo) {
        if(pageNo == null) {
            pageNo = 1;
        }
        queryPage(req, pageNo);
        return "/index.html#topData";
    }

    private void queryPage(HttpServletRequest req, int pageNo) {
        PageQuery<User> query = new PageQuery<User>();
        query.setPageNumber(pageNo);
        query.setPageSize(10);
        userDao.templatePage(query);
        req.setAttribute("users", query.getList());
        req.setAttribute("pageNo", query.getPageNumber());
        req.setAttribute("totalPage", query.getTotalPage());
        req.setAttribute("totalRow", query.getTotalRow());
    }
}

最后在templates目录里新建我们的页面index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>index</title>
<script src="${ctxPath}/js/jquery.min.js"></script>
<script type="text/javascript">
    function prev() {
        var pageNo = parseInt($("#pageNo").text());
        if (pageNo <= 1) {
            pageNo = 1;
        } else {
            pageNo -= 1;
        }
        $("#topData").load("/indexTopData.html?pageNo=" + pageNo)
    }

    function next() {
        var pageNo = parseInt($("#pageNo").text());
        var totalPage = parseInt($("#totalPage").text());
        if (pageNo >= totalPage) {
            pageNo = totalPage;
        } else {
            pageNo += 1;
        }
        $("#topData").load("/indexTopData.html?pageNo=" + pageNo)
    }
</script>
</head>
<body>
    <div style=" 600px;; margin: 0 auto;">
        <div>
            <H1>beetl+beetlSql ajax测试</H1>
        </div>
        <div id="topData">
            @#ajax topData: {
                <table style="border-collapse: collapse;text-align: center;">
                    <tr>
                        <th width=100>序号</th>
                        <th width=100>ID</th>
                        <th width=100>姓名</th>
                        <th width=100>创建日期</th>
                    </tr>
                    @for(user in users){
                    <tr 
                        @if(userLP.odd){
                            style = "background: red;"
                        @}else{
                            style = "background: yellow;"
                        @}
                    >
                        <td>${userLP.index}</td>
                        <td>${user.id}</td>
                        <td>${user.name}</td>
                        <td>${user.createTime, dateFormat="yyyy-MM-dd"}</td>
                    </tr>
                    @}
                </table>
                共有${totalRow!0}条记录分<span id="totalPage">${totalPage!0}</span>页&nbsp;&nbsp;
                @if(pageNo == 1){ 
                    <span>上一页</span>&nbsp;&nbsp; 
                @}else{ 
                    <a href="javascript: prev();">上一页</a>&nbsp;&nbsp; 
                @} 
                <span id="pageNo">${pageNo!1}</span>&nbsp;&nbsp;
                @if(pageNo == totalPage){ 
                    <span>下一页</span> 
                @}else{ 
                    <a href="javascript: next();">下一页</a> 
                @} 
            @}
        </div>
    </div>
</body>
</html>

注意：定界符@需要独占一行不要回解析错误，文件引用到jQuery需要在static目录下添加jquery.min.js文件

5、运行springboot项目