This commit is contained in:
zhaofang
2022-10-28 11:18:41 +08:00
parent e30f823f7d
commit b6aeb25f56

View File

@@ -109,29 +109,28 @@
</div>
</el-col>
<el-col :span="8">
<div class="catalog-box">
<div class="course-units">
<!-- <p class="title">课程目录</p> -->
<!-- <el-tabs type="border-card" v-model="ctabName" @tab-click="ctabChange">
<el-tab-pane label="课程目录" name="catalog"> -->
<div style="min-height: 500px;">
<div class="catalog" style="margin-top:30px;">
<el-collapse class="catalog-row" v-model="activeNames" @change="handleChange">
<el-collapse-item v-for="(item, index) in catalogTree" :key="index" :name="index">
<template class="collapse-title" slot="title">
<!-- <span :class="statusToContent(item.section.status).class">{{ statusToContent(item.section.status).text }}</span> -->
<span class="one-line-ellipsis" style="font-size:16px;font-weight: 700;color: #343434;margin-left: 5px;">{{ item.section.name }}</span>
</template>
<ul>
<li @click="showRes(ele)" v-for="(ele, i) in item.children" :key="i" class="catalog-cell">
<!-- <span :class="statusToContent(ele.status).class">{{ statusToContent(ele.status).text }}</span> -->
<span class="title-type-info" :style="{color:contentData.id==ele.id? '#ffaa00':''}">{{ getType(ele.contentType) }}</span>
<span style="line-height: 20px;" class="one-line-ellipsis" :style="{color:contentData.id==ele.id? '#ffaa00':''}">{{ ele.contentName}}</span>
<!--状态 有问题,未切换为正在进行的状态-->
<!-- <span :class="statusToContent(ele.status).class">{{ statusToContent(ele.status).text }}</span> -->
</li>
</ul>
</el-collapse-item>
</el-collapse>
<div class="catalog" v-if="courseInfo.type == 20">
<div v-for="(item, index) in catalogTree" :key="index" :name="index">
<div style="margin: 10px 0px;font-weight: 700;">{{item.section.name}}</div>
<div class="units-info" :class="{'units-active':contentData.id == ele.id}" v-for="(ele, i) in item.children" :key="i" @click="showRes(ele,i,index)">
<img v-if="contentData.id == ele.id" :src="`${webBaseUrl}/images/playicon.png`" alt=""> {{i+1}}.
<span>{{ ele.contentName }}</span>
</div>
</div>
</div>
<div v-else class="catalog">
<!-- contentList -->
<div class="units-info" v-for="(list, index) in contentList" :key="index" :name="index" @click="showRes(list,-1,index)" :class="{'units-active':contentData.id == list.id}">
<!-- <div class="units-info" :class="{'units-active':contentData.id == ele.id}" @click="showRes(ele,i,index)" v-for="(ele, i) in item.children" :key="i"> -->
<img v-if="contentData.id == list.id" :src="`${webBaseUrl}/images/playicon.png`" alt=""> {{index+1}}.
{{ list.contentName }}
<!-- </div> -->
</div>
</div>
</div>
<!-- </el-tab-pane>
@@ -267,25 +266,6 @@ export default {
onPlayerPlaying(itme){
// //console.log("当前播放"+itme);
// //console.log("当前播放11"+itme);
// if(this.contentData.contentType && this.contentData.contentType==10){
// let intTime=parseInt(itme);
// this.contentData.lastStudyTime=intTime;
// let saveTime=Math.floor(intTime%10);
// if(intTime>10 && saveTime==0 && this.contentData.studyItemId!=''){
// //记录播放时间
// //console.log('记录播放时间:'+intTime);
// let postData={
// itemId:this.contentData.studyItemId,
// videoTime:intTime
// }
// apiStudy.studyVideoTime(postData).then(rs=>{
// if(rs.status!=200){
// console.log('记录播放时间错误');
// }
// })
// }
// }
},
audioPlaying(item){
//console.log("当前播放"+item);
@@ -303,6 +283,7 @@ export default {
apiCoursePortal.detail(this.courseId,true).then(rs=>{
if(rs.status==200){
//设置必须的字段
if (rs.result.course.type == 20) { //有目录课程
rs.result.sections.forEach(sec => {
sec.status = 0; //加入状态表未开始
rs.result.contents.forEach(c => {
@@ -310,7 +291,35 @@ export default {
c.studyItemId = ''; //初始化字段学习条目id
c.lastStudyTime = 0; //初始化上次一学习的时间,作用于视频插放
});
});
this.sectionList = rs.result.sections;
}else if(rs.result.course.type==10){ //无目录课程
//如果是多个的话,就需要过滤一下
let indexNum=0;
let delIndexs=[];
rs.result.contents.forEach((c,cidx) => {
c.status = 0; //
c.studyItemId = '';
c.lastStudyTime = 0;
if(c.sortIndex==1){
indexNum++;
if(indexNum>1){
delIndexs.push(cidx);
}
}else if(c.sortIndex==2){
c.contentName='作业';
}else if(c.sortIndex==3){
c.contentName='考试';
}else if(c.sortIndex==4){
c.contentName='评估';
}
});
if(delIndexs.length>0){
delIndexs.forEach(delIdx=>{
rs.result.contents.splice(delIdx,1);
})
}
}
this.sectionList=rs.result.sections;
this.courseInfo=rs.result.course;
this.teachers=rs.result.teachers;
@@ -412,6 +421,34 @@ img{
max-width: 100%;
}
}
.course-units {
background: #fff;
padding: 10px 30px;
.units-info {
padding: 0 30px;
height: 60px;
line-height: 60px;
font-size: 16px;
cursor: pointer;
overflow: hidden;
white-space:nowrap;
word-break:break-all;
text-overflow:ellipsis;
}
.units-active {
background: #F6F6F6;
color: #387DF7;
font-weight: 600;
cursor: text;
img {
width: 18px;
height: 20px;
vertical-align: middle;
margin-right: 20px;
}
}
}
.one-line-ellipsis{
overflow: hidden;
box-sizing: border-box;
@@ -459,8 +496,6 @@ word-break:break-all;
}
.catalog-box {
background: #fff;
padding: 20px;
// box-shadow: 1px 1px 2px 2px #ededed;
.title {
font-size: 16px;
font-weight: 600;