商城-商品管理-商品修改
商城-商品管理-商品修改
- 2.商品修改
- 2.1.处理按钮点击触发的事件
- 2.2.实现对SpuDetail接口的数据获取
- 2.3.完成对sku信息的查询操作
- 2.4.展示页面返回的响应信息
- 2.5.接收并处理用户的提交数据
- 2.6.在后台完成订单数据的完整处理流程
-
- 2.6.1 Controller层的逻辑实现
- 2.6.2 Service层的数据处理逻辑
- 2.6.3 mapper配置以实现业务与数据库之间的映射关系
-
2.7.其它
-
2.商品修改
2.1.编辑按钮点击事件
在商品详情页,每一个商品后面,都会有一个编辑按钮:

通过点击这个功能按钮来触发操作,请注意观察其绑定的点击事件:

对应的方法:

可以看到这里发起了两个请求,在查询商品详情和sku信息。
因为在一个商品列表页面中仅包含spu的基本属性:如id、名称、品牌以及分类信息等缺少较为详细的商品详情(如spuDetail)以及sku相关数据为了在编辑页面展示所需的数据而不遗漏关键信息在此过程中需要调用这些数据库资源
因此,接下来我们就编写后台接口,提供查询服务接口。
2.2.查询SpuDetail接口
GoodsController
需要分析的内容:
采用的方式为GET;
请求指定的路径为/spu/detail/{id};
请求所需的参数为id,并且该参数应对应于spu的ID;
返回的数据类型为SpuDetail对象。
@GetMapping("/spu/detail/{id}")
public ResponseEntity<SpuDetail> querySpuDetailById(@PathVariable("id") Long id) {
SpuDetail detail = this.goodsService.querySpuDetailById(id);
if (detail == null) {
return new ResponseEntity<>(HttpStatus.NOT_FOUND);
}
return ResponseEntity.ok(detail);
}
代码解释
GoodsService
public SpuDetail querySpuDetailById(Long id) {
return this.spuDetailMapper.selectByPrimaryKey(id);
}
代码解释
测试

2.3.查询sku
分析
- 请求方式采用GET方式进行
- 指定请求路径为/sku/list
- 其中请求参数包括id,并具体指明该参数应为spu的id
- 返回的数据集为多个sku信息
GoodsController
@GetMapping("sku/list")
public ResponseEntity<List<Sku>> querySkuBySpuId(@RequestParam("id") Long id) {
List<Sku> skus = this.goodsService.querySkuBySpuId(id);
if (skus == null || skus.size() == 0) {
return new ResponseEntity<>(HttpStatus.NOT_FOUND);
}
return ResponseEntity.ok(skus);
}
代码解释
GoodsService
需要注意的一点是:为了方便页面显示,并非仅仅查询了sku的库存信息,在此过程中我们同时获取了其库存数量,并用星号标出变量stock
public List<Sku> querySkuBySpuId(Long spuId) {
// 查询sku
Sku record = new Sku();
record.setSpuId(spuId);
List<Sku> skus = this.skuMapper.select(record);
for (Sku sku : skus) {
// 同时查询出库存
sku.setStock(this.stockMapper.selectByPrimaryKey(sku.getId()).getStock());
}
return skus;
}
代码解释
测试:

2.4.页面回显
随便点击一个编辑按钮,发现数据回显完成:




2.5.页面提交
此处的保存功能与新增实际上是同一个按钮。由此可见, 提交时所遵循的逻辑也完全一致. 无需多言.
随便修改点数据,然后点击保存,可以看到浏览器已经发出请求:

2.6.后台实现
接下来,我们编写后台,实现修改商品接口。
2.6.1.Controller
- 请求方式:PUT
- 请求路径:/
- 请求参数:Spu对象
- 返回结果:无
/** * 新增商品
* @param spu
* @return
*/
@PutMapping
public ResponseEntity<Void> updateGoods(@RequestBody SpuBo spu) {
try {
this.goodsService.update(spu);
return new ResponseEntity<>(HttpStatus.NO_CONTENT);
} catch (Exception e) {
e.printStackTrace();
return new ResponseEntity<>(HttpStatus.INTERNAL_SERVER_ERROR);
}
}
代码解释
2.6.2.Service
SPU数据是可以进行修改的,在某些特定情况下需要特别注意对库存信息的更新频率。然而,在实际操作中我们发现 SKU 数据具有一定的不可变性原因:例如,在内存容量方面可能存在一定的限制因素导致现有存储资源已经不再可用。因此在执行相关操作时应当充分考虑当前系统的承载能力并采取相应的保护措施以避免潜在的数据丢失风险。
因此这里直接删除以前的SKU,然后新增即可。
代码:
@Transactional
public void update(SpuBo spu) {
// 查询以前sku
List<Sku> skus = this.querySkuBySpuId(spu.getId());
// 如果以前存在,则删除
if(!CollectionUtils.isEmpty(skus)) {
List<Long> ids = skus.stream().map(s -> s.getId()).collect(Collectors.toList());
// 删除以前库存
Example example = new Example(Stock.class);
example.createCriteria().andIn("skuId", ids);
this.stockMapper.deleteByExample(example);
// 删除以前的sku
Sku record = new Sku();
record.setSpuId(spu.getId());
this.skuMapper.delete(record);
}
// 新增sku和库存
saveSkuAndStock(spu.getSkus(), spu.getId());
// 更新spu
spu.setLastUpdateTime(new Date());
spu.setCreateTime(null);
spu.setValid(null);
spu.setSaleable(null);
this.spuMapper.updateByPrimaryKeySelective(spu);
// 更新spu详情
this.spuDetailMapper.updateByPrimaryKeySelective(spu.getSpuDetail());
}
代码解释
2.6.3.mapper
与以前一样。
2.7.其它
商品的删除、上下架大家自行实现。
