删除课程前后端实现

一 后端实现

1 控制器

/**
* 功能描述：根据ID删除课程
*
* @author cakin
* @date 2020/12/6
* @param id 课程id
* @return R 返回给前端的数据
*/
@ApiOperation("根据ID删除课程")
@DeleteMapping("remove/{id}")
public R removeById(@ApiParam(value = "课程id", required = true) @PathVariable String id) {
    // TODO: 删除课程视频
    // 此处调用vod中的删除视频文件的接口
    //删除课程封面
    courseService.removeCoverById(id);
    // 删除课程
    boolean result = courseService.removeCourseById(id);
    if (result) {
        return R.ok().message("删除成功");
    } else {
        return R.error().message("数据不存在");
    }
}

2 service层

接口

/**
* 功能描述：删除课程封面
*
* @author cakin
* @date 2020/12/6
* @param id 课程id
* @return boolean 是否删除成功
*/
boolean removeCoverById(String id);


/**
* 功能描述：删除课程
*
* @author cakin
* @date 2020/12/6
* @param id 课程id
* @return boolean 是否删除成功
*/
boolean removeCourseById(String id);

实现

/**
* 功能描述：删除课程封面
*
* @param id 课程id
* @return boolean 是否删除成功
* @author cakin
* @date 2020/12/6
*/
@Override
public boolean removeCoverById(String id) {
    // 根据id获取课程 Cover 的 url
    Course course = baseMapper.selectById(id);
    if (course != null) {
        String cover = course.getCover();
        if (!StringUtils.isEmpty(cover)) {
            R r = ossFileService.removeFile(cover);
            return r.getSuccess();
        }
    }
    return false;
}


/**
* 功能描述：删除课程
*
* @param id 课程id
* @return boolean 是否删除成功
* 数据库中外键约束的设置：
* 互联网分布式项目中不允许使用外键与级联更新，一切涉及级联的操作不要依赖数据库层，要在业务层解决
* 如果业务层解决级联删除功能
* 那么先删除子表数据，再删除父表数据
* @author cakin
* @date 2020/12/6
*/
@Transactional(rollbackFor = Exception.class)
@Override
public boolean removeCourseById(String id) {
    // 根据 courseId 删除 Video(课时)
    QueryWrapper<Video> videoQueryWrapper = new QueryWrapper<>();
    videoQueryWrapper.eq("course_id", id);
    videoMapper.delete(videoQueryWrapper);
    // 根据 courseId 删除 Chapter(章节)
    QueryWrapper<Chapter> chapterQueryWrapper = new QueryWrapper<>();
    chapterQueryWrapper.eq("course_id", id);
    chapterMapper.delete(chapterQueryWrapper);
    // 根据 courseId 删除 Comment(评论)
    QueryWrapper<Comment> commentQueryWrapper = new QueryWrapper<>();
    commentQueryWrapper.eq("course_id", id);
    commentMapper.delete(commentQueryWrapper);
    // 根据 courseId 删除 CourseCollect(课程收藏)
    QueryWrapper<CourseCollect> courseCollectQueryWrapper = new QueryWrapper<>();
    courseCollectQueryWrapper.eq("course_id", id);
    courseCollectMapper.delete(courseCollectQueryWrapper);
    // 根据 courseId 删除 CourseDescription(课程详情)
    courseDescriptionMapper.deleteById(id);
    // 删除课程
    return this.removeById(id);
}

二 前端实现

1 定义API

  // 根据id删除课程
  removeById(id) {
    return request({
      url: `/admin/edu/course/remove/${id}`,
      method: 'delete'
    })
  },

2 修改删除按钮

<el-button type="danger" size="mini" icon="el-icon-delete" @click="removeById(scope.row.id)">删除</el-button>

3 编写删除方法

    // 根据id删除数据
    removeById(id) {
      this.$confirm('此操作将永久删除该课程，以及该课程下的章节和视频，是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return courseApi.removeById(id)
      }).then(response => {
        this.fetchData()
        this.$message.success(response.message)
      }).catch((response) => { // 失败
        if (response === 'cancel') {
          this.$message.info('取消删除')
        }
      })
    }

三 测试