diff --git a/src/api/monitor.js b/src/api/monitor.js index f907bc5..47a869e 100644 --- a/src/api/monitor.js +++ b/src/api/monitor.js @@ -6,9 +6,9 @@ export function getTrafficEventsApi() { method: 'get' }) } -export function getVideoEventApi(scenicSpotId) { +export function getVideoEventApi(scenicSpotId,type) { return request({ - url: '/fjtcc-api/api/largeScreen/monitor/videoEvents?scenicSpotId='+scenicSpotId, + url: '/fjtcc-api/api/largeScreen/monitor/videoEvents?type='+type+'&scenicSpotId='+scenicSpotId, method: 'get' }) } diff --git a/src/components/monitor/index.vue b/src/components/monitor/index.vue index ce6aa3f..dca8c0c 100644 --- a/src/components/monitor/index.vue +++ b/src/components/monitor/index.vue @@ -8,7 +8,7 @@ v-for="(item, index) in navList" :key="index" > - {{ item.dictLabel }} + {{ item }} diff --git a/src/views/home/components/box-2.vue b/src/views/home/components/box-2.vue index fe63fd1..e8f7467 100644 --- a/src/views/home/components/box-2.vue +++ b/src/views/home/components/box-2.vue @@ -610,11 +610,11 @@ } &-tag--important { @extend .item-tag; - background: #feae00; + background: #d9011b; } &-tag--warn { @extend .item-tag; - background: #d9011b; + background: #feae00; } &-tag--normal { @extend .item-tag; diff --git a/src/views/hotel/components/video-box.vue b/src/views/hotel/components/video-box.vue index 3205916..8db7c89 100644 --- a/src/views/hotel/components/video-box.vue +++ b/src/views/hotel/components/video-box.vue @@ -243,11 +243,14 @@ isCollect: status == 0 ? 1 : 0 }) if (status == 0) { - thisVideo.value.isCollect=1 + if(thisVideo.value){ + thisVideo.value.isCollect=1 + } videoList.value[index].isCollect = 1 - } else { - thisVideo.value.isCollect=0 + if(thisVideo.value){ + thisVideo.value.isCollect=0 + } videoList.value[index].isCollect = 0 } pubSub.publish('videoCollect', id) @@ -394,16 +397,38 @@ videoLog.value = 2 cameraIndexCode.value = code setTimeout(() => { - hlsRef = new Hls({ - maxBufferLength: 10, // 最大缓冲长度(秒) - maxMaxBufferLength: 15, // 缓冲区长度的上限 - maxBufferSize: 30 * 1000 * 1000 // 最大缓冲大小(字节) - }) - hlsRef.loadSource(url) - hlsRef.attachMedia(videoRef.value) - hlsRef.on(Hls.Events.MANIFEST_PARSED, () => { - videoRef.value.play() - }) + if(url.startsWith('ws')){ + const player = mpegtsjs.createPlayer({ + url: url, + type: 'flv', + isLive: true, + hasAudio: false + }) + player.attachMediaElement(videoRef.value) + player.load() + player.play() + + // 错误处理和重连机制 + player.on('error', (err) => { + // 3 秒后尝试重新加载 + setTimeout(() => { + player.load() + player.play() + }, 3000) + }) + }else{ + hlsRef = new Hls({ + maxBufferLength: 10, // 最大缓冲长度(秒) + maxMaxBufferLength: 15, // 缓冲区长度的上限 + maxBufferSize: 30 * 1000 * 1000 // 最大缓冲大小(字节) + }) + hlsRef.loadSource(url) + hlsRef.attachMedia(videoRef.value) + hlsRef.on(Hls.Events.MANIFEST_PARSED, () => { + videoRef.value.play() + }) + } + if (type == 100) initVideo() }, 1000) } @@ -412,17 +437,39 @@ nextTick(() => { videoList.value.forEach(async (item, index) => { const video = document.getElementById(`monitorVideo${index}`) - const hls = new Hls({ - maxBufferLength: 10, // 最大缓冲长度(秒) - maxMaxBufferLength: 15, // 缓冲区长度的上限 - maxBufferSize: 30 * 1000 * 1000 // 最大缓冲大小(字节) - }) - hls.loadSource(item.hlsUrl) - hls.attachMedia(video) - hls.on(Hls.Events.MANIFEST_PARSED, () => { - video.play() - }) - hlsRefs.push(hls) + if(item.hlsUrl.startsWith('ws')){ + var player = mpegtsjs.createPlayer({ + url: item.hlsUrl, + type: 'flv', + isLive: true, + hasAudio: false + }) + player.attachMediaElement(video) + player.load() + player.play() + + // 错误处理和重连机制 + player.on('error', (err) => { + // 3 秒后尝试重新加载 + setTimeout(() => { + player.load() + player.play() + }, 3000) + }) + }else{ + const hls = new Hls({ + maxBufferLength: 10, // 最大缓冲长度(秒) + maxMaxBufferLength: 15, // 缓冲区长度的上限 + maxBufferSize: 30 * 1000 * 1000 // 最大缓冲大小(字节) + }) + hls.loadSource(item.hlsUrl) + hls.attachMedia(video) + hls.on(Hls.Events.MANIFEST_PARSED, () => { + video.play() + }) + hlsRefs.push(hls) + } + }) }) } diff --git a/src/views/monitor/components/box-2.vue b/src/views/monitor/components/box-2.vue index 5cc9ed2..4d5f005 100644 --- a/src/views/monitor/components/box-2.vue +++ b/src/views/monitor/components/box-2.vue @@ -10,9 +10,8 @@ :key="index" @click="handleNav(index)" > - - {{ item.dictLabel }} + {{ item }}