瑞吉外卖 —— 8、菜品展示、购物车、下单

目录

1、用户地址簿 

1.1、分析

1.1.1、需求分析

1.1.2、数据模型

1.1.3、导入代码

2、菜品展示

2.1、分析

2.1.1、需求分析 

2.1.2、交互过程

2.2、代码

2.2.1、代码修改 

2.2.2、获取套餐信息

3、购物车

3.1、分析

3.1.1、需求分析

3.1.2、数据模型

3.1.3、交互过程

3.2、代码

3.2.1、向购物车添加菜品或套餐

3.2.2、获取购物车信息

3.2.3、清空购物车

3.2.4、减少购物车菜品或套餐

4、用户下单

4.1、分析

4.1.1、需求分析

4.1.2、数据模型

4.1.3、交互过程

4.1.4、准备工作

4.2、代码

4.2.1、支付

---

1、用户地址簿 

1.1、分析

1.1.1、需求分析

1.1.2、数据模型

用户的地址信息会存储在 address_book 表，即地址簿表中。具体表结构如下:

1.1.3、导入代码

2、菜品展示

2.1、分析

2.1.1、需求分析 

2.1.2、交互过程

2.2、代码

2.2.1、代码修改 

前端在初始化时发送上面的两次请求后，需要都成功才会渲染数据

1.  
   initData(){
2.  
   // 两次请求都成功蔡渲染页面
3.  
   Promise.all([categoryListApi(),cartListApi({})]).then(res=>{
4.  
   //获取分类数据
5.  
   if(res[0].code === 1){
6.  
   this.categoryList = res[0].data
7.  
   if(Array.isArray(res[0].data) && res[0].data.length > 0){
8.  
   this.categoryId = res[0].data[0].id
9.  
   if(res[0].data[0].type === 1){
10.  
    this.getDishList()
11.  
    }else{
12.  
    this.getSetmealData()
13.  
    }
14.  
    }
15.  
    }else{
16.  
    this.$notify({ type:'warning', message:res[0].msg});
17.  
    }
18.  
    //获取菜品数据
19.  
    if(res[1].code === 1){
20.  
    this.cartData = res[1].data
21.  
    }else{
22.  
    this.$notify({ type:'warning', message:res[1].msg});
23.  
    }
24.  
    })
25.  
    },

所以将获取购物车的请求修改为获取假数据

1.  
   //获取购物车内商品的集合
2.  
   function cartListApi(data) {
3.  
   return $axios({
4.  
   // 'url': '/shoppingCart/list',
5.  
   'url': '/front/cartData.json',
6.  
   'method': 'get',
7.  
   params:{...data}
8.  
   })
9.  
   }

假数据内容

{"code":1,"msg":null,"data":[],"map":{}}

修改完后便可以看到展示的菜品及图品，但没有其口味信息，因为 DishController 中的 list 方法返回的是 Dish 实体类，而 Dish 中没有口味属性，需要添加口味属性，要返回 DishDto

1.  
   /**
2.  
   * 根据条件查询菜品数据
3.  
   * @param dish
4.  
   * @return
5.  
   */
6.  
   /*@GetMapping("/list")
7.  
   public R<List<Dish>> list(Dish dish){
8.  
   LambdaQueryWrapper<Dish> queryWrapper = new LambdaQueryWrapper<>();
9.  
   queryWrapper.eq(dish.getCategoryId() != null, Dish::getCategoryId, dish.getCategoryId());
10.  
    queryWrapper.eq(Dish::getStatus, 1);
11.  
    queryWrapper.orderByAsc(Dish::getSort).orderByDesc(Dish::getUpdateTime);
12.  
    List<Dish> list = dishSerivce.list(queryWrapper);
13.  
    return R.success(list);
14.  
    }*/
15.  
    @GetMapping("/list")
