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

提交修改

Browse Source
This commit is contained in:
daihh
2022-11-16 14:58:51 +08:00
parent f088eaa62a
commit b88a963320
2 changed files with 150 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

206
pages/study/courseStudy.vue
View File

@@ -225,13 +225,13 @@
<!-- <view class="mycrollcontent" style="display: flex;justify-content:flex-start;"> --> <!-- <view class="mycrollcontent" style="display: flex;justify-content:flex-start;"> -->
<view v-for="(con,conIdx) in scrollList" :key="conIdx" style="display: inline-block;" :id="con.id" @click="playContent(con,conIdx,0)"> <view v-for="(con,conIdx) in scrollList" :key="conIdx" style="display: inline-block;" :id="con.id" @click="playContent(con,conIdx,0)">
<!----> <!---->
<view :style="{width:scrollItemWidth+'px'}" class="scroll-item" :class="{'studying':curContent.id==con.id}"> <view :style="{width:scrollItemWidth+'px'}" class="scroll-item" :class="{'color-studying':curContent.id==con.id}">
<view class="scroll-item-sec">{{con.cataName}} <view class="scroll-item-sec">{{con.cataName}}
<!-- <text v-if="con.cataStatus && con.cataStatus==1" class="status-tag" :class="statusClass(con.cataStatus)">未开始</text> <!-- <text v-if="con.cataStatus && con.cataStatus==1" class="status-tag" :class="statusClass(con.cataStatus)">未开始</text>
<text v-if="con.cataStatus && con.cataStatus==2" class="status-tag" :class="statusClass(con.cataStatus)">进行中</text> <text v-if="con.cataStatus && con.cataStatus==2" class="status-tag" :class="statusClass(con.cataStatus)">进行中</text>
<text v-if="con.cataStatus && con.cataStatus==9" class="status-tag" :class="statusClass(con.cataStatus)">已完成</text> --> <text v-if="con.cataStatus && con.cataStatus==9" class="status-tag" :class="statusClass(con.cataStatus)">已完成</text> -->
</view> </view>
<view class="scroll-item-con"> <view class="scroll-item-con" :class="{'box-studying':curContent.id==con.id}">
<view class="scroll-item-name"> <view class="scroll-item-name">
{{con.contentName}} {{con.contentName}}
</view> </view>
@@ -265,7 +265,7 @@
<image v-if="isFavorite" src="/static/images/course/c_favorite_2.png" style="width: 80upx;height: 80upx;"> <image v-if="isFavorite" src="/static/images/course/c_favorite_2.png" style="width: 80upx;height: 80upx;">
<image v-else src="/static/images/course/c_favorite.png" style="width: 80upx;height: 80upx;"> <image v-else src="/static/images/course/c_favorite.png" style="width: 80upx;height: 80upx;">
</view> </view>
<view>收藏</view> <view><text v-if="isFavorite">已收藏</text><text v-else>收藏</text> </view>
</view> </view>
<view class="cinfo-btn" @click="openShare()"> <view class="cinfo-btn" @click="openShare()">
<view> <view>
@@ -458,9 +458,10 @@
handleTimeout:null, handleTimeout:null,
isAppendTime:true, isAppendTime:true,
appendStartTime: null, //记录追加的开始时间 appendStartTime: null, //记录追加的开始时间
appendHandle:null, appendHandle:null,//追加学习时长的timeout句柄
appentId:'',//当前追加的学习时长的id appentId:'',//当前追加的学习时长的id
appentInterval:30000,//追加学习时间的间隔 30秒加一次 appentInterval:5000,//追加学习时间的间隔 3秒加一次
handleTimeout: null,
preTime:-1, preTime:-1,
blobUrl:'',//音视频的播放地址 blobUrl:'',//音视频的播放地址
localTimeKey:'boeu-study-time' ,//本地存储的学习时长的key json格式 localTimeKey:'boeu-study-time' ,//本地存储的学习时长的key json格式
@@ -1037,13 +1038,98 @@
//console.log(e); //console.log(e);
this.scrollInfo = e.detail; this.scrollInfo = e.detail;
}, },
//以下是插入相关的处理 //以下是播放相关的处理
saveStudyDuration(duration) { //保存本地存储的学习时长
if (duration > 0) {
//发送用户学习事件
//console.log('保存到后台学习时长='+duration);
let postData={
"key": "StudyCourse",//课程学习的key
"title": "学习课程",//事件的标题
"parameters":"second:"+duration,//second:value,total:value 本次的学习时长
"content": "学习课程【"+this.courseInfo.name+"】",//事件的内容
"objId": this.courseInfo.id,//课程的id
"objType": "1",//类型
"source":"page",
"objInfo": ""+this.courseInfo.name,
"aid":this.userInfo.aid, //当前登录人的id
"aname":this.userInfo.name,//当前人的姓名
"status": 1 //状态
}
//静默处理
apiStat.sendEvent(postData).then(rs=>{
if(rs.status == 200) {
this.appendStartTime = new Date();//重新计时
studyUtil.clearStudyDuration(); //清除本地存储
} else {
console.log(rs.message);
}
});
}
},
//结束追加学习时长
stopStudyTime(){
//console.log('停止追加学习时长');
this.isAppendTime=false;
if (this.appendHandle != null) {
window.clearTimeout(this.appendHandle);
}
},
//追加学习时长， flag是否提交到后台
appendStudyTime() {
//console.log('开始追加学习时长',this.isAppendTime);
if (this.studyId == '') {
return;
}
if (!this.curContent.id) {
return;
}
//清除之前的
if(this.appendHandle != null) {
window.clearTimeout(this.appendHandle);
}
if (!this.isAppendTime) {
this.appendStartTime = null;
return;
}
//首先从本地读取
let duration = studyUtil.getStudyDuration();
//console.log('追加学习时长，当前本地积累的学习时长='+duration);
//追加学习长
let $this = this;
if (this.appendStartTime == null) {
this.appendStartTime = new Date();
this.appendHandle = setTimeout(function() {
$this.appendStudyTime();
}, $this.appentInterval); //设置定时追加学习时长
//保存之前的
if (duration >0 ) {
this.saveStudyDuration(duration);
}
return;
}
//如果当前追加开始时间不为空
let now = new Date();
let m = now.getTime() - this.appendStartTime.getTime(); //相差的毫秒数
let sen = parseInt(m / 1000); //计算秒数
duration = duration + $this.appentInterval/1000;//追加的是秒
if (sen>=60) { //一分钟保存一次
this.saveStudyDuration(duration);
} else {
studyUtil.setStudyDuration(duration); //添加到本地存储中
}
//启动下次追加学习时长
this.appendHandle = setTimeout(function() {
$this.appendStudyTime();
}, $this.appentInterval);
},
appendStudyOtherTime() { //非音视频课学习时长的增加,每一分钟保存一次 appendStudyOtherTime() { //非音视频课学习时长的增加,每一分钟保存一次
//console.log('开始追加学习时长',this.isAppendTime); //console.log('开始追加学习时长',this.isAppendTime);
if (this.studyId == '') { if (this.studyId == '') {
return; return;
} }
if (!this.contentData.id) {
if (!this.curContent.id) {
return; return;
} }
let postData={ let postData={
@@ -1087,9 +1173,9 @@
} }
this.touchNum = 0 this.touchNum = 0
},250) },250)
}, },
saveStudyItem(){ //先保存学习的内容,针对于音视频的内容 //先保存学习的内容,针对于音视频的内容
saveStudyItem(){
if(this.curContent.studyItemId) { if(this.curContent.studyItemId) {
return;//已经有记录的，不需要再保存了 return;//已经有记录的，不需要再保存了
} }
@@ -1174,39 +1260,39 @@
}, 200); }, 200);
}, },
onPlayerPlay(){ onPlayerPlay(){
this.isPlaying = true; this.isPlaying = true;
this.videoPlayingTime=0; this.videoPlayingTime=0;
// console.log("开始播放"); // console.log("开始播放");
this.playerBoxShow=false; this.playerBoxShow=false;
this.isAppendTime=false; this.isAppendTime=true;//可以追加学习时长
this.videoSpeed=studyUtil.getVideoSpeed(); this.videoSpeed=studyUtil.getVideoSpeed();
this.videoPlayer.playbackRate(this.videoSpeed); this.videoPlayer.playbackRate(this.videoSpeed);
this.videoPlayer.play(); this.videoPlayer.play();
let $this=this; this.appendStudyTime();//开始追加学习时长
if(this.curContent.status<9){ let $this=this;
let completeType=this.curriculumData.completeSetup; if(this.curContent.status<9){
//console.log(completeType,'completeType'); let completeType=this.curriculumData.completeSetup;
if(completeType==0){ //console.log(completeType,'completeType');
//默认5秒后学习完成. if(completeType==0){
$this.handleTimeout= setTimeout(function() {$this.saveStudyInfo();}, 5000); //5秒后记录学习完成 //默认5秒后学习完成.
}else{ //$this.handleTimeout= setTimeout(function() {$this.saveStudyInfo();}, 5000); //5秒后记录学习完成
//先记录进行中的学习内容 }else{
this.saveStudyItem(); //先记录进行中的学习内容
} this.saveStudyItem();
} }
}
}, },
onPlayerPause(){ onPlayerPause(){
this.isPlaying = false; this.isPlaying = false;
this.videoPlayer.pause(); this.videoPlayer.pause();
this.stopStudyTime();
}, },
onPlayerEnded(){ onPlayerEnded(){
this.playerBoxShow=true; this.playerBoxShow=true;
//console.log("播放结束"); this.stopStudyTime();
//this.isAppendTime=true;//开启追 if(this.curContent.status<9){
//加学习时间 this.finishStudyItem();
if(this.curContent.status<9){ }
this.finishStudyItem();
}
}, },
changeSpeed(e) { changeSpeed(e) {
// 获取选择的倍速 // 获取选择的倍速
@@ -1239,7 +1325,6 @@
}, },
onPlayerPlaying(e){ onPlayerPlaying(e){
//console.log("当前播放11",itme); //console.log("当前播放11",itme);
this.isAppendTime=false;//禁止追加学习时间
//console.log("当前播放11"+itme); //console.log("当前播放11"+itme);
let intTime=parseInt(e.detail.currentTime); let intTime=parseInt(e.detail.currentTime);
if(intTime>this.videoPlayingTime){ if(intTime>this.videoPlayingTime){
@@ -1259,7 +1344,7 @@
if(percent>=finishPercent){ if(percent>=finishPercent){
this.finishStudyItem(); this.finishStudyItem();
} }
}else if(completeType==2){ }else{
if(intTime>=completeSecond){ if(intTime>=completeSecond){
this.finishStudyItem(); this.finishStudyItem();
} }
@@ -1286,29 +1371,33 @@
} }
}, },
audioPlay(){ audioPlay(){
this.isAppendTime=false; this.isAppendTime=true;//开始记录音视频的学习时长
let $this=this; this.appendStudyTime();//开始追加学习时长
if(this.curContent.status<9){ // let $this=this;
let completeType=this.curriculumData.completeSetup; // if(this.curContent.status<9){
//console.log(completeType,'completeType'); // let completeType=this.curriculumData.completeSetup;
if(completeType==0){ // //console.log(completeType,'completeType');
//默认5秒后学习完成. // if(completeType==0){
$this.handleTimeout= setTimeout(function() {$this.saveStudyInfo();}, 5000); //5秒后记录学习完成 // //默认5秒后学习完成.
}else{ // $this.handleTimeout= setTimeout(function() {$this.saveStudyInfo();}, 5000); //5秒后记录学习完成
//先记录进行中的学习内容 // }else{
this.saveStudyItem(); // //先记录进行中的学习内容
} // this.saveStudyItem();
} // }
// }
}, },
audioEnd(){ audioEnd(){
this.stopStudyTime();
if(this.curContent.status<9){ if(this.curContent.status<9){
this.finishStudyItem(); this.finishStudyItem();
} }
}, },
audioPause(){ audioPause(){
this.stopStudyTime();
}, },
audioPlaying(e,second){ audioPlaying(e,second){
this.isAppendTime=false;//禁止追加学习时间 this.isAppendTime=true;//打开追加载学习时长
let intTime=second;//当前播放时间 let intTime=second;//当前播放时间
let videDuration=e.duration;//音频总时长，秒 let videDuration=e.duration;//音频总时长，秒
if(!videDuration){ if(!videDuration){
@@ -1321,17 +1410,17 @@
completeSecond=5;//如果没有就采用默认的时间了 completeSecond=5;//如果没有就采用默认的时间了
} }
if(completeType>0 && this.curContent.status<9){ //因为1按进度，2按时长都是计算时间，所以这里直接大于0处理 if(completeType>0 && this.curContent.status<9){ //因为1按进度，2按时长都是计算时间，所以这里直接大于0处理
if(completeType==1){ if(completeType==1){
let finishPercent=this.curriculumData.setupTage; let finishPercent=this.curriculumData.setupTage;
let percent =intTime*100/videDuration; let percent =intTime*100/videDuration;
if(percent>=finishPercent){ if(percent>=finishPercent){
this.finishStudyItem(); this.finishStudyItem();
} }
}else if(completeType==2){ }else{
if(intTime>=completeSecond){ if(intTime>=completeSecond){
this.finishStudyItem(); this.finishStudyItem();
} }
} }
} }
//以下是每隔10秒存储一下进度 //以下是每隔10秒存储一下进度
let saveTime=Math.floor(intTime%10); let saveTime=Math.floor(intTime%10);
@@ -1366,8 +1455,10 @@
studyId: this.studyId,//学习id, studyId: this.studyId,//学习id,
courseId: this.courseId,//课程id, courseId: this.courseId,//课程id,
contentId: this.curContent.id,//内容id, contentId: this.curContent.id,//内容id,
contentType: this.curContent.contentType,
contentName: this.curContent.contentName,//内容名称 contentName: this.curContent.contentName,//内容名称
progress: 100, progress: 100,
status: 9,
contentTotal:this.totalContent contentTotal:this.totalContent
} }
apiCourseStudy.studyContent(params).then(res=>{ apiCourseStudy.studyContent(params).then(res=>{
@@ -1499,7 +1590,8 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
.cinfo-btn{ .cinfo-btn{
margin:30upx 60upx; margin:30upx 80upx;
color:#999999;
} }
} }
} }

2
utils/study.js
View File

@@ -3,7 +3,7 @@ const studyDurationKey='xus_duration';
const studyVideoSpeedKey='xus_video_speed'; const studyVideoSpeedKey='xus_video_speed';
const studyVideoKeyPre='xus_video'; const studyVideoKeyPre='xus_video';
/**保存播放速度*/
const setVideoSpeed=function(speed){ const setVideoSpeed=function(speed){
uni.setStorageSync(studyVideoSpeedKey,speed); uni.setStorageSync(studyVideoSpeedKey,speed);
} }