Simple Scheduled Task List SSM project completed in 40 minutes - Quick one-article integration of small Demo built by SSM framework - Github address included

Posted by valerie19 on Sat, 22 Jan 2022 10:38:27 +0100

πŸ“‘ Content of this article: SSM framework to build a simple list of planned tasks project - project reality

πŸ“˜ Article Column: SSM Getting Started to the Tomb - One-stop Foundation and Advanced Columns

🎬 Latest update: January 20, 2022 SpringMVC Getting Started to Tomb One-stop Foundation and Advancement - Including Interview Points and Beginning Foundation - From 0 to 1 Servlet That's the little case

πŸ™Š Personal introduction: A tri-procedural ape in two colleges and universities, with a focus on the basic, clock-punching algorithm, sharing technology as a personal experience summary blogger, although sometimes lazy, will stick to it. If you like blogging very much, I suggest you read the following line ~ (Crazy Suggestion QwQ)

πŸŒ‡ Give the thumbs-up πŸ‘ Collection ⭐ Leaving a message. πŸ“ One click Three Caring Program apes, from you to me

πŸš€ SSM Framework Build Simple Scheduled Task List Item - Project Actual πŸš€

πŸ’– Write before πŸ’–

Because I finished the three main frameworks of SSM the other day~I did a simple integration project I had done before again. This time I did more than 40 minutes to finish this project, and this time I used Git to transfer it to Github and publish it as a war package on my server. In fact, this should be deployed using Nginx load balancing. After all, where does my small server stand? But it's just for testing. That's all the rubbish. The rest is in this article.

It is very useful to use the second brush to quickly pass SSM once! If you have the ability to remember to upload a Git operation to a remote warehouse, a multipoint distributed operation will be available later.

If not Git, look here: Git should learn that ~From beginners to operatives, he won't hit me ~

Github Project Address: Get your own ~

HHXiaoFu/StudyListSSM.github.io: Simple SSM project 30 min quick start

πŸŽ„ 1. Project Display

πŸͺ 1. Page Layout Display

Schedule list entry page:

Schedule List All schedules display page:

New Schedule Page in Schedule List

Modify Plan Page in Schedule List

πŸͺ 2. Project Framework Structure

Engineering Structure Drawing

β”œβ”€src
β”‚  β”œβ”€main
β”‚  β”‚  β”œβ”€java
β”‚  β”‚  β”‚  └─com
β”‚  β”‚  β”‚      └─alascanfu
β”‚  β”‚  β”‚          β”œβ”€controller
β”‚  β”‚  β”‚          β”‚      PlanController.java
β”‚  β”‚  β”‚          β”‚
β”‚  β”‚  β”‚          β”œβ”€dao
β”‚  β”‚  β”‚          β”‚      PlanMapper.java
β”‚  β”‚  β”‚          β”‚      PlanMapper.xml
β”‚  β”‚  β”‚          β”‚
β”‚  β”‚  β”‚          β”œβ”€pojo
β”‚  β”‚  β”‚          β”‚      Plan.java
β”‚  β”‚  β”‚          β”‚
β”‚  β”‚  β”‚          └─service
β”‚  β”‚  β”‚                  PlanService.java
β”‚  β”‚  β”‚
β”‚  β”‚  └─resources
β”‚  β”‚          applicationContext.xml
β”‚  β”‚          db.properties
β”‚  β”‚          mybatis-config.xml
β”‚  β”‚          spring-mvc.xml
β”‚  β”‚          spring-mybatis.xml
β”‚  β”‚          spring-service.xml
β”‚  β”‚
β”‚  └─test
β”‚      └─java
β”‚              Test.java
└─web
    β”‚  index.jsp
    β”‚
    └─WEB-INF
        β”‚  web.xml
        β”‚
        └─jsp
                addPlan.jsp
                deletePlan.jsp
                planList.jsp
                updatePlan.jsp

Functional Structure Diagram in idea


πŸŽ„ 2. Project Development Environment and Technology Stack

