瑞吉外卖 - 菜品信息分页查询功能(17)

某马瑞吉外卖单体架构项目完整开发文档,基于 Spring Boot 2.7.11 + JDK 11。预计 5 月 20 日前更新完成,有需要的胖友记得一键三连,关注主页 “瑞吉外卖” 专栏获取最新文章。
相关资料:https://pan.baidu.com/s/1rO1Vytcp67mcw-PDe_7uIg?pwd=x548
提取码:x548

1.需求分析

系统中的菜品数据很多的时候,如果在一个页面中全部展示出来会显得比较乱,不便于查看,所以一般的系统中都会以分页的方式来展示列表数据。并且在菜品页面中我们还应该一同展示菜品图片和菜品所属分类信息。

2.代码开发

2.1 梳理交互过程

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

  1. 页面(backend/page/food/list.html)发送 ajax 请求,将分页查询参数(page、pageSize、name)提交到服务端,获取分页数据;
  2. 页面发送请求,请求服务端进行图片下载,用于页面图片展示。

开发菜品信息分页查询功能,其实就是在服务端编写代码去处理前端页面发送的这 2 次请求即可。我们先来看看分页查询的相关请求信息:

同时菜品管理页面还支持基于菜品名称的模糊查询,对应的请求信息如下:

2.2 代码实现

DishController 中处理分页查询的相关代码如下:

@RestController
@RequestMapping("/dish")
public class DishController {
    
    
    @Resource
    private DishService dishService;
    
    @Resource
    private CategoryService categoryService;
    
    /**
     * 分页查询
     * @param page 当前页
     * @param pageSize 每页显示条数
     * @param name 菜品名称
     * @return R
     */
    @GetMapping("/page")
    public R<Page<DishDto>> page(int page,int pageSize,String name){
    
    
        // 1.创建分页构造器
        Page<Dish> pageInfo = new Page<>(page, pageSize);
        Page<DishDto> dishDtoPage = new Page<>();

        // 2.构造查询条件
        QueryWrapper<Dish> queryWrapper = new QueryWrapper<>();
        // 如果菜品名称不为空,则根据菜品名称进行模糊查询
        if(name != null && !"".equals(name)){
    
    
            queryWrapper.like("name",name);
        }
        // 根据跟新时间进行排序(Asc 升序、Desc 降序)
        queryWrapper.orderByDesc("update_time");

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

        // 4.将 pageInfo 中的数据复制到 dishDtoPage 中
        // 4.1 使用 BeanUtils 工具类进行属性拷贝(忽略 records 属性,因为 records 属性是 List<Dish> 类型)
        BeanUtils.copyProperties(pageInfo,dishDtoPage,"records");
        // 4.2 获取 pageInfo 中的 records 属性(List<Dish>),并将其转换为 List<DishDto>
        List<Dish> records = pageInfo.getRecords();
        List<DishDto> list = records.stream().map((item) -> {
    
    
            // 4.2.1 创建 DishDto 对象
            DishDto dishDto = new DishDto();
            // 4.2.2 将 item 中的属性拷贝到 dishDto 中
            BeanUtils.copyProperties(item,dishDto);
            // 4.2.3 获取分类id
            Long categoryId = item.getCategoryId();
            // 4.2.4 根据分类id查询分类对象
            Category category = categoryService.getById(categoryId);
            // 4.2.5 如果分类对象不为空,则将分类名称设置到 dishDto 中
            if(category != null){
    
    
                dishDto.setCategoryName(category.getName());
            }
            // 4.2.6 返回 dishDto
            return dishDto;
        }).collect(Collectors.toList());

        // 4.3 将 list 设置到 dishDtoPage 中
        dishDtoPage.setRecords(list);
        // 5.返回 R
        return R.success(dishDtoPage);
    }
    
    // 省略其他代码
}

上面为了能够正常显示分类名称,我们需要使用到前面的 DishDto,通过将 pageInfo 分页对象中的信息拷贝到 dishDtoPage 中去设置 categoryName 属性,最终返回 DishDto 类型的分页对象。

下面简单介绍一下上面拷贝用到的 BeanUtils 工具类。org.springframework.beans.BeanUtils 是 Spring 框架中的一个工具类,提供了一系列静态方法,用于实现 JavaBean 之间的属性拷贝、类型转换等操作。其中,该类的 copyProperties 方法是一个非常常用的方法,用于将源对象的属性值复制到目标对象中。

该方法的定义如下:

public static void copyProperties(Object source, Object target, String... ignoreProperties)

该方法接受两个参数(后面的 ignoreProperties 参数是可选的),分别为源对象和目标对象(还有忽略的属性)。该方法会将源对象中的属性值复制到目标对象中,如果属性名相同且类型相同,则直接复制;如果属性名相同但类型不同,则尝试进行类型转换;如果源对象中存在目标对象中不存在的属性,则忽略该属性。

3.功能测试

重启应用,点击菜品管理页面,分页查询成功:

可以看到分类信息和菜品图片也一同显示了,达到我们的需要。你可能要问了,图片不是都没有吗?这是应为当时导入数据库的 SQL 文件时的图片数据在本地都是没有的,自然无法下载。

你可以试着新增一个测试菜品上传图片呢,就能看到图片正常显示了:

猜你喜欢

转载自blog.csdn.net/ly1347889755/article/details/130755530