🎁🎁静态资源及sql文件分享
链接:https://pan.baidu.com/s/1X-yjmQcPD3PqS21x0HplNA?pwd=23gr
提取码:23gr
确认订单、显示收货地址功能的实现
- 显示勾选的购物车信息
-
- (一)显示勾选的购物车信息(持久层)
-
-
- 1.规划sql
- 2.设计接口和抽象方法
-
- (二)显示勾选的购物车信息(业务层)
-
-
- 1.规划异常
- 2.设计接口和抽象方法及实现
-
- (三)显示勾选的购物车信息(控制层)
-
-
- 1.处理异常
- 2.设计请求
- 3.处理请求
-
- (四)显示勾选的购物车信息(前端页面)
- 订单显示收货地址
显示勾选的购物车信息
(一)显示勾选的购物车信息(持久层)
1.规划sql
用户在购物车列表页中通过随机勾选相关的商品,在点击”结算”按钮后跳转到”确认订单页”,在这个页面中需要展示用户在上个页面所勾选的”购物车列表页”中对应的数据.且展示的内容还是来自于购物车表,所以”购物车列表页”需要将用户勾选的商品id传递给”确认订单页”
select
cid,
uid,
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
where
cid in (?,?,?)
order by
t_cart.created_time desc
2.设计接口和抽象方法
在CartMapper接口中添加findByCid2抽象方法
ListCartVo> findByCid2(Integer[] cids);
在CartMapper.xml文件中添加SQL语句的映射配置
select id="findByCid2" resultType="com.cy.store.vo.CartVo">
select cid,uid,pid,t_cart.price,t_cart.num,t_product.image,
t_product.title,t_product.price as realPrice
from t_cart left join t_product on t_product.id=t_cart.pid
where cid in (
foreach collection="array" item="cid" separator=",">
#{cid}
/foreach>
)
order by t_cart.created_time desc
/select>
foreach循环就是一个for循环
collection标识循环的是list集合还是数组,如果是list集合就用collection=“list”
item用来接收每次循环获取的值
separator标识循环出来的值中间用什么隔开,且最后循环出来的值后面不加
(二)显示勾选的购物车信息(业务层)
1.规划异常
查询语句,没有需要规划的异常,在业务层判断这几条购物车商品的数据归属是否正确,如果不正确也不需要抛出异常,直接从查询到的数据中移除该商品就行了
2.设计接口和抽象方法及实现
在ICartService接口中添加getByCids()抽象方法
ListCartVo> getByCids(Integer uid,Integer[] cids);
在CartServiceImpl类中重写业务接口中的抽象方法
@Override
public ListCartVo> getByCids(Integer uid, Integer[] cids) {
ListCartVo> result = cartMapper.findByCid2(cids);
if (result==null){
throw new CartNotFoundException("商品不存在");
}
IteratorCartVo> iterator = result.iterator();
while (iterator.hasNext()){
CartVo cartVo = iterator.next();
Integer uid1 = cartVo.getUid();
if (!uid1.equals(uid)){
result.remove(cartVo);
throw new AccessDeniedException("数据访问异常");
}
}
return result;
}
(三)显示勾选的购物车信息(控制层)
1.处理异常
没有异常需要处理
2.设计请求
请求路径:/carts/list
请求方式:GET
请求参数:Integer[] cids, HttpSession session
响应结果:JsonResult>
3.处理请求
在CartController类中添加处理请求的findVOByCids()方法。
@GetMapping("/list")
public JsonResultListCartVo>> findVOByCids(Integer[] cids,HttpSession session){
ListCartVo> cartVoList = cartService.getByCids(getuidfromsession(session), cids);
return new JsonResult>(ok,cartVoList);
}
(四)显示勾选的购物车信息(前端页面)
orderConfirm.js文件在orderConfirm.html页面中无用,所有在orderConfirm.html中注释掉
!-- script src="../js/orderConfirm.js" type="text/javascript" charset="utf-8">/script>-->
在orderConfirm.html页面编写js代码
script type="text/javascript">
$(document).ready(function() {
showCartList();
});
function showCartList() {
$("#cart-list").empty();
$.ajax({
url: "/carts/list",
type: "GET",
data: location.search.substr(1),
dataType: "JSON",
success: function(json) {
if (json.state == 200) {
var list = json.data;
console.log(location.search.substr(1));//调试用
//声明两个变量用于更新"确认订单"页的总件数和总价
var allCount = 0;
var allPrice = 0;
for (var i = 0; i list.length; i++) {
var tr = 'n' +
' n' +
'#{title} n' +
'¥#{price}
n' +
'#{num} n' +
'#{totalPrice} n' +
'
';
tr = tr.replace("#{image}",list[i].image);
tr = tr.replace("#{title}",list[i].title);
tr = tr.replace("#{price}",list[i].realPrice);
tr = tr.replace("#{num}",list[i].num);
tr = tr.replace("#{totalPrice}",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 (xhr) {
alert("在确认订单页加载勾选的购物车数据时发生未知的异常"+xhr.status);
}
});
}
/script>
订单显示收货地址
1.在orderConfirm.html页面中的ready函数中添加showAddressList方法的调用,使确认订单页加载时能够自动从后端获取该用户地址填充到select控件中并将第一个地址显示出来
$(document).ready(function() {
showCartList();
showAddressList();
});
2.在orderConfirm.html页面中编写showAddressList方法
function showAddressList() {
$("#address-list").empty();
$.ajax({
url: "/addresses",
type: "GET",
dataType: "JSON",
success: function(json) {
if (json.state == 200) {
var list = json.data;
for (var i = 0; i list.length; i++) {
/*
value="#{aid}"在该模块没有用,但是扔写上,只要是从数据库查到到的数据,都要让前端页
面的该条数据和id绑定(因为可能干别的什么时需要用到,就比如说下一个"创建订单"模块
就需要根据前端传给后端的aid查询用户选中的是哪一个地址然后将其加入订单表)
* */
var opt = '#{name} #{tag} #{provinceName}#{cityName}#{areaName}#{address} #{tel}';
opt = opt.replace("#{aid}",list[i].aid);
opt = opt.replace("#{name}",list[i].name);
opt = opt.replace("#{tag}",list[i].tag);
opt = opt.replace("#{provinceName}",list[i].provinceName);
opt = opt.replace("#{cityName}",list[i].cityName);
opt = opt.replace("#{areaName}",list[i].areaName);
opt = opt.replace("#{address}",list[i].address);
opt = opt.replace("#{tel}",list[i].tel);
$("#address-list").append(opt);
}
}
},
error: function (xhr) {
alert("在确认订单页加载用户地址时发生未知的异常"+xhr.status);
}
});
}
后记
👉👉💕💕美好的一天,到此结束,下次继续努力!欲知后续,请看下回分解,写作不易,感谢大家的支持!! 🌹🌹🌹
服务器托管,北京服务器托管,服务器租用 http://www.fwqtg.net