实习知识整理8：如何实现将商品加入购物车

情景分析：当我们进入商品详情页面时，一般会有两个按钮，一个是加入购物车，另一个是直接购买的按钮，我们先来看看加入购物车是如何实现的

1. 数据库表分析

需要3个表：商品表item、用户表user、购物车表cart

需要将商品信息item表和用户表绑定，生成购物车信息，同时添加到购物车信息表中

购物车表：（需要向后端传递这些字段信息）

2.  前端页面代码

            

                

                    
                    
                    
                    
                    
                    
                    
                    购买数量


                    直接购买

                

                
                加入购物车

            

1.为按钮添加点击事件，此时需要获取当前页面item的相关信息，以及所购买的数量，同时调用ajax将信息传递到后端 ，前后端的信息都是以json格式

 

3. 后端接收到数据并进行相应的处理

CartMapper.java

    // 添加商品到购物车
    int addCart(Cart cart);

CartMapper.xml

    
        INSERT INTO cart (USER_ID,ITEM_ID,BUY_COUNT,ITEM_SALE_PRICE,ITEM_NAME)
        VALUES(#{userId},#{itemId},#{buyCount},#{itemSalePrice},#{itemName})
    

CartService.java

    // 添加商品到购物车
    ResultDTO addCart(Cart cart);   // 这边以ResultDTO作为返回的类型

CartServiceImpl.java

     public ResultDTO addCart(Cart cart) {
            ResultDTO addCartResult = new ResultDTO<>();
            int result = cartMapper.addCart(cart);
            
            if (result > 0){
                addCartResult.setMsg("addSuccess");
                addCartResult.setCode(2000);
                // 如果该业务逻辑需要传递数据，可以再处理
            } else {
                addCartResult.setMsg("fail");
                addCartResult.setCode(5000);
            }

        return addCartResult;
    }

CastController.java

    @PostMapping("/addCart")
    @ResponseBody
    ResultDTO addCart(@RequestBody Cart cart) throws Exception{
        return cartService.addCart(cart);
    }

 

 前端再根据返回值提示相应的信息

 

 通过以上的操作已经可以实现向购物车中添加商品的操作了，但是又一个瑕疵的地方：

        比如用上述的方法，如果某一个人再同一家商店购买的商品，购买了两次，购物车中将会出现两条信息。这是不太好的。其实我们可以看看taobao就明白了

 

4. 完善 

解决上述出现的问题

1. 当点击加入购物车按钮后，前台会将userId和itemId等一系列信息传到后台，后台接收到信息后，可以根据 userId和itemId 进行查询 ，通过查询的结果来判断，如果存在则更新，不存在则新增

（1）所以我们需要补两个方法：

CartMapper.java

    // 更新购物车信息
    int updateCart(Cart cart);

    // 根据购物车中用户编号和商品编号查询购物记录是否存在
    Cart selectCartByUserIdAndItemId(Cart cart);

 

CartMapper.xml

    
        UPDATE cart SET BUY_COUNT=#{buyCount} WHERE CART_ID=#{cartId}
    

    
        SELECT CART_ID,USER_ID,ITEM_ID,ITEM_NAME,ITEM_SALE_PRICE,BUY_COUNT FROM cart
        WHERE USER_ID=#{userId} AND ITEM_ID=#{itemId}
    

CartService.java

    // 更新购物车信息
    boolean updateCart(Cart cart);

    // 根据购物车中用户编号和商品编号查询购物记录是否存在,
    // 存在则更新操作； 不存在则添加操作
    Cart selectCartByUserIdAndItemId(Cart cart);

 

 CartServiceImpl.java

    @Override
    public boolean updateCart(Cart cart) {
        Cart oldCart = selectCartByUserIdAndItemId(cart); // 将原有的购物车信息查询到
        System.out.println("oldCart:" + oldCart);
        int newBuyCount = cart.getBuyCount() + oldCart.getBuyCount(); // 将原纪录的数量加上新的购物数量
        cart.setBuyCount(newBuyCount); // 重新构造购买数量
        cart.setCartId(oldCart.getCartId()); // 将查询到的购物车的记录编号放入
        int updateResult = cartMapper.updateCart(cart);
        if (updateResult > 0) {
            return true;
        } else {
            return false;
        }
    }

    @Override
    public Cart selectCartByUserIdAndItemId(Cart cart) {
        return cartMapper.selectCartByUserIdAndItemId(cart);
    }

 

 

修改addCart()方法

    @Override
    public ResultDTO addCart(Cart cart) {
        ResultDTO addCartResult = new ResultDTO<>();
        Cart oldCartRecord = selectCartByUserIdAndItemId(cart); // 查询该购物记录是否存在
        // 如果同一个用户购买商品同一家的同一类商品，则更新操作
        if (oldCartRecord == null){
            System.out.println("购物车无该商品");
            int result = cartMapper.addCart(cart);
            if (result > 0){
                addCartResult.setMsg("addSuccess");
                addCartResult.setCode(2000);
                // 如果该业务逻辑需要传递数据，可以再处理
            } else {
                addCartResult.setMsg("fail");
                addCartResult.setCode(5000);
            }
        } else {
            boolean updateResult = updateCart(cart);
            if (updateResult) {
                addCartResult.setMsg("updateSuccess");
            } else {
                addCartResult.setMsg("updateFail");
            }
        }

        return addCartResult;
    }

 

前端再进行相应处理