1.持久层[Mapper]
1.规划SQL语句
用户在购物车列表页中通过随机勾选相关的商品，在点击"结算"按钮后，跳转到结算页面，在这个页面中需要展示用户在上个页面所勾选的购物车对应的数据，列表的展示，而展示的内容还是在于购物车的表，两个页面需要用户勾选多个值传递给下一个
select
cid, #日后勾选购物车商品模块需要用到cid来确定勾选的是购物车表的哪一条数据
uid, #感觉没必要,因为uid可以从session中拿的呀,难道是为
#了后面提交购物车订单时判断提交的商品的uid和登录的uid是否一致?
pid, #日购提交订单模块需要用到pid来确定购买的是商品表的哪件商
#品,然后对商品表的该商品的库存,销售热度等信息进行修改
t_cart.price, #两个表都有该字段,需要指定获取的是哪个数据表的
t_cart.num, #两个表都有该字段且含义不同,需要指定获取的是哪个数据表的
title,
t_product.price as realPrice, #为了在购物车列表页展示两个价格的差值
image
from t_cart
left join t_product on t_cart.pid = t_product.id #把t_cart作为主表(老师说现在处理的是购物车表的数据所以让其为主表,我不明白)
where
cid in (?,?,?)
order by
t_cart.created_time desc #进行排序使最新加入购物车的在最上面2. 接口和抽象方法
java
/**
* 用于：显示勾选购物车数据
* 根据购物车的id将用户选中的商品传递给"结算"页面
* @param cid
* @return
*/
List<CartVO> findVOByCid(Integer cid);3.配置映射
XML
<select id="findVOByCid" resultMap="CartEntityMap">
SELECT cid, uid, pid,
t_cart.price, t_cart.num,
t_product.title, t_product.image,
t_product.price AS realprice
FROM t_cart
LEFT JOIN t_product
ON t_cart.pid = t_product.id
WHERE cid in (
/*
collection:是什么类型
*/
<foreach collection="array" separator="," item="cid">
#{cid}
</foreach>
)
ORDER BY t_cart.created_time DESC
</select>4.单元测试
java
@Test
public void findVOByCid(){
Integer[] cids={1,2,3,45,6,9};
System.out.println(cartMapper.findVOByCid(cids));
}2.业务层[Service]
1.异常规划
因为是查询语句，所以没有异常处理
2.设计业务层接口抽象方法
java
/**
* 将用户在购物车页面中勾选中的数据传递给"结算"页面
* @param uid
* @param cids
* @return
*/
List<CartVO> getVOByCid(Integer uid,
Integer[] cids);3.完成抽象方法的设计
java
/**
* 将用户在购物车页面中勾选中的数据传递给"结算"页面
*
* @param uid
* @param cids
* @return
*/
@Override
public List<CartVO> getVOByCid(Integer uid, Integer[] cids) {
List<CartVO> list = cartMapper.findVOByCid(cids);
//循环遍历获取到的数据，查看该数据是否与目前传入的uid是一致的
Iterator<CartVO> it = list.iterator();
while (it.hasNext()){//如果循环没有遍历结束
//因为it一开始是指向下标为0，所以一上来就要next，才可以指向下一个
CartVO cartVO = it.next();
//进行判断用户对应是否正确
if (cartVO.getUid().equals(uid)) {//表示当前数据不属于当前的用户
//从集合中移除这个元素
list.remove(cartVO);
}
}
return list;
}3.控制层{Controller]
1.请求设计
- /cart/list
- Integeer cids,HttpSession session
- POST
- JsonResult<List<CartVO>>
2.完成请求处理
java
/**
* 将用户在购物车选中的商品通过"结算"传递到结算页面
* @param cids
* @param session
* @return
*/
@PostMapping("/list")
public JsonResult<List<CartVO>> getVOByCid(Integer[] cids,
HttpSession session){
List<CartVO> data = cartService.getVOByCid(getuidFromSession(session), cids);
return new JsonResult<>(OK,data);
}4.前端页面
1.将cart.html页面的"结算"按钮属性更改为"type=submit"
2.注释调用orderConfirm.html中的js代码
javascript
<!-- <script src="../js/orderConfirm.js" type="text/javascript" charset="utf-8"></script>-->3.orderConfirm.html页面中添加自动加载从上一个页面中传递过来的cids数据，再起请求ajax，中进行填充当前页面的某一个区域中
javascript
function showCartList() {
$("#cart-list").empty();
/*
* location.search.substr:是获取url中的数据
* 1:表示查找？之前
* 0：表示查找?之后【请求参数】
*
* 这里要传data是因为后端接口需要传入参数，所以这里才要写
* */
$.ajax({
url: "/cart/list",
data: location.search.substr(1),
type: "GET",
dataType: "JSON",
success: function(json) {
let list = json.data;
console.log("count=" + list.length);
let allCount = 0;
let allPrice = 0;
for (let i = 0; i < list.length; i++) {
console.log(list[i].title);
let tr = '<tr>'
+ '<td><img src="..#{image}collect.png" class="img-responsive" /></td>'
+ '<td><input type="hidden" name="cid" value="#{cid}" />#{title}</td>'
+ '<td>¥<span>#{realPrice}</span></td>'
+ '<td>#{num}</td>'
+ '<td>¥<span>#{totalPrice}</span></td>'
+ '</tr>';
tr = tr.replace(/#{cid}/g, list[i].cid);
tr = tr.replace(/#{image}/g, list[i].image);
tr = tr.replace(/#{title}/g, list[i].title);
tr = tr.replace(/#{realPrice}/g, list[i].realPrice);
tr = tr.replace(/#{num}/g, list[i].num);
tr = tr.replace(/#{totalPrice}/g, list[i].realPrice * list[i].num);
$("#cart-list").append(tr);
allCount += list[i].num;
allPrice += list[i].realPrice * list[i].num;
}
$("#all-count").html(allCount);
$("#all-price").html(allPrice);
},
error: function() {
alert("购物车数据加载未知异常 + 原因：" + xhr.status);
}
});
}