簡(jiǎn)單的ssm練手項(xiàng)目

這是一個(gè)簡(jiǎn)單的ssm整合項(xiàng)目? 實(shí)現(xiàn)了汽車的品牌，價(jià)格，車型的添加 ，修改，刪除，所有數(shù)據(jù)從數(shù)據(jù)庫(kù)中拿取

使用到了jsp+mysql+Mybatis+spring+springmvc 等后端技術(shù)，使用springboot快速搭建項(xiàng)目，前端使用到了layui

1.準(zhǔn)備數(shù)據(jù)庫(kù)相關(guān)

1.1 新建car表?

CREATETABLE`car` (

`id`int(11)NOTNULLAUTO_INCREMENT,

`brand`varchar(20)NOTNULL,

`type`varchar(20)NOTNULL,

`price`double(20,0)NOTNULL,

? PRIMARY KEY (`id`)

) ENGINE=InnoDB AUTO_INCREMENT=25DEFAULT CHARSET=utf8;

?

1.2 添加數(shù)據(jù)?

INSERTINTO`car`VALUES('1','豐田','卡羅拉','128888');

INSERTINTO`car`VALUES('2','本田','思域','138888');

INSERTINTO`car`VALUES('3','寶馬','3系','328888');

INSERTINTO`car`VALUES('4','榮威','RX8','168888');

INSERTINTO`car`VALUES('5','豐田','漢蘭達(dá)','328888');

INSERTINTO`car`VALUES('6','大眾','帕沙特','218888');

INSERTINTO`car`VALUES('7','奧迪','A6','456666');

INSERTINTO`car`VALUES('8','寶馬','7系','1200000');

2開(kāi)始項(xiàng)目?

新建一個(gè)springboot項(xiàng)目

添加相關(guān)依賴

</dependency>

<!--阿里巴巴連接池-->

<dependency>

<groupId>com.alibaba</groupId>

<artifactId>druid</artifactId>

<version>1.1.20</version>

</dependency>

<!--mybatis-plus依賴-->

<!--https://mvnrepository.com/artifact/com.baomidou/mybatis-plus -->

<dependency>

<groupId>com.baomidou</groupId>

<artifactId>mybatis-plus</artifactId>

<version>3.3.1</version>

</dependency>

?

<dependency>

<groupId>org.mybatis.spring.boot</groupId>

<artifactId>mybatis-spring-boot-starter</artifactId>

<version>2.1.3</version>

</dependency>

?

?

<!--jstl依賴-->

<!--https://mvnrepository.com/artifact/javax.servlet.jsp.jstl/jstl -->

<dependency>

<groupId>javax.servlet</groupId>

<artifactId>jstl</artifactId>

</dependency>

?

<!--使jsp頁(yè)面生效-->

<!--https://mvnrepository.com/artifact/org.apache.tomcat.embed/tomcat-embed-jasper -->

<dependency>

<groupId>org.apache.tomcat.embed</groupId>

<artifactId>tomcat-embed-jasper</artifactId>

<version>9.0.33</version>

</dependency>

<!--https://mvnrepository.com/artifact/mysql/mysql-connector-java -->

<dependency>

<groupId>mysql</groupId>

<artifactId>mysql-connector-java</artifactId>

<version>8.0.15</version>

</dependency>

<dependency>

<groupId>taglibs</groupId>

<artifactId>standard</artifactId>

<version>1.0.6</version>

</dependency>

<dependency>

<groupId>com.github.pagehelper</groupId>

<artifactId>pagehelper</artifactId>

<version>4.2.0</version>

</dependency>

?

?

?

?

</dependencies>

創(chuàng)建com.car.pojo.Car數(shù)據(jù)庫(kù)表對(duì)應(yīng)類，打上@TableName注解關(guān)聯(lián)上數(shù)據(jù)庫(kù)表，提供get/set方法，如果不想手寫get/set方法可以在創(chuàng)建springboot項(xiàng)目時(shí)勾選上Lombok依賴，可以自動(dòng)創(chuàng)建get/set方法

@TableName("car")//和數(shù)據(jù)庫(kù)的表相對(duì)應(yīng)

//@Data//自動(dòng)添加get/set方法