16.  
    public R<List<DishDto>> list(Dish dish){
17.  
    LambdaQueryWrapper<Dish> queryWrapper = new LambdaQueryWrapper<>();
18.  
    queryWrapper.eq(dish.getCategoryId() != null, Dish::getCategoryId, dish.getCategoryId());
19.  
    queryWrapper.eq(Dish::getStatus, 1);
20.  
    queryWrapper.orderByAsc(Dish::getSort).orderByDesc(Dish::getUpdateTime);
21.  
    List<Dish> list = dishSerivce.list(queryWrapper);
22.  
     
23.  
    List<DishDto> dishDtoList = list.stream().map((item) -> {
24.  
    DishDto dishDto = new DishDto();
25.  
    BeanUtils.copyProperties(item, dishDto);
26.  
     
27.  
    // 获取分类名称
28.  
    Long categoryId = item.getCategoryId();
29.  
    Category category = categoryService.getById(categoryId);
30.  
    if(category != null){
31.  
    String categoryName = category.getName();
32.  
    dishDto.setCategoryName(categoryName);
33.  
    }
34.  
     
35.  
    // 获取口味信息
36.  
    Long dishId = item.getId();
37.  
    LambdaQueryWrapper<DishFlavor> wrapper = new LambdaQueryWrapper<>();
38.  
    wrapper.eq(DishFlavor::getDishId, dishId);
39.  
    List<DishFlavor> dishFlavorList = dishFlavorService.list(wrapper);
40.  
    dishDto.setFlavors(dishFlavorList);
41.  
     
42.  
    return dishDto;
43.  
    }).collect(Collectors.toList());
44.  
     
45.  
    return R.success(dishDtoList);
46.  
    }

2.2.2、获取套餐信息

请求：

在 SetmealController 中添加方法

1.  
   /**
2.  
   * 根据条件获取套餐数据
3.  
   * @param setmeal
4.  
   * @return
5.  
   */
6.  
   @GetMapping("/list")
7.  
   public R<List<Setmeal>> list(Setmeal setmeal){
8.  
   LambdaQueryWrapper<Setmeal> queryWrapper = new LambdaQueryWrapper<>();
9.  
   queryWrapper.eq(setmeal.getCategoryId() != null, Setmeal::getCategoryId, setmeal.getCategoryId());
10.  
    queryWrapper.eq(setmeal.getStatus() != null, Setmeal::getStatus, setmeal.getStatus());
11.  
    queryWrapper.orderByDesc(Setmeal::getUpdateTime);
12.  
    List<Setmeal> list = setmealService.list(queryWrapper);
13.  
    return R.success(list);
14.  
    }

3、购物车

3.1、分析

3.1.1、需求分析

3.1.2、数据模型

购物车对应的数据表为 shopping_cart 表，具体表结构如下：

3.1.3、交互过程

3.1.4、准备工作

 将获取购物车信息的代码改回来

3.2、代码

3.2.1、向购物车添加菜品或套餐

 添加菜品请求：

添加套餐请求：

在 ShoppingCartController 添加方法

1.  
   /**
2.  
   * 向购物车添加菜品或套餐
3.  
   * @param shoppingCart
4.  
   * @return
5.  
   */
6.  
   @PostMapping("/add")
7.  
   public R<ShoppingCart> add(@RequestBody ShoppingCart shoppingCart){
8.  
   // 设置用户id，指定当前是哪个用户的购物车数据
9.  
   Long currentId = BaseContext.getCurrentId();
10.  
    shoppingCart.setUserId(currentId);
11.  
     
12.  
    // 查询当前菜品或套餐是否在购物车中
13.  
    Long dishId = shoppingCart.getDishId();
14.  
    LambdaQueryWrapper<ShoppingCart> queryWrapper = new LambdaQueryWrapper<>();
15.  
    queryWrapper.eq(ShoppingCart::getUserId, currentId);
16.  
    if(dishId != null){
17.  
    // 添加到购物车的是菜品
18.  
    queryWrapper.eq(ShoppingCart::getDishId, dishId);
19.  
    } else {
20.  
    // 添加到购物车的是套餐
21.  
    queryWrapper.eq(ShoppingCart::getSetmealId, shoppingCart.getSetmealId());
22.  
    }
23.  
    ShoppingCart cart = shoppingCartService.getOne(queryWrapper);
24.  
     
25.  
    if(cart != null){
26.  
    // 如果已存在，在原来的数量上加一
27.  
    cart.setNumber(cart.getNumber() 1);
28.  
    shoppingCartService.updateById(cart);
29.  
    } else {
30.  
    // 如果不存在，则添加到购物车，默认数量为1
31.  
    shoppingCart.setNumber(1);
32.  
    shoppingCart.setCreateTime(LocalDateTime.now());
33.  
    shoppingCartService.save(shoppingCart);
34.  
    cart = shoppingCart;
35.  
    }
36.  
     
37.  
    return R.success(cart);
38.  
    }

3.2.2、获取购物车信息

 获取购物车信息的请求：

在 ShoppingCartController 添加方法

