1.业务描述：
将数据库中的商品信息从数据库查询出来,然后进行删除、修 改、添加等操作。
2.技术架构设计:整体依旧基于“分而治之”的设计思想，采用MVC分层对业务进行技术实现。
3.基于特定架构下技术选型:
1)SpringBoot 管理依赖,提供基础配置,实现开箱即用
2)HikariCP 定义连接池
3)MyBatis 实现数据的持久操作
4)Spring IOC 实现资源整合
5)Spring Web 模块实现请求响应处理
6)Thymeleaf 基于此对象实现html模板解析
4.核心API(接口和类)的设计
1)pojo (Goods)
2)dao (GoodsDao,GoodsMapper.xml)
3)service(GoodsService,GoodsServiceImpl)
4)controller (GoodsController)
商品信息的查询并呈现:
1)Goods (id,name,remark,createdTime)
2)GoodsDao (@Mapper):List findGoods();
3)GoodsMapper.xml(mapper/goods/GoodsMapper.xml)
4)GoodsService,GoodsServiceImpl (@Service)
5)GoodsController(@Controller): String doFindGoods(){return goods;}
6)goods.html (templates/modules/)
第一步：定义商品pojo对象Goods，基于此对象封装商品数据。
public class Goods {
private Integer id;
private String name;
private String remark;
private Date createdTime;
@Override
public String toString() {
return "Goods{" +
"id=" + id +
", name='" + name + '\'' +
", remark='" + remark + '\'' +
", createdTime=" + createdTime +
'}';
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getRemark() {
return remark;
}
public void setRemark(String remark) {
this.remark = remark;
}
public Date getCreatedTime() {
return createdTime;
}
public void setCreatedTime(Date createdTime) { this.createdTime = createdTime;
}
}第二步：定义GoodsDao接口及查询方法
package com.cy.pj.goods.dao;
@Mapper
public interface GoodsDao{
List findGoods(String name);
} 第三步：定义GoodsMapper.xml文件并添加查询SQL映射
...
第四步：定义GoodsService接口及查询方法
定义GoodsService接口及查询方法
package com.cy.pj.goods.service;
public interface GoodsService{
List findGoods(String name);
} 定义GoodsService接口实现类GoodsServiceImpl并重写相关方法
package com.cy.pj.goods.service.impl;
@Service
public class GoodsServiceImpl implements GoodsService{
@Autowired
private GoodsDao goodsDao;
public List findGoods(String name){
return goodsDao.findGoods(name);
}
} 第五步：定义GoodsController类及处理查询请求的方法
package com.cy.pj.goods.controller;
@Controller
@RequestMapping("/goods/")
public class GoodsController{
@Autowired
private GoodsService goodsService;
@RequestMapping("doFindGoods")
public String doFindGoods(String name,Model model){
List list=goodsService.findGoods(name);
model.addAttribute("list",list);
return "goods";
}
} 查询客户端分析及实现
第一步：定义goods.html页面，用于呈现从服务端返回的数据
id
name
remark
createdTime
operation
1
A
A..
2020/12/30
delete
第二步：注册查询按钮click事件，基于此事件进行商品信息查询
商品子系统删除业务实现
业务分析
客户端点击删除按钮时,基于id删除数据中的商品信息
删除服务端实现
第一步:在GoodsDao中添加删除方法
@Delete("delete from tb_goods where id=#{id}") int deleteById(Integer id);第二步:在GoodsService接口及实现类中删除方法
public int deleteById(Integer id){
int rows=goodsDao.deleteById(id);
return rows;第三步:在GoodsController中添加处理删除请求的方法
@RequestMapping("doDeleteById")
public String doDeleteById(Integer id,Model model){
goodsService.deleteByreturn
"redirect:/goods/doFindGoods";Id(id);商品添加页面设计及呈现
业务分析
在商品列表页面上点击添加按钮时,进入商品添加页面.
添加服务端实现
在GoodsController中添加返回商品添加页面的方法
@GetMapping("doGoodsAddUI")
public String doGoodsAddUI(){
return "goods-add";添加客户端设计实现
第一步:商品列表页面添加按钮事件及事件处理函数
function doLoadGoodsAddUI(){ location.href=`${rootUrl}/goods/doGoodsAddUI`; }第三步:创建商品添加页面(goods-add.html),关键代码如下:
商品子系统添加业务实现
业务分析:
在页面上输入商品,输入完成,点击保存按钮将商品信息添加到数据库.
服务端设计实现
第一步:GoodsDao接口中添加保存商品信息的方法及映射
@Insert("insert into tb_goods (name,remark,createdTime) values (#{name},# {remark},now())")
int insertGoods(Goods goods);第二步: GoodsService接口及实现类中添加保存商品信息的方法
public int saveGoods(Goods goods){
return goodsDao.insertGoods(goods);
} 第三步:GoodsController中添加保存商品信息的方法
@PostMapping("doSaveGoods")
pulbic String doSaveGoods(Goods goods,Model model){
goodsService.saveGoods(goods);
return "redirect:/goods/doFindGoods";
}商品修改页面及数据呈现
业务分析
在商品列表页面点击修改按钮时,基于当前行记录的id,查询商品信息,并将商品信息呈现在页面上.
服务端设计及实现
第一步:GoodsDao接口中添加基于id执行查询的方法j及映射.
@Select("select * from tb_goods where id=#{id}") Goods findById(Integer id);第二步:GoodsService接口及实现类中添加基于id执行查询的方法.
public Goods findById(Integer id){
//......
return goodsDao.findById(id);
}第三步:GoodsController类中添加处理基于商品id执行查询的方法
@GetMapping("/doFindById/{id}")
public String doFindById(@PathVariable Integer id,Model model){
Goods goods=goodsService.findById(id);
model.addAttribute("goods",goods);
return "goods-update"; 客户端设计及实现
第一步:在goods列表页面,添加更新按钮并注册点击事件.
function doFindById(id){
location.href=`${rootUrl}/goods/doFindById/${id}`第二步:创建goods-update.html页面并基于此页面呈现修改数据
商品数据更新设计及实现
业务分析
在修改页面，点击修改按钮时将表单数据提交到服务端进行更新
服务端设计及实现
第一步：GoodsDao接口中添加修改方法及SQL映射
@Update("update tb_goods set name=#{name},remark=#{remark} where id=#{id}")
int updateGoods(Goods goods);第二步：GoodsService接口及实现类添加商品更新方法
public int updateGoods(Goods goods){
return goodsDao.updateGoods(goods);
}第三步：GoodsController中添加处理商品更新请求的方法
@RequestMapping("doUpdateGoods")
public String doUpdateGoods(Goods goods,Model model){
goodsService.updateGoods(goods);
return "redirect:/goods/doFindGoods";
}客户端设计及实现
点击update goods 按钮将表单数据提交到服务端。