基于 Spring Boot 瑞吉外卖体系开辟（六）
基于 Spring Boot 瑞吉外卖体系开辟（六）菜品列表
在体系管理端首页，单击左侧菜单栏中的“菜品管理”，会在右侧打开菜品管理页面。
https://i-blog.csdnimg.cn/direct/6343bc44a93848db9398ff50fe07596a.png
哀求URL/dish/page，哀求方法GET,哀求参数page，pageSize。
https://i-blog.csdnimg.cn/direct/4a89466e07334eadab88ca01438102b4.png
该菜品列表展示字段涉及菜品和分类名称数据，菜品（dish表）、分类（category表）来自不同表，所以这里打算使用自定义SQL两表联查。
创建DishDto
由于Dish字段不敷用，重新写一个数据传输对象（Dto）(Data Transfer Object)。
创建dto包，在com.itheima.reggie.dto创建DishDto类，类继承Dish字段，并且添加CategoryName属性。
@Data
public class DishDto extends Dish {
private String categoryName;
}
编写SQL
实现dish和category两表联查，这里接纳左毗连查询方式。可以先在navicat实验一下SQL是否精确。
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文件
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.itheima.reggie.mapper.DishMapper">
<select id="selectDishDtoPage" resultType="com.itheima.reggie.dto.DishDto">
select d.*,c.name as category_name from dish d
LEFT JOIN category c ON d.category_id=c.id
</select>
</mapper>
DishMapper添加执行SQL语句的方法
根据上面id属性值添加方法名，selectDishDtoPage方法就会执行xml文件中的SQL语句，返回List，page参数是主动分页的参数。
@Mapper
public interface DishMapper extends BaseMapper<Dish> {
public Page<DishDto> selectDishDtoPage(Page page);
}
DishService添加selectDishDtoPage方法
直接把DishMapper中的方法复制过来就可以。
public interface DishService extends IService<Dish> {
public Page<DishDto> selectDishDtoPage(Page page);
}
DishServiceImpl添加实现方法
注入DishMapper 调用selectDishDtoPage方法执行SQL语句。
@Service
public class DishServiceImpl extends ServiceImpl<DishMapper, Dish>
implements DishService {
@Autowired
private DishMapper dishMapper;
@Override
public Page<DishDto> selectDishDtoPage(Page page) {
return dishMapper.selectDishDtoPage(page);
}
}
DishController 编写前端哀求方法
前端哀求URL/dish/page，哀求方法GET,哀求参数page，pageSize。
page表现第几页，pageSize表现每一页的记载数。
@RestController
@RequestMapping("/dish")
public class DishController {
@Autowired
private DishService dishService;
@GetMapping("/page")
public R<Page<DishDto>> list(int page, int pageSize){
Page<DishDto> pageInfo = new Page<>(page,pageSize);
dishService.selectDishDtoPage(pageInfo);
return R.success(pageInfo);
}
}
运行测试
点击菜品管理可以展示出菜品和分类的数据，但是图片表现不出来。
https://i-blog.csdnimg.cn/direct/c258dc30b403480fb26e4c9db87fd73d.png
静态资源映射
把img存放在固定目录中记住路径。
https://i-blog.csdnimg.cn/direct/c459437f695043a79494d239d44b98af.png
在com.itheima.reggie.config.WebMvcConfig文件中设置静态资源映射，addResourceHandlers方法中添加图片映射代码如下：
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/
https://i-blog.csdnimg.cn/direct/1d52befbf18a44cab92559f802de5213.png
https://i-blog.csdnimg.cn/direct/17c42f72b143459b95e0c90131649a51.png
运行测试
https://i-blog.csdnimg.cn/direct/baf67014cf364f2dba35aed3add444a2.png
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]