1.  
   /**
2.  
   * 查看购物车
3.  
   * @return
4.  
   */
5.  
   @GetMapping("/list")
6.  
   public R<List<ShoppingCart>> list(){
7.  
   LambdaQueryWrapper<ShoppingCart> queryWrapper = new LambdaQueryWrapper<>();
8.  
   queryWrapper.eq(ShoppingCart::getUserId, BaseContext.getCurrentId());
9.  
   queryWrapper.orderByAsc(ShoppingCart::getCreateTime);
10.  
    List<ShoppingCart> list = shoppingCartService.list(queryWrapper);
11.  
    return R.success(list);
12.  
    }

3.2.3、清空购物车

清空购物车请求：

在 ShoppingCartController 添加方法 

1.  
   /**
2.  
   * 清空购物车
3.  
   * @return
4.  
   */
5.  
   @DeleteMapping("/clean")
6.  
   public R<String> clean(){
7.  
   LambdaQueryWrapper<ShoppingCart> queryWrapper = new LambdaQueryWrapper<>();
8.  
   queryWrapper.eq(ShoppingCart::getUserId, BaseContext.getCurrentId());
9.  
   shoppingCartService.remove(queryWrapper);
10.  
    return R.success("清空购物车成功");
11.  
    }

3.2.4、减少购物车菜品或套餐

请求：

1.  
   /**
2.  
   * 减少购物车菜品或套餐
3.  
   * @return
4.  
   */
5.  
   @PostMapping("/sub")
6.  
   public R<ShoppingCart> sub(@RequestBody ShoppingCart shoppingCart){
7.  
   Long currentId = BaseContext.getCurrentId();
8.  
   LambdaQueryWrapper<ShoppingCart> queryWrapper = new LambdaQueryWrapper<>();
9.  
   queryWrapper.eq(ShoppingCart::getUserId, currentId);
10.  
    ShoppingCart cart = null;
11.  
     
12.  
    // 获取要减少的菜品或套餐信息
13.  
    Long dishId = shoppingCart.getDishId();
14.  
    if(dishId == null){
15.  
    // 减少的是套餐数量
16.  
    Long setmealId = shoppingCart.getSetmealId();
17.  
    queryWrapper.eq(ShoppingCart::getSetmealId, setmealId);
18.  
    cart = shoppingCartService.getOne(queryWrapper);
19.  
    } else {
20.  
    // 减少的是菜品数量
21.  
    queryWrapper.eq(ShoppingCart::getDishId, dishId);
22.  
    cart = shoppingCartService.getOne(queryWrapper);
23.  
    }
24.  
     
25.  
    Integer number = cart.getNumber();
26.  
    if(number > 1){
27.  
    cart.setNumber(number - 1);
28.  
    shoppingCartService.updateById(cart);
29.  
    } else {
30.  
    shoppingCartService.removeById(cart.getId());
31.  
    }
32.  
     
33.  
    return R.success(cart);
34.  
    }

4、用户下单

4.1、分析

4.1.1、需求分析

4.1.2、数据模型

用户下单业务对应的数据表为 orders 表和 order_detail 表:

orders 表：

order_detail 表

4.1.3、交互过程

4.1.4、准备工作

4.2、代码

4.2.1、支付

支付请求：

① 在 OrderServiceImpl 实现方法

1.  
   package com.itheima.reggie.service.impl;
2.  
    
3.  
   import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
4.  
   import com.baomidou.mybatisplus.core.toolkit.IdWorker;
5.  
   import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
6.  
   import com.itheima.reggie.common.BaseContext;
7.  
   import com.itheima.reggie.common.CustomException;
8.  
   import com.itheima.reggie.entity.*;
9.  
   import com.itheima.reggie.mapper.OrderMapper;
10.  
    import com.itheima.reggie.service.*;
11.  
    import lombok.extern.slf4j.Slf4j;
12.  
    import org.springframework.beans.factory.annotation.Autowired;
13.  
    import org.springframework.stereotype.Service;
14.  
    import org.springframework.transaction.annotation.Transactional;
15.  
     
16.  
    import java.math.BigDecimal;
17.  
    import java.time.LocalDateTime;
18.  
    import java.util.List;
19.  
    import java.util.concurrent.atomic.AtomicInteger;
20.  
    import java.util.stream.Collectors;
21.  
     
22.  
    @Service
23.  
    @Slf4j
