hz/learning-system-portal
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git synced 2025-12-10 11:26:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
zhaofang
2022-10-28 11:18:41 +08:00
parent e30f823f7d
commit b6aeb25f56
1 changed files with 91 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
src/views/portal/course/rePreview.vue
View File

@@ -109,30 +109,29 @@
</div> </div>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<div class="catalog-box"> <div class="course-units">
<!-- <p class="title">课程目录</p> --> <!-- <p class="title">课程目录</p> -->
<!-- <el-tabs type="border-card" v-model="ctabName" @tab-click="ctabChange"> <!-- <el-tabs type="border-card" v-model="ctabName" @tab-click="ctabChange">
<el-tab-pane label="课程目录" name="catalog"> --> <el-tab-pane label="课程目录" name="catalog"> -->
<div style="min-height: 500px;"> <div style="min-height: 500px;">
<div class="catalog" style="margin-top:30px;"> <div class="catalog" v-if="courseInfo.type == 20">
<el-collapse class="catalog-row" v-model="activeNames" @change="handleChange"> <div v-for="(item, index) in catalogTree" :key="index" :name="index">
<el-collapse-item v-for="(item, index) in catalogTree" :key="index" :name="index"> <div style="margin: 10px 0px;font-weight: 700;">{{item.section.name}}</div>
<template class="collapse-title" slot="title"> <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)">
<!-- <span :class="statusToContent(item.section.status).class">{{ statusToContent(item.section.status).text }}</span> --> <img v-if="contentData.id == ele.id" :src="`${webBaseUrl}/images/playicon.png`" alt=""> {{i+1}}.
<span class="one-line-ellipsis" style="font-size:16px;font-weight: 700;color: #343434;margin-left: 5px;">{{ item.section.name }}</span> <span>{{ ele.contentName }}</span>
</template> </div>
<ul> </div>
<li @click="showRes(ele)" v-for="(ele, i) in item.children" :key="i" class="catalog-cell"> </div>
<!-- <span :class="statusToContent(ele.status).class">{{ statusToContent(ele.status).text }}</span> --> <div v-else class="catalog">
<span class="title-type-info" :style="{color:contentData.id==ele.id? '#ffaa00':''}">{{ getType(ele.contentType) }}</span> <!-- contentList -->
<span style="line-height: 20px;" class="one-line-ellipsis" :style="{color:contentData.id==ele.id? '#ffaa00':''}">{{ ele.contentName}}</span> <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"> -->
<!-- <span :class="statusToContent(ele.status).class">{{ statusToContent(ele.status).text }}</span> --> <img v-if="contentData.id == list.id" :src="`${webBaseUrl}/images/playicon.png`" alt=""> {{index+1}}.
</li> {{ list.contentName }}
</ul> <!-- </div> -->
</el-collapse-item> </div>
</el-collapse> </div>
</div>
</div> </div>
<!-- </el-tab-pane> <!-- </el-tab-pane>
</el-tabs> --> </el-tabs> -->
@@ -267,25 +266,6 @@ export default {
onPlayerPlaying(itme){ onPlayerPlaying(itme){
// //console.log("当前播放"+itme); // //console.log("当前播放"+itme);
// //console.log("当前播放11"+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){ audioPlaying(item){
//console.log("当前播放"+item); //console.log("当前播放"+item);
@@ -303,14 +283,43 @@ export default {
apiCoursePortal.detail(this.courseId,true).then(rs=>{ apiCoursePortal.detail(this.courseId,true).then(rs=>{
if(rs.status==200){ if(rs.status==200){
//设置必须的字段 //设置必须的字段
rs.result.sections.forEach(sec=>{ if (rs.result.course.type == 20) { //有目录课程
sec.status=0;//加入状态表未开始 rs.result.sections.forEach(sec => {
rs.result.contents.forEach(c=>{ sec.status = 0; //加入状态表未开始
c.status=0;//初始化状态 ，未开始 rs.result.contents.forEach(c => {
c.studyItemId='';//初始化字段，学习条目id c.status = 0; //初始化状态 ，未开始
c.lastStudyTime=0;//初始化上次一学习的时间，作用于视频插放 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.sectionList=rs.result.sections;
this.courseInfo=rs.result.course; this.courseInfo=rs.result.course;
this.teachers=rs.result.teachers; this.teachers=rs.result.teachers;
@@ -412,6 +421,34 @@ img{
max-width: 100%; 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{ .one-line-ellipsis{
overflow: hidden; overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
@@ -457,17 +494,15 @@ word-break:break-all;
padding: 20px; padding: 20px;
} }
} }
.catalog-box{ .catalog-box {
background: #fff; background: #fff;
padding: 20px; .title {
// box-shadow: 1px 1px 2px 2px #ededed; font-size: 16px;
.title{ font-weight: 600;
font-size: 16px; color: #333333;
font-weight: 600; padding-left: 20px;
color: #333333; }
padding-left: 20px;
} }
}
.collapse-title { .collapse-title {
flex: 1 0 90%; flex: 1 0 90%;