562 lines
24 KiB
JavaScript
562 lines
24 KiB
JavaScript
|
var couid = $api.querystring("couid");
|
|||
|
|
var vdata = new Vue({
|
|||
|
|
data: {
|
|||
|
|
//数据实体
|
|||
|
|
account: {}, //当前账号信息
|
|||
|
|
course: {}, //当前课程
|
|||
|
|
outline: {}, //当前课程章节
|
|||
|
|
subject: {}, //当前专业
|
|||
|
|
outlines: [], //当前课程的章节列表（树形）
|
|||
|
|
access: [], //附件列表
|
|||
|
|
events: [], //视频事件
|
|||
|
|
messages: [], //咨询留言
|
|||
|
|
//当前章节的视频信息
|
|||
|
|
video: {
|
|||
|
|
url: '', //视频路径
|
|||
|
|
total: 0, //总时长
|
|||
|
|
playTime: 0, //当前播放时间，单位：毫秒
|
|||
|
|
playhistime: 0, //历史播放时间
|
|||
|
|
studytime: 0, //累计学习时间
|
|||
|
|
percent: 0 //完成度（百分比）
|
|||
|
|
},
|
|||
|
|
playtime: 0, //当前播放时间，单位：秒
|
|||
|
|
playpercent: 0, //当前播放完成度百分比
|
|||
|
|
//状态
|
|||
|
|
state: {}, //课程状态
|
|||
|
|
couid: $api.querystring("couid"),
|
|||
|
|
olid: $api.querystring("olid"),
|
|||
|
|
median: false, //分隔线折叠状态
|
|||
|
|
titState: 'loading', //左侧选项卡的状态
|
|||
|
|
rightState: 'outline', //右侧选项卡状态，章节outline,交流chat
|
|||
|
|
outlineLoaded: false, //右侧章节列表加载中
|
|||
|
|
studylogUpdate: false, //学习记录是否在递交中
|
|||
|
|
studylogState: 0, //学习记录提交状态，1为成功，-1为失败
|
|||
|
|
switchSubtitle: $api.cookie("switchSubtitle_" + $api.querystring("couid")) == "true" ? true : false, //弹幕开关
|
|||
|
|
//控件
|
|||
|
|
player: null //播放器
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
//课程状态
|
|||
|
|
state: function (val) {
|
|||
|
|
if (vdata.state.isNull) vdata.titState = 'isNull';
|
|||
|
|
if (vdata.state.isAccess) vdata.titState = 'isAccess';
|
|||
|
|
if (vdata.state.isQues) vdata.titState = 'isQues';
|
|||
|
|
if (vdata.state.isContext) vdata.titState = 'isContext';
|
|||
|
|
if (vdata.state.isLive) vdata.titState = 'isLive';
|
|||
|
|
if (vdata.state.existVideo) vdata.titState = 'existVideo';
|
|||
|
|
//if (!vdata.state.canStudy) vdata.titState = 'isNull';
|
|||
|
|
if (vdata.state.DeskAllow) return;
|
|||
|
|
//视频播放
|
|||
|
|
if (vdata.state.canStudy && (vdata.state.existVideo || vdata.state.isLive))
|
|||
|
|
vdata.videoPlay(vdata.state);
|
|||
|
|
},
|
|||
|
|
//左侧选项卡切换
|
|||
|
|
titState: function (val) {
|
|||
|
|
if (vdata.playready()) {
|
|||
|
|
vdata.titState == 'existVideo' ? vdata.player.play() : vdata.player.pause();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//弹幕开关
|
|||
|
|
'switchSubtitle': function (val, old) {
|
|||
|
|
if (val != old)
|
|||
|
|
$api.cookie("switchSubtitle_" + vdata.couid, val);
|
|||
|
|
},
|
|||
|
|
//播放进度时间变化
|
|||
|
|
playtime: function (val) {
|
|||
|
|
vdata.video.studytime++;
|
|||
|
|
//当前视频播放进度百分比
|
|||
|
|
var per = Math.floor(vdata.video.studytime <= 0 ? 0 : vdata.video.studytime / vdata.video.total * 100);
|
|||
|
|
vdata.playpercent = per;
|
|||
|
|
//触发视频事件
|
|||
|
|
vdata.videoEvent(vdata.playtime);
|
|||
|
|
},
|
|||
|
|
//播放进度百分比变化，
|
|||
|
|
playpercent: function (val, oldval) {
|
|||
|
|
//console.log('当前播放进度百分比：'+val);
|
|||
|
|
//学习记录提交
|
|||
|
|
if (val <= 100) vdata.videoLog(val);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
//知识库的点击事件
|
|||
|
|
knlClick: function () {
|
|||
|
|
new top.PageBox('课程知识库', 'Knowledges.ashx?couid=' + vdata.couid, 100, 100, null, window.name).Open();
|
|||
|
|
},
|
|||
|
|
//章节列表的点击事件
|
|||
|
|
outlineClick: function (olid, event) {
|
|||
|
|
var url = $api.setpara("olid", olid);
|
|||
|
|
history.pushState({}, null, url);
|
|||
|
|
vdata.olid = olid;
|
|||
|
|
vdata.titState = 'loading';
|
|||
|
|
if (event != null) event.preventDefault();
|
|||
|
|
//获取当前章节状态，和专业信息
|
|||
|
|
$api.bat(
|
|||
|
|
$api.get("Outline/ForID", {
|
|||
|
|
id: olid
|
|||
|
|
}),
|
|||
|
|
$api.get("Outline/state", {
|
|||
|
|
olid: olid
|
|||
|
|
})
|
|||
|
|
).then(axios.spread(function (ol, state) {
|
|||
|
|
if (ol.data.success && state.data.success) {
|
|||
|
|
vdata.outline = ol.data.result;
|
|||
|
|
vdata.state = state.data.result;
|
|||
|
|
if (!vdata.state.isLive && vdata.state.PlayTime / 1000 > 0) {
|
|||
|
|
/*
|
|||
|
|
vdata.$confirm('是否从上次进度播放？', '提示', {
|
|||
|
|
confirmButtonText: '确定',
|
|||
|
|
cancelButtonText: '取消',
|
|||
|
|
type: 'warning'
|
|||
|
|
}).then(function() {
|
|||
|
|
vdata.videoSeek(vdata.state.PlayTime / 1000);
|
|||
|
|
window.setTimeout(function() {
|
|||
|
|
if (vdata.playready()) vdata.player.play();
|
|||
|
|
}, 500);
|
|||
|
|
}).catch(function() {
|
|||
|
|
|
|||
|
|
});*/
|
|||
|
|
}
|
|||
|
|
//视频播放记录
|
|||
|
|
var result = state.data.result;
|
|||
|
|
vdata.video.studytime = isNaN(result.StudyTime) ? 0 : result.StudyTime;
|
|||
|
|
vdata.video.playhistime = isNaN(result.PlayTime) ? 0 : result.PlayTime / 1000;
|
|||
|
|
window.setTimeout(function () {
|
|||
|
|
vdata.outlineLoaded = true;
|
|||
|
|
}, 100);
|
|||
|
|
|
|||
|
|
//获取视频事件
|
|||
|
|
if (state.data.result.existVideo && vdata.outline) {
|
|||
|
|
$api.get("Outline/VideoEvents", {
|
|||
|
|
olid: vdata.outline.Ol_ID
|
|||
|
|
}).then(function (req) {
|
|||
|
|
if (req.data.success) {
|
|||
|
|
vdata.events = req.data.result;
|
|||
|
|
} else {
|
|||
|
|
alert("视频事件加载失败！详情：\r" + req.data.message);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
if (!ol.data.success) alert("章节信息加载异常！详情：\r" + ol.data.message);
|
|||
|
|
if (!state.data.success) alert("章节状态加载异常！详情：\r" + state.data.message);
|
|||
|
|
}
|
|||
|
|
}));
|
|||
|
|
//获取留言列表
|
|||
|
|
vdata.msgGet();
|
|||
|
|
},
|
|||
|
|
//播放器是否准备好
|
|||
|
|
playready: function () {
|
|||
|
|
if (vdata.player != null) {
|
|||
|
|
return vdata.player._isReady && vdata.player.engine;
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
},
|
|||
|
|
//视频开始播放
|
|||
|
|
videoPlay: function (state) {
|
|||
|
|
if (vdata.player != null) {
|
|||
|
|
vdata.player.destroy();
|
|||
|
|
vdata.player = null;
|
|||
|
|
}
|
|||
|
|
if (!vdata.state.isLive) { //点播
|
|||
|
|
vdata.player = new QPlayer({
|
|||
|
|
url: state.urlVideo,
|
|||
|
|
container: document.getElementById("videoplayer"),
|
|||
|
|
autoplay: true,
|
|||
|
|
});
|
|||
|
|
} else { //直播
|
|||
|
|
vdata.player = new QPlayer({
|
|||
|
|
url: state.urlVideo,
|
|||
|
|
container: document.getElementById("livebox"),
|
|||
|
|
isLive: true,
|
|||
|
|
autoplay: true
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
if (vdata.player != null) {
|
|||
|
|
vdata.player.on("loading", vdata.videoready);
|
|||
|
|
vdata.player.on("ready", vdata.videoready);
|
|||
|
|
vdata.player.on("timeupdate", function (currentTime, totalTime) {
|
|||
|
|
vdata.video.total = parseInt(totalTime);
|
|||
|
|
vdata.video.playTime = currentTime; //详细时间，精确到毫秒
|
|||
|
|
vdata.playtime = parseInt(currentTime);
|
|||
|
|
//学习完成度，最大为百分百
|
|||
|
|
vdata.video.percent = Math.floor(vdata.video.studytime <= 0 ? 0 : vdata.video.studytime / vdata.video.total * 1000) / 10;
|
|||
|
|
vdata.video.percent = vdata.video.percent > 100 ? 100 : vdata.video.percent;
|
|||
|
|
});
|
|||
|
|
vdata.player.on("seeked", function () {
|
|||
|
|
vdata.playtime = vdata.playready() ? vdata.player.currentTime : 0;
|
|||
|
|
window.setTimeout(function () {
|
|||
|
|
if (vdata.playready()) vdata.player.pause();
|
|||
|
|
}, 50);
|
|||
|
|
});
|
|||
|
|
vdata.player.on("play", function (e) {
|
|||
|
|
if (window.videoFixed) vdata.player.pause();
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//播放器加载后的事件
|
|||
|
|
videoready: function () {
|
|||
|
|
//隐藏全屏按钮
|
|||
|
|
var fullbtn = document.getElementsByClassName("qplayer-fullscreen");
|
|||
|
|
for (var i = 0; i < fullbtn.length; i++) {
|
|||
|
|
fullbtn[i].style.display = "none";
|
|||
|
|
}
|
|||
|
|
//隐藏设置按钮(播放倍速也禁用了)
|
|||
|
|
var setbtn = document.getElementsByClassName("qplayer-settings-btn");
|
|||
|
|
for (var i = 0; i < setbtn.length; i++) {
|
|||
|
|
//setbtn[i].style.display = "none";
|
|||
|
|
}
|
|||
|
|
//给video对象增加属性
|
|||
|
|
var video = document.querySelector("video");
|
|||
|
|
video.setAttribute("x5-playsinline", "");
|
|||
|
|
video.setAttribute("playsinline", true);
|
|||
|
|
video.setAttribute("webkit-playsinline", true);
|
|||
|
|
video.setAttribute("x-webkit-airplay", true);
|
|||
|
|
video.setAttribute("x5-video-player-type", "h5");
|
|||
|
|
video.setAttribute("x5-video-player-fullscreen", "");
|
|||
|
|
video.setAttribute("x5-video-orientation", "portraint");
|
|||
|
|
},
|
|||
|
|
//视频播放跳转
|
|||
|
|
videoSeek: function (second) {
|
|||
|
|
if (vdata.playready()) {
|
|||
|
|
vdata.player.seek(second);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//学习记录记录
|
|||
|
|
videoLog: function (per) {
|
|||
|
|
if (vdata.studylogUpdate) return;
|
|||
|
|
var interval = 1; //间隔百分比多少递交一次记录
|
|||
|
|
if (vdata.video.total <= 5 * 60) interval = 10; //5分钟内的视频
|
|||
|
|
else if (vdata.video.total <= 10 * 60) interval = 5; //10分钟的视频，5%递交一次
|
|||
|
|
else if (vdata.video.total <= 30 * 60) interval = 2; //30分钟的视频，2%递交一次
|
|||
|
|
if (per > 0 && per < (100 + interval) && per % interval == 0) {
|
|||
|
|
if (!vdata.outline) return;
|
|||
|
|
$api.post("Course/StudyLog", {
|
|||
|
|
couid: vdata.course.Cou_ID,
|
|||
|
|
olid: vdata.outline.Ol_ID,
|
|||
|
|
playTime: vdata.playtime,
|
|||
|
|
studyTime: vdata.video.studytime,
|
|||
|
|
totalTime: vdata.video.total
|
|||
|
|
}, function () {
|
|||
|
|
vdata.studylogUpdate = true;
|
|||
|
|
}, function () {
|
|||
|
|
vdata.studylogUpdate = false;
|
|||
|
|
}).then(function (req) {
|
|||
|
|
if (!req.data.success) {
|
|||
|
|
if (vdata.playready()) {
|
|||
|
|
vdata.player.pause();
|
|||
|
|
vdata.player.destroy();
|
|||
|
|
vdata.player = null;
|
|||
|
|
}
|
|||
|
|
alert(req.data.message);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
vdata.studylogState = 1;
|
|||
|
|
window.setTimeout(function () {
|
|||
|
|
vdata.studylogState = 0;
|
|||
|
|
}, 2000);
|
|||
|
|
}).catch(function (err) {
|
|||
|
|
vdata.studylogState = -1;
|
|||
|
|
//alert(err);
|
|||
|
|
window.setTimeout(function () {
|
|||
|
|
vdata.studylogState = 0;
|
|||
|
|
}, 2000);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//视频事件的触发
|
|||
|
|
videoEvent: function (playtime) {
|
|||
|
|
if (vdata.events.length < 1) return;
|
|||
|
|
var curr = null;
|
|||
|
|
for (var ev in vdata.events) {
|
|||
|
|
if (vdata.events[ev].Oe_TriggerPoint == playtime) {
|
|||
|
|
curr = vdata.events[ev];
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (curr == null) return;
|
|||
|
|
//视频暂停
|
|||
|
|
if (vdata.playready()) vdata.player.pause();
|
|||
|
|
var box = new MsgBox();
|
|||
|
|
box.OverEvent = function () {
|
|||
|
|
if (vdata.playready()) vdata.player.play();
|
|||
|
|
}
|
|||
|
|
if (curr.Oe_EventType == 1)
|
|||
|
|
box.Init("提示：" + curr.Oe_Title, curr.Oe_Context, curr.Oe_Width, curr.Oe_Height, "alert").Open();
|
|||
|
|
if (curr.Oe_EventType == 2)
|
|||
|
|
box.Init("知识点：" + curr.Oe_Title, curr.Oe_Context, curr.Oe_Width, curr.Oe_Height, "alert").Open();
|
|||
|
|
if (curr.Oe_EventType == 3) {
|
|||
|
|
var items = eval(curr.Oe_Datatable);
|
|||
|
|
var context = curr.Oe_Context + "<div class='quesBox'>";
|
|||
|
|
for (var i in items) {
|
|||
|
|
if (items[i].item == "") continue;
|
|||
|
|
context += "<div onclick='vdata.videoEventClick(" + items[i].iscorrect + ",-1)'>" +
|
|||
|
|
(Number(i) + 1) + "、" + items[i].item + "</div>";
|
|||
|
|
}
|
|||
|
|
context += "</div>";
|
|||
|
|
context += "<div id='event_error'>回答错误</div>";
|
|||
|
|
box.Init("提问" + curr.Oe_Title, context, curr.Oe_Width, curr.Oe_Height, "null").Open();
|
|||
|
|
}
|
|||
|
|
if (curr.Oe_EventType == 4) {
|
|||
|
|
var items = eval(curr.Oe_Datatable);
|
|||
|
|
var context = curr.Oe_Context + "<div class='quesBox'>";
|
|||
|
|
for (var i in items) {
|
|||
|
|
if (items[i].item == "") continue;
|
|||
|
|
context += "<div onclick='vdata.videoEventClick(null," + items[i].point + ")'>" +
|
|||
|
|
(Number(i) + 1) + "、" + items[i].item + " - （跳转到：" + items[i].point + "秒）</div>";
|
|||
|
|
}
|
|||
|
|
context += "</div>";
|
|||
|
|
box.Init("反馈：" + curr.Oe_Title, context, curr.Oe_Width, curr.Oe_Height, "alert").Open();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//视频事件的点击操作
|
|||
|
|
videoEventClick: function (iscorrect, seek) {
|
|||
|
|
//视频事件的问题
|
|||
|
|
if (iscorrect != null) {
|
|||
|
|
if (iscorrect) MsgBox.Close();
|
|||
|
|
if (!iscorrect) {
|
|||
|
|
var err = document.getElementById("event_error");
|
|||
|
|
err.style.height = 20 + 'px';
|
|||
|
|
err.style.opacity = 1;
|
|||
|
|
window.setTimeout(function () {
|
|||
|
|
var err = document.getElementById("event_error");
|
|||
|
|
err.style.height = 0 + 'px';
|
|||
|
|
err.style.opacity = 0;
|
|||
|
|
}, 1000);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
//视频跳转
|
|||
|
|
if (iscorrect == null && seek > 0) {
|
|||
|
|
if (!vdata.playready()) return;
|
|||
|
|
vdata.player.seek(seek);
|
|||
|
|
MsgBox.Close();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//发送消息
|
|||
|
|
msgSend: function () {
|
|||
|
|
var msg = document.getElementById("messageinput").value;
|
|||
|
|
if ($api.trim(msg) == '') return;
|
|||
|
|
var span = Date.now() - Number($api.cookie("msgtime"));
|
|||
|
|
if (span / 1000 < 10) {
|
|||
|
|
vdata.$notify({
|
|||
|
|
message: '不要频繁发消息！',
|
|||
|
|
position: 'bottom-right'
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
$api.cookie("msgtime", Date.now());
|
|||
|
|
$api.post("message/add", {
|
|||
|
|
acc: '',
|
|||
|
|
msg: msg,
|
|||
|
|
playtime: vdata.playtime,
|
|||
|
|
couid: vdata.couid,
|
|||
|
|
olid: vdata.olid
|
|||
|
|
}).then(function (req) {
|
|||
|
|
var d = req.data;
|
|||
|
|
if (d.success) {
|
|||
|
|
document.getElementById("messageinput").value = '';
|
|||
|
|
vdata.msgGet();
|
|||
|
|
} else {
|
|||
|
|
alert("信息添加发生异常！详情：\r" + d.message);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
//获取当前章节的留言信息
|
|||
|
|
msgGet: function () {
|
|||
|
|
if (!vdata.olid || vdata.olid < 1) return;
|
|||
|
|
$api.post("message/count", {
|
|||
|
|
olid: vdata.olid,
|
|||
|
|
order: 'asc',
|
|||
|
|
count: 100
|
|||
|
|
}).then(function (req) {
|
|||
|
|
var d = req.data;
|
|||
|
|
if (d.success) {
|
|||
|
|
vdata.messages = d.result;
|
|||
|
|
window.setTimeout(function () {
|
|||
|
|
var dl = document.getElementById("chatlistdl");
|
|||
|
|
document.getElementById("chatlist").scrollTop = dl.offsetHeight;
|
|||
|
|
}, 1000);
|
|||
|
|
} else {
|
|||
|
|
alert("留言信息加载异常！详情：\r" + d.message);
|
|||
|
|
}
|
|||
|
|
}).catch(function (err) {
|
|||
|
|
//alert("msgGet方法存在错误："+err);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
init: function () {
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
created: function () {
|
|||
|
|
var couid = $api.querystring("couid");
|
|||
|
|
$api.bat(
|
|||
|
|
$api.get("Outline/tree", {
|
|||
|
|
couid: couid
|
|||
|
|
}),
|
|||
|
|
$api.get("Course/ForID", {
|
|||
|
|
id: couid
|
|||
|
|
})).then(axios.spread(function (ol, cur) {
|
|||
|
|
if (ol.data.success && cur.data.success) {
|
|||
|
|
if (ol.data.result.length < 1) throw "没有课程章节";
|
|||
|
|
vdata.outlines = ol.data.result;
|
|||
|
|
if (vdata.olid == '') vdata.olid = ol.data.result[0].Ol_ID;
|
|||
|
|
vdata.outlineClick(vdata.olid, null);
|
|||
|
|
vdata.course = cur.data.result;
|
|||
|
|
document.title = vdata.course.Cou_Name;
|
|||
|
|
$api.get("Subject/ForID", {
|
|||
|
|
id: vdata.course.Sbj_ID
|
|||
|
|
}).then(function (subject) {
|
|||
|
|
if (subject.data.success) {
|
|||
|
|
vdata.subject = subject.data.result;
|
|||
|
|
} else {
|
|||
|
|
if (!subject.data.success) throw "课程所属专业加载异常！详情：\r" + subject.data.message;
|
|||
|
|
}
|
|||
|
|
}).catch(function (err) {
|
|||
|
|
alert(err);
|
|||
|
|
});
|
|||
|
|
vdata.msgGet();
|
|||
|
|
} else {
|
|||
|
|
if (!ol.data.success) throw "章节列表加载异常！详情：\r" + ol.data.message;
|
|||
|
|
if (!cur.data.success) throw "课程信息加载异常！详情：\r" + cur.data.message;
|
|||
|
|
}
|
|||
|
|
})).catch(function (err) {
|
|||
|
|
alert(err);
|
|||
|
|
});
|
|||
|
|
//当前登录学员
|
|||
|
|
$api.get("Account/Current", {}, null, null).then(function (req) {
|
|||
|
|
if (req.data.success) {
|
|||
|
|
vdata.account = req.data.result;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
//定时刷新（加载）咨询留言
|
|||
|
|
window.setInterval('vdata.msgGet()', 1000 * 10);
|
|||
|
|
},
|
|||
|
|
mounted: function () {
|
|||
|
|
//视频上面的漂浮信息（学员姓名和电话），防录屏
|
|||
|
|
window.setInterval(function () {
|
|||
|
|
var acc = document.getElementById("accinfo");
|
|||
|
|
if (acc == null) return;
|
|||
|
|
if (acc.parentNode.offsetHeight == 0 || acc.parentNode.offsetWidth == 0) return;
|
|||
|
|
//移动速度
|
|||
|
|
window.acctop = window.acctop ? window.acctop : Math.ceil(Math.random() * 100) / 10;
|
|||
|
|
window.accleft = window.accleft ? window.accleft : Math.ceil(Math.random() * 100) / 10;
|
|||
|
|
//获取当前坐标
|
|||
|
|
var top = Number(acc.style.top.replace('px', ''));
|
|||
|
|
var left = Number(acc.style.left.replace('px', ''));
|
|||
|
|
//转向
|
|||
|
|
if (top < 0 || top > acc.parentNode.offsetHeight - acc.offsetHeight) window.acctop = -window.acctop;
|
|||
|
|
if (left < 0 || left > acc.parentNode.offsetWidth - acc.offsetWidth) window.accleft = -window.accleft;
|
|||
|
|
//移动
|
|||
|
|
acc.style.top = (top < 0 ? 0 : (top > acc.parentNode.offsetHeight - acc.offsetHeight ? acc.parentNode.offsetHeight - acc.offsetHeight : top + window.acctop)) + "px";
|
|||
|
|
acc.style.left = (left < 0 ? 0 : (left > acc.parentNode.offsetWidth - acc.offsetWidth ? acc.parentNode.offsetWidth - acc.offsetWidth : left + window.accleft)) + "px";
|
|||
|
|
|
|||
|
|
}, 200);
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
vdata.$mount('#body');
|
|||
|
|
window.onload = function () {
|
|||
|
|
this.vdata.init();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
window.onblur = function () {
|
|||
|
|
if (vdata.playready()) {
|
|||
|
|
//if (vdata.state.isLive || vdata.state.existVideo)
|
|||
|
|
if (!vdata.state.SwitchPlay)
|
|||
|
|
vdata.player.pause();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
window.onfocus = function () {
|
|||
|
|
//如果有视频事件弹出，则窗体获取焦点时，视频并不播放
|
|||
|
|
if ($("div[type=MsgBox]").size() > 0) return;
|
|||
|
|
if (vdata.playready()) {
|
|||
|
|
//vdata.titState == 'existVideo' && vdata.state.isLive ? vdata.player.play() : vdata.player.pause();
|
|||
|
|
//只有当处于视频状态时才播放
|
|||
|
|
if (vdata.titState == 'existVideo' || vdata.titState == 'isLive')
|
|||
|
|
vdata.player.play();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
window.onresize = function () {
|
|||
|
|
window.setTimeout(function () {
|
|||
|
|
var str = '';
|
|||
|
|
[22, 9, 4, 5, 15].forEach(x => str += String.fromCharCode(0x60 + x));
|
|||
|
|
var v = document.querySelector(str);
|
|||
|
|
if (!v) return;
|
|||
|
|
var styles = document.defaultView.getComputedStyle(v.parentNode, null);
|
|||
|
|
var posi = styles.getPropertyValue('position');
|
|||
|
|
window.videoFixed = posi == 'fixed';
|
|||
|
|
v.style.display = window.videoFixed ? 'none' : '';
|
|||
|
|
!window.videoFixed && $("div[type=MsgBox]").size() < 1 ? v.play() : v.pause();
|
|||
|
|
}, 100);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//全局过滤器，日期格式化
|
|||
|
|
Vue.filter('date', function (value, fmt) {
|
|||
|
|
if ($api.getType(value) != 'Date') return value;
|
|||
|
|
var o = {
|
|||
|
|
"M+": value.getMonth() + 1,
|
|||
|
|
"d+": value.getDate(),
|
|||
|
|
"h+": value.getHours(),
|
|||
|
|
"m+": value.getMinutes(),
|
|||
|
|
"s+": value.getSeconds()
|
|||
|
|
};
|
|||
|
|
if (/(y+)/.test(fmt))
|
|||
|
|
fmt = fmt.replace(RegExp.$1, (value.getFullYear() + "").substr(4 - RegExp.$1.length));
|
|||
|
|
for (var k in o)
|
|||
|
|
if (new RegExp("(" + k + ")").test(fmt))
|
|||
|
|
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
|
|||
|
|
return fmt;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
//******* 附件列表
|
|||
|
|
Vue.component('accessory', {
|
|||
|
|
props: ['uid', 'isbuy'],
|
|||
|
|
data: function () {
|
|||
|
|
return {
|
|||
|
|
datas: [], //附件列表
|
|||
|
|
msg: '' //提示信息
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
'uid': function (val, old) {
|
|||
|
|
var th = this;
|
|||
|
|
th.msg = '';
|
|||
|
|
$api.get("Outline/Accessory", { uid: val }).then(function (acc) {
|
|||
|
|
if (acc.data.success) {
|
|||
|
|
th.datas = acc.data.result;
|
|||
|
|
} else {
|
|||
|
|
th.msg = "附件信息加载异常！详情：\r" + acc.data.message;
|
|||
|
|
}
|
|||
|
|
}).catch(function (err) {
|
|||
|
|
th.msg = err;
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
'isbuy': function (val, old) {
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
//附件的点击事件
|
|||
|
|
accessClick: function (file, tit, event) {
|
|||
|
|
var exist = file.substring(file.lastIndexOf(".") + 1).toLowerCase();
|
|||
|
|
if (exist == "pdf") {
|
|||
|
|
event.preventDefault();
|
|||
|
|
var box = new PageBox(tit, $api.pdfViewer(file), 100, 100, null, window.name);
|
|||
|
|
box.Open();
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
template: '<div id="accessory">\
|
|||
|
|
<div v-if="!isbuy" style="color:red;">课程未购买，资料不提供下载或预览</div>\
|
|||
|
|
<a v-if="isbuy" v-for="(item,index) in datas" target="_blank":href="item.As_FileName"\
|
|||
|
|
v-on:click="accessClick(item.As_FileName,item.As_Name,$event)"\
|
|||
|
|
:download="item.As_Name">{{index+1}}、{{item.As_Name}}\
|
|||
|
|
</a>\
|
|||
|
|
<div v-if="!isbuy" v-for="(item,index) in datas" >\
|
|||
|
|
{{index+1}}、{{item.As_Name}}\
|
|||
|
|
</div>\
|
|||
|
|
<div class="noInfo">{{msg}}</div>\
|
|||
|
|
</div>'
|
|||
|
|
});
|