瑞吉外卖项目（五） 菜品管理业务开发

第七章 菜品管理业务开发

文件上传下载

文件上传介绍

文件上传，upload，是指将本地图片、视频、音频等文件上传到服务器上，可以供其他用户浏览或下载的过程

文件上传时，对页面的form表单有如下要求：

• method=“post” 采用post方式提交
• enctype=“multipart/from-data” 采用multipart格式上传
• type=“file” 使用input的file控件上传

服务端要接受客户端页面上传的文件，通常会使用Apache的两个组件：

• Commons-fileupload
• commons-io

Spring框架在Spring-Web包中对于文件上传进行了封装，只需要在Controller方法中，声明一个MulipartFile类型的参数即可

文件下载介绍

文件下载，download，将文件从服务器传输到本地计算机的过程

通过浏览器进行文件下载，通常由两种表现形式：

• 以附件形式下载，弹出保存对话框，将文件保存到指定磁盘目录
• 直接在浏览器打开

通过浏览器进行文件下载，本质上就是服务端将文件以流的形式写回浏览器的过程

文件上传代码介绍

由于下载下来的文件是临时文件，需要在配置中，添加一个自定义路径去保存图片

配置好后，在Controller中获得该参数

@Value("${reggie.path}")
private String basePath;

/**
 * 文件上传
 * @param file
 * @return
 */
@PostMapping("/upload")
public R<String> upload(MultipartFile file) {
    //file是临时文件,需要转存到指定位置MultipartFile file的名字必须和前端保持一致，ca
    log.info(file.toString());

    //原始文件名
    String originalFilename = file.getOriginalFilename();
    String suffix = null;
    if (originalFilename != null) {
        suffix = originalFilename.substring(originalFilename.lastIndexOf("."));
    }

    //使用uuid重新生成文件名，防止出现覆盖
    String fileName = UUID.randomUUID().toString() + suffix;

    //创建一个目录对象
    File dir = new File(basePath);
    //判断当前目录是否存在
    if (!dir.exists()){
        //目录不存在，创建新目录
        boolean mkdirs = dir.mkdirs();
    }

    try {
        file.transferTo(new File(basePath + fileName));
    } catch (IOException e) {
        e.printStackTrace();
    }
    return R.success(fileName);
}

注意：public R upload(MultipartFile file)必须要和前端参数名字保持一致，否则会出现报错

文件下载代码实现

/**
 * 文件下载
 * @param name
 * @param response
 */
@GetMapping("/download")
public void download(String name, HttpServletResponse response){
    //输入流，通过输入流读取文件内容
    try {
        FileInputStream fileInputStream = new FileInputStream(new File(basePath+name));

        //输出流，通过输出流将文件写回浏览器
        ServletOutputStream outputStream = response.getOutputStream();

        response.setContentType("image/jpeg");

        int len=0;
        byte[] bytes = new byte[1024];

        while ((len=fileInputStream.read(bytes))!=-1){
            outputStream.write(bytes,0,len);
            outputStream.flush();
        }
        //关闭资源
        outputStream.close();
        fileInputStream.close();

    } catch (Exception e) {
        e.printStackTrace();
    }
}

新增菜品

需求分析

后台系统中，可以管理菜品信息，通过新增功能添加一个新的菜品，在添加菜品时需要选择当前菜品所属的菜品分类，并且上传菜品图片，在移动端会按照菜品分类来展示对于的菜品信息

数据模型

新增菜品，其实就是新增页面录入菜品的信息插入到dish表中，如果添加了口味做法，还需要向dish_flavor表插入数据

代码开发

基本结构：

• 实体类DishFlavor
• Mapper接口DishFlavorMapper
• 业务接口DishFlavorService
• 业务层实现类DishFlavorServiceImpl
• 控制层 DishController

交互流程：

1. 页面（backend/page/food/add.html）发送Ajax请求，请求服务端获取菜品分类数据并展示到下拉框中

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

2. 页面发送请求进行图片上传，请求服务端将图片保存到服务器

3. 页面发送请求进行图片下载，请求服务器将图片下载到服务端

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

   ps：这里涉及到两个表的操作，由于前端传输的口味是数组，我们的实体类Dish里面没有这个数组去接收对应的Json数组，因此需要新建一个dto类，去接收前端对应的Json数据

   Disdto.java

   @EqualsAndHashCode(callSuper = true)
   @Data
   public class DishDto extends Dish {
   
       private List<DishFlavor> flavors = new ArrayList<>();
   
       private String categoryName;
   
       private Integer copies;
   }
   

   然后对于接收到的信息在Controller层进行处理，涉及两个表的操作，联表查询，简单的sql无法实现，需要手动在DishService添加Service方法savaWithFlavor

   public class DishServiceImpl extends ServiceImpl<DishMapper, Dish> implements DishService {
   
       @Autowired
       private DishFlavorService dishFlavorService;
   
       /**
        * 新增菜品同时保存口味
        * @param dishDto
        */
       @Override
       @Transactional
       public void savaWithFlavor(DishDto dishDto) {
           //保存菜品基本信息dish
           this.save(dishDto);
           Long dishId = dishDto.getId();//菜品id
           //菜品口味
           List<DishFlavor> flavors = dishDto.getFlavors();
           flavors=flavors.stream().peek((item)-> item.setDishId(dishId)).collect(Collectors.toList());
           //保存菜品口味表
           dishFlavorService.saveBatch(flavors);
       }
   }
   

   用了Stream流对接收到的数据进行一个处理，将前端传进来的Json数组进行一个一一对应，分别调用两个update方法，一个对于dishDto表的更新，一个对于flavors表的更新

