购物车逻辑

xiaoxiao2021-02-28  118

既然是购物车,自然需要一个购物车(cart): 购物车中有加入购物车,从购物车中删除,计算购物车中所有商品总价格的方法,我们在这里是将所有的商品放入到了一个map集合中

public class Cart { Map<String,Commodity> cartbean=new HashMap<String, Commodity>(); int num=0; public void savecommo(Commodity commodity){ if (!cartbean.containsKey(commodity.getId())){ commodity.setNum(1); cartbean.put(commodity.getId(),commodity); }else { Commodity commodity1 = cartbean.get(commodity.getId()); commodity1.setNum(commodity1.getNum()+1); } } //删除商品 public void delete(String id){ Commodity remove = cartbean.remove(id); } //计算总价格 public float price(){ float price=0; Collection<Commodity> values = cartbean.values(); for(Commodity c:values){ price =price + c.getPrice()*c.getNum(); } return price; } //前端页面提供查询购物车的中商品 public Map<String,Commodity> show(){ return cartbean; } }

首先需要前台展示: 但是在展示所有商品之前需要查询出全部商品:

/*读取所有的商品*/ @RequestMapping("findAllCommodity.do") @ResponseBody public List<Commodity> findAllCommodity(){ List<Commodity> findallcommodity = cd.findallcommodity(); return findallcommodity; }

读取到所有的商品信息之后回到前端展示:

<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <html> <head> <title>Title</title> <link rel="stylesheet" href="css/icon.css"/> <link rel="stylesheet" href="css/easyui.css"/> <link rel="stylesheet" href="css/bootstrap.css"/> <script src="js/jquery.js"></script> <script type="text/javascript" src="js/easyui.js"></script> <script type="text/javascript" src="js/easyui-lang-zh_CN.js"></script> <script type="text/javascript" src="ckeditor/ckeditor.js"></script> </head> <body> <div style="margin: 100px 100px;width: 80%"> <ul> <c:forEach items="${portal}" var="item"> <li class="list-group-item"> <span> ${item.name} </span> | <span> ${item.price} </span> | <span> <a href="toCart.do?id=${item.id}" class="btn btn-danger">购买</a> <%--<button class="btn btn-danger">购买</button>--%> </span> </li> </c:forEach> </ul> </div> </body> </html>

之后用户选择商品加入购物车,加入购物车需要前端传递一个商品id给后台,在后台根据id获取该商品,将商品存放到map集合中,再将集合放入session中

@RequestMapping("toCart.do") public String addCart(String id,HttpSession session){ Commodity one = cd.findOne(id); Cart cart = (Cart) session.getAttribute("cart"); if (cart==null){ cart = new Cart(); cart.savecommo(one); }else { cart.savecommo(one); } session.setAttribute("cart",cart); return "redirect:cart.jsp"; }

按照正常的逻辑,加入购物车后需要来到购物车页面,该页面显示所有购物车中的商品

<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <html> <head> <title>Title</title> <link rel="stylesheet" href="css/icon.css"/> <link rel="stylesheet" href="css/easyui.css"/> <link rel="stylesheet" href="css/bootstrap.css"/> <script src="js/jquery.js"></script> <script type="text/javascript" src="js/easyui.js"></script> <script type="text/javascript" src="js/easyui-lang-zh_CN.js"></script> <script type="text/javascript" src="ckeditor/ckeditor.js"></script> <script> function deletecatecom(id) { $.get("deletecatecommo.do",{idd:id},function (dd) { location.reload(true); }) } </script> </head> <body> <div style="margin: 100px 100px;width: 80%"> <ul> <c:forEach items="${cart.show()}" var="item"> <li class="list-group-item"> <span> 商品名称: ${item.value.name} </span> | <span> 商品单价: ${item.value.price} </span> | <span> 购买数量: ${item.value.num} </span> <span> <a href="JavaScript:deletecatecom('${item.value.id}')" class="btn btn-danger" >删除</a> </span> </li> </c:forEach> <li class="list-group-item">总价:${cart.price()}</li> </ul> </div> </body> </html>

到目前为止,一个简单的购物车基本上已经实现了,还有一个小功能,就是购物车的删除,从购物车中删除商品,这个相对来说是比较简单的,只需要传递一个id,根据id值将商品从map集合中删除即可

//删除购物车中的商品 @RequestMapping("deletecatecommo.do") @ResponseBody public String deletecatecom(String idd,HttpSession session){ Cart attribute = (Cart) session.getAttribute("cart"); attribute.delete(idd); return "success"; }

以上代码均由SSM环境下搭建

转载请注明原文地址: https://www.6miu.com/read-19667.html

最新回复(0)