24.  
    public class OrderServiceImpl extends ServiceImpl<OrderMapper, Orders> implements OrderService {
25.  
     
26.  
    @Autowired
27.  
    private ShoppingCartService shoppingCartService;
28.  
     
29.  
    @Autowired
30.  
    private UserService userService;
31.  
     
32.  
    @Autowired
33.  
    private AddressBookService addressBookService;
34.  
     
35.  
    @Autowired
36.  
    private OrderDetailService orderDetailService;
37.  
     
38.  
    /**
39.  
    * 用户下单
40.  
    * @param orders
41.  
    */
42.  
    @Transactional
43.  
    public void submit(Orders orders) {
44.  
    //获得当前用户id
45.  
    Long userId = BaseContext.getCurrentId();
46.  
     
47.  
    // 查询当前用户的购物车数据
48.  
    LambdaQueryWrapper<ShoppingCart> queryWrapper = new LambdaQueryWrapper<>();
49.  
    queryWrapper.eq(ShoppingCart::getUserId, userId);
50.  
    List<ShoppingCart> shoppingCarts = shoppingCartService.list(queryWrapper);
51.  
     
52.  
    if(shoppingCarts == null || shoppingCarts.size() == 0){
53.  
    throw new CustomException("购物车为空，无法下单");
54.  
    }
55.  
     
56.  
    // 查询用户数据
57.  
    User user = userService.getById(userId);
58.  
     
59.  
    // 查询地址信息
60.  
    AddressBook addressBook = addressBookService.getById(orders.getAddressBookId());
61.  
    if(addressBook == null){
62.  
    throw new CustomException("用户地址信息有误，无法下单");
63.  
    }
64.  
     
65.  
    // 生成订单号
66.  
    long orderId = IdWorker.getId();
67.  
     
68.  
    // 计算订单总金额
69.  
    AtomicInteger amount = new AtomicInteger(0); // 保证线程安全
70.  
    List<OrderDetail> orderDetails = shoppingCarts.stream().map((item) -> {
71.  
    OrderDetail orderDetail = new OrderDetail();
72.  
    orderDetail.setOrderId(orderId);
73.  
    orderDetail.setNumber(item.getNumber());
74.  
    orderDetail.setDishFlavor(item.getDishFlavor());
75.  
    orderDetail.setDishId(item.getDishId());
76.  
    orderDetail.setSetmealId(item.getSetmealId());
77.  
    orderDetail.setName(item.getName());
78.  
    orderDetail.setImage(item.getImage());
79.  
    orderDetail.setAmount(item.getAmount());
80.  
    amount.addAndGet(item.getAmount().multiply(new BigDecimal(item.getNumber())).intValue()); // =
81.  
    return orderDetail;
82.  
    }).collect(Collectors.toList());
83.  
     
84.  
    // 向订单表插入数据
85.  
    orders.setId(orderId);
86.  
    orders.setOrderTime(LocalDateTime.now());
87.  
    orders.setCheckoutTime(LocalDateTime.now());
88.  
    orders.setStatus(2);
89.  
    orders.setAmount(new BigDecimal(amount.get())); //总金额
90.  
    orders.setUserId(userId);
91.  
    orders.setNumber(String.valueOf(orderId));
92.  
    orders.setUserName(user.getName());
93.  
    orders.setConsignee(addressBook.getConsignee());
94.  
    orders.setPhone(addressBook.getPhone());
95.  
    orders.setAddress((addressBook.getProvinceName() == null ? "" : addressBook.getProvinceName())
96.  
    (addressBook.getCityName() == null ? "" : addressBook.getCityName())
97.  
    (addressBook.getDistrictName() == null ? "" : addressBook.getDistrictName())
98.  
    (addressBook.getDetail() == null ? "" : addressBook.getDetail()));
99.  
    this.save(orders);
100.  
      
101.  
     // 向订单明细表插入数据(多条数据)
102.  
     orderDetailService.saveBatch(orderDetails);
103.  
      
104.  
     // 清空购物车数据
105.  
     shoppingCartService.remove(queryWrapper);
106.  
     }
107.  
     }

② 在 OrderController 中使用方法

1.  
   /**
2.  
   * 支付订单
3.  
   * @param orders
4.  
   * @return
5.  
   */
6.  
   @PostMapping("/submit")
7.  
   public R<String> submit(@RequestBody Orders orders){
8.  
   orderService.submit(orders);
9.  
   return null;
10.  
    }

这篇好文章是转载于：学新通技术网