1、需要添加内容
2、添加课程实现所属讲师下拉选择框
(1)EduTeacherController中添加查询所有讲师的接口。
//查询所有讲师
@ApiOperation(value = "查询所有讲师")
@GetMapping
public R getAllTeacher(){
List<EduTeacher> list = eduTeacherService.list(null);
return R.ok().data("items",list);
}
(2)在teacher.js新增接口方法。
//查询所有讲师
getAllTeacher(){
return request({
url: `/eduservice/eduteacher`,
method: 'get'
})
}
(3)在添加课程页面添加页面元素。
<!-- 课程讲师 -->
<el-form-item label="课程讲师">
<el-select v-model="courseInfo.teacherId" placeholder="请选择">
<el-option
v-for="teacher in teacherList"
:key="teacher.id"
:label="teacher.name"
:value="teacher.id"
/>
</el-select>
</el-form-item>
(4)js的实现。
import course from "@/api/course";
import teacher from "@/api/teacher";
export default {
data() {
return {
courseInfo: {}, //封装表单数据
saveBtnDisabled: false, //保存按钮是否禁用
teacherList:[]//讲师信息集合
};
},
created() {
this.getAllTeacherList()
},
methods: {
//查询所有讲师
getAllTeacherList(){
teacher.getAllTeacher()
.then(response=>{
this.teacherList = response.data.items
})
},
…
3、添加课程实现所属分类下拉选择框(二级联动)
(1)确认接口,均已实现,就是查询课程分类的接口。
(2)添加页面元素。
<!-- 所属分类 -->
<el-form-item label="课程类别">
<!--一级分类-->
<el-select @change="getTwoSubjectByOne"
v-model="courseInfo.subjectParentId" placeholder="一级分类">
<el-option
v-for="subject in oneSubjectList"
:key="subject.id"
:label="subject.title"
:value="subject.id"
/>
</el-select>
<!--二级分类-->
<el-select v-model="courseInfo.subjectId" placeholder="二级分类">
<el-option
v-for="subject in twoSubjectList"
:key="subject.id"
:label="subject.title"
:value="subject.id"
/>
</el-select>
</el-form-item>
(3)js方法实现
import subject from "@/api/subject";
export default {
data() {
return {
courseInfo: {}, //封装表单数据
saveBtnDisabled: false, //保存按钮是否禁用
teacherList:[],//讲师信息集合
oneSubjectList:[],//一级分类集合
twoSubjectList:[]//二级分类集合
};
},
created() {
this.getAllTeacherList()
this.getAllOneSubject()
},
methods: {
//查询所有讲师
getAllTeacherList(){
teacher.getAllTeacher()
.then(response=>{
this.teacherList = response.data.items
})
},
//查询所有一级分类信息
getAllOneSubject(){
subject.getAllSubject()
.then(response=>{
this.oneSubjectList = response.data.allSubject
})
},
//当点击一个一级分类时,触发事件
getTwoSubjectByOne(value){
for(let i=0;i<this.oneSubjectList.length;i++ ){
//得到每一个一级分类
let oneSubject = this.oneSubjectList[i]
if(oneSubject.id === value){
this.twoSubjectList = oneSubject.children
}
}
},