1. Technology Stack

Technical Stack Required for Project

Spring+SpringMVC+MyBatis+MySQL+Bootstrap+Tomcat

✨ 2. Development environment ✨

Project Development Environment

The small payment here is Spring5.3.9 - MySQL8.0.25 - Tomcat8.5.682

✨ 3. Master of Pre-knowledge ✨

Pre-knowledge Mastery

Above pre-knowledge, write more detailed, beginners recommend to directly start SSM and MySQL related knowledge

πŸŽ„ 3. Planned List Items

🎍 1. New Maven Project Import Dependency

Step 1: Create a new Maven project to import related project dependencies and set the pom.xml file to filter Maven packages

pom.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.alascanfu</groupId>
    <artifactId>StudyPlanSystem</artifactId>
    <version>1.0-SNAPSHOT</version>

<!--Add Dependency-->
    <dependencies>
        <!--Unit Test Dependency-->
        <dependency>
            <groupId>junit</groupId>
            <artifactId>junit</artifactId>
            <version>4.12</version>
            <scope>test</scope>
        </dependency>
        <!--Support servlet,JavaWeb programming-->
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <version>4.0.1</version>
        </dependency>
        <!--Support jsp-->
        <dependency>
            <groupId>javax.servlet.jsp</groupId>
            <artifactId>jsp-api</artifactId>
            <version>2.2</version>
        </dependency>
        <dependency>
            <groupId>jstl</groupId>
            <artifactId>jstl</artifactId>
            <version>1.2</version>
        </dependency>
        <!--Database Driven Dependency-->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>8.0.26</version>
        </dependency>
        <!--Support mybatis-->
        <dependency>
            <groupId>org.mybatis</groupId>
            <artifactId>mybatis</artifactId>
            <version>3.5.7</version>
        </dependency>
        <!--Support Druid Database Management-->
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid</artifactId>
            <version>1.2.6</version>
        </dependency>
        <!--Support spring-mybatis-->
        <dependency>
            <groupId>org.mybatis</groupId>
            <artifactId>mybatis-spring</artifactId>
            <version>2.0.6</version>
        </dependency>
        <!--Support SpringMVC-->
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-webmvc</artifactId>
            <version>5.3.9</version>
        </dependency>
        <!--Support spring-jdbc-->
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-jdbc</artifactId>
            <version>5.3.9</version>
        </dependency>
        <!--Support spring-aop-->
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-aop</artifactId>
            <version>5.3.9</version>
        </dependency>
        <dependency>
            <groupId>org.aspectj</groupId>
            <artifactId>aspectjweaver</artifactId>
            <version>1.9.8.M1</version>
        </dependency>
    </dependencies>
    
<!--Packaging filter configuration-->
    <build>
        <resources>
            <resource>
                <directory>src/main/java</directory>
                <includes>
                    <include>**/*.xml</include>
                    <include>**/*.properties</include>
                </includes>
                <filtering>true</filtering>
            </resource>
            <resource>
                <directory>src/main/resources</directory>
                <includes>
                    <include>**/*.xml</include>
                    <include>**/*.properties</include>
                </includes>
                <filtering>true</filtering>
            </resource>
        </resources>
    </build>
</project>

🎍 2. Design Database

Step 2: Design the database and create related tables to add some data to it for testing

Database Creation

CREATE DATABASE plansystem;

CREATE TABLE plan (
	`plan_id` int PRIMARY KEY NOT NULL AUTO_INCREMENT,
	`start_date` VARCHAR(64) NOT NULL,
	`end_date` VARCHAR(64) ,
	`context` VARCHAR(64) NOT NULL
)ENGINE=INNODB DEFAULT charset=utf8

Add some data to the database for subsequent testing

🎍 3. Create a web project to configure the web.xml assembly Tomcat

Step 3: Create a web project and configure the web.xml file

Don't forget to configure Artifacts to build server output from Tomcat after you've created your web project

