|
|
@@ -27,177 +27,190 @@
|
|
|
</div>
|
|
|
<!-- 章节目录 -->
|
|
|
<template v-if="tab.name == '1'">
|
|
|
- <!-- <catalogue :goodsId='goodsId'></catalogue> -->
|
|
|
<div class="mulu_body">
|
|
|
<div class="left-box">
|
|
|
+ <div v-for="(courseItem, tindex) in goodsTeacher" :key="tindex + 'one'">
|
|
|
<div class="left-box__body">
|
|
|
- <div
|
|
|
- class="course-list-item"
|
|
|
- v-for="(course, index) in s_courseList"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="course-list-item_title"
|
|
|
- @click="openCourse(course)"
|
|
|
- >
|
|
|
- <i
|
|
|
- :class="{
|
|
|
- 'el-icon-caret-right': !course.showList,
|
|
|
- 'el-icon-caret-bottom': course.showList,
|
|
|
- }"
|
|
|
- ></i>
|
|
|
- {{ course.courseName }}
|
|
|
- </div>
|
|
|
- <template v-if="course.showList">
|
|
|
- <div
|
|
|
- class="item"
|
|
|
- v-for="(item, index) in course.list"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
- <template v-if="item.type == 1">
|
|
|
+ <template v-for="(course, cindex) in courseItem.courseList">
|
|
|
+ <!-- v-for="(course, cindex) in s_courseList" -->
|
|
|
+ <div v-if="course.show == 1" :key="cindex + 'two'">
|
|
|
<div
|
|
|
- class="item__title"
|
|
|
- @click="openModule(item)"
|
|
|
+ class="course-list-item"
|
|
|
+ v-show="course.subjectId === newActiveSubjectId || !newActiveSubjectId"
|
|
|
>
|
|
|
- <i
|
|
|
- :class="{
|
|
|
- 'el-icon-caret-right': !item.showList,
|
|
|
- 'el-icon-caret-bottom': item.showList,
|
|
|
- }"
|
|
|
- ></i>
|
|
|
- {{ item.name }}
|
|
|
- </div>
|
|
|
- <div class="item__content">
|
|
|
- <div
|
|
|
- class="bank-chapter"
|
|
|
- v-if="item.showList"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="bank-chapter__item"
|
|
|
- v-for="(
|
|
|
- chapter, chapterIndex
|
|
|
- ) in item.list"
|
|
|
- :key="chapterIndex"
|
|
|
- >
|
|
|
<div
|
|
|
- class="bank-chapter__item__text"
|
|
|
- @click="openChapter(chapter)"
|
|
|
+ class="course-list-item_title"
|
|
|
+ @click="openCourse(course)"
|
|
|
>
|
|
|
<i
|
|
|
:class="{
|
|
|
- 'el-icon-caret-right':
|
|
|
- !chapter.showList,
|
|
|
- 'el-icon-caret-bottom':
|
|
|
- chapter.showList,
|
|
|
+ 'el-icon-caret-right': !course.showList,
|
|
|
+ 'el-icon-caret-bottom': course.showList,
|
|
|
}"
|
|
|
- ></i
|
|
|
- >{{ chapter.name }}
|
|
|
+ ></i>
|
|
|
+ {{ course.courseName }}
|
|
|
</div>
|
|
|
-
|
|
|
- <div
|
|
|
- class="bank-section"
|
|
|
- v-if="chapter.showList"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="bank-section__item"
|
|
|
- v-for="(
|
|
|
- section, sectionIndex
|
|
|
- ) in chapter.list"
|
|
|
- :key="sectionIndex"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="bank-section__item__text"
|
|
|
- >
|
|
|
- {{ section.name }}
|
|
|
+ <div v-if="courseItem.teaList && courseItem.teaList.length > 0" class="teacher_names">
|
|
|
+ <div v-for="(tea, index) in courseItem.teaList" :key="index + 'three'" class="names"
|
|
|
+ :class="{nactive: States[tindex] == index}"
|
|
|
+ @click="switchTeacher(tea, index, tindex)">
|
|
|
+ {{ tea.aliasName }}
|
|
|
</div>
|
|
|
+ </div>
|
|
|
+ <template v-if="course.showList">
|
|
|
<div
|
|
|
- v-if="section.tryListen"
|
|
|
- @click="
|
|
|
- toDo(section, item.courseId)
|
|
|
- "
|
|
|
- class="btn"
|
|
|
+ class="item"
|
|
|
+ v-for="(item, index) in course.list"
|
|
|
+ :key="index"
|
|
|
>
|
|
|
- 试看
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <template v-if="item.type == 1">
|
|
|
+ <div
|
|
|
+ class="item__title"
|
|
|
+ @click="openModule(item)"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ :class="{
|
|
|
+ 'el-icon-caret-right': !item.showList,
|
|
|
+ 'el-icon-caret-bottom': item.showList,
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ <div class="item__content">
|
|
|
+ <div
|
|
|
+ class="bank-chapter"
|
|
|
+ v-if="item.showList"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bank-chapter__item"
|
|
|
+ v-for="(
|
|
|
+ chapter, chapterIndex
|
|
|
+ ) in item.list"
|
|
|
+ :key="chapterIndex"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bank-chapter__item__text"
|
|
|
+ @click="openChapter(chapter)"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ :class="{
|
|
|
+ 'el-icon-caret-right':
|
|
|
+ !chapter.showList,
|
|
|
+ 'el-icon-caret-bottom':
|
|
|
+ chapter.showList,
|
|
|
+ }"
|
|
|
+ ></i
|
|
|
+ >{{ chapter.name }}
|
|
|
+ </div>
|
|
|
|
|
|
- <template v-if="item.type == 2">
|
|
|
- <div class="item__content">
|
|
|
- <div class="bank-chapter">
|
|
|
- <div class="bank-chapter__item">
|
|
|
- <div
|
|
|
- class="bank-chapter__item__text"
|
|
|
- @click="openChapter(item)"
|
|
|
- >
|
|
|
- <i
|
|
|
- :class="{
|
|
|
- 'el-icon-caret-right':
|
|
|
- !item.showList,
|
|
|
- 'el-icon-caret-bottom':
|
|
|
- item.showList,
|
|
|
- }"
|
|
|
- ></i
|
|
|
- >{{ item.name }}
|
|
|
- </div>
|
|
|
+ <div
|
|
|
+ class="bank-section"
|
|
|
+ v-if="chapter.showList"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bank-section__item"
|
|
|
+ v-for="(
|
|
|
+ section, sectionIndex
|
|
|
+ ) in chapter.list"
|
|
|
+ :key="sectionIndex"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bank-section__item__text"
|
|
|
+ >
|
|
|
+ {{ section.name }}
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="section.tryListen"
|
|
|
+ @click="
|
|
|
+ toDo(section, item.courseId)
|
|
|
+ "
|
|
|
+ class="btn"
|
|
|
+ >
|
|
|
+ 试看
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
|
|
|
- <div
|
|
|
- class="bank-section"
|
|
|
- v-if="item.showList"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="bank-section__item"
|
|
|
- v-for="(
|
|
|
- section, sectionIndex
|
|
|
- ) in item.list"
|
|
|
- :key="sectionIndex"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="bank-section__item__text"
|
|
|
- >
|
|
|
- {{ section.name }}
|
|
|
- </div>
|
|
|
- <div
|
|
|
- v-if="section.tryListen"
|
|
|
- @click="
|
|
|
- toDo(section, item.courseId)
|
|
|
- "
|
|
|
- class="btn"
|
|
|
- >
|
|
|
- 试看
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <template v-if="item.type == 2">
|
|
|
+ <div class="item__content">
|
|
|
+ <div class="bank-chapter">
|
|
|
+ <div class="bank-chapter__item">
|
|
|
+ <div
|
|
|
+ class="bank-chapter__item__text"
|
|
|
+ @click="openChapter(item)"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ :class="{
|
|
|
+ 'el-icon-caret-right':
|
|
|
+ !item.showList,
|
|
|
+ 'el-icon-caret-bottom':
|
|
|
+ item.showList,
|
|
|
+ }"
|
|
|
+ ></i
|
|
|
+ >{{ item.name }}
|
|
|
+ </div>
|
|
|
|
|
|
- <template v-if="item.type == 3">
|
|
|
- <div class="item__content">
|
|
|
- <div class="bank-section">
|
|
|
- <div class="bank-section__item">
|
|
|
- <div class="bank-section__item__text">
|
|
|
- {{ item.name }}
|
|
|
- </div>
|
|
|
- <div
|
|
|
- v-if="item.tryListen"
|
|
|
- @click="toDo(item, item.courseId)"
|
|
|
- class="btn"
|
|
|
- >
|
|
|
- 试看
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div
|
|
|
+ class="bank-section"
|
|
|
+ v-if="item.showList"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bank-section__item"
|
|
|
+ v-for="(
|
|
|
+ section, sectionIndex
|
|
|
+ ) in item.list"
|
|
|
+ :key="sectionIndex"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bank-section__item__text"
|
|
|
+ >
|
|
|
+ {{ section.name }}
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="section.tryListen"
|
|
|
+ @click="
|
|
|
+ toDo(section, item.courseId)
|
|
|
+ "
|
|
|
+ class="btn"
|
|
|
+ >
|
|
|
+ 试看
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="item.type == 3">
|
|
|
+ <div class="item__content">
|
|
|
+ <div class="bank-section">
|
|
|
+ <div class="bank-section__item">
|
|
|
+ <div class="bank-section__item__text">
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="item.tryListen"
|
|
|
+ @click="toDo(item, item.courseId)"
|
|
|
+ class="btn"
|
|
|
+ >
|
|
|
+ 试看
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
- </template>
|
|
|
</div>
|
|
|
</template>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -230,7 +243,7 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- 弹窗 -->
|
|
|
- <buy-dialog :buyModal.sync="buyModal" :topicId="topicId" :subjectType="1" :type="1"></buy-dialog>
|
|
|
+ <buy-dialog :buyModal.sync="buyModal" :topicId="topicId" :subjectType="1" :type="3"></buy-dialog>
|
|
|
</div>
|
|
|
|
|
|
<!-- </div> -->
|
|
|
@@ -288,6 +301,10 @@ export default {
|
|
|
playCourseId: 0, // 播放课程id
|
|
|
showAsk: false,
|
|
|
buyModal: false,
|
|
|
+ goodsTeacher: [],
|
|
|
+ teaIndex: 0,
|
|
|
+ States: {0: 0},
|
|
|
+ newActiveSubjectId: '',
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -304,8 +321,9 @@ export default {
|
|
|
this.showAsk = !this.showAsk
|
|
|
},
|
|
|
toChangeCou(item, index) {
|
|
|
+ this.newActiveSubjectId = item.subjectId
|
|
|
this.subIndex = index
|
|
|
- this.s_courseList = this.courseList.filter(e => e.subjectId == item.subjectId)
|
|
|
+ // this.s_courseList = this.courseList.filter(e => e.subjectId == item.subjectId)
|
|
|
},
|
|
|
togoBuy() {
|
|
|
this.buyModal = true
|
|
|
@@ -338,6 +356,27 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+ //切换老师
|
|
|
+ switchTeacher(data, index, tindex){
|
|
|
+ console.log(data,'data', index,tindex);
|
|
|
+ this.States[tindex] = index
|
|
|
+ this.teaIndex = index
|
|
|
+ this.goodsTeacher.forEach((item,index) => {
|
|
|
+ if(item.teaList && item.teaList.length > 0){
|
|
|
+ let list = item.teaList.filter(x => x.aliasName == data.aliasName)
|
|
|
+ if(list && list.length > 0){
|
|
|
+ item.courseList.forEach((course,courseIndex) => {
|
|
|
+ if(course.courseId == data.courseId){
|
|
|
+
|
|
|
+ this.$set(this.goodsTeacher[index].courseList[courseIndex],"show",1)
|
|
|
+ }else{
|
|
|
+ this.$set(this.goodsTeacher[index].courseList[courseIndex],"show",0)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
/**
|
|
|
* 获取课程章节列表，/app/common/goods/course/list/' + data,
|
|
|
*/
|
|
|
@@ -348,6 +387,8 @@ export default {
|
|
|
item.showList = false
|
|
|
item.list = []
|
|
|
})
|
|
|
+ // 获取双师制
|
|
|
+ this.getCourseTeacher(res.rows)
|
|
|
this.courseList = res.rows || []
|
|
|
// 筛选科目名称
|
|
|
let ids = []
|
|
|
@@ -361,6 +402,7 @@ export default {
|
|
|
this.subList = [...newArr]
|
|
|
this.subList = this.subList.filter(item => item.subjectName)
|
|
|
console.log('this.subList', this.subList)
|
|
|
+ this.subList.length && (this.newActiveSubjectId = this.subList[0].subjectId)
|
|
|
|
|
|
if (this.needOpen) {
|
|
|
for (let i = 0; i < this.courseList.length; i++) {
|
|
|
@@ -381,6 +423,73 @@ export default {
|
|
|
|
|
|
})
|
|
|
},
|
|
|
+ getCourseTeacher(rows) {
|
|
|
+ //获取商品双师资模板
|
|
|
+ this.$request.getGoodsCourseTeacher({
|
|
|
+ goodsId: this.goodsId
|
|
|
+ }).then((res1) => {
|
|
|
+ console.log(res1,'res1');
|
|
|
+ if(res1.data && res1.data.length > 0){
|
|
|
+ //课程老师模板
|
|
|
+ let teacherTel = res1.data;
|
|
|
+ //商品课程
|
|
|
+ let courses = rows;
|
|
|
+ teacherTel.forEach((tea) => {
|
|
|
+ let dataList = []
|
|
|
+ let teacherList = []
|
|
|
+ courses.forEach((item) => {
|
|
|
+ if(tea.courseIds.search(item.courseId) > -1){
|
|
|
+ dataList.push(item)
|
|
|
+ teacherList = tea.courseList
|
|
|
+ }
|
|
|
+ })
|
|
|
+ let result = {
|
|
|
+ teaList:teacherList,
|
|
|
+ courseList:dataList
|
|
|
+ }
|
|
|
+ this.goodsTeacher.push(result)
|
|
|
+ })
|
|
|
+ if(this.goodsTeacher && this.goodsTeacher.length > 0){
|
|
|
+ let courseIds = []
|
|
|
+ this.goodsTeacher.forEach((item) => {
|
|
|
+ item.courseList.forEach((course) => {
|
|
|
+ courseIds.push(course.courseId)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ if(courseIds.length > 0){
|
|
|
+ courses.forEach((item) => {
|
|
|
+ if(!courseIds.includes(item.courseId)){
|
|
|
+ let data = {
|
|
|
+ teaList:[],
|
|
|
+ courseList: []
|
|
|
+ }
|
|
|
+ data.courseList.push(item)
|
|
|
+ this.goodsTeacher.push(data)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.goodsTeacher.forEach((item) => {
|
|
|
+ if(item.courseList && item.courseList.length > 0){
|
|
|
+ item.courseList[0].show = 1
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ //没有双师资模板
|
|
|
+ rows.forEach((item) => {
|
|
|
+ item.show = 1
|
|
|
+ let data = {
|
|
|
+ teaList:[],
|
|
|
+ courseList: []
|
|
|
+ }
|
|
|
+ data.courseList.push(item)
|
|
|
+ this.goodsTeacher.push(data)
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(this.goodsTeacher,'this.goodsTeacher');
|
|
|
+ },
|
|
|
// 获取课程目录，/app/common/course/menuList
|
|
|
getCourseMenus(item) {
|
|
|
return new Promise((resolve) => {
|
|
|
@@ -682,9 +791,9 @@ export default {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
overflow-y: auto;
|
|
|
-
|
|
|
+ padding-top: 10px;
|
|
|
.course-list-item {
|
|
|
- padding: 16px;
|
|
|
+ padding: 0px 16px 10px;
|
|
|
border-radius: 10px;
|
|
|
|
|
|
.item {
|
|
|
@@ -706,7 +815,6 @@ export default {
|
|
|
&__item {
|
|
|
padding-top: 10px;
|
|
|
padding-bottom: 10px;
|
|
|
- // border-bottom: 1px solid #eeeeee;
|
|
|
font-size: 14px;
|
|
|
color: #fff;
|
|
|
&__text {
|
|
|
@@ -722,7 +830,6 @@ export default {
|
|
|
&__item {
|
|
|
padding-top: 10px;
|
|
|
padding-bottom: 10px;
|
|
|
- // border-bottom: 1px solid #eeeeee;
|
|
|
font-size: 14px;
|
|
|
display: flex;
|
|
|
color: #3f8dfd;
|
|
|
@@ -822,4 +929,22 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+// 老师名称样式
|
|
|
+.teacher_names {
|
|
|
+ display: flex;
|
|
|
+ margin-left: 20px;
|
|
|
+ margin-top: 10px;
|
|
|
+ .names {
|
|
|
+ font-size: 13px;
|
|
|
+ color: #383838;
|
|
|
+ margin-right: 8px;
|
|
|
+ cursor: pointer;
|
|
|
+ background: #818181;
|
|
|
+ border-radius: 4px;
|
|
|
+ padding: 3px 6px;
|
|
|
+ &.nactive {
|
|
|
+ background: #CCCCCC;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
xuqiaoying
