本文在上一篇SpringBoot使用thymeleaf实现用户的登录注册(四)基础上实现用户对商品的增删改查。
项目结构图如下:
项目结构图中框起来的是需要修改或者新建的
流程图如下:
1.修改db2(product)的功能实现
1.1修改db2—>mapper下的
ProductMapper.java
@Qualifier("db2SqlSessionFactory")
@Mapper
@Component
public interface ProductMapper {
/**
* 添加一个商品
*
* @param name
* @param price
*/
@Insert("insert into product(productName, productPrice) values(#{name}, #{price})")
void addProduct(@Param("name") String name, @Param("price") Double price);
/**
* 查询所有的商品
*
* @return
*/
@Select("select * from product")
List<Product> findAll();
/**
* 根据商品id查询商品信息
* @param id
*/
@Select("select * from product where productId = #{id}")
Product findOne(@Param("id") Integer id);
/**
*更新商品信息
* @param product
*/
@Update({"update product set productName = #{product.productName}, productPrice = #{product.productPrice} where productId = #{product.productId}"})
void update(@Param("product") Product product);
/**
* 根据商品id删除商品信息
* @param id
*/
@Delete("delete from product where productId = #{id}")
void delete(@Param("id") Integer id);
}
1.2修改db2—>service下的
IProductService.java
public interface IProductService {
/**
* 添加一个商品
*
* @param product
*/
void saveProduct(Product product);
/**
* 查询所有的商品
*
* @return
*/
List<Product> findAllProducts();
/**
* 根据商品id查询商品信息
* @param id
* @return
*/
Product findOne(Integer id);
/**
*更新商品信息
* @param product
*/
void update(Product product);
/**
* 根据商品id删除商品信息
* @param id
*/
void delete(Integer id);
}
impl.ProductServiceImpl.java
@Service
public class ProductServiceImpl implements IProductService {
@Autowired
private ProductMapper productMapper;
/**
* 添加一个商品
*
* @param product
*/
@Override
// @Transactional(transactionManager = "db2TransactionManager")
public void saveProduct(Product product) {
productMapper.addProduct(product.getProductName(), product.getProductPrice());
}
/**
* 查询所有的商品
*
* @return
*/
@Override
public List<Product> findAllProducts() {
return productMapper.findAll();
}
/**
* 根据商品id查询商品信息
* @param id
* @return
*/
@Override
public Product findOne(Integer id) {
return productMapper.findOne(id);
}
/**
*更新商品信息
* @param product
*/
@Override
public void update(Product product) {
productMapper.update(product);
}
/**
* 根据商品id删除商品信息
* @param id
*/
@Override
public void delete(Integer id) {
productMapper.delete(id);
}
}
2.修改Controller
ProductController.java
@Controller
public class ProductController {
@Autowired
IProductService productService;
/**
* 商品列表
* @param model
* @return
*/
@RequestMapping("/productList")
public String productList(Model model) {
List<Product> products = productService.findAllProducts();
model.addAttribute("products", products);
return "product/productList";
}
/**
* 商品列表点击Add
* @return
*/
@RequestMapping("/toAdd")
public String toAdd(){
return "product/productAdd";
}
/**
* 执行增加商品信息,增加提交后自动返回商品列表界面
* @param product
* @return
*/
@RequestMapping("/add")
public String add(Product product){
productService.saveProduct(product);
return "redirect:/productList";
}
/**
* 商品列表点击update
* @param model
* @param id
* @return
*/
@RequestMapping("/toUpdate")
public String toUpdate(Model model, Integer id){
Product product = productService.findOne(id);
model.addAttribute("product", product);
return "product/productUpdate";
}
/**
* 执行更新商品信息,增加提交后自动返回商品列表界面
* @param product
* @return
*/
@RequestMapping("/update")
public String update(Product product){
productService.update(product);
return "redirect:/productList";
}
/**
* 商品列表点击delete
* @param id
* @return
*/
@RequestMapping("/delete")
public String delete(Integer id){
productService.delete(id);
return "redirect:/productList";
}
}
3.修改HTML页面
3.1使用Bootstrap美化HTML页面
在resources—>static下新建css文件夹,再在css文件夹下新建bootstrap.css
bootstrap.css具体见源码
3.2修改resources---->templates—>products的
productList.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>productList</title>
<!--thymeleaf表达式,th:href="@{/css/bootstrap.css}"@表示后面的是一个链接-->
<link rel="stylesheet" th:href="@{/css/bootstrap.css}"></link>
</head>
<body class="container">
<br/>
<h1>商品列表</h1>
<br/><br/>
<div class="with:80%">
<table class="table table-hover">
<thead>
<tr>
<th>#</th>
<th>productName</th>
<th>productPrice</th>
</tr>
</thead>
<tbody>
<!--each来进行for循环求值-->
<tr th:each="product : ${products}">
<th scope="row" th:text="${product.productId}"></th>
<td th:text="${product.productName}"></td>
<td th:text="${product.productPrice}"></td>
<td><a th:href="@{/toUpdate(id=${product.productId})}">update</a></td>
<td><a th:href="@{/delete(id=${product.productId})}">delete</a></td>
</tr>
</tbody>
</table>
</div>
<div class="form-group">
<div class="col-sm-2 control-label">
<a href="/toAdd" th:href="@{/toAdd}" class="btn btn-info">add</a>
</div>
</div>
</body>
</html>
productAdd.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>productAdd</title>
<!--利用thymeleaf表达式获取css路径,bootstrap给button提供样式-->
<link rel="stylesheet" th:href="@{/css/bootstrap.css}"></link>
</head>
<body class="container">
<br/>
<h1>添加商品</h1>
<br/><br/>
<div class="with:80%">
<form class="form-horizontal" th:action="@{/add}" method="post">
<div class="form-group">
<label for="productName" class="col-sm-2 control-label">productName</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="productName" id="productName" placeholder="productName"/>
</div>
</div>
<div class="form-group">
<label for="productPrice" class="col-sm-2 control-label" >productPrice</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="productPrice" id="productPrice" placeholder="productPrice"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input type="submit" value="Submit" class="btn btn-info" />
<input type="reset" value="Reset" class="btn btn-info" />
</div>
</div>
</form>
</div>
</body>
</html>
productUpdate.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>productUpdate</title>
<link rel="stylesheet" th:href="@{/css/bootstrap.css}"></link>
</head>
<body class="container">
<br/>
<h1>修改商品信息</h1>
<br/><br/>
<div class="with:80%">
<form class="form-horizontal" th:action="@{/update}" th:object="${product}" method="post">
<input type="hidden" name="productId" th:value="*{productId}" />
<div class="form-group">
<label for="productName" class="col-sm-2 control-label">productName</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="productName" id="productName" th:value="*{productName}" placeholder="productName"/>
</div>
</div>
<div class="form-group">
<label for="productPrice" class="col-sm-2 control-label" >productPrice</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="productPrice" id="productPrice" th:value="*{productPrice}" placeholder="productPrice"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input type="submit" value="Submit" class="btn btn-info" />
<a href="/toAdd" th:href="@{/productList}" class="btn btn-info">Back</a>
</div>
</div>
</form>
</div>
</body>
</html>