功能测试

页面下拉框显示成功

添加菜品成功

联表查询成功

菜品信息分页查询

需求分析

将菜品信息分页展示出来

代码开发

这里有点绕，

首先，按照正常的分页查询查询Dish的话菜品管理页面是查询不到菜品分类的，菜品分类在category表中，因此我们的思路要转向联表查询。

• 查询Dish整张表得到对应的category_id，根据category_id去查询category表对应的菜品分类
• 由于前端传过来的有一个list数组，因此我们不能直接返回Dish查询的数据，因此要new一个dishDtoPage，并且将从dishPage查询出来的数据复制给dishDtoPage，由于list数据是空的
• 因此需要对前端请求来的数据records进行stream流的处理，将records里面的数据逐一给dishDtoPage空的list中
• 最后将dishDtoPage处理好的所有数据返回给前端

/**
 * 菜品信息分页查询
 * @param page
 * @param pageSize
 * @param name
 * @return
 */
@GetMapping("/page")
public R<Page> page(int page, int pageSize,String name){
    log.info("page={},pageSize={}",page,pageSize);
    //创建分页构造器
    Page<Dish> dishPage = 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(dishPage,queryWrapper);

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

    List<Dish> records = dishPage.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);
}

功能测试

records数组信息响应正常，页面成功显示菜品分类信息

修改菜品

需求分析

需要修改菜品的信息

代码开发

由于是修改菜品信息，因此在list.html页需要将所要修改的对象进行信息回显

因此我们需要根据菜品id查询对应的菜品信息和口味信息

/**
 * 根据id查询菜品信息和口味信息
 * @param id
 * @return
 */
@GetMapping("/{id}")
public R<DishDto>get(@PathVariable Long id){

    DishDto dishDto = dishService.getByIdWithFlavor(id);

    return R.success(dishDto);
}

完成信息回显功能后，需要进行修改菜品的操作，前端返回来的数据是Json数据因此需要在参数添加上@RequestBody注解

/**
 * 修改菜品
 * @param dishDto
 * @return
 */
@PutMapping
public R<String> update(@RequestBody DishDto dishDto){
    log.info(dishDto.toString());

    dishService.updateWithFlavor(dishDto);

    return R.success("修改菜品成功");
}

这里的更新操作，不仅仅要更新菜品信息，还要更新菜品分类，菜品口味涉及三张表的查询，因此要编写updateWithFlavor方法

@Override
@Transactional
public void updateWithFlavor(DishDto dishDto) {
    //更新dish表基本信息
    this.updateById(dishDto);

    //清理当前菜品对应口味数据dish_flavor
    LambdaQueryWrapper<DishFlavor> queryWrapper = new LambdaQueryWrapper<>();
    queryWrapper.eq(DishFlavor::getDishId,dishDto.getId());
    dishFlavorService.remove(queryWrapper);

    //添加当前提交过来的口味数据
    List<DishFlavor> flavors = dishDto.getFlavors();
    flavors=flavors.stream().peek((item)-> item.setDishId(dishDto.getId())).collect(Collectors.toList());

    dishFlavorService.saveBatch(flavors);

}

这里不仅仅更新了Dish表的信息，由于口味的信息是一条一条存进数据库的，要再做一次匹配会有点麻烦，因此直接选择删除对应的口味信息，重新在插入页面提交的新的口味信息即可

功能测试

在Controller调用updateWithFlavor，返回数据，成功

更改菜品销售状态

需求分析

需要更改菜品状态

代码开发

我们看到前端给到后端的请求为Post方法的/status/1?ids

因此编写对应的方法，为了拿到URI的变量，注意使用@PathVariable与@RequestParam变量

/**
 * 修改菜品当前销售状态
 * @param
 * @return
 */
@PostMapping("/status/{status}")
public R<String> updateStatus( @PathVariable Integer status,@RequestParam List<Long> ids){
    log.info("所需要更新id有:{}",ids);
    UpdateWrapper<Dish> updateWrapper = new UpdateWrapper<>();
    updateWrapper.set("status",status).in("id",ids);

    //判断更新状态
    if(!dishService.update(updateWrapper)){
        return R.error("修改菜品状态失败");
    }
    return R.success("修改状态成功");
}

修改，批量修改功能成功

删除菜品

需求分析

需要删除菜品

代码开发

由于存在批量删除，因此传进来的参数用List接收

/**
 * 删除方法
 * @param ids
 * @return
 */
@DeleteMapping
public R<String> delete(@RequestParam List<Long> ids){
    log.info("删除菜品id有:{}",ids);

    dishService.removeBatchByIds(ids);
    return R.success("删除菜品成功");
}

功能测试

删除，批量删除功能成功