Spring Boot 一個極簡且完整的后臺框架

一個完整的極簡后臺框架锐锣,方便做小項目的時候可以快速開發(fā)腌闯。
這里面多貼圖片和代碼,做個參考吧雕憔,代碼可以下載下來自己看看姿骏,里面這套后臺模板不錯,喜歡的拿去斤彼。

先放幾張圖

image
image
image

項目介紹

SpringBoot分瘦,實現(xiàn)了一個極簡單的后臺框架


image

項目配置

maven配置pox.xml

<?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.moxi</groupId>
    <artifactId>moxi</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <packaging>jar</packaging>

    <name>moxi</name>
    <description>mox</description>

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>1.5.2.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>
    </properties>

    <dependencies>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
        </dependency>

        <!-- mybatis -->
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>1.2.0</version>
        </dependency>

        <!-- mysql -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>

        <!--thymeleaf  -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

        <!--commons-io  -->
        <dependency>
            <groupId>commons-io</groupId>
            <artifactId>commons-io</artifactId>
            <version>2.4</version>
        </dependency>

    </dependencies>

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

</project>

項目配置文件application.properties

#DataBase start
spring.datasource.url=jdbc:mysql://127.0.0.1:3306/moxi?useUnicode=true&characterEncoding=UTF-8
spring.datasource.username=root
spring.datasource.password=Shu1shu2
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
#DataBase end

#thymeleaf start
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
#開發(fā)時關(guān)閉緩存,不然沒法看到實時頁面
spring.thymeleaf.cache=false
#thymeleaf end

#uploadFileSize start
spring.http.multipart.maxFileSize=10Mb
spring.http.multipart.maxRequestSize=100Mb
#uploadFileSize end

項目分層

Controller層,追求極簡琉苇,分頁自己進行了一個簡單封裝

package com.moxi.controller;

import java.io.File;

import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.List;

import javax.servlet.http.HttpSession;

import org.apache.commons.io.FileUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.multipart.MultipartFile;

import com.moxi.model.NewsCategory;
import com.moxi.service.NewsCategoryService;
import com.moxi.util.PageUtil;

@Controller
@RequestMapping("/admin")
public class NewsController {

    @Autowired
    private NewsCategoryService newsCategoryService;

    @RequestMapping("/newsManage_{pageCurrent}_{pageSize}_{pageCount}")
    public String newsManage(@PathVariable Integer pageCurrent,@PathVariable Integer pageSize,@PathVariable Integer pageCount, Model model) {
        return "/news/newsManage";
    }

    /**
     * 文章分類列表
     * @param newsCategory
     * @param pageCurrent
     * @param pageSize
     * @param pageCount
     * @param model
     * @return
     */
    @RequestMapping("/newsCategoryManage_{pageCurrent}_{pageSize}_{pageCount}")
    public String newsCategoryManage(NewsCategory newsCategory,@PathVariable Integer pageCurrent,@PathVariable Integer pageSize,@PathVariable Integer pageCount, Model model) {
        //判斷
        if(pageSize == 0) pageSize = 10;
        if(pageCurrent == 0) pageCurrent = 1;
        int rows = newsCategoryService.count(newsCategory);
        if(pageCount == 0) pageCount = rows%pageSize == 0 ? (rows/pageSize) : (rows/pageSize) + 1;

        //查詢
        newsCategory.setStart((pageCurrent - 1)*pageSize);
        newsCategory.setEnd(pageSize);
        List<NewsCategory> list = newsCategoryService.list(newsCategory);

        //輸出
        model.addAttribute("list", list);
        String pageHTML = PageUtil.getPageContent("newsCategoryManage_{pageCurrent}_{pageSize}_{pageCount}?name="+newsCategory.getName(), pageCurrent, pageSize, pageCount);
        model.addAttribute("pageHTML",pageHTML);
        model.addAttribute("newsCategory",newsCategory);
        return "/news/newsCategoryManage";
    }

    /**
     * 文章分類新增嘲玫、修改跳轉(zhuǎn)
     * @param model
     * @param newsCategory
     * @return
     */
    @GetMapping("newsCategoryEdit")
    public String newsCategoryEditGet(Model model,NewsCategory newsCategory) {
        if(newsCategory.getId()!=0){
            NewsCategory newsCategoryT = newsCategoryService.findById(newsCategory);
            model.addAttribute("newsCategory",newsCategoryT);
        }
        return "/news/newsCategoryEdit";
    }

