1. 新建前端页面

2. 完善主页逻辑

build.bat

@@ -1 +1,25 @@
-mvn clean package compile -Dmaven.test.skip=true
+@echo off
+echo build %1%
+set /p tag=TAG:
+
+echo ----------------------------
+echo ------ Start pull ... ------
+echo ----------------------------
+
+git pull
+
+echo -------------------------------
+echo ------ Start build %tag% ------
+echo -------------------------------
+
+for /F %%i in ('git checkout %tag%') do ( set success=%%i)
+if "%success%" equ "" (
+  echo Not Found TAG: %tag%
+  echo ---------------------------
+  echo ------ Build failed! ------
+  echo ---------------------------
+  pause
+) else (
+  echo Build TAG: %tag%
+  mvn clean package compile -Dmaven.test.skip=true
+)

src/main/java/cn/minbb/job/controller/web/JobController.java

@@ -0,0 +1,31 @@
+package cn.minbb.job.controller.web;
+
+import cn.minbb.job.data.Const;
+import lombok.extern.log4j.Log4j2;
+import org.springframework.stereotype.Controller;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.servlet.ModelAndView;
+
+@Controller
+@Log4j2
+@RequestMapping("/job")
+public class JobController {
+
+    public JobController() {
+    }
+
+    @GetMapping("/full")
+    public ModelAndView jobFullPage(ModelAndView modelAndView) {
+        modelAndView.addObject(Const.Key.KEY_ACTIVE, Const.ViewName.VIEW_JOB_FULL);
+        modelAndView.setViewName(Const.ViewName.VIEW_JOB_FULL);
+        return modelAndView;
+    }
+
+    @GetMapping("/practice")
+    public ModelAndView jobPracticePage(ModelAndView modelAndView) {
+        modelAndView.addObject(Const.Key.KEY_ACTIVE, Const.ViewName.VIEW_JOB_PRACTICE);
+        modelAndView.setViewName(Const.ViewName.VIEW_JOB_PRACTICE);
+        return modelAndView;
+    }
+}

src/main/java/cn/minbb/job/controller/web/MainController.java

@@ -1,25 +1,39 @@
 package cn.minbb.job.controller.web;
 
 import cn.minbb.job.data.Const;
+import cn.minbb.job.model.Banner;
+import cn.minbb.job.service.BannerService;
 import lombok.extern.log4j.Log4j2;
 import org.springframework.stereotype.Controller;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.servlet.ModelAndView;
 
