974 lines
33 KiB
Vue
974 lines
33 KiB
Vue
<template>
|
||
<view>
|
||
<cu-custom ref="cuCustom" bgColor="bg-gradual-blueness" :isBack="true" :isRingt="true" :backUrl="backUrl">
|
||
<block slot="backText">返回</block>
|
||
<block slot="content">学习详细</block>
|
||
</cu-custom>
|
||
<view v-show="isNoPass" class="waring">
|
||
<text>人脸识别失败，无法视频播放视频！</text>
|
||
</view>
|
||
<view v-if="TabCur == 0" class="svideo">
|
||
<!-- <video v-if="movie.poster" id="coursewareVideo" style="width: 100%;" :src="movie.src" :poster="movie.poster" :show-progress="false"-->
|
||
<!-- :enable-progress-gesture="false" direction="-90" :initial-time="playTime" @play="onPlayerPlay($event)"-->
|
||
<!-- @pause="onPlayerPause($event)" @ended="onPlayerEnded($event)" @timeupdate="onPlayerTimeupdate($event)"></video>-->
|
||
<view id="fixed">
|
||
<web-view-video
|
||
v-if="movie.src"
|
||
ref="video"
|
||
:src="movie.src"
|
||
:poster="movie.poster"
|
||
:play-time="Number(serverVideoPlayTime)"
|
||
@timeupdate="onPlayerTimeupdate"
|
||
@pause="fnPause"
|
||
@play="fnPlay"
|
||
@ended="fnEnded"
|
||
/>
|
||
</view>
|
||
</view>
|
||
<view class="sdetail">
|
||
<scroll-view scroll-x class="bg-white nav text-center" scroll-with-animation :scroll-left="scrollLeft">
|
||
<view class="cu-item " :class="index==TabCur?'text-blue cur':''" v-for="(item,index) in tabNav" :key="index"
|
||
@tap="tabSelect"
|
||
:data-id="index">
|
||
{{ item.name }}
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<block v-if="TabCur==0">
|
||
<view v-if="pd.VIDEOLIST.length>0">
|
||
<view class="tcl_box" v-for="(item,index) in pd.VIDEOLIST" :key="item.COURSEWAREID">
|
||
<view class="tcl_item">
|
||
<view class="sleft">
|
||
<text class=" cuIcon-videofill mr10"
|
||
:class="item.COURSEWAREID == currentCoursewareID ? 'text-blue' : 'text-grey'"></text>
|
||
<text @click="$noMultipleClicks(fnVideoSwitching,index)" class="text-title">{{
|
||
item.COURSEWARENAME
|
||
}}
|
||
</text>
|
||
<text v-show="item.PLAYCOUNT>0" class="text-green">(已学习)</text>
|
||
</view>
|
||
<view class="tcl_time">
|
||
<view class="tcl_text">
|
||
<text class="mr20">{{ item.VIDEOTIMEFORMAT }}</text>
|
||
<text v-if="item.VIDEOTIME != 0">已学{{ item.VIDEOPROGRESS }}%</text>
|
||
</view>
|
||
<button class="cu-btn bg-orange round sm" @click="$noMultipleClicks(goStudyQuestion,item)">习题练习
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!--<view class="svideol" v-for="(item,index) in pd.VIDEOLIST" :key="item.COURSEWAREID">
|
||
<view class="sitem">
|
||
<view class="sleft">
|
||
<text v-if="item.COURSEWAREID == currentCoursewareID" class="text-blue cuIcon-videofill mr10"></text>
|
||
<text @click="$noMultipleClicks(studyVideo,index)">{{item.COURSEWARENAME}}</text>
|
||
<text v-show="item.PLAYCOUNT>0" class="text-green">(已学习)</text>
|
||
</view>
|
||
<view class="sright">
|
||
<button class="cu-btn bg-green round sm" @click="$noMultipleClicks(goStudyQuestion,item)">习题练习</button>
|
||
</view>
|
||
</view>
|
||
</view>-->
|
||
</view>
|
||
<view v-else-if="dataFlag=='noData'" class="dy-null">
|
||
<view class="dy-null-img">
|
||
<image src="../../../static/null.png" mode=""></image>
|
||
</view>
|
||
<view class="dy-null-title">
|
||
暂无数据
|
||
</view>
|
||
</view>
|
||
<view class="cu-tabbar-height"></view>
|
||
</block>
|
||
|
||
<block v-if="TabCur==1">
|
||
<view v-if="pd.DATALIST.length>0">
|
||
<view class="svideol" v-for="(item,index) in pd.DATALIST" :key="item.COURSEWAREID">
|
||
<view class="sitem">
|
||
<view class="sleft">
|
||
<text class="text-blue cuIcon-newsfill mr10"></text>
|
||
<!-- <text class="text-red">(必修)</text>-->
|
||
<text @click="$noMultipleClicks(studyData,index)">{{ item.COURSEWARENAME }}</text>
|
||
<text v-show="item.PLAYCOUNT>0" class="text-green">(已学习)</text>
|
||
</view>
|
||
<view class="sright">
|
||
<button class="cu-btn bg-green round sm" @click="$noMultipleClicks(goStudyQuestion,item)">习题练习
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view v-else-if="dataFlag=='noData'" class="dy-null">
|
||
<view class="dy-null-img">
|
||
<image src="../../../static/null.png" mode=""></image>
|
||
</view>
|
||
<view class="dy-null-title">
|
||
暂无数据
|
||
</view>
|
||
</view>
|
||
<view class="cu-tabbar-height"></view>
|
||
</block>
|
||
<view class="bottom-fixed">
|
||
<button class="cu-btn bg-green lg" @click="$noMultipleClicks(goExam)">课程考试</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
basePath,
|
||
baseImgPath,
|
||
loginUser
|
||
} from '@/common/tool.js';
|
||
import WebViewVideo from './web_view_video.vue'
|
||
|
||
let throttleTimer;
|
||
let throttleFlag;
|
||
// 人脸识别定时器
|
||
let faceAuthTimer;
|
||
export default {
|
||
components: {
|
||
WebViewVideo,
|
||
},
|
||
data() {
|
||
return {
|
||
baseImgPath: baseImgPath,
|
||
backUrl: '/pages/application/onlinexxks/my-tasks',
|
||
loading: false,
|
||
sTop: 0,
|
||
totalHeight: 0,
|
||
tabNav: [{
|
||
name: '视频课件'
|
||
},
|
||
{
|
||
name: '资料课件'
|
||
}
|
||
],
|
||
TabCur: 0,
|
||
scrollLeft: 0,
|
||
noClick: true,
|
||
coursewareIntroduce: '课程课件介绍',
|
||
STAGESTUDENTRELATION_ID: '',
|
||
// videoId
|
||
coursewareFiles: '',
|
||
coursewareCapture: '',
|
||
list: [],
|
||
pd: {
|
||
STUDYTASK_ID: '',
|
||
STUDY_NAME: '',
|
||
COURSEWARE_COUNT: 0,
|
||
STAGEEXAMPAPER_ID: '',
|
||
EXAMNAME: '',
|
||
EXAMTIME: '',
|
||
ANSWERSHEETTIME: '',
|
||
EXAMSCORE: '',
|
||
QUESTIONNUM: '',
|
||
EXAMSTATE: '',
|
||
PASSSCORE: '',
|
||
STAGEEXAMSTATE: '',
|
||
STAGEEXAMSCORE: '',
|
||
COMPLETE_COURSEWARE: 0,
|
||
VIDEOLIST: [],
|
||
DATALIST: [],
|
||
}, // 数据,
|
||
// 当前播放课件
|
||
currentCoursewareListIndex: 0,
|
||
currentCoursewareID: '',
|
||
currentCurriculumID: '',
|
||
videoRecord: {},
|
||
movie: {
|
||
'id': 0,
|
||
'title': '课件名称',
|
||
'src': '', //视频地址
|
||
'poster': '', //封面地址
|
||
'actors': '主讲人',
|
||
'desc': '课件简介'
|
||
},
|
||
dataFlag: 'noData',
|
||
// 人脸倒计时
|
||
randomTime: 0,
|
||
isNoPass: false,
|
||
showTitle: true,
|
||
// 服务器存入的视频播放时间
|
||
serverVideoPlayTime: 0,
|
||
// 当前视频播放进度
|
||
changeVideoPlayTime: 0,
|
||
submitTimeWaitForCount: 0, // 提交时间等待次数
|
||
}
|
||
},
|
||
// 初始化页面用
|
||
async onLoad(event) {
|
||
this.STAGESTUDENTRELATION_ID = event.STAGESTUDENTRELATION_ID
|
||
await this.fnGetData()
|
||
// 人脸识别后的
|
||
// if (event.isNoPass) {
|
||
// this.isNoPass = event.isNoPass
|
||
// }
|
||
// if (event.showTitle) {
|
||
// this.showTitle = false;
|
||
// }
|
||
// // 人脸识别后的
|
||
// if (event.FACED) {
|
||
// this.currentCoursewareID = event.CURRENTCOURSEWAREID
|
||
// this.currentCurriculumID = event.CURRICULUM_ID
|
||
// this.currentCoursewareListIndex = event.COURSEWAREINDEX
|
||
// await this.fnGetData()
|
||
// this.$forceUpdate()
|
||
// } else {
|
||
// await this.goFaceRecognition(0)
|
||
// }
|
||
},
|
||
onBackPress() {
|
||
if (this.timer) {
|
||
clearInterval(this.timer)
|
||
this.timer = null
|
||
}
|
||
this.$refs.cuCustom.BackPage()
|
||
return true
|
||
},
|
||
beforeDestroy() {
|
||
this.fnClearInterval()
|
||
},
|
||
onUnload() {
|
||
this.fnClearInterval()
|
||
// 如果定时器在运行则关闭
|
||
// this.saveVideoRecord(0, this.changeVideoPlayTime)
|
||
if (this.timer) {
|
||
clearInterval(this.timer)
|
||
this.timer = null
|
||
}
|
||
},
|
||
methods: {
|
||
// 异步调用 CORPINFO_ID,USER_ID
|
||
post(url, data) {
|
||
return new Promise((resolve, reject) => {
|
||
if (data && data.loading !== false) {
|
||
uni.showLoading({
|
||
title: "加载中",
|
||
});
|
||
}
|
||
uni.request({
|
||
url: basePath + url,
|
||
data: {
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
...data,
|
||
},
|
||
method: "POST",
|
||
header: {
|
||
"Content-type": "application/x-www-form-urlencoded",
|
||
},
|
||
success: (res) => {
|
||
if (res.statusCode !== 200) {
|
||
uni.showToast({
|
||
title: "网络错误请重试," + res.statusCode,
|
||
icon: "error",
|
||
duration: 2000,
|
||
});
|
||
}
|
||
if (data && data.loading !== false) {
|
||
uni.hideLoading();
|
||
}
|
||
if (res.data.result === "success") {
|
||
resolve(res.data);
|
||
} else {
|
||
uni.showToast({
|
||
title: res.data.msg || "系统开小差了",
|
||
icon: "none",
|
||
duration: 2000,
|
||
});
|
||
reject(res.data);
|
||
}
|
||
},
|
||
fail: (err) => {
|
||
if (data && data.loading !== false) {
|
||
uni.hideLoading();
|
||
}
|
||
uni.showToast({
|
||
title: "网络错误请重试",
|
||
icon: "none",
|
||
duration: 2000,
|
||
});
|
||
reject(err);
|
||
},
|
||
});
|
||
});
|
||
},
|
||
|
||
async fnGetData() {
|
||
uni.showLoading({
|
||
title: '请稍候'
|
||
})
|
||
const resData = await this.post('/app/stagestudentrelation/getMyTask', {
|
||
STAGESTUDENTRELATION_ID: this.STAGESTUDENTRELATION_ID,
|
||
});
|
||
this.pd = resData.pd;
|
||
this.pd.VIDEOLIST.forEach((ele) => {
|
||
if (ele.VIDEOTIME == 0) {
|
||
ele.VIDEOTIMEFORMAT = ''
|
||
ele.VIDEOPROGRESS = ''
|
||
} else {
|
||
ele.VIDEOTIMEFORMAT = this.formatVideoTime(ele.VIDEOTIME)
|
||
this.operatVideoList(ele)
|
||
}
|
||
})
|
||
// 默认播放第一个，此时currentCoursewareListIndex默认是0，人脸识别后这个值会变
|
||
this.currentCoursewareID = this.pd.VIDEOLIST?.[this.currentCoursewareListIndex].COURSEWAREID
|
||
this.currentCurriculumID = this.pd.VIDEOLIST?.[this.currentCoursewareListIndex].CURRICULUMID
|
||
this.$forceUpdate()
|
||
// 获取播放地址，设置播放时间
|
||
await this.fnGetVideoPlayInfo(
|
||
this.pd.VIDEOLIST?.[this.currentCoursewareListIndex].COURSEWAREFILES,
|
||
this.pd.VIDEOLIST?.[this.currentCoursewareListIndex].COURSEWAREID
|
||
)
|
||
uni.hideLoading();
|
||
|
||
},
|
||
// 获取视频详情，封面与路径
|
||
async fnGetVideoPlayInfo(videoId, courseware_id) {
|
||
const resData = await this.post('/app/audioOrVideo/getPlayInfo', {
|
||
videoId: videoId,
|
||
CURRICULUM_ID: this.currentCurriculumID,
|
||
VIDEOCOURSEWARE_ID: courseware_id,
|
||
});
|
||
if (!resData.PLAYURL) {
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "检测到课件切换过于频繁！退出视频播放！",
|
||
confirmText: "退出视频播放",
|
||
cancelText: "确定",
|
||
success: (res) => {
|
||
uni.navigateBack();
|
||
}
|
||
})
|
||
return
|
||
}
|
||
await this.fnGetVideoPlayProgress(resData.PLAYURL, resData.COVERURL);
|
||
},
|
||
// 获取视频播放进度
|
||
async fnGetVideoPlayProgress(PLAYURL, COVERURL) {
|
||
const resData = await this.post('/app/coursestudyvideorecord/getVideoProgress', {
|
||
STUDYTASK_ID: this.pd.STUDYTASK_ID,
|
||
CURRICULUM_ID: this.currentCurriculumID,
|
||
VIDEOCOURSEWARE_ID: this.currentCoursewareID,
|
||
});
|
||
// 没有 存一次
|
||
if (!resData.pd.RESOURCETIME) {
|
||
await this.fnSubmitPlayTime("0", 0);
|
||
}
|
||
this.serverVideoPlayTime = Math.floor(resData.pd.RESOURCETIME) || 0
|
||
console.log('获取到当前视频进度' + this.serverVideoPlayTime)
|
||
this.movie.src = PLAYURL;
|
||
this.movie.poster = COVERURL;
|
||
console.log('获取到当前视频路径' + this.movie.src)
|
||
this.$forceUpdate()
|
||
// 开启 人脸定时扫 任务
|
||
},
|
||
// 保存视频进度
|
||
async fnSubmitPlayTime(isEnd, time) {
|
||
const resData = await this.post('/app/coursestudyvideorecord/save', {
|
||
CURRICULUM_ID: this.currentCurriculumID,
|
||
VIDEOCOURSEWARE_ID: this.currentCoursewareID,
|
||
STUDYTASK_ID: this.pd.STUDYTASK_ID,
|
||
RESOURCETIME: time,
|
||
IS_END: isEnd,
|
||
TYPE: 1,
|
||
});
|
||
this.videoRecord = resData.pd
|
||
if (isEnd == 1) {
|
||
this.pd.COMPLETE_COURSEWARE = resData.pd.COMPLETE_COURSEWARE
|
||
this.pd.VIDEOLIST[this.currentCoursewareListIndex].PLAYCOUNT = resData.pd.PLAYCOUNT
|
||
this.changeOperatVideoList(this.pd.VIDEOLIST[this.currentCoursewareListIndex])
|
||
}
|
||
this.$forceUpdate()
|
||
// this.changeOperatVideoList(this.pd.VIDEOLIST[this.currentCoursewareListIndex])
|
||
},
|
||
// 防抖
|
||
throttle(func, wait = 500, immediate = true) {
|
||
if (immediate) {
|
||
if (!throttleFlag) {
|
||
throttleFlag = true
|
||
// 如果是立即执行，则在wait毫秒内开始时执行
|
||
typeof func === 'function' && func()
|
||
throttleTimer = setTimeout(() => {
|
||
throttleFlag = false
|
||
}, wait)
|
||
}
|
||
} else if (!throttleFlag) {
|
||
throttleFlag = true
|
||
// 如果是非立即执行，则在wait毫秒内的结束处执行
|
||
throttleTimer = setTimeout(() => {
|
||
throttleFlag = false
|
||
typeof func === 'function' && func()
|
||
}, wait)
|
||
}
|
||
},
|
||
// 当前播放位置发生变化时触发。 只有
|
||
onPlayerTimeupdate(event) {
|
||
this.throttle(async () => {
|
||
this.changeOperatVideoList(this.pd.VIDEOLIST[this.currentCoursewareListIndex])
|
||
this.changeVideoPlayTime = event;
|
||
if (event - this.serverVideoPlayTime >= 5) {
|
||
this.serverVideoPlayTime = event;
|
||
this.submitTimeWaitForCount = ++this.submitTimeWaitForCount;
|
||
}
|
||
if (this.submitTimeWaitForCount === 6) {
|
||
this.submitTimeWaitForCount = 0;
|
||
await this.fnSubmitPlayTime("0", event);
|
||
}
|
||
}, 1000);
|
||
},
|
||
fnClearInterval() {
|
||
faceAuthTimer && clearInterval(faceAuthTimer);
|
||
faceAuthTimer = null;
|
||
},
|
||
fnEnded() {
|
||
if (this.changeVideoPlayTime - this.serverVideoPlayTime >= 10) {
|
||
uni.navigateBack();
|
||
return;
|
||
}
|
||
this.changeVideoPlayTime = 0;
|
||
this.fnSubmitPlayTime("1", 0);
|
||
|
||
// this.fnClearInterval();
|
||
},
|
||
fnPlay() {
|
||
// this.fnClearInterval();
|
||
// if (this.randomTime === 0) {
|
||
// // 十分钟后 进行人脸
|
||
// this.randomTime = new Date().getTime() + 60 * 1000 * 10;
|
||
// }
|
||
// faceAuthTimer = setInterval(async () => {
|
||
// if (new Date().getTime() >= this.randomTime) {
|
||
// // 到人脸识别的时候了
|
||
// this.fnClearInterval();
|
||
// this.$refs.video && this.$refs.video.fn('fullscreen.exit')
|
||
// this.movie.src = ''
|
||
// this.movie.poster = ''
|
||
// this.randomTime = 0;
|
||
// await this.fnSubmitPlayTime("0", this.changeVideoPlayTime);
|
||
// await this.goFaceRecognition(this.currentCoursewareListIndex);
|
||
// }
|
||
// }, 1000);
|
||
},
|
||
// 视频暂停
|
||
async fnPause() {
|
||
await this.fnSubmitPlayTime("0", this.changeVideoPlayTime);
|
||
// this.fnClearInterval();
|
||
},
|
||
// 切换课件
|
||
async fnVideoSwitching(index) {
|
||
var item = this.pd.VIDEOLIST[index]
|
||
//播放视频不是同一个的时候
|
||
if (this.currentCoursewareID != item.COURSEWAREID) {
|
||
this.movie.src = "";
|
||
this.movie.poster = "";
|
||
this.submitTimeWaitForCount = 0;
|
||
this.$forceUpdate()
|
||
this.$refs.video && this.$refs.video.fn('destroy')
|
||
// 当前播放时间 存起来
|
||
if (this.changeVideoPlayTime !== 0) {
|
||
await this.fnSubmitPlayTime("0", this.changeVideoPlayTime);
|
||
this.changeVideoPlayTime = 0;
|
||
this.serverVideoPlayTime = 0;
|
||
}
|
||
this.$forceUpdate()
|
||
console.log(item)
|
||
this.currentCoursewareListIndex = index
|
||
this.currentCoursewareID = item.COURSEWAREID
|
||
this.currentCurriculumID = item.CURRICULUMID
|
||
this.getPlayInfo(item.COURSEWAREFILES, item.COURSEWAREID)
|
||
this.getVideoProgress()
|
||
}
|
||
},
|
||
|
||
startTimer() {
|
||
this.seconds += 1
|
||
this.$nextTick(() => {
|
||
if (this.seconds == 1 * 60) {
|
||
}
|
||
})
|
||
},
|
||
async tabSelect(e) {
|
||
if (this.TabCur != e.currentTarget.dataset.id) {
|
||
this.TabCur = e.currentTarget.dataset.id;
|
||
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
|
||
this.currentCoursewareID = ''
|
||
if (this.TabCur == 1) {
|
||
this.movie.poster = ''
|
||
this.movie.src = ''
|
||
await this.fnSubmitPlayTime(0, this.changeVideoPlayTime)
|
||
if (this.timer) {
|
||
clearInterval(this.timer)
|
||
this.timer = null
|
||
}
|
||
} else {
|
||
|
||
await this.fnGetData()
|
||
// this.movie.poster = baseImgPath + this.pd.VIDEOLIST[0].COURSEWARECAPTURE
|
||
// this.movie.src = baseImgPath + this.pd.VIDEOLIST[0].COURSEWAREFILES
|
||
}
|
||
}
|
||
},
|
||
getData() {
|
||
console.log('getData')
|
||
return new Promise((resolve, reject) => {
|
||
var _this = this;
|
||
uni.showLoading({
|
||
title: '请稍候'
|
||
})
|
||
uni.request({
|
||
url: basePath + '/app/stagestudentrelation/getMyTask',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
STAGESTUDENTRELATION_ID: this.STAGESTUDENTRELATION_ID,
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
if ("success" == res.data.result) {
|
||
uni.hideLoading();
|
||
_this.pd = res.data.pd;
|
||
_this.pd.VIDEOLIST.forEach((ele) => {
|
||
if (ele.VIDEOTIME == 0) {
|
||
ele.VIDEOTIMEFORMAT = ''
|
||
ele.VIDEOPROGRESS = ''
|
||
} else {
|
||
ele.VIDEOTIMEFORMAT = _this.formatVideoTime(ele.VIDEOTIME)
|
||
_this.operatVideoList(ele)
|
||
}
|
||
// 如果数据不更新的话，增加下面代码
|
||
// res.data.varList.splice(1, 0)
|
||
})
|
||
// 进入后自动播放第一个
|
||
if (_this.currentCoursewareID == '') {
|
||
this.currentCoursewareID = _this.pd.VIDEOLIST[0].COURSEWAREID
|
||
this.currentCurriculumID = _this.pd.VIDEOLIST?.[0].CURRICULUMID
|
||
console.log(this.currentCurriculumID)
|
||
// 初始化 服务器播放时间
|
||
let rTime = _this.pd.VIDEOLIST?.[0].RESOURCETIME
|
||
console.log(_this.pd)
|
||
console.log('getData---RESOURCETIME' + rTime)
|
||
this.serverVideoPlayTime = Math.floor(rTime) || 0
|
||
this.getPlayInfo(_this.pd.VIDEOLIST?.[0].COURSEWAREFILES, _this.pd.VIDEOLIST?.[0].COURSEWAREID)
|
||
// _this.movie.poster = baseImgPath + _this.pd.VIDEOLIST[0].COURSEWARECAPTURE
|
||
// _this.movie.src = baseImgPath + _this.pd.VIDEOLIST[0].COURSEWAREFILES
|
||
}
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: res.data.message,
|
||
duration: 2000
|
||
});
|
||
}
|
||
resolve(true)
|
||
}
|
||
})
|
||
})
|
||
},
|
||
changeOperatVideoList(ele) {
|
||
console.log('视频播放刷新百分比')
|
||
console.log(ele)
|
||
if (ele.PLAYCOUNT > 0) {
|
||
ele.VIDEOPROGRESS = 100
|
||
} else {
|
||
if (this.changeVideoPlayTime != 0) {
|
||
ele.VIDEOPROGRESS = (this.changeVideoPlayTime / ele.VIDEOTIME * 100).toFixed(0)
|
||
}
|
||
}
|
||
this.$forceUpdate()
|
||
console.log(ele.VIDEOPROGRESS)
|
||
},
|
||
operatVideoList(ele) {
|
||
console.log('初始化刷新百分比')
|
||
if (ele.PLAYCOUNT > 0) { //已学习
|
||
ele.VIDEOPROGRESS = 100
|
||
} else {
|
||
if (ele.VIDEOTIME == 0 || ele.RESOURCETIME == 0) { //视频无时长信息或没有开始学习
|
||
ele.VIDEOPROGRESS = 0
|
||
} else {
|
||
ele.VIDEOPROGRESS = (ele.RESOURCETIME / ele.VIDEOTIME * 100).toFixed(0)
|
||
this.$forceUpdate()
|
||
}
|
||
}
|
||
console.log(ele.VIDEOPROGRESS)
|
||
},
|
||
formatVideoTime(VIDEOTIME) {
|
||
var minute = Math.floor((VIDEOTIME / 60))
|
||
var second = (VIDEOTIME - minute * 60).toFixed(0)
|
||
return (minute < 10 ? ("0" + minute) : minute) + ":" + (second < 10 ? ("0" + second) : second)
|
||
},
|
||
validStr(str) {
|
||
if (str != null && str != '' && typeof (str) != "undefined" && str != 0)
|
||
return true
|
||
return false
|
||
},
|
||
async studyVideo(index) {
|
||
var item = this.pd.VIDEOLIST[index]
|
||
//播放视频不是同一个的时候
|
||
if (this.currentCoursewareID != item.COURSEWAREID) {
|
||
this.currentCoursewareListIndex = index
|
||
//保存上个视频的播放进度
|
||
if (this.currentCoursewareID != '') {
|
||
this.saveVideoRecord(0, this.changeVideoPlayTime)
|
||
}
|
||
this.serverVideoPlayTime = 0
|
||
this.changeVideoPlayTime = 0
|
||
this.currentTime = 0
|
||
// this.isPaused = false
|
||
this.currentCoursewareID = item.COURSEWAREID
|
||
this.currentCurriculumID = item.CURRICULUMID
|
||
this.$forceUpdate()
|
||
if (this.validStr(item.COURSEWAREFILES)) {
|
||
this.coursewareFiles = item.COURSEWAREFILES
|
||
this.coursewareCapture = item.COURSEWARECAPTURE
|
||
this.getPlayInfo(item.COURSEWAREFILES)
|
||
// this.movie.poster = baseImgPath + item.COURSEWARECAPTURE
|
||
// this.movie.src = baseImgPath + item.COURSEWAREFILES
|
||
this.getVideoProgress() //方法放在studyVideo加载后，此方法里的this.playTime获取不到值
|
||
// todo 人脸需放开
|
||
// if (!this.pd.VIDEOLIST[index].ISCHECKFACE) {
|
||
// this.pd.VIDEOLIST[index].ISCHECKFACE = 1
|
||
// this.goFaceRecognition(index)
|
||
// return
|
||
// }
|
||
// myvideo.seek(parseInt(this.playTime));
|
||
// if(this.timer) {
|
||
// clearInterval(this.timer)
|
||
// this.timer = null
|
||
// }
|
||
// this.timer = setInterval(this.startTimer, 1000)
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '课件视频资源已失效，请联系管理员',
|
||
duration: 2000
|
||
});
|
||
}
|
||
}
|
||
|
||
},
|
||
// 监听播放
|
||
onPlayerPlay(player) {
|
||
if (this.currentCoursewareID == '') {
|
||
this.studyVideo(0)
|
||
}
|
||
this.isPaused = false
|
||
},
|
||
// 监听暂停
|
||
onPlayerPause(player) {
|
||
this.isPaused = true
|
||
},
|
||
|
||
onPlayerEnded(player) {
|
||
this.isPaused = true
|
||
// localStorage.setItem('currentTime' + this.currentCoursewareID, 0)
|
||
this.playTime = 0
|
||
this.currentTime = 0
|
||
this.saveVideoRecord(1)
|
||
if (this.timer) {
|
||
clearInterval(this.timer)
|
||
this.timer = null
|
||
}
|
||
if (this.pd.VIDEOLIST[this.currentCoursewareListIndex].VIDEOTIME != 0) {
|
||
this.pd.VIDEOLIST[this.currentCoursewareListIndex].PLAYCOUNT = Number(this.pd.VIDEOLIST[this.currentCoursewareListIndex].PLAYCOUNT) + 1
|
||
this.pd.VIDEOLIST[this.currentCoursewareListIndex].RESOURCETIME = this.playTime
|
||
this.operatVideoList(this.pd.VIDEOLIST[this.currentCoursewareListIndex])
|
||
}
|
||
},
|
||
saveVideoRecord(isEnd, time) {
|
||
if (this.currentCoursewareID != '') {
|
||
uni.request({
|
||
url: basePath + '/app/coursestudyvideorecord/save',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
USERNAME: loginUser.USERNAME,
|
||
CURRICULUM_ID: this.currentCurriculumID,
|
||
VIDEOCOURSEWARE_ID: this.currentCoursewareID,
|
||
RESOURCETIME: time,
|
||
STUDYTASK_ID: this.pd.STUDYTASK_ID,
|
||
IS_END: isEnd,
|
||
TYPE: 1,
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
this.videoRecord = res.data.pd
|
||
if (isEnd == 1) {
|
||
this.pd.COMPLETE_COURSEWARE = res.data.pd.COMPLETE_COURSEWARE
|
||
this.pd.VIDEOLIST[this.currentCoursewareListIndex].PLAYCOUNT = res.data.pd.PLAYCOUNT
|
||
}
|
||
}
|
||
})
|
||
}
|
||
},
|
||
getVideoProgress() {
|
||
uni.request({
|
||
url: basePath + 'app/coursestudyvideorecord/getVideoProgress',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
STUDYTASK_ID: this.pd.STUDYTASK_ID,
|
||
CURRICULUM_ID: this.currentCurriculumID,
|
||
VIDEOCOURSEWARE_ID: this.currentCoursewareID,
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
if (res.data.pd != '') {
|
||
this.videoRecord = res.data.pd
|
||
this.serverVideoPlayTime = this.videoRecord.RESOURCETIME
|
||
}
|
||
}
|
||
})
|
||
},
|
||
getPlayInfo(videoId, courseware_id) {
|
||
uni.request({
|
||
url: basePath + 'app/audioOrVideo/getPlayInfo',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
videoId: videoId,
|
||
CURRICULUM_ID: this.currentCurriculumID,
|
||
VIDEOCOURSEWARE_ID: courseware_id || this.currentCoursewareID,
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
console.log(res.data)
|
||
if (res.data != '') {
|
||
if (res.data.trafficOverruns) {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '商城课件点播流量超限，请联系管理员',
|
||
duration: 2000
|
||
});
|
||
} else {
|
||
this.movie.poster = res.data.COVERURL
|
||
this.movie.src = res.data.PLAYURL
|
||
}
|
||
}
|
||
}
|
||
})
|
||
},
|
||
studyData(index) {
|
||
var item = this.pd.DATALIST[index]
|
||
this.currentCoursewareListIndex = index
|
||
this.currentCoursewareID = item.COURSEWAREID
|
||
this.currentCurriculumID = item.CURRICULUMID
|
||
if (this.validStr(item.COURSEWAREFILES)) {
|
||
uni.showLoading({
|
||
title: "加载中..."
|
||
}); //加载中动画
|
||
uni.downloadFile({
|
||
url: baseImgPath + item.COURSEWAREFILES,
|
||
success: (res) => {
|
||
uni.hideLoading(); //结束加载中动画
|
||
uni.openDocument({
|
||
filePath: res.tempFilePath,
|
||
success: function (res) {
|
||
}
|
||
})
|
||
}
|
||
})
|
||
uni.request({
|
||
url: basePath + 'app/coursestudyvideorecord/save',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
USERNAME: loginUser.USERNAME,
|
||
CURRICULUM_ID: item.CURRICULUMID,
|
||
VIDEOCOURSEWARE_ID: item.COURSEWAREID,
|
||
RESOURCETIME: item.VIDEOTIME,
|
||
STUDYTASK_ID: this.pd.STUDYTASK_ID,
|
||
IS_END: 1,
|
||
TYPE: 2,
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
this.pd.COMPLETE_COURSEWARE = res.data.pd.COMPLETE_COURSEWARE
|
||
this.pd.DATALIST[this.currentCoursewareListIndex].PLAYCOUNT = res.data.pd.PLAYCOUNT
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '课件文件资源已失效，请联系管理员',
|
||
duration: 2000
|
||
});
|
||
}
|
||
|
||
},
|
||
async goFaceRecognition(index) {
|
||
this.currentCoursewareListIndex = index
|
||
await this.getData()
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: "需进行人脸认证",
|
||
// confirmText: "确认",
|
||
// success: (res) => {
|
||
// if (res.confirm) {
|
||
// uni.redirectTo({
|
||
// url: '/pages/application/onlinexxks/face/index?CURRICULUM_ID=' + this.currentCurriculumID
|
||
// + '&STAGESTUDENTRELATION_ID=' + this.STAGESTUDENTRELATION_ID
|
||
// + '&CURRENTCOURSEWAREID=' + this.currentCoursewareID + '&COURSEWAREFILES=' + this.coursewareFiles
|
||
// + '&COURSEWARECAPTURE=' + this.coursewareCapture + '&PLAYTIME=' + this.serverVideoPlayTime
|
||
// + '&COURSEWAREINDEX=' + index
|
||
//
|
||
// })
|
||
// }
|
||
// if (res.cancel) {
|
||
// uni.redirectTo({
|
||
// url: '/pages/application/onlinexxks/my-tasks'
|
||
// });
|
||
// }
|
||
// }
|
||
// })
|
||
},
|
||
//习题练习
|
||
goStudyQuestion(item) {
|
||
uni.request({
|
||
url: basePath + '/app/mycurriculum/countForStudyByCoursewareId',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
CURRICULUMID: item.CURRICULUMID,
|
||
COURSEWAREID: item.COURSEWAREID,
|
||
COURSEWARETYPE: item.COURSEWARETYPE,
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
uni.hideLoading(); //结束加载中动画
|
||
if ("success" == res.data.result) {
|
||
if (res.data.pd.COUNT > 0) {
|
||
this.goStudyDetail(item)
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '课件还没有添加课件习题',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
}
|
||
})
|
||
|
||
},
|
||
goStudyDetail(item) {
|
||
/*
|
||
if (item.STUDYSTATE == '1') {
|
||
uni.request({
|
||
url: basePath + '/app/coursestudentrelation/updateStudentState',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
USERNAME: loginUser.USERNAME,
|
||
TYPE: '1',
|
||
STUDYSTATE: '2',
|
||
STAGESTUDENTRELATION_ID: this.STAGESTUDENTRELATION_ID,
|
||
},
|
||
success: (res) => {
|
||
if ("success" == res.data.result) {
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: res.data.message,
|
||
duration: 2000
|
||
});
|
||
}
|
||
}
|
||
});
|
||
}*/
|
||
uni.redirectTo({
|
||
url: '/pages/application/onlinexxks/my-study-detail?STUDYTASK_ID=' + this.pd.STUDYTASK_ID + '&COURSEWAREID=' + item.COURSEWAREID + '&COURSEWARETYPE=' +
|
||
item.COURSEWARETYPE + '&CURRICULUM_ID=' + item.CURRICULUMID + '&STAGESTUDENTRELATION_ID=' + this.STAGESTUDENTRELATION_ID
|
||
})
|
||
},
|
||
goExam() {
|
||
uni.request({
|
||
url: basePath + '/app/stagestudentrelation/checkMyTask',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
STAGESTUDENTRELATION_ID: this.pd.STAGESTUDENTRELATION_ID,
|
||
CORPINFO_ID: loginUser.CORPINFO_ID,
|
||
USER_ID: loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
uni.hideLoading(); //结束加载中动画
|
||
console.log(res)
|
||
if (res.data.code == 500) {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: res.data.msg,
|
||
duration: 2000
|
||
})
|
||
return
|
||
}
|
||
uni.showModal({
|
||
title: '',
|
||
content: '确定要进行考试吗？',
|
||
cancelColor: '#000000',
|
||
cancelText: '取消',
|
||
confirmText: '确定',
|
||
success: res => {
|
||
if (res.confirm) {
|
||
// uni.redirectTo({
|
||
// url: '/pages/application/onlinexxks/my-exam-curriculum?CURRICULUM_ID=' + this.currentCurriculumID +
|
||
// '&STAGESTUDENTRELATION_ID=' + this.STAGESTUDENTRELATION_ID
|
||
// })
|
||
uni.redirectTo({
|
||
url: '/pages/application/onlinexxks/my-exam-stage?STUDYTASK_ID=' + this.pd.STUDYTASK_ID + '&STAGEEXAMPAPER_ID=' + this.pd.STAGEEXAMPAPER_ID +
|
||
'&STAGESTUDENTRELATION_ID=' + this.pd.STAGESTUDENTRELATION_ID
|
||
});
|
||
}
|
||
}
|
||
})
|
||
}
|
||
})
|
||
// }
|
||
},
|
||
BackPage() {
|
||
uni.redirectTo({
|
||
url: '/pages/application/onlinexxks/my-curriculum',
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.sdetail {
|
||
margin-top: 30px;
|
||
}
|
||
</style>
|