类型：开发
描述：
This commit is contained in:
@@ -26,7 +26,7 @@
|
||||
<el-input placeholder="请输入内容" v-model="cameraName" @input="onInput" />
|
||||
<img class="search-icon" src="/src/assets/images/search-icon-1.png" alt="" />
|
||||
</div>
|
||||
|
||||
|
||||
<div class="tree-box">
|
||||
<div class="tree-item" v-for="(item, i) in regionList" :key="i">
|
||||
<div class="tree-item__node" @click="handleRegions(i)">
|
||||
@@ -78,7 +78,7 @@
|
||||
</div>
|
||||
<video
|
||||
class="video-item__video"
|
||||
:id="'monitorVideo' + index"
|
||||
:id="'hotelmonitorVideo' + index"
|
||||
preload="auto"
|
||||
muted
|
||||
autoplay
|
||||
@@ -91,7 +91,7 @@
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="pagination">
|
||||
<el-pagination
|
||||
@@ -154,7 +154,7 @@
|
||||
</p>
|
||||
<video
|
||||
class="item-img"
|
||||
:id="'monitorVideo' + index"
|
||||
:id="'hotelmonitorVideo' + index"
|
||||
muted
|
||||
autoplay
|
||||
:controls="false"
|
||||
@@ -184,281 +184,347 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { getRegionsListApi,getPreviewUrlApi } from '@/api/home'
|
||||
import {
|
||||
getVideoTypeApi,
|
||||
getVideoRegionsApi,
|
||||
postVideoRemainApi,
|
||||
postVideoControlApi,
|
||||
postVideoCollectApi
|
||||
} from '@/api/monitor'
|
||||
import pubSub from 'pubsub-js'
|
||||
import Hls from 'hls.js'
|
||||
import emptyIco from '@/assets/images/n-icon.png'
|
||||
import { debounce } from 'lodash'
|
||||
const Z00M_IN = 'ZOOM_IN' // 焦距变大
|
||||
const Z00M_OUT = 'ZOOM_OUT' // 焦距变小
|
||||
const UP = 'UP' // 上转
|
||||
const DOWN = 'DOWN' // 下转
|
||||
const LEFT = 'LEFT' // 左转
|
||||
const RIGHT = 'RIGHT' // 右转
|
||||
const STOP = 'STOP' // 停止操作
|
||||
let cond = ref(false)
|
||||
let ACTION = '0'
|
||||
let hlsRefs = []
|
||||
let hlsRef = null
|
||||
let timer = null
|
||||
let videoLog = ref(1)
|
||||
let videoList = ref([])
|
||||
let cameraIndexCode = ref('')
|
||||
let videoRef = ref()
|
||||
let monitorChange = null
|
||||
let total = ref(0)
|
||||
let loading = ref(false)
|
||||
let command = ref('')
|
||||
let cameraName = ref('')
|
||||
let regionList = ref()
|
||||
let params = reactive({
|
||||
businessScenicArea: "",
|
||||
cameraName: "",
|
||||
pageNum: 1,
|
||||
pageSize: 6,
|
||||
})
|
||||
let show = ref(false)
|
||||
const onMonitorChange = () => {
|
||||
monitorChange = pubSub.subscribe('hotelChange', (res, data) => {
|
||||
params.businessScenicArea = data.name
|
||||
params.pageNum = 1
|
||||
videoList.value = []
|
||||
total.value = 0
|
||||
cond.value = false
|
||||
getRegionsList()
|
||||
})
|
||||
}
|
||||
// 关注
|
||||
const handleCollect = async (id, status, index) => {
|
||||
await postVideoCollectApi({
|
||||
cameraIndexCode:id,
|
||||
isCollect: status == 0 ? 1 : 0
|
||||
})
|
||||
if (status == 0) {
|
||||
thisVideo.value.isCollect=1
|
||||
videoList.value[index].isCollect = 1
|
||||
|
||||
} else {
|
||||
thisVideo.value.isCollect=0
|
||||
videoList.value[index].isCollect = 0
|
||||
}
|
||||
pubSub.publish('videoCollect', id)
|
||||
}
|
||||
// 采集
|
||||
const handleAction = async (e) => {
|
||||
if (e == STOP) {
|
||||
ACTION = '1'
|
||||
} else {
|
||||
ACTION = '0'
|
||||
command.value = e
|
||||
}
|
||||
await postVideoControlApi({
|
||||
action: ACTION,
|
||||
command: command.value,
|
||||
cameraIndexCode: cameraIndexCode.value
|
||||
})
|
||||
if (e == STOP) {
|
||||
command.value = ''
|
||||
}
|
||||
ElMessage({
|
||||
message: '操作成功',
|
||||
type: 'success'
|
||||
})
|
||||
}
|
||||
// 返回列表
|
||||
const handleBack = () => {
|
||||
videoLog.value = 1
|
||||
hlsRef.destroy()
|
||||
initVideo()
|
||||
}
|
||||
let isCollect = ref(0)
|
||||
let isDiy = ref(0)
|
||||
let videoSrc = ref('')
|
||||
const handleCamera = async (itemCode,resource) => {
|
||||
show.value = true
|
||||
let res = await getPreviewUrlApi({
|
||||
type: 'hls',
|
||||
cameraIndexCode:itemCode
|
||||
})
|
||||
cameraIndexCode.value = itemCode;
|
||||
isCollect.value = resource.isCollect
|
||||
isDiy.value = resource.isDiy
|
||||
videoSrc.value = res.data.url
|
||||
}
|
||||
//清除 hls
|
||||
const clearHlsRefs = () => {
|
||||
if (hlsRefs.length > 0) {
|
||||
hlsRefs.map((item) => {
|
||||
item.destroy()
|
||||
})
|
||||
hlsRefs = []
|
||||
}
|
||||
}
|
||||
// 分页
|
||||
const currentChange = (e) => {
|
||||
clearHlsRefs()
|
||||
videoList.value = []
|
||||
getRegionsList()
|
||||
}
|
||||
//获取酒店视频列表
|
||||
const getRegionsList = async()=>{
|
||||
clearHlsRefs()
|
||||
videoLog.value = 1
|
||||
try {
|
||||
if (loading.value) return
|
||||
let res = await getRegionsListApi({...params})
|
||||
if (res.data.length > 0) {
|
||||
videoList.value = res.data
|
||||
cond.value = true
|
||||
total.value = res.total
|
||||
nextTick(() => {
|
||||
if(!videoList.value.length) return false
|
||||
videoList.value.forEach(async (x, index) => {
|
||||
const video = document.getElementById(`monitorVideo${index}`)
|
||||
const hls = new Hls({
|
||||
maxBufferLength: 10, // 最大缓冲长度（秒）
|
||||
maxMaxBufferLength: 15, // 缓冲区长度的上限
|
||||
maxBufferSize: 30 * 1000 * 1000 // 最大缓冲大小（字节）
|
||||
})
|
||||
hls.loadSource(x.hlsUrl)
|
||||
hls.attachMedia(video)
|
||||
hls.on(Hls.Events.MANIFEST_PARSED, () => {
|
||||
video.play()
|
||||
})
|
||||
hls.on(Hls.Events.ERROR, (event, data) => {
|
||||
console.error('HLS 播放器遇到错误:', data);
|
||||
// 根据错误类型进行处理
|
||||
// initVideo()
|
||||
if (data.fatal) {
|
||||
switch (data.type) {
|
||||
case Hls.ErrorTypes.NETWORK_ERROR:
|
||||
console.log('网络错误，尝试重新加载');
|
||||
hls.startLoad();
|
||||
break;
|
||||
case Hls.ErrorTypes.MEDIA_ERROR:
|
||||
console.log('媒体错误，尝试修复');
|
||||
hls.recoverMediaError();
|
||||
break;
|
||||
default:
|
||||
console.log('无法恢复的错误，销毁播放器');
|
||||
// hls.destroy();
|
||||
break;
|
||||
}
|
||||
}
|
||||
})
|
||||
hlsRefs.push(hls)
|
||||
})
|
||||
})
|
||||
} else {
|
||||
videoList.value = []
|
||||
cond.value = true
|
||||
if (timer) clearInterval(timer)
|
||||
}
|
||||
loading.value = false
|
||||
}catch (error) {
|
||||
loading.value = false
|
||||
}
|
||||
import { getVideCollectCate,getVideCollectCateSort,getColletDiyApi,getPreviewUrlApi} from '@/api/home'
|
||||
import {
|
||||
getVideoTypeApi,
|
||||
getVideoRegionsApi,
|
||||
postVideoRemainApi,
|
||||
postVideoControlApi,
|
||||
postVideoCollectApi
|
||||
} from '@/api/monitor'
|
||||
import draggable from 'vuedraggable';
|
||||
import pubSub from 'pubsub-js'
|
||||
import Hls from 'hls.js'
|
||||
import emptyIco from '@/assets/images/n-icon.png'
|
||||
import { debounce } from 'lodash'
|
||||
import mpegtsjs from "mpegts.js";
|
||||
// const Z00M_IN = 'ZOOM_IN' // 焦距变大
|
||||
// const Z00M_OUT = 'ZOOM_OUT' // 焦距变小
|
||||
// const UP = 'UP' // 上转
|
||||
// const DOWN = 'DOWN' // 下转
|
||||
// const LEFT = 'LEFT' // 左转
|
||||
// const RIGHT = 'RIGHT' // 右转
|
||||
// const STOP = 'STOP' // 停止操作
|
||||
const Z00M_IN = 'zoomin' // 焦距变大
|
||||
const Z00M_OUT = 'zoomout' // 焦距变小
|
||||
const UP = 'up' // 上转
|
||||
const DOWN = 'down' // 下转
|
||||
const LEFT = 'left' // 左转
|
||||
const RIGHT = 'right' // 右转
|
||||
const STOP = 'stop' // 停止操作
|
||||
let cond = ref(false)
|
||||
let ACTION = '0'
|
||||
let hlsRefs = []
|
||||
let hlsRef = null
|
||||
let timer = null
|
||||
let videoLog = ref(1)
|
||||
let videoList = ref([])
|
||||
let cameraIndexCode = ref('')
|
||||
let videoRef = ref()
|
||||
let monitorChange = null
|
||||
let total = ref(0)
|
||||
let loading = ref(false)
|
||||
let command = ref('')
|
||||
let cameraName = ref('')
|
||||
let regionList = ref()
|
||||
let params = reactive({
|
||||
businessScenicArea: "",
|
||||
cameraName: "",
|
||||
pageNum: 1,
|
||||
pageSize: 6,
|
||||
})
|
||||
let grad = ref(3)
|
||||
let show = ref(false)
|
||||
const onMonitorChange = () => {
|
||||
monitorChange = pubSub.subscribe('hotelChange', (res, data) => {
|
||||
params.businessScenicArea = data.name
|
||||
params.pageNum = 1
|
||||
videoList.value = []
|
||||
total.value = 0
|
||||
cond.value = false
|
||||
getRegionsList()
|
||||
})
|
||||
}
|
||||
//弹窗收藏监听
|
||||
const isDiyChange = (val)=>{
|
||||
console.log(val,11222)
|
||||
isDiy.value = val
|
||||
if(!val){
|
||||
show.value = false
|
||||
videoList.value[diyIndex.value].videos = videoList.value[diyIndex.value].videos.filter(item => item.cameraIndexCode !== cameraIndexCode.value);
|
||||
}
|
||||
// videoList.value[diyIndex.value].videos.forEach(async (it, i) => {
|
||||
|
||||
}
|
||||
let thisVideo = ref(null)
|
||||
const handleItemVideo = (url, type, code,item) => {
|
||||
thisVideo.value = item
|
||||
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 (type == 100) initVideo()
|
||||
}, 1000)
|
||||
}
|
||||
const initVideo = () => {
|
||||
clearHlsRefs()
|
||||
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)
|
||||
})
|
||||
})
|
||||
}
|
||||
watch(
|
||||
() => videoList.value,
|
||||
(val) => {
|
||||
if (val.length) {
|
||||
postVideoRemain()
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
// 更新视频
|
||||
const postVideoRemain = async () => {
|
||||
timer = setInterval(() => {
|
||||
postVideoRemainApi({
|
||||
cameraIndexCode: videoList.value.map((item) => item.cameraIndexCode)
|
||||
})
|
||||
}, 1500)
|
||||
}
|
||||
const getVideoRegions = async () => {
|
||||
let res = await getVideoRegionsApi({
|
||||
cameraName: cameraName.value,
|
||||
businessScenicArea: params.businessScenicArea
|
||||
})
|
||||
console.log(res,11111111111111)
|
||||
regionList.value = res.data
|
||||
regionList.value.forEach((item,index)=>{
|
||||
// item.show = true
|
||||
item.videoResources=item.resourcesList[0].videoResources
|
||||
})
|
||||
regionList.value[0].show = true
|
||||
|
||||
}
|
||||
const handleRegions = (e) => {
|
||||
regionList.value[e].show = !regionList.value[e].show
|
||||
}
|
||||
const onInput = debounce((e) => {
|
||||
getVideoRegions()
|
||||
}, 500)
|
||||
let hotelChange = null;
|
||||
onMounted(()=>{
|
||||
hotelChange = pubSub.subscribe('hotelChange', (msg, data) => {
|
||||
cameraName.value = ''
|
||||
params.businessScenicArea = data.name
|
||||
getVideoRegions()
|
||||
|
||||
})
|
||||
onMonitorChange()
|
||||
|
||||
})
|
||||
onUnmounted(() => {
|
||||
clearHlsRefs()
|
||||
if (hotelChange) pubSub.unsubscribe(hotelChange)
|
||||
if (timer) clearInterval(timer)
|
||||
pubSub.unsubscribe(monitorChange)
|
||||
})
|
||||
// if(it.cameraIndexCode == cameraIndexCode.value){
|
||||
// it.isDiy = val
|
||||
// }
|
||||
// })
|
||||
}
|
||||
const onStart = (res)=>{
|
||||
|
||||
}
|
||||
const onEnd = (evt)=>{
|
||||
const itemIndex = parseInt(evt.to.getAttribute('data-item-index')); // 当前拖拽的 item 的下标
|
||||
getVideCollectCateSort({
|
||||
key:videoList.value[itemIndex].key,
|
||||
cameraIndexCodes:videoList.value[itemIndex].videos.map((item) => item.cameraIndexCode)
|
||||
}).then((ress)=>{
|
||||
|
||||
// getVideCollectCateList()
|
||||
})
|
||||
// postVideoRemain()
|
||||
initVideo()
|
||||
}
|
||||
// 获取关注列表
|
||||
const getVideCollectCateList = async () => {
|
||||
clearHlsRefs()
|
||||
params.businessVideoDisplayPosition = ''
|
||||
let res = await getVideCollectCate(params)
|
||||
videoList.value = res.data
|
||||
if(videoList.value.length<=3){
|
||||
grad.value = 3
|
||||
}else if(videoList.value.length<=6){
|
||||
grad.value = 2
|
||||
}else{
|
||||
grad.value = 1
|
||||
}
|
||||
postVideoRemain()
|
||||
// total.value = res.total
|
||||
|
||||
initVideo()
|
||||
}
|
||||
// 收藏
|
||||
const handleCollect = async (id, status, index,element) => {
|
||||
await getColletDiyApi({
|
||||
cameraIndexCode:id,
|
||||
isDiy: status == 0 ? 1 : 0
|
||||
})
|
||||
if (status == 0) {
|
||||
|
||||
element.isDiy = 1
|
||||
|
||||
} else {
|
||||
|
||||
videoList.value[index].videos = videoList.value[index].videos.filter(item => item.cameraIndexCode !== id);
|
||||
console.log('取消收藏',)
|
||||
element.isDiy = 0
|
||||
show.value = false
|
||||
}
|
||||
// pubSub.publish('videoCollect', id)
|
||||
}
|
||||
// 采集
|
||||
const handleAction = async (e) => {
|
||||
if (e == STOP) {
|
||||
ACTION = '1'
|
||||
command.value = e
|
||||
} else {
|
||||
ACTION = '0'
|
||||
command.value = e
|
||||
}
|
||||
await postVideoControlApi({
|
||||
action: ACTION,
|
||||
command: command.value,
|
||||
cameraIndexCode: cameraIndexCode.value
|
||||
})
|
||||
if (e == STOP) {
|
||||
command.value = ''
|
||||
}
|
||||
ElMessage({
|
||||
message: '操作成功',
|
||||
type: 'success'
|
||||
})
|
||||
}
|
||||
// 返回列表
|
||||
const handleBack = () => {
|
||||
videoLog.value = 1
|
||||
hlsRef.destroy()
|
||||
initVideo()
|
||||
}
|
||||
let isCollect = ref(0)
|
||||
let isDiy = ref(0)
|
||||
let videoSrc = ref('')
|
||||
let diyIndex = ref(null)
|
||||
const handleCamera = async (itemCode,resource,index) => {
|
||||
diyIndex.value = index
|
||||
show.value = true
|
||||
let res = await getPreviewUrlApi({
|
||||
type: 'hls',
|
||||
cameraIndexCode:itemCode
|
||||
})
|
||||
cameraIndexCode.value = itemCode;
|
||||
isCollect.value = resource.isCollect
|
||||
isDiy.value = resource.isDiy
|
||||
videoSrc.value = res.data.url
|
||||
}
|
||||
//清除 hls
|
||||
const clearHlsRefs = () => {
|
||||
if (hlsRefs.length > 0) {
|
||||
hlsRefs.map((item) => {
|
||||
item.destroy()
|
||||
})
|
||||
hlsRefs = []
|
||||
}
|
||||
}
|
||||
// 分页
|
||||
const currentChange = (e) => {
|
||||
clearHlsRefs()
|
||||
videoList.value = []
|
||||
getRegionsList()
|
||||
}
|
||||
|
||||
let thisVideo = ref(null)
|
||||
const handleItemVideo = (url, type, code,item) => {
|
||||
thisVideo.value = item
|
||||
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 (type == 100) initVideo()
|
||||
}, 1000)
|
||||
}
|
||||
const createPlayer = (cameraIndexCode,videoElement) => {
|
||||
getPreviewUrlApi({
|
||||
type: 'hls',
|
||||
cameraIndexCode: cameraIndexCode
|
||||
}).then(res=>{
|
||||
const url = res.data.url;
|
||||
if(url.startsWith('ws')){
|
||||
const player = mpegtsjs.createPlayer({
|
||||
url: url,
|
||||
type: 'flv',
|
||||
isLive: true,
|
||||
hasAudio: false
|
||||
})
|
||||
player.attachMediaElement(videoElement)
|
||||
player.load()
|
||||
player.play()
|
||||
// 错误处理和重连机制
|
||||
player.on(mpegtsjs.Events.ERROR, (err) => {
|
||||
player.unload();
|
||||
player.destroy();
|
||||
console.error('播放器错误:', err)
|
||||
// 3 秒后尝试重新加载
|
||||
setTimeout(() => {
|
||||
console.error('重新加载【'+cameraIndexCode+'】' )
|
||||
createPlayer(cameraIndexCode,videoElement);
|
||||
}, 3000)
|
||||
})
|
||||
|
||||
hlsRefs.push(player)
|
||||
}
|
||||
else{
|
||||
const player = new Hls({
|
||||
maxBufferLength: 10, // 最大缓冲长度（秒）
|
||||
maxMaxBufferLength: 15, // 缓冲区长度的上限
|
||||
maxBufferSize: 30 * 1000 * 1000 // 最大缓冲大小（字节）
|
||||
})
|
||||
player.loadSource(url)
|
||||
player.attachMedia(videoElement)
|
||||
player.on(Hls.Events.MANIFEST_PARSED, () => {
|
||||
videoElement.play()
|
||||
})
|
||||
player.on(Hls.Events.ERROR, (event, data) => {
|
||||
// 根据错误类型进行处理
|
||||
if (data.fatal) {
|
||||
switch (data.type) {
|
||||
case Hls.ErrorTypes.NETWORK_ERROR:
|
||||
console.log('网络错误，尝试重新加载');
|
||||
player.startLoad();
|
||||
break;
|
||||
case Hls.ErrorTypes.MEDIA_ERROR:
|
||||
console.log('媒体错误，尝试修复');
|
||||
player.recoverMediaError();
|
||||
break;
|
||||
default:
|
||||
console.log('无法恢复的错误，销毁播放器');
|
||||
// hls.destroy();
|
||||
break;
|
||||
}
|
||||
}
|
||||
})
|
||||
hlsRefs.push(player)
|
||||
}
|
||||
})
|
||||
}
|
||||
const initVideo = () => {
|
||||
clearHlsRefs()
|
||||
nextTick(() => {
|
||||
videoList.value.forEach(async (it, i) => {
|
||||
|
||||
it.videos.forEach((item,index)=>{
|
||||
setTimeout(() => {
|
||||
const video = document.getElementById(`collectmonitorVideo${item.cameraIndexCode}`)
|
||||
createPlayer(item.cameraIndexCode,video);
|
||||
}, 1000)
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
}
|
||||
watch(
|
||||
() => videoList.value,
|
||||
(val) => {
|
||||
if (val.length) {
|
||||
postVideoRemain()
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
// 更新视频
|
||||
const postVideoRemain = async () => {
|
||||
// timer = setInterval(() => {
|
||||
// clearInterval(timer)
|
||||
// videoList.value.forEach((items,index)=>{
|
||||
// setTimeout(()=>{
|
||||
// postVideoRemainApi({
|
||||
// cameraIndexCode: items.videos.map((item) => item.cameraIndexCode)
|
||||
// })
|
||||
// },1500)
|
||||
//
|
||||
// })
|
||||
//
|
||||
// }, 1500)
|
||||
}
|
||||
const getVideoRegions = async () => {
|
||||
let res = await getVideoRegionsApi({
|
||||
cameraName: cameraName.value,
|
||||
businessScenicArea: params.businessScenicArea
|
||||
})
|
||||
console.log(res,11111111111111)
|
||||
regionList.value = res.data
|
||||
regionList.value.forEach((item,index)=>{
|
||||
// item.show = true
|
||||
item.videoResources=item.resourcesList[0].videoResources
|
||||
})
|
||||
regionList.value[0].show = true
|
||||
|
||||
}
|
||||
const handleRegions = (e) => {
|
||||
regionList.value[e].show = !regionList.value[e].show
|
||||
}
|
||||
const onInput = debounce((e) => {
|
||||
getVideoRegions()
|
||||
}, 500)
|
||||
let hotelChange = null;
|
||||
onMounted(()=>{
|
||||
getVideCollectCateList()
|
||||
console.log(draggable,'draggable')
|
||||
})
|
||||
onUnmounted(() => {
|
||||
if (timer) clearInterval(timer)
|
||||
clearHlsRefs()
|
||||
|
||||
})
|
||||
</script>
|
||||
<style></style>
|
||||
<style scoped lang="scss">
|
||||
@@ -506,7 +572,7 @@
|
||||
}
|
||||
}
|
||||
.video-box {
|
||||
|
||||
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex: 1;
|
||||
|
||||
Reference in New Issue
Block a user