基于 Spring Boot 瑞吉外卖体系开辟（六）

基于 Spring Boot 瑞吉外卖体系开辟（六）

菜品列表

在体系管理端首页，单击左侧菜单栏中的“菜品管理”，会在右侧打开菜品管理页面。

哀求URL/dish/page，哀求方法GET,哀求参数page，pageSize。

   该菜品列表展示字段涉及菜品和分类名称数据，菜品（dish表）、分类（category表）来自不同表，所以这里打算使用自定义SQL两表联查。
  创建DishDto

由于Dish字段不敷用，重新写一个数据传输对象（Dto）(Data Transfer Object)。
创建dto包，在com.itheima.reggie.dto创建DishDto类，类继承Dish字段，并且添加CategoryName属性。

1. @Data
2. public class DishDto extends Dish {
3.     private String categoryName;
4. }

复制代码

编写SQL

实现dish和category两表联查，这里接纳左毗连查询方式。可以先在navicat实验一下SQL是否精确。

1. select d.*,c.name as category_name from dish d LEFT JOIN category c ON d.category_id=c.id

复制代码

创建自定义SQL设置文件

在resources目录下创建mapper目录，然后在mapper目录下创建DishMapper.xml文件

1. <?xml version="1.0" encoding="UTF-8"?>
2. <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
3.         "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
4. <mapper namespace="com.itheima.reggie.mapper.DishMapper">
6.     <select id="selectDishDtoPage" resultType="com.itheima.reggie.dto.DishDto">
7.         select d.*,c.name as category_name from dish d
8.             LEFT JOIN category c ON d.category_id=c.id
9.     </select>
11. </mapper>

复制代码

DishMapper添加执行SQL语句的方法

根据上面id属性值添加方法名，selectDishDtoPage方法就会执行xml文件中的SQL语句，返回List，page参数是主动分页的参数。

1. @Mapper
2. public interface DishMapper extends BaseMapper<Dish> {
4.     public Page<DishDto> selectDishDtoPage(Page page);
6. }

复制代码

DishService添加selectDishDtoPage方法

直接把DishMapper中的方法复制过来就可以。

1. public interface DishService extends IService<Dish> {
3.     public Page<DishDto> selectDishDtoPage(Page page);
5. }

复制代码

DishServiceImpl添加实现方法

注入DishMapper 调用selectDishDtoPage方法执行SQL语句。

1. @Service
2. public class DishServiceImpl extends ServiceImpl<DishMapper, Dish>
3.         implements DishService {
5.     @Autowired
6.     private DishMapper dishMapper;
7.     @Override
8.     public Page<DishDto> selectDishDtoPage(Page page) {
9.         return dishMapper.selectDishDtoPage(page);
10.     }
12. }

复制代码

DishController 编写前端哀求方法

前端哀求URL/dish/page，哀求方法GET,哀求参数page，pageSize。
page表现第几页，pageSize表现每一页的记载数。

1. @RestController
2. @RequestMapping("/dish")
3. public class DishController {
4.     @Autowired
5.     private DishService dishService;
7.     @GetMapping("/page")
8.     public R<Page<DishDto>> list(int page, int pageSize){
9.         Page<DishDto> pageInfo = new Page<>(page,pageSize);
10.         dishService.selectDishDtoPage(pageInfo);
11.         return R.success(pageInfo);
12.     }
14. }

复制代码

运行测试

点击菜品管理可以展示出菜品和分类的数据，但是图片表现不出来。

静态资源映射

把img存放在固定目录中记住路径。

在com.itheima.reggie.config.WebMvcConfig文件中设置静态资源映射，addResourceHandlers方法中添加图片映射代码如下：

1. registry.addResourceHandler("/images/**").addResourceLocations("file:D:/file/img/");

复制代码

设置后重启项目，图片访问路径为
http://127.0.0.1:8080/images/0a3b3288-3446-4420-bbff-f263d0c02d8e.jpg
修改前端HTML中的图片路径

修改backend/page/food/list.html文件中的代码，/common/download?name=修改为/images/

运行测试

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。