历史播放
This commit is contained in:
zy
parent
43af71a084
commit
dacd296f0a
|
|
@ -68,89 +68,96 @@ function statistic(record) {
|
||||||
if(camType.value == 'ball' || camType.value === 'halfball') {
|
if(camType.value == 'ball' || camType.value === 'halfball') {
|
||||||
width.value = 1000;
|
width.value = 1000;
|
||||||
}
|
}
|
||||||
if(record.deviceIotUrl && record.deviceIotUrl != ''){
|
if(record.isRewind) {
|
||||||
let videohtml =
|
if(record.deviceReverseIotUrl && record.deviceReverseIotUrl != ''){
|
||||||
`<div style="width: 100%;height: 600px;margin:auto;"><div id="videos" style="width: 100%; height: 100%"></div></div>`
|
let videohtml =
|
||||||
nextTick(() => {
|
`<div style="width: 100%;height: 600px;margin:auto;"><div id="videos" style="width: 100%; height: 100%"></div></div>`
|
||||||
let dom = document.querySelector('#parent2')
|
nextTick(() => {
|
||||||
dom.innerHTML = videohtml
|
let dom = document.querySelector('#parent2')
|
||||||
player.value = new EZUIKit.EZUIKitPlayer({
|
dom.innerHTML = videohtml
|
||||||
id: 'videos', // 视频容器ID
|
player.value = new EZUIKit.EZUIKitPlayer({
|
||||||
accessToken: record.ysToken,
|
id: 'videos', // 视频容器ID
|
||||||
url: record.deviceIotUrl,
|
accessToken: record.ysToken,
|
||||||
audio: 0,
|
url: record.deviceReverseIotUrl,
|
||||||
autoplay: true,
|
audio: 0,
|
||||||
// simple: 极简版; pcLive: pc直播; pcRec: pc回放; mobileLive: 移动端直播; mobileRec: 移动端回放;security: 安防版; voice: 语音版;
|
autoplay: true,
|
||||||
template: 'security',
|
// simple: 极简版; pcLive: pc直播; pcRec: pc回放; mobileLive: 移动端直播; mobileRec: 移动端回放;security: 安防版; voice: 语音版;
|
||||||
// themeData: this.themeData,
|
template: 'security',
|
||||||
plugin: ['expend'], // 加载插件，talk-对讲
|
// themeData: this.themeData,
|
||||||
height: 600,
|
plugin: ['expend'], // 加载插件，talk-对讲
|
||||||
showStreamInfo:false,
|
height: 600,
|
||||||
|
showStreamInfo:false,
|
||||||
|
})
|
||||||
|
playerType.value = 'ys';
|
||||||
|
|
||||||
|
const videosWrap = document.getElementById('videos-wrap');
|
||||||
|
videosWrap.style.height = '100%';
|
||||||
})
|
})
|
||||||
playerType.value = 'ys';
|
}
|
||||||
|
}else{
|
||||||
|
|
||||||
const videosWrap = document.getElementById('videos-wrap');
|
if(record.deviceIotUrl && record.deviceIotUrl != ''){
|
||||||
videosWrap.style.height = '100%';
|
let videohtml =
|
||||||
})
|
`<div style="width: 100%;height: 600px;margin:auto;"><div id="videos" style="width: 100%; height: 100%"></div></div>`
|
||||||
}else if(record.deviceUrl && record.deviceUrl !=''){
|
nextTick(() => {
|
||||||
let video = document.createElement('video');
|
let dom = document.querySelector('#parent2')
|
||||||
video.id = `videos`;
|
dom.innerHTML = videohtml
|
||||||
video.className = `video-js example-video vjs-default-skin vjs-big-play-centered`;
|
player.value = new EZUIKit.EZUIKitPlayer({
|
||||||
video.autoplay = 'autoplay';
|
id: 'videos', // 视频容器ID
|
||||||
video.controls = 'controls';
|
accessToken: record.ysToken,
|
||||||
video.style = `object-fit: fill;width:100%;height:100%`;
|
url: record.deviceIotUrl,
|
||||||
video.preload = `auto`;
|
audio: 0,
|
||||||
video.muted = `muted`;
|
autoplay: true,
|
||||||
|
// simple: 极简版; pcLive: pc直播; pcRec: pc回放; mobileLive: 移动端直播; mobileRec: 移动端回放;security: 安防版; voice: 语音版;
|
||||||
|
template: 'security',
|
||||||
|
// themeData: this.themeData,
|
||||||
|
plugin: ['expend'], // 加载插件，talk-对讲
|
||||||
|
height: 600,
|
||||||
|
showStreamInfo:false,
|
||||||
|
})
|
||||||
|
playerType.value = 'ys';
|
||||||
|
|
||||||
nextTick(() => {
|
const videosWrap = document.getElementById('videos-wrap');
|
||||||
let dom = document.querySelector('#parent2')
|
videosWrap.style.height = '100%';
|
||||||
dom.innerHTML = '';//先清空
|
|
||||||
dom.appendChild(video)
|
|
||||||
player.value = videojs(`videos`, {
|
|
||||||
autoplay:true,
|
|
||||||
bigPlayButton: true,
|
|
||||||
textTrackDisplay: true,
|
|
||||||
posterImage: true,
|
|
||||||
errorDisplay: false,
|
|
||||||
controlBar: true,
|
|
||||||
height: 600,
|
|
||||||
preload:'metadata' ,
|
|
||||||
userActions: {
|
|
||||||
hotkeys: false // 禁用快捷键
|
|
||||||
},
|
|
||||||
sources:[{
|
|
||||||
src:record.deviceUrl,
|
|
||||||
type:'application/x-mpegURL'
|
|
||||||
}]
|
|
||||||
});
|
|
||||||
playerType.value = 'm3u8';
|
|
||||||
player.value.play();
|
|
||||||
})
|
|
||||||
}else if(record.deviceReverseIotUrl && record.deviceReverseIotUrl != ''){
|
|
||||||
let videohtml =
|
|
||||||
`<div style="width: 100%;height: 600px;margin:auto;"><div id="videos" style="width: 100%; height: 100%"></div></div>`
|
|
||||||
nextTick(() => {
|
|
||||||
let dom = document.querySelector('#parent2')
|
|
||||||
dom.innerHTML = videohtml
|
|
||||||
player.value = new EZUIKit.EZUIKitPlayer({
|
|
||||||
id: 'videos', // 视频容器ID
|
|
||||||
accessToken: record.ysToken,
|
|
||||||
url: record.deviceReverseIotUrl,
|
|
||||||
audio: 0,
|
|
||||||
autoplay: true,
|
|
||||||
// simple: 极简版; pcLive: pc直播; pcRec: pc回放; mobileLive: 移动端直播; mobileRec: 移动端回放;security: 安防版; voice: 语音版;
|
|
||||||
template: 'security',
|
|
||||||
// themeData: this.themeData,
|
|
||||||
plugin: ['expend'], // 加载插件，talk-对讲
|
|
||||||
height: 600,
|
|
||||||
showStreamInfo:false,
|
|
||||||
})
|
})
|
||||||
playerType.value = 'ys';
|
}else if(record.deviceUrl && record.deviceUrl !=''){
|
||||||
|
let video = document.createElement('video');
|
||||||
|
video.id = `videos`;
|
||||||
|
video.className = `video-js example-video vjs-default-skin vjs-big-play-centered`;
|
||||||
|
video.autoplay = 'autoplay';
|
||||||
|
video.controls = 'controls';
|
||||||
|
video.style = `object-fit: fill;width:100%;height:100%`;
|
||||||
|
video.preload = `auto`;
|
||||||
|
video.muted = `muted`;
|
||||||
|
|
||||||
const videosWrap = document.getElementById('videos-wrap');
|
nextTick(() => {
|
||||||
videosWrap.style.height = '100%';
|
let dom = document.querySelector('#parent2')
|
||||||
})
|
dom.innerHTML = '';//先清空
|
||||||
|
dom.appendChild(video)
|
||||||
|
player.value = videojs(`videos`, {
|
||||||
|
autoplay:true,
|
||||||
|
bigPlayButton: true,
|
||||||
|
textTrackDisplay: true,
|
||||||
|
posterImage: true,
|
||||||
|
errorDisplay: false,
|
||||||
|
controlBar: true,
|
||||||
|
height: 600,
|
||||||
|
preload:'metadata' ,
|
||||||
|
userActions: {
|
||||||
|
hotkeys: false // 禁用快捷键
|
||||||
|
},
|
||||||
|
sources:[{
|
||||||
|
src:record.deviceUrl,
|
||||||
|
type:'application/x-mpegURL'
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
playerType.value = 'm3u8';
|
||||||
|
player.value.play();
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
||||||
|
|
@ -45,6 +45,7 @@
|
||||||
* 查看监控
|
* 查看监控
|
||||||
*/
|
*/
|
||||||
function handleMonitor(record) {
|
function handleMonitor(record) {
|
||||||
|
record.isRewind = false;
|
||||||
monitorRegisterModal.value.statistic(record);
|
monitorRegisterModal.value.statistic(record);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -52,6 +53,7 @@
|
||||||
* 查看历史监控
|
* 查看历史监控
|
||||||
*/
|
*/
|
||||||
function handleHisMonitor(record) {
|
function handleHisMonitor(record) {
|
||||||
|
record.isRewind = true;
|
||||||
monitorRegisterModal.value.statistic(record);
|
monitorRegisterModal.value.statistic(record);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue