Skip to content

C
CFFP-HB
Commit ad554b2e by kyle
Options

播放轨迹

parent adb90dc7
Showing with 44 additions and 16 deletions
pages/courseDetail/courseDetail.vue
...@@ -12,7 +12,6 @@ ...@@ -12,7 +12,6 @@
</view> </view>
<view class="" style="width: 50rpx;height: 50rpx;padding-right: 20rpx;"> <view class="" style="width: 50rpx;height: 50rpx;padding-right: 20rpx;">
<image class="image" @click="reinvite" src="../../static/fastentry/Slice122.png" mode=""></image> <image class="image" @click="reinvite" src="../../static/fastentry/Slice122.png" mode=""></image>
</view> </view>
<view class="" style="width: 50rpx;height: 50rpx; "> <view class="" style="width: 50rpx;height: 50rpx; ">
<image class="image" @click="shareToggle" src="../../static/fastentry/Slice12.png" mode=""></image> <image class="image" @click="shareToggle" src="../../static/fastentry/Slice12.png" mode=""></image>
...@@ -22,7 +21,7 @@ ...@@ -22,7 +21,7 @@
<!-- 课程banner图 --> <!-- 课程banner图 -->
<!-- v-show="!sliceshare" --> <!-- v-show="!sliceshare" -->
<view class="courseBannerBox" v-if="!sliceshare"> <view class="courseBannerBox" v-if="!sliceshare">
<video v-if="isRenderVideo" id="myVideo" :src="courseInfo.filePathOss" :initial-time="initialTimev" <video v-if="isRenderVideo" id="myVideo" :src="courseInfo.filePathOss" :initial-time="viewTime"
object-fit="contain" class="videoBox" :poster="courseInfo.fileFirstImage" object-fit="contain" class="videoBox" :poster="courseInfo.fileFirstImage"
:title="courseInfo.fileTitle" @loadedmetadata="loadedmetadata" @play="playVideo" @pause="pause" :title="courseInfo.fileTitle" @loadedmetadata="loadedmetadata" @play="playVideo" @pause="pause"
@ended="ended" @timeupdate="timeupdate" style="width: 100vw;height: 320rpx;"></video> @ended="ended" @timeupdate="timeupdate" style="width: 100vw;height: 320rpx;"></video>
...@@ -32,7 +31,7 @@ ...@@ -32,7 +31,7 @@
<view class="courseTitleContent"> <view class="courseTitleContent">
<view class="courseTitle"> <view class="courseTitle">
<view class="" style="width: 70%;"> <view class="" style="width: 70%;">
<h4>{{courseInfo.fileTitle}}---{{videoPlaybackInfo.viewTime}}---{{initialTimev}}</h4> <h4>{{courseInfo.fileTitle}}{{viewTime}}</h4>
</view> </view>
<view class="shareF"> <view class="shareF">
<view class="awakenApp" @click="jumpapp()" v-if="coursesharing == 1"> <view class="awakenApp" @click="jumpapp()" v-if="coursesharing == 1">
...@@ -141,6 +140,7 @@ ...@@ -141,6 +140,7 @@
}, },
data() { data() {
return { return {
isPauseFlag:true,
isRenderVideo: false, isRenderVideo: false,
fileId: null, fileId: null,
lecturerId: null, lecturerId: null,
...@@ -172,7 +172,6 @@ ...@@ -172,7 +172,6 @@
shareCode: null, shareCode: null,
sharelogin: false, sharelogin: false,
startTime: '', startTime: '',
initialTimev:0
}; };
}, },
methods: { methods: {
...@@ -331,6 +330,7 @@ ...@@ -331,6 +330,7 @@
}, },
// 课程详情页面 // 课程详情页面
courseDetail() { courseDetail() {
console.log('courseDetail')
api.courseDetail({ api.courseDetail({
fileId: this.fileId, fileId: this.fileId,
userId: this.coursesharing == '1' ? uni.getStorageSync('h5_userId') : uni.getStorageSync( userId: this.coursesharing == '1' ? uni.getStorageSync('h5_userId') : uni.getStorageSync(
...@@ -341,11 +341,12 @@ ...@@ -341,11 +341,12 @@
this.courseInfo = res['data']['data']; this.courseInfo = res['data']['data'];
this.lecturerId = res['data']['data']['fileLecturerId']; this.lecturerId = res['data']['data']['fileLecturerId'];
this.lecturerQuery(); this.lecturerQuery();
this.relatedCoursesList();
if (uni.getStorageSync('h5_coursesharing')) { if (uni.getStorageSync('h5_coursesharing')) {
this.coursesharing = uni.getStorageSync('h5_coursesharing') this.coursesharing = uni.getStorageSync('h5_coursesharing')
this.getshareData() this.getshareData()
} }
if (this.courseInfo.status === 2) { if (this.courseInfo.status == 2) {
this.findVideoPlayback(); this.findVideoPlayback();
}else{ }else{
this.isRenderVideo = true; this.isRenderVideo = true;
...@@ -374,6 +375,8 @@ ...@@ -374,6 +375,8 @@
return dataHandling.secondsTransferPipe(value) return dataHandling.secondsTransferPipe(value)
}, },
async play(item) { async play(item) {
console.log('play')
// 相关列表点击播放
if (this.courseInfo.status == 1) { if (this.courseInfo.status == 1) {
// 不可播放 // 不可播放
uni.showToast({ uni.showToast({
...@@ -382,14 +385,26 @@ ...@@ -382,14 +385,26 @@
duration: 2000 duration: 2000
}); });
} else { } else {
this.videoContext.pause();
if(this.fileId != item.fileId){
if(!this.isPauseFlag){
await this.saveVideoPlayback(); await this.saveVideoPlayback();
}
console.log('保存之后执行这里')
// 当点击的课程和当前播放的课程不一致时，执行此方法
uni.showLoading({
title: '加载中'
});
this.playbackId = null; this.playbackId = null;
this.fileId = item.fileId; this.fileId = item.fileId;
this.courseInfo.packFileId = item.packFileId; this.courseInfo.packFileId = item.packFileId;
this.courseDetail() this.courseDetail()
} }
}
}, },
saveVideoPlayback() { saveVideoPlayback() {
console.log('saveVideoPlayback')
return new Promise((resolve,reject)=>{
// 视频播放轨迹保存 // 视频播放轨迹保存
const param = { const param = {
id: this.playbackId ? this.playbackId : null, id: this.playbackId ? this.playbackId : null,
...@@ -401,17 +416,18 @@ ...@@ -401,17 +416,18 @@
viewTime: Math.floor(this.viewTime), viewTime: Math.floor(this.viewTime),
playbackStatus: this.viewTime >= this.totalTime ? '2' : '1' playbackStatus: this.viewTime >= this.totalTime ? '2' : '1'
} }
return new Promise((resolve,reject)=>{
api.saveVideoPlayback(param).then(res => { api.saveVideoPlayback(param).then(res => {
if (res['success']) { if (res['success']) {
this.playbackId = res['data']['id']; this.playbackId = res['data']['id'];
resolve() console.log('执行了保存成功，入参=======',param)
console.log('执行保存了===========',param.viewTime) resolve();
} }
}) })
}) })
}, },
findVideoPlayback() { findVideoPlayback() {
console.log('findVideoPlayback')
// 查询视频播放最新记录 // 查询视频播放最新记录
const param = { const param = {
systemType: 1, systemType: 1,
...@@ -422,20 +438,30 @@ ...@@ -422,20 +438,30 @@
api.findVideoPlayback(param).then(res => { api.findVideoPlayback(param).then(res => {
if (res['success']) { if (res['success']) {
this.videoPlaybackInfo = res['data']; this.videoPlaybackInfo = res['data'];
this.initialTimev = this.videoPlaybackInfo.viewTime; console.log('查询视频播放轨迹结果=====',this.videoPlaybackInfo)
if(this.videoPlaybackInfo.viewTime < this.videoPlaybackInfo.totalTime){
this.viewTime = this.videoPlaybackInfo.viewTime;
this.totalTime = this.videoPlaybackInfo.totalTime;
}else{
this.totalTime = this.viewTime = 0;
}
this.isRenderVideo = true; this.isRenderVideo = true;
this.$forceUpdate();
}else{ }else{
this.isRenderVideo = true; this.isRenderVideo = true;
this.totalTime = this.viewTime = 0;
} }
// 跳转到指定位置
this.videoContext.seek(this.viewTime);
uni.hideLoading();
}) })
}, },
loadedmetadata(e) {
this.totalTime = e.detail.duration;
},
playVideo(e) { playVideo(e) {
if(this.videoPlaybackInfo.viewTime >= this.videoPlaybackInfo.totalTime){ console.log('playVideo')
this.videoPlaybackInfo.viewTime = 0; this.isPauseFlag = false;
console.log(this.viewTime,this.totalTime)
if(this.viewTime>=this.totalTime){
this.viewTime = 0;
this.videoContext.seek(this.viewTime);
} }
// 开始/继续播放 // 开始/继续播放
if (this.courseInfo.status === 2) { if (this.courseInfo.status === 2) {
...@@ -448,6 +474,8 @@ ...@@ -448,6 +474,8 @@
} }
}, },
pause(e) { pause(e) {
console.log('pause')
this.isPauseFlag = true;
// 暂停播放 // 暂停播放
if (this.timer) { if (this.timer) {
clearInterval(this.timer) clearInterval(this.timer)
...@@ -460,6 +488,7 @@ ...@@ -460,6 +488,7 @@
} }
}, },
ended(e) { ended(e) {
console.log('ended')
// 播放到末尾 // 播放到末尾
if (this.timer) { if (this.timer) {
clearInterval(this.timer) clearInterval(this.timer)
...@@ -542,7 +571,6 @@ ...@@ -542,7 +571,6 @@
let dataForm = uni.getStorageSync('userinfodataForm') let dataForm = uni.getStorageSync('userinfodataForm')
this.realName = dataForm.realName this.realName = dataForm.realName
// this.switchTab(1);
}, },
onShow() { onShow() {
this.switchTab(1); this.switchTab(1);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment