新增菜品以及分页请求(瑞吉外卖)

新增菜品以及分页请求(瑞吉外卖)

图片的上传和下载就不说了

1.新增

在进入前端页面的时候发送过一次请求

在这里插入图片描述

就是这个请求,通过浏览器可以具体

在这里插入图片描述

先完成这个

1.1下拉框

​ 思路:就是调用service层里面的list的那个方法,然后写一些排序的条件

代码

/**
 * 根据条件查询分类数据
 * @param category
 * @return
 */
@GetMapping("/list")
public R<List<Category>> list(Category category){
    //条件构造器
    LambdaQueryWrapper<Category> queryWrapper = new LambdaQueryWrapper<>();
    //添加条件
    queryWrapper.eq(category.getType() != null,Category::getType,category.getType());
    //添加排序条件
    queryWrapper.orderByAsc(Category::getSort).orderByDesc(Category::getUpdateTime);
    
    List<Category> list = categoryService.list(queryWrapper);
    return R.success(list);
}

1.2新增页面

在开发代码之前,需要梳理一下新增菜品时前端页面和服务端的交互过程:

1、页面(backend/page/food/add.html)发送ajax请求,请求服务端获取菜品分类数据并展示到下拉框中2、页面发送请求进行图片上传,请求服务端将图片保存到服务器

3、页面发送请求进行图片下载,将上传的图片进行回显

4、点击保存按钮,发送ajax请求,将菜品相关数据以json形式提交到服务端

开发新增菜品功能,其实就是在服务端编写代码去处理前端页面发送的这4次请求即可。

1.21先看发送的ajax请求

很明确的可以看出来是一个post的请求,然后重点看数据,会发现其实这个是对两个表进行修改的
在这里插入图片描述

其次就是关于flavors这个数据,从前端页面来看是封装成了一个list的集合

浏览页面代码

如果是dish可以吗很明显是不对的,因为dish的属性里面根本没有flavors这个属性

所以导入一个dto的类

DTO,全称为Data Transfer Object,即数据传输对象,一般用于展示层与服务层之间的数据传输。

//这个类就将flavors做成了一个集合,并且继承了dish,将两个类整合成一个类了

@Data
public class DishDto extends Dish {

    private List<DishFlavor> flavors = new ArrayList<>();

    private String categoryName;

    private Integer copies;
}

所以我们需要对service层中的save方法进行重写

1.2.2如何重写这个service

​ 明确需求,这个service的对象是dto,dto里面封装了一个list集合,所以基本信息和这个list集合其实是分开的是两部分

​ 那就先保存基本信息,然后在调用service的saveBatch全部保存下来

​ 既然是两部分就需要开启一个事务啦

@Transactional
public void saveWithFlavor(DishDto dishDto) {
    //保存菜品的基本信息到菜品表dish
    this.save(dishDto);

    Long dishId = dishDto.getId();//菜品id

    //菜品口味
    List<DishFlavor> flavors = dishDto.getFlavors();
    flavors = flavors.stream().map((item) -> {
        item.setDishId(dishId);
        return item;
    }).collect(Collectors.toList());

    //保存菜品口味数据到菜品口味表dish_flavor
    dishFlavorService.saveBatch(flavors);

}

当然这里你也可以用for循环的方式来遍历

// 获取菜品口味列表
List<DishFlavor> flavors = dishDto.getFlavors();

// 使用循环遍历每个口味对象
for (int i = 0; i < flavors.size(); i++) {
    DishFlavor flavor = flavors.get(i);
    flavor.setDishId(dishId); // 将菜品ID设置到每个口味对象中
    flavors.set(i, flavor); // 更新列表中的口味对象
}

// 保存菜品口味数据到菜品口味表dish_flavor
dishFlavorService.saveBatch(flavors);

然后在service层里面调用就可以了

可能会有些疑惑对这个代码

//菜品口味

    List<DishFlavor> flavors = dishDto.getFlavors();
    flavors = flavors.stream().map((item) -> {
        item.setDishId(dishId);
        return item;
    }).collect(Collectors.toList());
//使用collect方法将流中的元素收集到一个新的列表中。Collectors.toList()是一个收集器,指定了收集的结果应该是一个列表