Note: Make sure all dependencies are Put into Output Root at this time or the corresponding dependencies may not be loaded properly.

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <servlet>
        <servlet-name>springmvc</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:applicationContext.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>springmvc</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>
    
    <filter>
        <filter-name>encodingFilter</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>utf-8</param-value>
        </init-param>
    </filter>

    <filter-mapping>
        <filter-name>encodingFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

    <session-config>
        <session-timeout>15</session-timeout>
    </session-config>
    

</web-app>

The above web. The XML file configures the front-end controller Dispatcher Servlet and its corresponding configuration file path applicationContext. The XML file, followed by the CharacterEncoding Filter, which configures the character encoding format and session lifetime.

πŸŽ„ 4. Write and integrate DAO and Service layers

🎁 1. Writing DAO Layer and Integration with Spring and Mybatis

Plan.java

/**
 * Functional Description
 * Plan Entity Class
 * @author Alascanfu
 * @date 2022/1/20
 */
public class Plan {
    private int planId;
    private String startDate;
    private String endDate;
    private String context;
    
    public Plan() {
    }
    
    public Plan(int planId, String startDate, String endDate, String context) {
        this.planId = planId;
        this.startDate = startDate;
        this.endDate = endDate;
        this.context = context;
    }
    
    public int getPlanId() {
        return planId;
    }
    
    public void setPlanId(int planId) {
        this.planId = planId;
    }
    
    public String getStartDate() {
        return startDate;
    }
    
    public void setStartDate(String startDate) {
        this.startDate = startDate;
    }
    
    public String getEndDate() {
        return endDate;
    }
    
    public void setEndDate(String endDate) {
        this.endDate = endDate;
    }
    
    public String getContext() {
        return context;
    }
    
    public void setContext(String context) {
        this.context = context;
    }
    
    @Override
    public String toString() {
        return "Plan{" +
            "planId=" + planId +
            ", startDate='" + startDate + '\'' +
            ", endDate='" + endDate + '\'' +
            ", context='" + context + '\'' +
            '}';
    }
}

PlanMapper.java

/**
 * Functional Description
 * PlanMapper
 * @author Alascanfu
 * @date 2022/1/20
 */
public interface PlanMapper {
    //Add a plan information
    public int addPlan(Plan plan);
    //Delete the schedule information for the specified id
    public int deletePlanById(@Param("planId") int id);
    //Update the schedule information for the specified id
    public int updatePlanById(Plan plan);
    //Reads the schedule information for the specified id
    public Plan queryPlanById(int id);
    //Get all plan information
    public List<Plan> queryAllPlan();
    
    //Get all schedules in the selected date
    public List<Plan> queryDate(Plan plan);
}

PlanMapper.xml