    /**
     * 文章分類新增、修改提交
     * @param model
     * @param newsCategory
     * @param imageFile
     * @param httpSession
     * @return
     */
    @PostMapping("newsCategoryEdit")
    public String newsCategoryEditPost(Model model,NewsCategory newsCategory, @RequestParam MultipartFile[] imageFile,HttpSession httpSession) {
        for (MultipartFile file : imageFile) {
            if (file.isEmpty()) {
                System.out.println("文件未上傳");
            } else {
                SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMddHHmmss");
                Date date = new java.util.Date();
                String strDate = sdf.format(date);
                String fileName = strDate + file.getOriginalFilename().substring(
                                file.getOriginalFilename().indexOf("."),
                                file.getOriginalFilename().length());
                String realPath = httpSession.getServletContext().getRealPath("/userfiles");
                System.out.println("realPath : "+realPath);
                try {
                    FileUtils.copyInputStreamToFile(file.getInputStream(),new File(realPath, fileName));
                    newsCategory.setImage("/userfiles/"+fileName);
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
        if(newsCategory.getId()!=0){
            newsCategoryService.update(newsCategory);
        } else {
            newsCategoryService.insert(newsCategory);
        }
        return "redirect:newsCategoryManage_0_0_0";
    }

}

Model層(pure類)

package com.moxi.model;

import java.sql.Date;

public class NewsCategory extends BaseObject {

    private long id;
    private String name;
    private String description;
    private String image;
    private Date addDate;
    private int state;

    public long getId() {
        return id;
    }

    public void setId(long id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getDescription() {
        return description;
    }

    public void setDescription(String description) {
        this.description = description;
    }

    public String getImage() {
        return image;
    }

    public void setImage(String image) {
        this.image = image;
    }

    public Date getAddDate() {
        return addDate;
    }

    public void setAddDate(Date addDate) {
        this.addDate = addDate;
    }

    public int getState() {
        return state;
    }

    public void setState(int state) {
        this.state = state;
    }

}

Service層翁潘,一切追求極簡趁冈,所以這里Mybatis用得是注解,我覺得注解也挺好用的拜马。

package com.moxi.service;

import java.util.List;

import org.apache.ibatis.annotations.Insert;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;
import org.apache.ibatis.annotations.Update;
import com.moxi.model.NewsCategory;

@Mapper
public interface NewsCategoryService {

    @Select("SELECT * FROM `moxi`.`news_category` where id = #{id};")
    NewsCategory findById(NewsCategory newsCategory);

    @Select({
        "<script>",
        "SELECT * FROM `moxi`.`news_category`",
        "WHERE state = 0",
            "<when test='name!=null'>",
                "AND name LIKE CONCAT('%',#{name},'%')",
            "</when>",
            "order by addDate desc limit #{start},#{end}",
        "</script>"
    })
    List<NewsCategory> list(NewsCategory newsCategory);

    @Select({
        "<script>",
        "SELECT count(*) FROM `moxi`.`news_category`",
        "WHERE state = 0",
            "<when test='name!=null'>",
                "AND name LIKE CONCAT('%',#{name},'%')",
            "</when>",
        "</script>"
    })
    int count(NewsCategory newsCategory);

    @Insert("INSERT INTO `moxi`.`news_category` (`id`, `name`, `description`, `image`, `addDate`, `state`) VALUES (null, #{name}, #{description}, #{image}, now(), 0);")
    int insert(NewsCategory newsCategory);

    @Update("UPDATE `moxi`.`news_category`SET `name` = #{name}, `description` = #{description}, `image` = #{image}, `state` = #{state} WHERE `id` = #{id};")
    int update(NewsCategory newsCategory);

}

View層渗勘,使用的thymeleaf的標(biāo)簽,挺好用的俩莽,本來打算全站用ajax旺坠,不過開發(fā)效率稍微慢了些。

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>

<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>MOXI</title>

<link th:href="@{/css/bootstrap.min.css}" rel="stylesheet" />
<link th:href="@{/font-awesome/css/font-awesome.css}" rel="stylesheet" />
<link th:href="@{/css/style.css}" rel="stylesheet" />

<link th:href="@{/css/plugins/iCheck/custom.css}" rel="stylesheet"/>
<link th:href="@{/css/plugins/footable/footable.core.css}" rel="stylesheet"/>

</head>

<body>

    <div id="wrapper">
        <nav class="navbar-default navbar-static-side" role="navigation" th:include="nav :: navigation"></nav>
        <div id="page-wrapper" class="gray-bg">
            <div class="border-bottom" th:include="header :: headerTop"></div>
            <div class="row wrapper border-bottom white-bg page-heading" th:fragment="headerNav">
                <div class="col-lg-10">
                    <h2>文章分類</h2>
                    <ol class="breadcrumb">
                        <li>
                            <a href="#">首頁</a>
                        </li>
                        <li>
                            <a>內(nèi)容管理</a>
                        </li>
                        <li class="active">
                            <strong>文章分類</strong>
                        </li>
                    </ol>
                </div>
                <div class="col-lg-2">
                </div>
            </div>
            <div class="wrapper wrapper-content animated fadeInRight">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="ibox float-e-margins">
                            <div class="ibox-title">
                                <h5>搜索</h5>
                                <div class="ibox-tools">
                                    <a class="collapse-link">
                                        <i class="fa fa-chevron-up"></i>
                                    </a>
                                </div>
                            </div>
                            <div class="ibox-content" style="display: block;">
                                <form action="newsCategoryManage_0_0_0">
                                    <div class="row">
                                        <div class="col-sm-3 m-b-xs">
                                            <input name="name" value="" th:value="${newsCategory.name}" placeholder="分類名稱" class="form-control" type="text"/>
                                        </div>
                                        <div class="col-sm-1 m-b-xs">
                                            <button id="submitButton" class="btn btn-primary btn-block" type="submit"><i class="fa fa-search"></i>    <strong>搜索</strong></button>
                                        </div>
                                    </div>
                                </form>
                                <div class="row">
                                    <div class="col-sm-6 m-b-xs">
                                        <a th:href="@{newsCategoryEdit}" class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="left" title="" data-original-title="Refresh inbox"><i class="fa fa-plus"></i>    新增分類    </a>
                                    </div>
                                    <div class="col-sm-6 m-b-xs"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12">
                        <div class="ibox float-e-margins">
                            <div class="ibox-title">
                                <h5>文章列表</h5>
                                <div class="ibox-tools">
                                    <a class="collapse-link">
                                        <i class="fa fa-chevron-up"></i>
                                    </a>
                                </div>
                            </div>
                            <div class="ibox-content">

                                <div class="table-responsive">
                                    <table class=" table table-hover" data-page-size="10">
                                        <thead>
                                            <tr>
                                                <th width="5%">ID</th>
                                                <th width="30%">名稱 </th>
                                                <th width="40%">描述 </th>
                                                <th width="10%">添加時間</th>
                                                <th>操作</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr th:each="nc : ${list}">
                                                <td th:text="${nc.id}">Onions</td>
                                                <td th:text="${nc.name}">Onions</td>
                                                <td th:text="${nc.description}">Onions</td>
                                                <td th:text="${nc.addDate}">Onions</td>
                                                <td>
                                                    <a th:href="@{'newsCategoryEdit?id='+${nc.id}}" title="修改"><i class="fa fa-edit text-navy"></i></a>

                                                    <a th:href="@{'newsCategoryEdit?id='+${nc.id}}" title="修改"><i class="fa fa-trash-o text-navy"></i></a>
                                                </td>
                                            </tr>
                                        </tbody>
                                        <tfoot>
                                            <tr>
                                                <td colspan="7">
                                                    <ul id="pageHTML" class="pagination pull-right"></ul>
                                                </td>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="footer" th:include="footer :: copyright"></div>
        </div>
    </div>

    <!-- Mainly scripts -->
    <script th:src="@{/js/jquery-2.1.1.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/plugins/metisMenu/jquery.metisMenu.js}"></script>
    <script th:src="@{/js/plugins/slimscroll/jquery.slimscroll.min.js}"></script>

    <!-- Peity -->
    <script th:src="@{/js/plugins/peity/jquery.peity.min.js}"></script>

    <!-- Custom and plugin javascript -->
    <script th:src="@{/js/inspinia.js}"></script>
    <script th:src="@{/js/plugins/pace/pace.min.js}"></script>

    <!-- iCheck -->
    <script th:src="@{/js/plugins/iCheck/icheck.min.js}"></script>

    <!-- Peity -->
    <script th:src="@{/js/demo/peity-demo.js}"></script>

    <!-- FooTable -->
    <script th:src="@{/js/plugins/footable/footable.all.min.js}"></script>

    <!-- common -->
    <script th:src="@{/js/common.js}"></script>

    <script th:inline="javascript">

        var pageHTML = [[${pageHTML}]];
        $(document).ready(function () {
            $("#pageHTML").html(pageHTML);

        });

    </script>
</body>

</html>

分頁封裝扮超,一切為了極簡取刃,做了個util類

package com.moxi.util;

public class PageUtil {

    public static String getPageContent(String url,int pageCurrent,int pageSize,int pageCount){
        if (pageCount == 0) {
            return "";
        }
        String urlNew = url.replace("{pageSize}", pageSize+"").replace("{pageCount}", pageCount+"");

        String first = urlNew.replace("{pageCurrent}", 1+"");
        String prev = urlNew.replace("{pageCurrent}", (pageCurrent - 1)+"");
        String next = urlNew.replace("{pageCurrent}", (pageCurrent + 1)+"");
        String last = urlNew.replace("{pageCurrent}", pageCount+"");

        StringBuffer html = new StringBuffer();
        html.append("<li class=\"footable-page-arrow"+(pageCurrent<=1?" disabled":"")+"\"><a href=\""+(pageCurrent<=1?"#":first)+"\">?</a></li>");
        html.append("<li class=\"footable-page-arrow"+(pageCurrent<=1?" disabled":"")+"\"><a href=\""+(pageCurrent<=1?"#":prev)+"\">?</a></li>");
        for(int i = 0 ;i < pageCount; i++){
            String urlItem = urlNew.replace("{pageCurrent}", (i+1)+"");
            html.append("<li class=\"footable-page"+(((i+1) == pageCurrent)?" active":"")+"\"><a href=\""+urlItem+"\">"+(i+1)+"</a></li>");
        }
        html.append("<li class=\"footable-page-arrow"+(pageCurrent==pageCount?" disabled":"")+"\"><a href=\""+(pageCurrent==pageCount?"#":next)+"\">?</a></li>");
        html.append("<li class=\"footable-page-arrow"+(pageCurrent==pageCount?" disabled":"")+"\"><a href=\""+(pageCurrent==pageCount?"#":last)+"\">?</a></li>");

        return html.toString().replaceAll("null", "");
    }

}

就這些,足夠簡單出刷。包含登錄璧疗、列表、分頁馁龟、新增崩侠、修改、上傳文件等……接下來會不斷進行完善坷檩。
sql語句放到項目里面了却音。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末改抡,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子系瓢,更是在濱河造成了極大的恐慌阿纤,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,214評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件夷陋,死亡現(xiàn)場離奇詭異欠拾,居然都是意外死亡,警方通過查閱死者的電腦和手機肌稻,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,307評論 2 382
  • 文/潘曉璐 我一進店門清蚀,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人爹谭,你說我怎么就攤上這事枷邪。” “怎么了诺凡?”我有些...
    開封第一講書人閱讀 152,543評論 0 341
  • 文/不壞的土叔 我叫張陵东揣,是天一觀的道長。 經(jīng)常有香客問我腹泌,道長嘶卧,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,221評論 1 279
  • 正文 為了忘掉前任凉袱,我火速辦了婚禮芥吟,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘专甩。我一直安慰自己钟鸵,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 64,224評論 5 371
  • 文/花漫 我一把揭開白布涤躲。 她就那樣靜靜地躺著棺耍,像睡著了一般。 火紅的嫁衣襯著肌膚如雪种樱。 梳的紋絲不亂的頭發(fā)上蒙袍,一...
    開封第一講書人閱讀 49,007評論 1 284
  • 那天,我揣著相機與錄音嫩挤,去河邊找鬼害幅。 笑死,一個胖子當(dāng)著我的面吹牛岂昭,可吹牛的內(nèi)容都是我干的矫限。 我是一名探鬼主播,決...
    沈念sama閱讀 38,313評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼叼风!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起棍苹,我...
    開封第一講書人閱讀 36,956評論 0 259
  • 序言:老撾萬榮一對情侶失蹤无宿,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后枢里,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體孽鸡,經(jīng)...
    沈念sama閱讀 43,441評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,925評論 2 323
  • 正文 我和宋清朗相戀三年栏豺,在試婚紗的時候發(fā)現(xiàn)自己被綠了彬碱。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,018評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡奥洼,死狀恐怖巷疼,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情灵奖,我是刑警寧澤嚼沿,帶...
    沈念sama閱讀 33,685評論 4 322
  • 正文 年R本政府宣布,位于F島的核電站瓷患,受9級特大地震影響骡尽,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜擅编,卻給世界環(huán)境...
    茶點故事閱讀 39,234評論 3 307
  • 文/蒙蒙 一攀细、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧爱态,春花似錦谭贪、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,240評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至吆豹,卻和暖如春鱼的,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背痘煤。 一陣腳步聲響...
    開封第一講書人閱讀 31,464評論 1 261
  • 我被黑心中介騙來泰國打工凑阶, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人衷快。 一個月前我還...
    沈念sama閱讀 45,467評論 2 352
  • 正文 我出身青樓宙橱,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子师郑,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 42,762評論 2 345

推薦閱讀更多精彩內(nèi)容