显示商品详情
1.商品显示商品详情持久层
1.1 规划查询的SQL语句
根据商品的id显示商品详情的SQL语句
SELECT * FROM t_product WHERE id=?
1.2 实现接口与抽象方法
在ProductMapper接口中添加抽象方法。
/* 根据商品id查询商品详情*/ Product findById(Integer id);
1.3 配置SQL映射
1.在ProductMapper.xml文件中配置findById(Integer id)方法的映射。
<!-- 根据商品id查询商品详情：Product findById(Integer id) --> <select id="findById" resultMap="ProductEntityMap"> SELECT * FROM t_product WHERE id=#{id} </select>
ProductMapper–findById
测试
ProductMapperTests
package com.up.stores.mapper; import com.up.stores.entity.Product; import org.junit.Test; import org.junit.runner.RunWith; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.boot.test.context.SpringBootTest; import org.springframework.test.context.junit4.SpringRunner; import java.util.List; @RunWith(SpringRunner.class) @SpringBootTest public class ProductMapperTests { @Autowired private ProductMapper productMapper; @Test public void findHotList() { List<Product> list = productMapper.findHotList(); System.out.println("count=" + list.size()); for (Product item : list) { System.out.println(item); } } @Test public void findById() { Integer id = 10000017; Product result = productMapper.findById(id); System.out.println(result); } }
ProductMapperTests
2.商品显示商品详情业务层
2.1 规划异常
如果商品数据不存在，一个抛出ProductNotFoundException,需要创建异常。
package com.cy.store.service.ex; /** 商品数据不存在的异常 */ public class ProductNotFoundException extends ServiceException { public ProductNotFoundException() { } public ProductNotFoundException(String message) { super(message); } public ProductNotFoundException(String message, Throwable cause) { super(message, cause); } public ProductNotFoundException(Throwable cause) { super(cause); } public ProductNotFoundException(String message, Throwable cause, boolean enableSuppression, boolean writableStackTrace) { super(message, cause, enableSuppression, writableStackTrace); } }
ProductNotFoundException
2.2 实现接口与抽象方法
在业务层IProductService接口中添加findById(Integer id)抽象方法。
/*根据商品id查询商品详情*/ Product findById(Integer id);
2.3 实现抽象方法
1.在ProductServiceImpl类中，实现接口中的findByd(Integer id)抽象方法.
@Override public Product findById(Integer id) { // 根据参数id调用私有方法执行查询，获取商品数据 Product product = productMapper.findById(id); // 判断查询结果是否为null if (product == null) { // 是：抛出ProductNotFoundException throw new ProductNotFoundException("尝试访问的商品数据不存在"); } // 将查询结果中的部分属性设置为null product.setPriority(null); product.setCreatedUser(null); product.setCreatedTime(null); product.setModifiedUser(null); product.setModifiedTime(null); // 返回查询结果 return product; }
ProductService–findById
测试
package com.cy.store.service; import com.cy.store.entity.Product; import com.cy.store.service.ex.ServiceException; import org.junit.jupiter.api.Test; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.boot.test.context.SpringBootTest; import java.util.List; @SpringBootTest public class ProductServiceTests { @Autowired private IProductService productService; @Test public void findHotList() { try { List<Product> list = productService.findHotList(); System.out.println("count=" + list.size()); for (Product item : list) { System.out.println(item); } } catch (ServiceException e) { System.out.println(e.getClass().getSimpleName()); System.out.println(e.getMessage()); } } @Test public void findById() { try { Integer id = 10000042; Product result = productService.findById(id); System.out.println(result); } catch (ServiceException e) { System.out.println(e.getClass().getSimpleName()); System.out.println(e.getMessage()); } } }
**ProductServiceTests **
3.商品显示商品详情控制器
3.1 处理异常
在BaseController类中处理ProductNotFoundException
else if (e instanceof ProductNotFoundException) { result.setState(4006); result.setMessage("商品数据不存在的异常"); }
BaseController–ProductNotFoundException
3.2 设计请求
请求路径：/products/{id}/details 请求参数：@PathVariable("id") Integer id 请求类型：GET 响应结果：JsonResult<Product>
3.3 处理请求
1.在ProductController类中添加处理请求的getById()方法
@GetMapping("{id}/details") public JsonResult<Product> getById(@PathVariable("id") Integer id) { // 调用业务对象执行获取数据 Product data = productService.findById(id); // 返回成功和数据 return new JsonResult<Product>(OK, data); }
ProductController–getById
测试
2.完成或启动项目，直接访问测试。
4 商品详情页–前端页面
1.检查在product.html页面body标签内部的最后是否引入jquery-getUrlParam.js文件，如果引入无需重复引入。
<script type="text/javascript" src="../js/jquery-getUrlParam.js"></script>
2.在product.html页面中body标签内部的最后，添加获取当前商品详情的代码。
<script type="text/javascript"> let id = $.getUrlParam("id"); console.log("id=" + id); $(document).ready(function() { $.ajax({ url: "/products/" + id + "/details", type: "GET", dataType: "JSON", success: function(json) { if (json.state == 200) { console.log("title=" + json.data.title); $("#product-title").html(json.data.title); $("#product-sell-point").html(json.data.sellPoint); $("#product-price").html(json.data.price); for (let i = 1; i <= 5; i++) { $("#product-image-" + i + "-big").attr("src", ".." + json.data.image + i + "_big.png"); $("#product-image-" + i).attr("src", ".." + json.data.image + i + ".jpg"); } } else if (json.state == 4006) { // 商品数据不存在的异常 location.href = "index.html"; } else { alert("获取商品信息失败！" + json.message); } } }); }); $("#btn-add-to-cart").click(function(){ $.ajax({ url: "/carts/add_to_cart", type: "POST", data: { "pid": id, "amount":$("#num").val() }, dataType: "JSON", success: function(json) { if (json.state == 200) { alert("加入购物车成功！"); } else { alert("加入购物车失败！"); } }, error: function(xhr) { alert("加入购物车产生未知异常" + xhr.message); } }); }); </script>
product.html
测试
完成后启动项目进行测试。
README–显示商品详情