<?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.alascanfu.dao.PlanMapper">

    <insert id="addPlan" parameterType="com.alascanfu.pojo.Plan">
        insert into plan(start_date,end_date,context)
        values (#{startDate},#{endDate},#{context})
    </insert>
    <update id="updatePlanById">
        update plan
        set start_date = #{startDate},end_date = #{endDate},context = #{context}
        where plan_id = #{planId}
    </update>

    <delete id="deletePlanById" parameterType="int">
        delete from plan
        where plan_id = #{planId}
    </delete>

    <select id="queryPlanById" resultType="com.alascanfu.pojo.Plan">
        select plan_id,start_date,end_date,context from plan where plan_id = #{planId}
    </select>
    <select id="queryAllPlan" resultType="com.alascanfu.pojo.Plan">
        select plan_id,start_date,end_date,context from plan
    </select>

    <select id="queryDate" resultType="com.alascanfu.pojo.Plan">
        select plan_id,start_date,end_date,context
        from plan
        where
        STR_TO_DATE(start_date,'%Y-%m-%d') &lt;= STR_TO_DATE(#{startDate},'%Y-%m-%d')
        and STR_TO_DATE(#{startDate},'%Y-%m-%d') &lt;= STR_TO_DATE(end_date,'%Y-%m-%d')
    </select>


</mapper>

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>
    <!-- Turn on hump naming -->
    <settings>
        <setting name="mapUnderscoreToCamelCase" value="true"/>
    </settings>

    <typeAliases>

    </typeAliases>
</configuration>

db.properties

jdbc.url=jdbc:mysql://localhost:3306/plansystem?useSSL=true&useUnicode=true&characterEncoding=utf8&serverTimezone=Asia/Shanghai
jdbc.username=root
jdbc.password=123456
jdbc.driverClassName=com.mysql.cj.jdbc.Driver

Here we need to pay attention to Ha Mybatis8. More than 0 time zones have to be increased oh~

spring-mybatis.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd">

    <context:property-placeholder location="classpath:db.properties"/>
<!--    To configure Druid data source-->
    <bean class="com.alibaba.druid.pool.DruidDataSource" id="dataSource">
        <property name="driverClassName" value="${jdbc.driverClassName}"/>
        <property name="url" value="${jdbc.url}"/>
        <property name="username" value="${jdbc.username}"/>
        <property name="password" value="${jdbc.password}"/>
    </bean>
<!--    take SqlSessionFactory Injection into IOC In containers, and configure mapper Map file address of mybatis-config File Address-->
    <bean class="org.mybatis.spring.SqlSessionFactoryBean" id="sqlSessionFactory">
        <property name="dataSource" ref="dataSource"/>
        <property name="configLocation" value="classpath:mybatis-config.xml"/>
        <property name="mapperLocations" value="classpath:com/alascanfu/dao/*.xml"/>
    </bean>
<!-- Automatically help us map -->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <property name="basePackage" value="com.alascanfu.dao"/>
    </bean>
</beans>

🎁 2. Write the Sercvice service layer and configure spring-service.xml

PlanService.java

@Service("planService")
public class PlanService {
    
    @Autowired
    PlanMapper planMapper;
    //Add a plan information
    public int addPlan(Plan plan){
        return planMapper.addPlan(plan);
    }
    //Delete the schedule information for the specified id
    public int deletePlanById(@Param("planId") int id){
        return planMapper.deletePlanById(id);
    }
    //Update the schedule information for the specified id
    public int updatePlanById(Plan plan){
        return planMapper.updatePlanById(plan);
    }
    //Reads the schedule information for the specified id
    public Plan queryPlanById(int id){
        return planMapper.queryPlanById(id);
    }
    //Get all plan information
    public List<Plan> queryAllPlan(){
        return planMapper.queryAllPlan();
    }
    
    //Get all plans for the date of the day
    public List<Plan> queryDate(Plan plan){
        return planMapper.queryDate(plan);
    }
}

The annotations used above inject the Service layer directly into the IOC container and automatically construct objects through reflection when PlanMapper is needed.

spring-service.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans
        xmlns="http://www.springframework.org/schema/beans"
        xmlns:context="http://www.springframework.org/schema/context"
        xmlns:tx="http://www.springframework.org/schema/tx"
        xmlns:aop="http://www.springframework.org/schema/aop"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

       xsi:schemaLocation="
       http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context.xsd
        http://www.springframework.org/schema/tx
        http://www.springframework.org/schema/tx/spring-tx.xsd
        http://www.springframework.org/schema/aop
        http://www.springframework.org/schema/aop/spring-aop.xsd
">
    <context:component-scan base-package="com.alascanfu.service"/>
    <context:annotation-config/>
    <aop:aspectj-autoproxy/>
    <tx:annotation-driven/>
    <import resource="spring-mybatis.xml"/>

    <bean class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
        <property name="dataSource" ref="dataSource"/>
    </bean>

</beans>

Because small payments do not add AOP related operations here and response agents are not added at the service level, this profile is not configured, but it is important to note that classes containing @Service are injected into the IOC container through DI.

ApplicationContext at this time. XML

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"

       xsi:schemaLocation="http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd">
    <context:component-scan base-package="com.alascanfu"/>
    <context:annotation-config/>
    <import resource="classpath:spring-mybatis.xml"/>
    <import resource="classpath:spring-service.xml"/>
</beans>

πŸŽ„ 5. Write the Controller layer and corresponding front-end pages

🎁 1. Write and beautify the front page interface a little

index.jsp

<%--
  Created by IntelliJ IDEA.
  User: Emperor Bai Ying Li Mu
  Date: 2022/1/20
  Time: 18:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>Schedule List Home Page</title>
  </head>
  <style>
    a {
      color: black;
      text-decoration: none;
      font-size: 18px;
    }
    h3{
      width: 180px;
      height: 38px;
      margin: 100px auto;
      line-height: 38px;
      text-align: center ;
      background-color: skyblue;
    }
    h4{
      text-align: center;
      margin: 100px auto;
      font-family: STXingkai;
    }
  </style>
  <body>
  <h3>
    <a href="${pageContext.request.contextPath}/planSystem/allPlan">Enter Plan Management List</a>
    <h4>Author: Alascanfu</h4>
    <h4>Date: January 21, 2022</h4>
  </h3>
  </body>
</html>

✨ 2. Show all plans in the plan list ✨

PlanController.java

@Controller
@RequestMapping("/planSystem")
public class PlanController {
    @Autowired
    PlanService planService;
    
    /**
     *Functional Description
     * Query all scheduled lists to return to the list display page
     * @date 2022/1/20
     *  @author Alascanfu
     */
    @RequestMapping("/allPlan")
    public String planList(Model model){
        List<Plan> plans = planService.queryAllPlan();
        model.addAttribute("plans",plans);
        return "planList";
    }
}

Pages for testing

<%--
  Created by IntelliJ IDEA.
  User: Emperor Bai Ying Li Mu
  Date: 2022/1/20
  Time: 18:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>planList</title>
</head>
<body>
<h1>Schedule list: ${plans}</h1>
</body>
</html>

Now that we can test the data, we need to beautify the page

This applies to some Bootstrap related technologies. The rasterization system is very practical, it won't look at the official website, it will be ready in more than an hour

PlanList.jsp

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Emperor Bai Ying Li Mu
  Date: 2022/1/20
  Time: 18:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>planList</title>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 ">
            <div class="page-header">
                <h1>
                    <small>Schedule List - Show all plans</small>
                </h1>
            </div>
        </div>
    </div>

    <div class="row clearfix">
        <div class="col-md-12">
            <table class="table table-hover table-striped">
                <thead>
                    <tr>
                        <th>Plan number</th>
                        <th>Start date</th>
                        <th>Closing date</th>
                        <th>Brief Content</th>
                    </tr>
                </thead>
                <tbody>
                    <c:forEach var="plan" items="#{plans}">
                        <tr>
                            <td>${plan.planId}</td>
                            <td>${plan.startDate}</td>
                            <td>${plan.endDate}</td>
                            <td>${plan.context}</td>
                        </tr>
                    </c:forEach>
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
</html>

Show as follows:

✨ 3. New Plan Page Writing and Displaying All and its Controller ✨

Modify the previous planList page and add a button to increase the plan

planList.jsp

<div class="row">
        <div class="col-md-4 column">
            <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/toAddPlan">New Plan</a>
            <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/allPlan">Show All</a>
        </div>
</div>

Add it to the table

PlanController.java

/**
     *Functional Description
     * Jump to the page where you want to add a plan
     * @date 2022/1/21
     *  @author Alascanfu
     */
@RequestMapping("/toAddPlan")
public String toAddPlan(){
    return "addPlan";
}
    
    /**
     *Functional Description
     * Add Schedule
     * @date 2022/1/21
     *  @author Alascanfu
     */
@RequestMapping("/addPlan")
public String addPlan(Plan plan){
    planService.addPlan(plan);
        return "redirect:/planSystem/allPlan";
}

addPlan.jsp

<%--
  Created by IntelliJ IDEA.
  User: Emperor Bai Ying Li Mu
  Date: 2022/1/21
  Time: 14:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>addPlan</title>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 ">
            <div class="page-header">
                <h1>
                    <small>Plan List - New Plan</small>
                </h1>
            </div>
        </div>
    </div>

    <form action="${pageContext.request.contextPath}/planSystem/addPlan" method="post">
        <div class="form-group">
            <label>Start date</label>
            <input type="date" class="form-control" name="startDate" placeholder="2022-01-21" required>
        </div>
        <div class="form-group">
            <label>Closing date</label>
            <input type="date" class="form-control" name="endDate" placeholder="2022-01-22" required>
        </div>
        <div class="form-group">
            <label>Plan Content</label>
            <input type="text" class="form-control" name="context" placeholder="Please outline the plan" required>
        </div>

        <button type="submit" class="btn btn-default">Submit</button>
    </form>
</div>
</body>
</html>

Testing - Test

Add data to view results

The above ontroller-level workflow goes to the following:When we click on a new plan on the planList page, our client (browser) sends a request to our Tomcat server, which is then adapted by the front-end controller to handle the Controller layer, where we add data from the addPlan page via a request to/toAddPlan s. When we finish adding data, submitting the form will reach / addPlanin Controller again to persist the data to the database, and then redirection will display all the data in the database now on the planList page.

✨ 4. Delete Schedule Controller Layer and Jump Processing ✨

PlanController.java

    /**
     *Functional Description
     * Delete specified schedule
     * @date 2022/1/21
     *  @author Alascanfu
     */
    @RequestMapping("/deletePlan")
    public String deletePlan(int planId){
        planService.deletePlanById(planId);
        return "redirect:/planSystem/allPlan";
    }

Beautify and write previous front-end pages

<div class="row clearfix">
        <div class="col-md-12">
            <table class="table table-hover table-striped">
                <thead>
                    <tr>
                        <th>Plan number</th>
                        <th>Start date</th>
                        <th>Closing date</th>
                        <th>Brief Content</th>
                        <th>operation</th>
                    </tr>
                </thead>
                <tbody>
                    <c:forEach var="plan" items="#{plans}">
                        <tr>
                            <td>${plan.planId}</td>
                            <td>${plan.startDate}</td>
                            <td>${plan.endDate}</td>
                            <td>${plan.context}</td>
                            <td>
                                <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/toUpdatePlan?planId=${plan.planId}">modify</a>
                                &nbsp; | &nbsp;
                                <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/deletePlan?planId=${plan.planId}">delete</a>
                            </td>

                        </tr>
                    </c:forEach>
                </tbody>
            </table>
        </div>

✨ 5. Modify Plan Controller and Page Writing ✨

PlanController.java

/**
     *Functional Description
     * Jump to the page where you want to modify your plan
     * @date 2022/1/21
     *  @author Alascanfu
     */
    @RequestMapping("/toUpdatePlan")
    public String toUpdatePlan(Plan plan,Model model){
        Plan qPlan = planService.queryPlanById(plan.getPlanId());
        model.addAttribute("QPlan",qPlan);
        return "updatePlan";
    }
    
    /**
     *Functional Description
     * Modify the specified schedule
     * @date 2022/1/21
     *  @author Alascanfu
     */
    @RequestMapping("/updatePlan")
    public String updatePlan(Plan plan, Model model){
        planService.updatePlanById(plan);
        return "redirect:/planSystem/allPlan";
    }

This requires a Front End Jump Controller process to preserve the data so that the user cannot modify the plan number, and subsequent updates after the plan is passed in are redirected to all the plan pages

updatePlan.jsp

<%--
  Created by IntelliJ IDEA.
  User: Emperor Bai Ying Li Mu
  Date: 2022/1/21
  Time: 14:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>updatePlan</title>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 ">
            <div class="page-header">
                <h1>
                    <small>Schedule List - Modify Schedule</small>
                </h1>
            </div>
        </div>
    </div>

    <form action="${pageContext.request.contextPath}/planSystem/updatePlan" method="post">
        <div class="form-group">
            <label>Plan number</label>
            <input  type="hidden" class="form-control" name="planId" value="${QPlan.planId}" required>
            <p class="form-control-static">${QPlan.planId}</p>
        </div>
        <div class="form-group">
            <label>Start date</label>
            <input type="date" class="form-control" name="startDate" value="${QPlan.startDate}" required>
        </div>
        <div class="form-group">
            <label>Closing date</label>
            <input type="date" class="form-control" name="endDate" value="${QPlan.endDate}" required>
        </div>
        <div class="form-group">
            <label>Plan Content</label>
            <input type="text" class="form-control" name="context" placeholder="${QPlan.context}" required>
        </div>

        <button type="submit" class="btn btn-default">Submit</button>
    </form>
</div>
</body>
</html>

✨ 6. Query the date schedule (show the schedule to be completed for the date queried) ✨

PlanController.java

    /**
     * Functional Description
     * Extension: Show all schedules needed for query dates
     * @date 2022/1/21
     * @author Alascanfu
     */
    @RequestMapping("/queryDate")
    public String queryStartDate(Plan plan,Model model){
        List<Plan> plans = planService.queryDate(plan);
        model.addAttribute("plans",plans);
        return "planList";
    }

✨✨ 7. The overall JSP page (planList) ✨✨

The JSP home page designed at this time:

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Emperor Bai Ying Li Mu
  Date: 2022/1/20
  Time: 18:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>planList</title>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 ">
            <div class="page-header">
                <h1>
                    <small>Schedule List - Show all plans</small>
                </h1>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-4 column">
            <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/toAddPlan">New Plan</a>
            <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/allPlan">Show All</a>
        </div>
        <div class="col-md-4">
            <form action="${pageContext.request.contextPath}/planSystem/queryDate" method="post" class="form-inline">
                <div class="form-group">
                    <input type="date" name="startDate" class="form-control" />
                </div>
                <button type="submit" class="btn btn-default">query</button>
            </form>
        </div>
    </div>

    <div class="row clearfix">
        <div class="col-md-12">
            <table class="table table-hover table-striped">
                <thead>
                    <tr>
                        <th>Plan number</th>
                        <th>Start date</th>
                        <th>Closing date</th>
                        <th>Brief Content</th>
                        <th>operation</th>
                    </tr>
                </thead>
                <tbody>
                    <c:forEach var="plan" items="#{plans}">
                        <tr>
                            <td>${plan.planId}</td>
                            <td>${plan.startDate}</td>
                            <td>${plan.endDate}</td>
                            <td>${plan.context}</td>
                            <td>
                                <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/toUpdatePlan?planId=${plan.planId}">modify</a>
                                &nbsp; | &nbsp;
                                <a class="btn btn-info" href="${pageContext.request.contextPath}/planSystem/deletePlan?planId=${plan.planId}">delete</a>
                            </td>

                        </tr>
                    </c:forEach>
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
</html>

🎁 8. Test Projects 🎁

New Plan

Delete Schedule

Query for schedules to be completed on a specified date

πŸŽ„ 6. Project Summary

This is a very, very simple and basic project for SMM. It will take about an hour or more to start learning soon. But when you brush it again, this project will come in handy. The small payer has written about 40 minutes to hold this project. It is a good small project. You can also improve it and complete your own small project Demo. For example, what kind of paging query, what kind of fuzzy query, I will pass it on to Github for everyone to refer to, learn together, progress together, go on, and believe that there is absolutely nothing wrong with me.

πŸ’– Write at the end πŸ’–

SSM Framework Review Paragraph~

Subsequent small payments will refresh SpringBoot Quick Development!

And will continue to update the JVM operating system computer network algorithms and other related knowledge

Learn a little every day, at least get something. It's a great day.

Last xdm refuel!!! No complaints, no regrets for your dream~

Topics: Java github Back-end SSM Software development