-
-
-
-
-
-
-
- ![]()
- ![]()
-
-
赞
+
+ {
if (rs.status == 200) {
+ if(rs.result.isPermission){
+ this.protocolDialogVisible=true
+ }
+ if (!rs.result.isPermission || (rs.result.isPermission && this.Internet==1)){
+ // this.getInternet()
+ this.renderCourse = true
+ }else{
+ // this.Internet=1;
+ this.renderCourse = false
+ this.protocolDialogVisible=true
+ }
if(rs.result.contents.length==0){
$this.$message.error('课程内容已删除或课程已不再使用');
return;
@@ -1309,11 +1343,11 @@
}
//设置必须的字段
if(rs.result.contents.length==1){
- $this.tab=2;
- //console.log('内容只有一个');
+ $this.tab=2;
+ //console.log('内容只有一个');
}
if(!rs.result.isCrowd){
- $this.$message.error('您没有查看该课程的权限');
+ $this.$message.error('您没有查看该课程的权限');
}
// 是否播放
this.isCrowd = rs.result.isCrowd
@@ -1357,7 +1391,8 @@
}
}
this.courseInfo = rs.result.course;
-
+ this.warn = rs.result.warn;
+ this.warnTitle = rs.result.warnTitle;
if (rs.result.teachers && rs.result.teachers.length > 0) {
let userIds = [];
let ctoUsers = [];
@@ -1386,12 +1421,53 @@
this.totalContent = rs.result.contents.length;
//加载学习的数据
this.loadStudyData(rs.result);
-
} else {
this.$message.error(rs.message);
}
+
});
},
+ refreshPage() {
+ location.reload(true);
+ this.getInternet();
+ this.loadData();
+ },
+ getXmlHttpRequest() {
+ if (window.XMLHttpRequest) {
+ return new XMLHttpRequest();
+ }
+ else if (window.ActiveXObject) {
+ return new ActiveXObject("Microsoft.XMLHTTP");
+ }
+ },
+ // 检测是否为内网
+ getInternet() {
+ this.Internet = 3;
+ let $this = this;
+ let xmlhttp = this.getXmlHttpRequest();
+ let timedOut = false;
+ let timer = setTimeout(function () {
+ timedOut = true;
+ xmlhttp.abort();
+ }, 1000);
+ xmlhttp.open("HEAD", window.location.protocol + "//uapi.boe.com.cn/500.html", true);
+ xmlhttp.send();
+ xmlhttp.onreadystatechange = function () {
+ if (xmlhttp.readyState == 4) {
+ if (xmlhttp.status == 200) {
+ clearTimeout(timer);
+ $this.Internet = 1;
+ } else {
+ clearTimeout(timer);
+ // $this.protocolDialogVisible=true
+ $this.Internet = 2;
+ }
+ } else {
+ if (timedOut) return;//忽略中止请求
+ clearTimeout(timer);//取消等待的超时
+ }
+ }
+ },
loadStudyData(result) {
let $this=this;
this.loadScorePraiseAndTrample();
@@ -1514,37 +1590,37 @@
progress(val) {
const progressValue = parseFloat(val) * 100;
this.sendEventProgress = Number(progressValue.toFixed(2));
- },
+ },
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, //状态
- "contentId": this.contentData.id,
+ "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, //状态
+ "contentId": this.contentData.id,
+ }
+ if(this.resType == 10){
+ postData.progress = this.sendEventProgress;
+ }
+ //静默处理
+ apiStat.sendEvent(postData).then(rs=>{
+ if(rs.status == 200) {
+ // this.appendStartTime = new Date();//重新计时
+ // studyUtil.clearStudyDuration(); //清除本地存储
+ } else {
+ console.log(rs.message);
}
- if(this.resType == 10){
- postData.progress = this.sendEventProgress;
- }
- //静默处理
- apiStat.sendEvent(postData).then(rs=>{
- if(rs.status == 200) {
- // this.appendStartTime = new Date();//重新计时
- // studyUtil.clearStudyDuration(); //清除本地存储
- } else {
- console.log(rs.message);
- }
- });
+ });
// let postAppendData = {
// id: this.appentId,
// studyId: this.studyId,
@@ -1566,13 +1642,13 @@
},
//结束追加学习时长
stopStudyTime(){
- //console.log('停止追加学习时长');
- this.isAppendTime=false;
- //暂停让他为空 从新计时
- this.appendStartTime = null
- if (this.appendHandle != null) {
- window.clearTimeout(this.appendHandle);
- }
+ //console.log('停止追加学习时长');
+ this.isAppendTime=false;
+ //暂停让他为空 从新计时
+ this.appendStartTime = null
+ if (this.appendHandle != null) {
+ window.clearTimeout(this.appendHandle);
+ }
},
appendStudyTime() {
// 暂停的时候重新从十五秒开始计时
@@ -1594,11 +1670,11 @@
this.appendHandle && window.clearTimeout(this.appendHandle);
//启动下次追加学习时长
this.appendHandle = setTimeout(() => {
- let endTime = new Date().getTime();
- this.appentInterval = 60
- let totalTime = Math.round((endTime - this.appendStartTime) / 1000);
- this.appendStudyTime();
- this.saveStudyDuration(totalTime)
+ let endTime = new Date().getTime();
+ this.appentInterval = 60
+ let totalTime = Math.round((endTime - this.appendStartTime) / 1000);
+ this.appendStudyTime();
+ this.saveStudyDuration(totalTime)
}, this.appentInterval * 1000);
},
@@ -1664,26 +1740,30 @@
},
handleAudioTimeUpdate(currentTime) {
// if(this.contentStudysLength.length == 0){
- let params = {
- studyId: this.studyId, //学习id,
- courseId: this.courseId, //课程id,
- contentId: this.contentData.id, //内容id,
- contentType: this.contentData.contentType,
- contentName: this.contentData.contentName, //内容名称
- progress: 1,
- status: 2,
- contentTotal: this.totalContent
- };
- if(currentTime > 2 && this.trueFalse){
- apiStudy.studyContent(params).then(()=>{
- if(this.contentData.status<2){
- this.contentData.status = 2;
- }
- })
- this.trueFalse = false
- }
+ let params = {
+ studyId: this.studyId, //学习id,
+ courseId: this.courseId, //课程id,
+ contentId: this.contentData.id, //内容id,
+ contentType: this.contentData.contentType,
+ contentName: this.contentData.contentName, //内容名称
+ progress: 1,
+ status: 2,
+ contentTotal: this.totalContent
+ };
+ if(currentTime > 2 && this.trueFalse){
+ apiStudy.studyContent(params).then(()=>{
+ if(this.contentData.status<2){
+ this.contentData.status = 2;
+ }
+ })
+ this.trueFalse = false
+ }
},
},
+ destroyed(){
+ this.cleanAppendTime();
+ this.stopStudyTime();
+ },
}
@@ -1723,18 +1803,41 @@
min-height: 400px;
display: flex;
justify-content: space-between;
+ .course-player-container {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ }
.course-player{ //内容播放区域
- flex:1;
+ flex: 4; // 80%高度
min-width: 700px;
- min-height: 400px;
- max-height: 800px;
- //height: 100%;
+ // min-height: 400px;
+ // max-height: 800px;
+ height: 80%;
border: 1px solid #ffffff;
padding-right: 20px;
+ background-color: rgb(238, 238, 238);
// overflow: auto;
}
.course-control{ //内容控制区域
- width: 420px;
+ width: 420px;
+ }
+ }
+
+ @media screen and (max-width: 1200px) {
+ .course-playbox,
+ .course-infobox {
+ flex-direction: column;
+ }
+ .course-player,
+ .course-info {
+ min-width: 100%;
+ padding-right: 0;
+ }
+ .course-control,
+ .course-teacher {
+ width: 100%;
+ margin-top: 20px;
}
}
.course-infobox {
@@ -1856,13 +1959,10 @@
}
.player-box {
- position: absolute;
- // top: 62px;
- // left: 184px;
- width: 300px;
- left: 50%;
- top: 50%;
- transform: translate(-50%, -50%);
+ position: relative;
+ width: 100%;
+ max-width: 300px;
+ margin: 20px auto;
height: 187px;
background: rgba(74, 74, 74, .5);
border-radius: 33px;
@@ -2005,6 +2105,7 @@
}
.course-interact {
+ flex: 1; // 20%高度
height: 54px;
// padding-top: 10px;
// padding-right: 10px;
@@ -2368,4 +2469,18 @@
height: 200px;
background: url('../../../public/images/couresdetail.png');
}
+
+.protocol {
+ .protocol-title {
+ font-size: 20px;
+ font-weight: 600;
+ text-align: center;
+ margin-bottom: 25px;
+ }
+
+ .protocol-content {
+ font-size: 14px;
+ line-height: 25px;
+ }
+}
+
+
+
+
-
+
-
+
-
+ ![]()
+ ![]()
+
+
+ 赞
+
+ ![]()
+ ![]()
+
+
踩
+
- ![]()
- ![]()
-
-
- 踩
-
+
-
-
-
-
-
-
+
+
+
+
{{ toScore(courseInfo.score) }}
分
+
-
+
@@ -369,6 +390,7 @@
},
data() {
return {
+ protocolDialogVisible: false,
tentative: false,
isContentTypeTwo: null,
isContentType: null,
@@ -390,6 +412,7 @@
curCFile: {
converStatus: 4,
},
+ Internet: 3,//1是成功 2是是失败 3是检测中
radio: '',
interactRuning: false,
playerBoxShow: false,
@@ -431,6 +454,7 @@
getType: getType,
ctabName: 'catalog',
resType: null,
+ renderCourse: true,
activeNames: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
scoreInfo: {
dlgShow: false,
@@ -454,9 +478,12 @@
cumulativeDuration:0, //非音频累计时长
maxDuration:0, //非音频最大时长
defaultMaxTime:1800, //非音频默认最大时间
+ warn:"测试内容",
+ warnTitle:"测试标题",
}
},
mounted() {
+ this.getInternet();
// 增加的用户受众id
let localKey = "user_" + this.userInfo.sysId + "_gids";
let hasIds = sessionStorage.getItem(localKey);
@@ -504,10 +531,6 @@
return treeList;
}
},
- destroyed(){
- this.cleanAppendTime();
- this.stopStudyTime();
- },
methods: {
handleOpen(key,path){
if(this.isFalse){
@@ -522,13 +545,13 @@
},
noteChange(){
//视频点定位，直接到播放的视频位置
- this.timer = new Date().getTime()
+ this.timer = new Date().getTime()
},
//清空追加学习时长事件
cleanAppendTime(){
- if(this.appendStudyOtherHandle){
- window.clearTimeout(this.appendStudyOtherHandle);
- }
+ if(this.appendStudyOtherHandle){
+ window.clearTimeout(this.appendStudyOtherHandle);
+ }
},
//非音视频课学习时长的增加,每一分钟保存一次
appendStudyOtherTime() {
@@ -539,46 +562,46 @@
if (!this.contentData.id) {
return;
}
- //每一分钟保存一次
- // 取消阅读的每分钟六十秒的计时，最多是设置的时间或默认时间
- let $this=this;
- let startTime = new Date().getTime();
- this.appendStudyOtherHandle = setTimeout(function() {
- let endTime = new Date().getTime();
- let totalTime = Math.round((endTime - startTime) / 1000);
- $this.cumulativeDuration += totalTime;
- if($this.cumulativeDuration <= $this.maxDuration){
- //发送时长
- $this.sendStudyOtherTime(totalTime);
- //递归调用
- $this.appendStudyOtherTime();
- }else{
- clearTimeout(this.appendStudyOtherHandle);
- $this.cumulativeDuration = 0;
- $this.maxDuration = 0;
- }
- }, 1000*60);
+ //每一分钟保存一次
+ // 取消阅读的每分钟六十秒的计时，最多是设置的时间或默认时间
+ let $this=this;
+ let startTime = new Date().getTime();
+ this.appendStudyOtherHandle = setTimeout(function() {
+ let endTime = new Date().getTime();
+ let totalTime = Math.round((endTime - startTime) / 1000);
+ $this.cumulativeDuration += totalTime;
+ if($this.cumulativeDuration <= $this.maxDuration){
+ //发送时长
+ $this.sendStudyOtherTime(totalTime);
+ //递归调用
+ $this.appendStudyOtherTime();
+ }else{
+ clearTimeout(this.appendStudyOtherHandle);
+ $this.cumulativeDuration = 0;
+ $this.maxDuration = 0;
+ }
+ }, 1000*60);
},
sendStudyOtherTime(totalTime){
//静默处理
apiStat.sendEvent({
- "key": "StudyCourseOther",//课程学习的key
- "title": "非音视频课内容",//事件的标题
- "parameters":"second:" + totalTime,//second:value 本次的学习时长
- "content": "学习课程",//事件的内容
- "objId": this.courseInfo.id,//课程的id
- "objType": "1",//类型
- "source":"page",
- "objInfo": ""+this.courseInfo.name,
- "aid":this.userInfo.aid, //当前登录人的id
- "aname":this.userInfo.name,//当前人的姓名
- "status": 1 //状态
- }).then(rs=>{
- if(rs.status != 200) {
- console.log(rs.message);
- }
- });
+ "key": "StudyCourseOther",//课程学习的key
+ "title": "非音视频课内容",//事件的标题
+ "parameters":"second:" + totalTime,//second:value 本次的学习时长
+ "content": "学习课程",//事件的内容
+ "objId": this.courseInfo.id,//课程的id
+ "objType": "1",//类型
+ "source":"page",
+ "objInfo": ""+this.courseInfo.name,
+ "aid":this.userInfo.aid, //当前登录人的id
+ "aname":this.userInfo.name,//当前人的姓名
+ "status": 1 //状态
+ }).then(rs=>{
+ if(rs.status != 200) {
+ console.log(rs.message);
+ }
+ });
},
//笔记组件触发，播放指定时间
onPlayVideo(contentId,time){
@@ -587,32 +610,32 @@
console.log(contentId,this.contentData.id,'两个内容id');
let $this=this;
if(this.contentData.id==contentId){
- this.onPlayerPause()
- this.contentData.lastStudyTime=time;
- setTimeout(() => {
- $this.$refs.myVideoPlayer.startPlay(time);
- }, 10)
- console.log('开始播放1');
+ this.onPlayerPause()
+ this.contentData.lastStudyTime=time;
+ setTimeout(() => {
+ $this.$refs.myVideoPlayer.startPlay(time);
+ }, 10)
+ console.log('开始播放1');
}else{
- //通过contentId
- let toResContent=null;
- this.contentList.forEach(c => {
- if(c.id==contentId){
- c.lastStudyTime=time;
- toResContent=c;
- }
- });
- if(toResContent){
-
- this.changePlayRes(toResContent);
- setTimeout(() => {
- $this.$refs.myVideoPlayer.startPlay(time);
- }, 10)
-
- console.log('开始播放2');
- }else{
- this.$message.error('资源已不存在或更换过，已无法定位');
+ //通过contentId
+ let toResContent=null;
+ this.contentList.forEach(c => {
+ if(c.id==contentId){
+ c.lastStudyTime=time;
+ toResContent=c;
}
+ });
+ if(toResContent){
+
+ this.changePlayRes(toResContent);
+ setTimeout(() => {
+ $this.$refs.myVideoPlayer.startPlay(time);
+ }, 10)
+
+ console.log('开始播放2');
+ }else{
+ this.$message.error('资源已不存在或更换过，已无法定位');
+ }
}
this.playerBoxShow = false;
},
@@ -690,23 +713,23 @@
}else if(r.contentType==50){ //scorm
this.scormUrl='';
apiCourseFile.detail(r.contentRefId).then(cfrs => {
- if(cfrs.status==200){
- this.curCFile = cfrs.result;
- //this.scormUrl=cfrs
- let pars='?mode=normal&r='+Math.random();
- pars+='&scormId='+this.curCFile.id;
- pars+='&courseId='+this.courseId;
- pars+='&contentId='+r.id;
- pars+='&studentId='+this.userInfo.aid;
- pars+='&studentName='+encodeURIComponent(this.userInfo.name);
- pars+='&lmsId='+this.studyId;
- pars+='&scoId=';//不指定，scorm模块自动根据学习记录定位
- let urlPre=window.location.protocol;
- let configUrl=process.env.VUE_APP_SCORM_URL;
- configUrl=urlPre+configUrl.substring(configUrl.indexOf(':')+1);
+ if(cfrs.status==200){
+ this.curCFile = cfrs.result;
+ //this.scormUrl=cfrs
+ let pars='?mode=normal&r='+Math.random();
+ pars+='&scormId='+this.curCFile.id;
+ pars+='&courseId='+this.courseId;
+ pars+='&contentId='+r.id;
+ pars+='&studentId='+this.userInfo.aid;
+ pars+='&studentName='+encodeURIComponent(this.userInfo.name);
+ pars+='&lmsId='+this.studyId;
+ pars+='&scoId=';//不指定，scorm模块自动根据学习记录定位
+ let urlPre=window.location.protocol;
+ let configUrl=process.env.VUE_APP_SCORM_URL;
+ configUrl=urlPre+configUrl.substring(configUrl.indexOf(':')+1);
- this.scormUrl=configUrl+pars;//播放的首页
- }
+ this.scormUrl=configUrl+pars;//播放的首页
+ }
});
}else if (r.contentType == 52) {
@@ -737,12 +760,12 @@
setTimeout(() => {
this.isContentTypeTwo = r.contentType
$this.isShowTime()
- }, 2000);
- }
+ }, 2000);
+ }
}
//以下是学习记录,50是scorm项目
if (this.contentData.contentType > 20 && this.contentData.contentType !== 50) { //非视频类的
- //用户的学习时长，非音视频课程学习,单独的处理
+ //用户的学习时长，非音视频课程学习,单独的处理
this.isAppendTime = false;
this.appendStudyOtherHandle = setTimeout(function() {
@@ -752,18 +775,18 @@
// 没有设置默认时长三十分钟，
$this.maxDuration = r.duration !== 0 ? r.duration * 2 : $this.defaultMaxTime;
$this.$store.dispatch("userTrigger", {
- "key": "StudyCourseOther",//课程学习的key
- "title": "非音视频课内容",//事件的标题
- "parameters":"second:15",//second:value 本次的学习时长
- "content": "学习课程",//事件的内容
- "objId": $this.courseInfo.id,//课程的id
- "objType": "1",//类型
- "source":"page",
- "objInfo": ""+$this.courseInfo.name,
- "aid":$this.userInfo.aid, //当前登录人的id
- "aname":$this.userInfo.name,//当前人的姓名
- "status": 1 //状态
- });
+ "key": "StudyCourseOther",//课程学习的key
+ "title": "非音视频课内容",//事件的标题
+ "parameters":"second:15",//second:value 本次的学习时长
+ "content": "学习课程",//事件的内容
+ "objId": $this.courseInfo.id,//课程的id
+ "objType": "1",//类型
+ "source":"page",
+ "objInfo": ""+$this.courseInfo.name,
+ "aid":$this.userInfo.aid, //当前登录人的id
+ "aname":$this.userInfo.name,//当前人的姓名
+ "status": 1 //状态
+ });
$this.appendStudyOtherTime();
}, 15000); //非音视频课程学习,十五秒后记录
this.isContentType = this.contentData.contentType
@@ -780,20 +803,20 @@
this.$nextTick(function(){
- if (r.contentType == 10) {
- console.log('视频处理lastStudyTime',this.contentData.lastStudyTime)
- console.log('视频处理progressVideo',this.contentData.progressVideo)
- this.$refs.myVideoPlayer.updateProgressByClickBar2(this.contentData.lastStudyTime,this.contentData.progressVideo);
- }
+ if (r.contentType == 10) {
+ console.log('视频处理lastStudyTime',this.contentData.lastStudyTime)
+ console.log('视频处理progressVideo',this.contentData.progressVideo)
+ this.$refs.myVideoPlayer.updateProgressByClickBar2(this.contentData.lastStudyTime,this.contentData.progressVideo);
+ }
- let h=$this.$refs.coursePlayer.offsetHeight;
- //解决获取高度不正的问题
- if(h>400 && h<500){
- h=h+40;
- }else if(h>500){
- h=h+60;
- }
- $this.controlHeight=h-95;
+ let h=$this.$refs.coursePlayer.offsetHeight;
+ //解决获取高度不正的问题
+ if(h>400 && h<500){
+ h=h+40;
+ }else if(h>500){
+ h=h+60;
+ }
+ $this.controlHeight=h-95;
})
@@ -935,9 +958,9 @@
this.interactRuning = true;
let teacherId='';
if(this.teachers.length>0){
- teacherId=this.teachers[0].teacherId;
+ teacherId=this.teachers[0].teacherId;
}else{
- teacherId=this.courseInfo.sysCreateAid
+ teacherId=this.courseInfo.sysCreateAid
}
let postData = {
objType: 1,
@@ -1078,7 +1101,7 @@
class: 'catalog-cell-state1'
};
}
- break;
+ break;
}
return data;
},
@@ -1139,8 +1162,8 @@
var markDiv = div.querySelector("#" + divId);
console.log("去除水印 ---- gx markDiv ----",markDiv);
if (markDiv) {
- console.log("执行去除水印 ---- gx markDiv ----",markDiv);
- div.removeChild(markDiv);
+ console.log("执行去除水印 ---- gx markDiv ----",markDiv);
+ div.removeChild(markDiv);
}
}
},
@@ -1199,9 +1222,9 @@
var time = localStorage.getItem('videoProgressData')
var arr = time&&JSON.parse(time) || {}
if(arr[this.blobId] && this.contentData.progressVideo
-
+ {{ contentData.contentName }}
-
-
-
+
-
+
{{ contentData.contentName }}
+
+
-
-
-
-
-
- 此课程内容无法预览，请联系管理员
-
- 此课程内容无法预览，请联系管理员
-
-
-
-
-
-
-
-
-
-
-
- {{ contentData.contentName }}
- {{ conLink.url }}
+
+
+
+
+
+
-
+ 此课程内容无法预览，请联系管理员
+ 此课程内容无法预览，请联系管理员
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ contentData.contentName }}
+ {{ conLink.url }}
+
+
+
+
+
+
+
-
-
-
-
-
-
+
@@ -303,6 +313,17 @@
+
+ 十分抱歉，您当前的网络环境不符合观看要求。为了保障课程信息的安全，您需要接入公司内网才能观看。
+
+
+ 重新检测
+
{{warnTitle}}
+
+ {{warn}}
+
+
+