publicclassCar{

@TableId(type=IdType.AUTO)

privateIntegerid;

privateStringtype;

privateStringbrand;

privateDoubleprice;

?

publicIntegergetId() {

returnid;

?? }

?

publicvoidsetId(Integerid) {

this.id=id;

?? }

?

publicStringgetType() {

returntype;

?? }

?

publicvoidsetType(Stringtype) {

this.type=type;

?? }

?

publicStringgetBrand() {

returnbrand;

?? }

?

publicvoidsetBrand(Stringbrand) {

this.brand=brand;

?? }

?

publicDoublegetPrice() {

returnprice;

?? }

?

publicvoidsetPrice(Doubleprice) {

this.price=price;

?? }

?

@Override

publicStringtoString() {

return"Car{"+

"id="+id+

", type='"+type+'\''+

", brand='"+brand+'\''+

", price="+price+

'}';

?? }

}

在car包下新建conteoller.AutoConteoller類并打上@Controller注解

@Controller

public class AutoController {

?? @Autowired

?? private AutoServiceImpl autoService;

?

?? @RequestMapping("/findAll")

?? public String findAll(Integer page,Model model){

? ? ?? //開(kāi)始分頁(yè)

? ? ?? PageHelper.startPage(page,3);

? ? ?? List<Car> carList = autoService.findAll(page);

? ? ?? PageInfo<Car> pageInfo = new PageInfo<>(carList);

? ? ?? model.addAttribute("list",carList);

? ? ?? model.addAttribute("page",page);

? ? ?? return "list";

?? }

?? //添加數(shù)據(jù)

?? @RequestMapping("/add")

?? public String addCar(Car car){

? ? ?? autoService.addCar(car);

? ? ?? return "redirect:findAll";

?? }

?? //搜索

?? @RequestMapping("/findCarByType")

?? public String findCarByType(String brand,Model model){

? ? ?? List<Car> carList = autoService.findCarByType(brand);

? ? ?? model.addAttribute("list",carList);

? ? ?? return "list";

?? }

?? //根據(jù)id刪除

?? @RequestMapping("/delete")

?? public String deleteById(Integer id){

? ? ?? autoService.deleteById(id);

? ? ?? return "redirect:findAll";

?? }

?? //跳轉(zhuǎn)修改頁(yè)

?? @RequestMapping("/alter")

?? public String skip(Integer id,Model model){

? ? ?? List<Car> carBrand = autoService.findCarById(id);

? ? ?? model.addAttribute("list",carBrand);

? ? ?? return "update";

?? }

?? //修改

?? @RequestMapping("/update")

?? public String updateCarByBrand(Car car){

? ? ?? autoService.updateCarByBrand(car);

? ? ?? return "redirect:findAll";

?? }

?? //根據(jù)id查詢

?? public String findCarById(Integer id,Model model){

? ? ?? List<Car> cars = autoService.findCarById(id);

? ? ?? model.addAttribute("list",cars);

? ? ?? return "list";

?? }

?

}

在car包下新建srvice.AutoService接口

publicinterfaceAutoService{

//查詢所有

List<Car>findAll(Integerpage);

//新增

voidaddCar(Carcar);

//根據(jù)品牌搜索

List<Car>findCarByType(Stringbrand);

//根據(jù)id刪除

voiddeleteById(Integerid);

//修改

voidupdateCarByBrand(Carcar);

//根據(jù)id查詢

List<Car>findCarById(Integerid);

}

在Service包下新建AutoService接口的實(shí)現(xiàn)類impl.AutoServiceImpl實(shí)現(xiàn)AutoService接口中的方法，并打上@Service注解‘

@Service

publicclassAutoServiceImplimplementsAutoService{

@Autowired(required=false)

privateAutoMapperautoMapper;

?

//查詢所有

@Override

publicList<Car>findAll(Integerpage) {

List<Car>carList=autoMapper.findAll(page);

returncarList;

?? }

?

@Override

publicvoidaddCar(Carcar) {

autoMapper.addCar(car);

?? }

?

@Override

publicList<Car>findCarByType(Stringbrand) {

List<Car>carList=autoMapper.findCarByType(brand);

returncarList;

?? }

?

@Override

publicvoiddeleteById(Integerid) {

autoMapper.deleteById(id);

?? }

?

@Override

publicvoidupdateCarByBrand(Carcar) {

autoMapper.updateCarByBrand(car);

?? }

?

@Override

publicList<Car>findCarById(Integerid) {

List<Car>cars=autoMapper.findCarById(id);

returncars;

?? }

}