+import java.util.List;
+
 @Controller
 @Log4j2
 @RequestMapping("")
 public class MainController {
 
+    private final BannerService bannerService;
+
+    public MainController(BannerService bannerService) {
+        this.bannerService = bannerService;
+    }
+
     @GetMapping("")
     public ModelAndView indexPage(ModelAndView modelAndView) {
+        List<Banner> bannerList = bannerService.findAll();
+        modelAndView.addObject("bannerList", bannerList);
+        modelAndView.addObject(Const.Key.KEY_ACTIVE, Const.ViewName.VIEW_INDEX);
         modelAndView.setViewName(Const.ViewName.VIEW_INDEX);
         return modelAndView;
     }
 
     @GetMapping("/about")
     public ModelAndView aboutPage(ModelAndView modelAndView) {
+        modelAndView.addObject(Const.Key.KEY_ACTIVE, Const.ViewName.VIEW_ABOUT);
         modelAndView.setViewName(Const.ViewName.VIEW_ABOUT);
         return modelAndView;
     }

src/main/java/cn/minbb/job/data/Const.java

@@ -47,6 +47,8 @@ public class Const {
         String VIEW_SIGN_IN = "sign-in";
         String VIEW_SIGN_UP = "sign-up";
         String VIEW_ABOUT = "about";
+        String VIEW_JOB_FULL = "job-full";
+        String VIEW_JOB_PRACTICE = "job-practice";
         String VIEW_FEEDBACK = "feedback";
     }
 

src/main/java/cn/minbb/job/model/Banner.java

@@ -1,8 +1,6 @@
 package cn.minbb.job.model;
 
-import lombok.Data;
-import lombok.EqualsAndHashCode;
-import lombok.NoArgsConstructor;
+import lombok.*;
 
 import javax.persistence.Column;
 import javax.persistence.Entity;
@@ -37,6 +35,9 @@ public class Banner extends Auditable {
     @Column(name = "url", columnDefinition = "VARCHAR(255) COMMENT '链接'")
     private String url;
 
+    @Column(name = "action", columnDefinition = "VARCHAR(16) COMMENT '动作提示'")
+    private String action;
+
     @Column(name = "priority", columnDefinition = "INT COMMENT '优先级'")
     private Integer priority;
 

src/main/resources/templates/fragments/footer.html

@@ -12,27 +12,27 @@
 <footer th:fragment="footer">
     <div class="container-fluid text-white">
         <div class="row" style="background-color: #444444; padding: 24px 48px;">
-            <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
+            <div class="col-xs-12 col-sm-12 col-md-4 col-lg-6">
                 <h4 class="white-text">校园招聘网</h4>
                 <p>基于学校的招聘资源打造求职招聘平台，为即将毕业的学生提供一个稳定，安全，规范的求职渠道。</p>
                 <p>下一个，就是你！</p>
             </div>
-            <div class="col col-xs-12 col-sm-6 col-md-3 col-lg-3 offset-md-1 offset-lg-1">
+            <div class="col col-xs-12 col-sm-6 col-md-3 col-lg-2 offset-md-1 offset-lg-1">
                 <h5>链接</h5>
                 <ul>
                     <li><a class="" href="/about">关于</a></li>
                     <li><a class="" href="/">反馈建议</a></li>
                 </ul>
             </div>
-            <div class="col col-xs-12 col-sm-6 col-md-3 col-lg-3 offset-md-1 offset-lg-1">
-                <h5>链接</h5>
+            <div class="col col-xs-12 col-sm-6 col-md-3 col-lg-2 offset-md-1 offset-lg-1">
+                <h5>更多</h5>
                 <ul>
                     <li><a class="" href="/">招商引资</a></li>
                     <li><a class="" href="/">加入我们</a></li>
                 </ul>
             </div>
         </div>
-        <div class="row" style="background-color: #111111; padding: 12px 16px;">
+        <div class="row" id="tail" style="background-color: #111111; padding: 12px 16px; font-size: 14px;">
             <span>&copy; 2020 <a href="/"> 校园招聘网</a></span>
             <div class="col text-right" style="padding: 0;"><a href="/">豫ICP备16029895号-6</a></div>
         </div>

src/main/resources/templates/fragments/header.html

@@ -21,11 +21,17 @@
             <li class="nav-item" th:classappend="${ACTIVE == 'index'}? 'active'">
                 <a class="nav-link" href="/">首页<span class="sr-only">(current)</span></a>
             </li>
+            <li class="nav-item" th:classappend="${ACTIVE == 'job-full'}? 'active'">
+                <a class="nav-link" href="/job/full">全职招聘</a>
+            </li>
+            <li class="nav-item" th:classappend="${ACTIVE == 'job-practice'}? 'active'">
+                <a class="nav-link" href="/job/practice">实习招聘</a>
+            </li>
             <li class="nav-item" th:class="${ACTIVE == 'about'}? 'active'">
                 <a class="nav-link" href="/about">关于</a>
             </li>
             <li class="nav-item">
-                <a class="nav-link" href="#!" data-toggle="tooltip" data-placement="bottom" data-html="true"
+                <a class="nav-link" href="#" data-toggle="tooltip" data-placement="bottom" data-html="true"
                    title="<img src='https://files.minbb.cn/images/QQGroup.jpg' width='160' alt='校招QQ群二维码'/><br/><p>群号: 496061797</p>">
                     校招QQ群
                 </a>

src/main/resources/templates/index.html

@@ -6,13 +6,147 @@
 <head>
     <meta charset="UTF-8"/>
     <title>首页 - [[${APP_NAME}]]</title>
+
+    <style>
+        /* Since positioning the image, we need to help out the caption */
+        .carousel-caption {
+            bottom: 3rem;
+            z-index: 10;
+        }
+
+        /* Declare heights because of positioning of img element */
+        .carousel-item {
+            height: 32rem;
+            background-color: #777;
+        }
+
+        .carousel-item > img {
+            position: absolute;
+            top: 0;
+            left: 0;
+            min-width: 100%;
+            height: 32rem;
+        }
+
+        /* MARKETING CONTENT */
+        /* Center align the text within the three columns below the carousel */
+        .marketing .col-lg-4 {
+            margin-bottom: 1.5rem;
+            text-align: center;
+        }
+
+        .marketing h2 {
+            font-weight: 400;
+        }
+
+        .marketing .col-lg-4 p {
+            margin-right: .75rem;
+            margin-left: .75rem;
+        }
+
+        /* Featurettes */
+
+        .featurette-divider {
+            margin: 5rem 0; /* Space out the Bootstrap <hr> more */
+        }
+
+        /* Thin out the marketing headings */
+        .featurette-heading {
+            font-weight: 300;
+            line-height: 1;
+            letter-spacing: -.05rem;
+        }
+
+        /* RESPONSIVE CSS */
+
+        @media (min-width: 40em) {
+            /* Bump up size of carousel content */
+            .carousel-caption p {
+                margin-bottom: 20px;
+                font-size: 1.25rem;
+                line-height: 1.4;
+            }
+
+            .featurette-heading {
+                font-size: 50px;
+            }
+        }
+
+        @media (min-width: 62em) {
+            .featurette-heading {
+                margin-top: 7rem;
+            }
+        }
+    </style>
 </head>
 <body>
 <th:block layout:fragment="content">
-    <h5>基于Java的校园智能求职招聘平台的设计与实现</h5>
+    <!-- 首页轮播图 -->
+    <div class="carousel slide" id="index-carousel" data-ride="carousel">
+        <ol class="carousel-indicators">
+            <li data-target="#index-carousel" th:each="banner, stat : ${bannerList}"
+                th:data-slide-to="${stat.index}" th:class="${stat.index == 0}? 'active'"></li>
+        </ol>
+        <div class="carousel-inner">
+            <div class="carousel-item" th:each="banner, stat : ${bannerList}" th:classappend="${stat.index == 0}? 'active'">
+                <img class="first-slide" src="" alt="" th:src="${banner.getImage()}" th:alt="${banner.getRemark()}"/>
+                <div class="container">
+                    <div class="carousel-caption" th:classappend="${stat.count % 3 == 1}? 'text-left' : (${stat.count % 3 == 2}? '' : 'text-right')">
+                        <h1 th:text="${banner.getTitle()}"></h1>
+                        <p th:text="${banner.getSubtitle()}"></p>
+                        <p><a class="btn btn-lg btn-success" href="" role="button" target="_blank" th:href="${banner.getUrl()}" th:text="${banner.getAction()}"></a></p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <a class="carousel-control-prev" href="#index-carousel" role="button" data-slide="prev">
+            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+            <span class="sr-only">Previous</span>
+        </a>
+        <a class="carousel-control-next" href="#index-carousel" role="button" data-slide="next">
+            <span class="carousel-control-next-icon" aria-hidden="true"></span>
+            <span class="sr-only">Next</span>
+        </a>
+    </div>
 
     <div class="container" style="margin-top: 24px;">
-        待实现...
+        <div class="row mb-2">
+            <div class="col-md-12">
+                <h3 class="pb-3 mb-4 font-italic border-bottom">推荐职位</h3>
+            </div>
+            <div class="col-md-6">
+                <div class="card flex-md-row mb-4 box-shadow h-md-250">
+                    <div class="card-body d-flex flex-column align-items-start">
+                        <strong class="d-inline-block mb-2 text-primary">World</strong>
+                        <h3 class="mb-0">
+                            <a class="text-dark" href="#">Featured post</a>
+                        </h3>
+                        <div class="mb-1 text-muted">Nov 12</div>
+                        <p class="card-text mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
+                        <a href="#">Continue reading</a>
+                    </div>
+                    <img class="card-img-right flex-auto d-none d-md-block" data-src="holder.js/200x250?theme=thumb" alt="Thumbnail [200x250]"
+                         src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22200%22%20height%3D%22250%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20250%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_171a4b7082d%20text%20%7B%20fill%3A%23eceeef%3Bfont-weight%3Abold%3Bfont-family%3AArial%2C%20Helvetica%2C%20Open%20Sans%2C%20sans-serif%2C%20monospace%3Bfont-size%3A13pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_171a4b7082d%22%3E%3Crect%20width%3D%22200%22%20height%3D%22250%22%20fill%3D%22%2355595c%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%2256.1953125%22%20y%3D%22131%22%3EThumbnail%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"
+                         data-holder-rendered="true" style="width: 200px; height: 250px;">
+                </div>
+            </div>
+            <div class="col-md-6">
+                <div class="card flex-md-row mb-4 box-shadow h-md-250">
+                    <div class="card-body d-flex flex-column align-items-start">
+                        <strong class="d-inline-block mb-2 text-success">Design</strong>
+                        <h3 class="mb-0">
+                            <a class="text-dark" href="#">Post title</a>
+                        </h3>
+                        <div class="mb-1 text-muted">Nov 11</div>
+                        <p class="card-text mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
+                        <a href="#">Continue reading</a>
+                    </div>
+                    <img class="card-img-right flex-auto d-none d-md-block" data-src="holder.js/200x250?theme=thumb" alt="Thumbnail [200x250]"
+                         src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22200%22%20height%3D%22250%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20250%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_171a4b70832%20text%20%7B%20fill%3A%23eceeef%3Bfont-weight%3Abold%3Bfont-family%3AArial%2C%20Helvetica%2C%20Open%20Sans%2C%20sans-serif%2C%20monospace%3Bfont-size%3A13pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_171a4b70832%22%3E%3Crect%20width%3D%22200%22%20height%3D%22250%22%20fill%3D%22%2355595c%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%2256.1953125%22%20y%3D%22131%22%3EThumbnail%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"
+                         data-holder-rendered="true" style="width: 200px; height: 250px;">
+                </div>
+            </div>
+        </div>
     </div>
 </th:block>
 </body>

src/main/resources/templates/job-full.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns="http://www.w3.org/1999/html"
+      xmlns:th="http://www.thymeleaf.org"
+      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+      layout:decorate="~{layouts/layout}">
+<head>
+    <meta charset="UTF-8"/>
+    <title>全职招聘 - [[${APP_NAME}]]</title>
+</head>
+<body>
+<th:block layout:fragment="content">
+    <div class="container">
+        全职招聘
+    </div>
+</th:block>
+</body>
+</html>

src/main/resources/templates/job-practice.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns="http://www.w3.org/1999/html"
+      xmlns:th="http://www.thymeleaf.org"
+      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+      layout:decorate="~{layouts/layout}">
+<head>
+    <meta charset="UTF-8"/>
+    <title>实习招聘 - [[${APP_NAME}]]</title>
+</head>
+<body>
+<th:block layout:fragment="content">
+    <div class="container">
+        实习招聘
+    </div>
+</th:block>
+</body>
+</html>