想如何将这两个表关联起来?

  • map操作的lambda表达式中,对每个DishFlavor对象调用setDishId方法,将dishId(菜品的ID)设置到该对象中。这样,每个口味对象就与特定的菜品关联起来。

1.2.3调用

@PostMapping
public R<String> save(@RequestBody DishDto dishDto){
    log.info(dishDto.toString());

    dishService.savithFlavor(dishDto);

    return R.success("新增菜品成功");
}

记得页面返回的是一个json数据

2.分页

分页的时候会有一个问题

@GetMapping("/page")
public R<Page> page(int page,int pageSize,String name){

    //构造分页构造器对象
    Page<Dish> pageInfo = new Page<>(page,pageSize);
   

    //条件构造器
    LambdaQueryWrapper<Dish> queryWrapper = new LambdaQueryWrapper<>();
    //添加过滤条件
    queryWrapper.like(name != null,Dish::getName,name);
    //添加排序条件
    queryWrapper.orderByDesc(Dish::getUpdateTime);

    //执行分页查询
    dishService.page(pageInfo,queryWrapper);

    return R.success(pageInfo);
}

如果是这样的话页面不会显示菜品分类,为什么了

很简单,在dish里面并没有我们需要的这个Category,只有关于他的id

所以我们这里的类又需要dto

2.1思路

​ 依旧写一个分页构造器,里面的泛型写dto,并且将前面的赋值给这个新的

Page<DishDto> dishDtoPage = new Page<>();
BeanUtils.copyProperties(pageInfo,dishDtoPage,"records");

这里为什么需要records

public class Page<T> implements IPage<T> {
    private static final long serialVersionUID = 8545996863226528798L;
    protected List<T> records;
    protected long total;
    protected long size;
    protected long current;
    protected List<OrderItem> orders;
    protected boolean optimizeCountSql;
    protected boolean isSearchCount;
    protected boolean hitCount;
    protected String countId;
    protected Long maxLimit;

这里的list其实就是我们页面的所有元素

所以相当于我们要往这个里面设置一些东西

所以先获得这个list

List<Dish> records = pageInfo.getRecords();

遍历这个然后通过id来找名

List<DishDto> list = records.stream().map((item) -> {
    DishDto dishDto = new DishDto();

    BeanUtils.copyProperties(item,dishDto);
    //值得注意

    Long categoryId = item.getCategoryId();//分类id
    //根据id查询分类对象
    Category category = categoryService.getById(categoryId);

    if(category != null){
        String categoryName = category.getName();
        dishDto.setCategoryName(categoryName);
    }
    return dishDto;
}).collect(Collectors.toList());

最后才将这个list重新设置

dishDtoPage.setRecords(list);

2.2完整的代码

@GetMapping("/page")
public R<Page> page(int page,int pageSize,String name){

    //构造分页构造器对象
    Page<Dish> pageInfo = new Page<>(page,pageSize);
    Page<DishDto> dishDtoPage = new Page<>();

    //条件构造器
    LambdaQueryWrapper<Dish> queryWrapper = new LambdaQueryWrapper<>();
    //添加过滤条件
    queryWrapper.like(name != null,Dish::getName,name);
    //添加排序条件
    queryWrapper.orderByDesc(Dish::getUpdateTime);

    //执行分页查询
    dishService.page(pageInfo,queryWrapper);

    //对象拷贝
    BeanUtils.copyProperties(pageInfo,dishDtoPage,"records");

    List<Dish> records = pageInfo.getRecords();

    List<DishDto> list = records.stream().map((item) -> {
        DishDto dishDto = new DishDto();

        BeanUtils.copyProperties(item,dishDto);

        Long categoryId = item.getCategoryId();//分类id
        //根据id查询分类对象
        Category category = categoryService.getById(categoryId);

        if(category != null){
            String categoryName = category.getName();
            dishDto.setCategoryName(categoryName);
        }
        return dishDto;
    }).collect(Collectors.toList());

    dishDtoPage.setRecords(list);

    return R.success(dishDtoPage);
}
 Category category = categoryService.getById(categoryId);

        if(category != null){
            String categoryName = category.getName();
            dishDto.setCategoryName(categoryName);
        }
        return dishDto;
    }).collect(Collectors.toList());

    dishDtoPage.setRecords(list);

    return R.success(dishDtoPage);
}
  • 6
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值