在car包下新建mapper.AutoMapper接口，并打上@Mapper注解

@Mapper

publicinterfaceAutoMapper{

@Select("select * from car")

List<Car>findAll(Integerpage);

//添加

@Insert("insert into car(brand,type,price)values(#{brand},#{type},#{price})")

voidaddCar(Carcar);

//根據(jù)品牌查詢

@Select("select * from car where brand like '%${brand}%'")

List<Car>findCarByType(Stringbrand);

//根據(jù)id刪除

@Delete("delete from car where id=#{id}")

voiddeleteById(Integerid);

//修改

@Update("update car set brand=#{brand},type=#{type},price=#{price} where brand=#{brand}")

voidupdateCarByBrand(Carcar);

//根據(jù)id查詢

@Select("select * from car where id = #{id}")

List<Car>findCarById(Integerid);

}

新建list.jsp頁(yè)面（主頁(yè)面展示）

<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<link type="text/css" href=".././css/layui.css" rel="stylesheet">

<html>

<head>

? ? <title>品牌列表</title>

? ? <style type="text/css">

? ? ? ? .layui-form{

? ? ? ? ? ? display: flex;

? ? ? ? }

? ? ? ? .layui-btn{

? ? ? ? ? ? margin-left: 10px;

? ? ? ? }

? ? ? ? .hint{

? ? ? ? ? ? color: red;

? ? ? ? ? ? line-height: 40px

? ? ? ? }

? ? ? ? .break-point{

? ? ? ? ? ? height: 2px;

? ? ? ? }

? ? ? ? .layui-table th{

? ? ? ? ? ? text-align: center;

? ? ? ? }

? ? ? ? .layui-table td{

? ? ? ? ? ? text-align: center;

? ? ? ? }

? ? ? ? .layui-card{

? ? ? ? ? ? background-color:#393D49;

? ? ? ? }

? ? ? ? .layui-card-header{

? ? ? ? ? ? color: #01AAED;

? ? ? ? ? ? text-align: center;

? ? ? ? }

? ? ? ? .page-button{

? ? ? ? ? ? width: 30%;

? ? ? ? ? ? display: flex;

? ? ? ? ? ? align-items:center;

? ? ? ? ? ? justify-content: center;

? ? ? ? }

? ? ? ? .main{

? ? ? ? ? ? display: flex;

? ? ? ? ? ? align-items:center;

? ? ? ? ? ? justify-content: center;

? ? ? ? }

? ? </style>

</head>

<tbody>

<div class="layui-card">

? ? <div class="layui-card-header">汽車列表</div>

</div>

<form class="layui-form" action="add" method="get">

? ? <div class="layui-form-item">

? ? ? ? <label class="layui-form-label">品牌</label>

? ? ? ? <div class="layui-input-block">

? ? ? ? ? ? <input type="text" name="brand" required? lay-verify="required" placeholder="請(qǐng)輸入品牌" autocomplete="off" class="layui-input">

? ? ? ? </div>

? ? </div>

? ? <div class="layui-form-item">

? ? ? ? <label class="layui-form-label">型號(hào)</label>

? ? ? ? <div class="layui-input-block">

? ? ? ? ? ? <input type="text" name="type" required? lay-verify="required" placeholder="請(qǐng)輸入型號(hào)" autocomplete="off" class="layui-input">

? ? ? ? </div>

? ? </div>

? ? <div class="layui-form-item">

? ? ? ? <label class="layui-form-label">價(jià)格</label>

? ? ? ? <div class="layui-input-block">

? ? ? ? ? ? <input type="number" name="price" required? lay-verify="required" placeholder="請(qǐng)輸入價(jià)格" autocomplete="off" class="layui-input">

? ? ? ? </div>

? ? </div>

? ? <input type="submit" value="添加" class="layui-btn"/>

