海上捞火锅

海上捞火锅


修改购物车中菜品数量

[TOC]

简要描述
  • 购物车中修改菜品数量
触发事件
<img src="./images/subtract.png" @click="cartNumberSubtract(item)" />
接口调用
async cartNumberSubtract(item){
    let params = {
        dishId:item.dishId,
        setmealId:item.setmealId,
    }
    const res = await updateCartApi(params)
    if(res.code === 1){
        this.dishList.forEach(dish=>{
            if(dish.id === (item.dishId || item.setmealId)){
                dish.number = (res.data.number === 0 ? undefined : res.data.number)
            }
        })
        this.getCartData()
    }else{
        this.$notify({ type:'warning', message:res.msg});
    }
},
请求URL
  • [context-path]/shoppingCart/sub
请求方式
  • POST
请求参数
  • 携带参数可能是dish_id 也可能是 setmealId,所以我们需要实体类shoppingCart来接收;
参数名 类型 说明
dishid bigint 菜品编号
setmealid bigint 套餐编号
接口API
function  updateCartApi(data){
    return $axios({
        'url': '/shoppingCart/sub',
        'method': 'post',
        data
      })
}
返回示例
code: 1
data: {id: "1609088693839339522", name: "猪脑", userId: "1605795539925098497", dishId: "1605796042641793026",…}
map: {}
msg: null
返回参数说明
参数名 类型 说明
code int 返回码,1:成功;0或其他:失败
data object 返回数据
map map 动态数据
msg string 错误信息
备注

data有两种返回值

public static <T> R<T> success(T object) {
    R<T> r = new R<T>();
    r.data = object;
    r.code = 1;
    return r;
}

public static <T> R<T> error(String msg) {
    R r = new R();
    r.msg = msg;
    r.code = 0;
    return r;
}
后端接口请求参数
  • @RequestBody 接收前端传递给后端的json字符串中的数据(请求体ShoppingCart中的数据)
后端代码
@PostMapping("/sub")
@Transactional
public R<ShoppingCart> sub(@RequestBody ShoppingCart shoppingCart){

    Long dishId = shoppingCart.getDishId();
    LambdaQueryWrapper<ShoppingCart> queryWrapper = new LambdaQueryWrapper<>();

    //代表数量减少的是菜品数量
    if (dishId != null){
        //通过dishId查出购物车对象
        queryWrapper.eq(ShoppingCart::getDishId,dishId);
        //这里必须要加两个条件,否则会出现用户互相修改对方与自己购物车中相同套餐或者是菜品的数量
        queryWrapper.eq(ShoppingCart::getUserId,BaseContext.getCurrentId());
        ShoppingCart cart1 = shoppingCartService.getOne(queryWrapper);
        cart1.setNumber(cart1.getNumber()-1);
        Integer LatestNumber = cart1.getNumber();
        if (LatestNumber > 0){
            //对数据进行更新操作
            shoppingCartService.updateById(cart1);
        }else if(LatestNumber == 0){
            //如果购物车的菜品数量减为0,那么就把菜品从购物车删除
            shoppingCartService.removeById(cart1.getId());
        }else if (LatestNumber < 0){
            return R.error("操作异常");
        }

        return R.success(cart1);
    }

    Long setmealId = shoppingCart.getSetmealId();
    if (setmealId != null){
        //代表是套餐数量减少
        queryWrapper.eq(ShoppingCart::getSetmealId,setmealId).eq(ShoppingCart::getUserId,BaseContext.getCurrentId());
        ShoppingCart cart2 = shoppingCartService.getOne(queryWrapper);
        cart2.setNumber(cart2.getNumber()-1);
        Integer LatestNumber = cart2.getNumber();
        if (LatestNumber > 0){
            //对数据进行更新操作
            shoppingCartService.updateById(cart2);
        }else if(LatestNumber == 0){
            //如果购物车的套餐数量减为0,那么就把套餐从购物车删除
            shoppingCartService.removeById(cart2.getId());
        }else if (LatestNumber < 0){
            return R.error("操作异常");
        }
        return R.success(cart2);
    }
    //如果两个大if判断都进不去
    return R.error("操作异常");
}

页面列表

ITEM_HTML