前后端联调实例-讲师管理

之前学习了一下前后端联调的一般步骤和Nginx的简单配置，现在以讲师管理功能为例来实战一下。

项目环境

后端：SpringBoot + MyBatisPlus +MySQL+Nginx
前端：vue-cli + axios

后端

1、编写讲师管理Controller，包含根据id删除讲师、分页查询讲师列表、新增讲师等请求接口。

@Api(description = "讲师管理")
@RestController
@RequestMapping("/admin/edu/teacher")
@CrossOrigin   //跨域支持
public class TeacherAdminController {
  
  @Autowired
  private TeacherService teacherService;

  @ApiOperation(value = "根据id删除讲师")
  @DeleteMapping("{id}")
  public R removeById(@ApiParam(name = "id",value="讲师id",required = true)
                                    @PathVariable String id){
    teacherService.removeById(id);
    return R.ok();
  }
  
  @ApiOperation(value = "分页查询讲师列表")
  @GetMapping("{page}/{limit}")
  public R pageList(@ApiParam(name = "page",value = "当前页码",required = true)
                               @PathVariable Long page,
                               @ApiParam(name = "limit",value = "每页记录数",required = true)
                               @PathVariable Long limit,
                               @ApiParam(name = "teacherQuery",value = "查询对象",required = true)
                               TeacherQuery teacherQuery){
    if(page <=0 || limit <=0){  
      //抛出统一异常，好处：所有开发人员协同时可保证错误结构一致
      throw new CodingException(ResultCodeEnum.PARAM_ERROR);
    }
    Page<Teacher> pageParam = new Page<>(page,limit);
    //调用自己扩展的查询方法
    teacherService.pageQuery(pageParam,teacherQuery);
    //结果封装
    List<Teacher> records = pageParam.getRecords();
    long total = pageParam.getTotal();
    return R.ok().data("total",total).data("rows",records);
  }
  
  @ApiOperation(value = "新增讲师")
  @PostMapping
  public R save(@ApiParam(name = "teacher",value = "讲师对象",required = true)
                        @RequestBody Teacher teacher){
    teacherService.save(teacher);
    return R.ok();
  }
}

2、编写讲师服务接口，并继承IService接口。

public interface TeacherService extends IService<Teacher> {
    void pageQuery(Page<Teacher> pageParam,TeacherQuery teacherQuery);
}

3、编写讲师服务接口实现类，并继承ServiceImpl类。

@Service
public class TeacherServiceImpl extends ServiceImpl<TeacherMapper,Teacher> implements TeacherService {
    
    @Override
    public void pageQuery(Page<Teacher> pageParam,TeacherQuery teacherQuery){
        //MP 让我们可以通过面向对象的方式编写SQL
        QueryWrapper<Teacher> queryWrapper = new QueryWrapper<>();
        queryWrapper.orderByAsc("sort");
        if(teacherQuery == null){
            baseMapper.selectPage(pageParam,queryWrapper);
            return;
        }
        String name = teacherQuery.getName();
        String level = teacherQuery.getLevel();
        Strin