? ? <input type="reset" value="重置" class="layui-btn layui-btn-primary"/>

</form>

<!-- 搜索 -->

<form class="layui-form" action="findCarByType" method="get">

? ? <div class="layui-form-item">

? ? ? ? <label class="layui-form-label">品牌</label>

? ? ? ? <div class="layui-input-block">

? ? ? ? ? ? <input type="text" name="brand" required? lay-verify="required" placeholder="請(qǐng)輸入品牌" autocomplete="off" class="layui-input">

? ? ? ? </div>

? ? </div>

? ? <input type="submit" value="搜索" class="layui-btn"/>

? ? <input type="reset" value="重置" class="layui-btn layui-btn-primary"/>

? ? <div>

? ? ? ? <div class="hint">提示：搜索功能支持模糊查找</div>

? ? </div>

</form>

<hr class="layui-bg-green">

<table class="layui-table">

? ? <thead>

? ? <tr>

? ? ? ? <th>編號(hào)</th>

? ? ? ? <th>品牌</th>

? ? ? ? <th>型號(hào)</th>

? ? ? ? <th>價(jià)格</th>

? ? ? ? <th>刪除|修改</th>

? ? </tr>

? ? <tbody>

<c:forEach items="${list}" var="carlist">

? ? <tr>

? ? ? ? <td>${carlist.id}</td>

? ? ? ? <td>${carlist.brand}</td>

? ? ? ? <td>${carlist.type}</td>

? ? ? ? <td>￥${carlist.price}</td>

? ? ? ? <td>

? ? ? ? ? ? <a href="delete?id=${carlist.id}" class="layui-btn layui-btn-normal">刪除</a>

? ? ? ? ? ? <a href="alter?id=${carlist.id}" class="layui-btn layui-btn-normal">修改</a>

? ? ? ? </td>

? ? </tr>

</c:forEach>

? ? </tbody>

? ? </tbody>

</table>

</body>

</html>

新建update.jsp頁(yè)面（車輛信息修改）

<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<link type="text/css" rel="stylesheet" href=".././css/layui.css">

<html>

<head>

? ? <title>修改</title>

? ? <style type="text/css">

? ? ? ? .layui-form{

? ? ? ? ? ? display: flex;

? ? ? ? }

? ? ? ? .layui-btn{

? ? ? ? ? ? margin-left: 10px;

? ? ? ? }

? ? ? ? .layui-card{

? ? ? ? ? ? background-color:#393D49;

? ? ? ? }

? ? ? ? .layui-card-header{

? ? ? ? ? ? color: #01AAED;

? ? ? ? ? ? text-align: center;

? ? ? ? }

? ? </style>

</head>

<body>

<div class="layui-card">

? ? <div class="layui-card-header">修改</div>

</div>

<c:forEach items="${list}" var="car">

? ? <form class="layui-form" action="update" method="get">

? ? ? ? <div class="layui-form-item">

? ? ? ? ? ? <label class="layui-form-label">品牌</label>

? ? ? ? ? ? <div class="layui-input-block">

? ? ? ? ? ? ? ? <input type="text" name="brand" required? lay-verify="required" placeholder="${car.brand}" autocomplete="off" class="layui-input">

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? ? ? <div class="layui-form-item">

? ? ? ? ? ? <label class="layui-form-label">車型</label>

? ? ? ? ? ? <div class="layui-input-block">

? ? ? ? ? ? ? ? <input type="text" name="type" required? lay-verify="required" placeholder="${car.type}" autocomplete="off" class="layui-input">

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? ? ? <div class="layui-form-item">

? ? ? ? ? ? <label class="layui-form-label">價(jià)格</label>

? ? ? ? ? ? <div class="layui-input-block">

? ? ? ? ? ? ? ? <input type="text" name="price" required? lay-verify="required" placeholder="${car.price}" autocomplete="off" class="layui-input">

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? ? ? <input type="submit" value="修改" class="layui-btn"/>

? ? ? ? <input type="reset" value="重置" class="layui-btn layui-btn-primary"/>

? ? </form>

</c:forEach>

</body>

</html>

注意：前端使用到了Layui需要的可以去Layui官網(wǎng)下載根據(jù)文檔使用

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容