diff --git a/src/views/device/components/lib/custom/video-custom.js b/src/views/device/components/lib/custom/video-custom.js index de50e24..b5e2edc 100644 --- a/src/views/device/components/lib/custom/video-custom.js +++ b/src/views/device/components/lib/custom/video-custom.js @@ -103,14 +103,25 @@ const clearClss = ($wsControl) => { if ($flex1) $flex1.remove() } -export const rendererVideoPage = (opts = {}) => { +export const rendererVideoPage = async (opts = {}) => { + const defaults = { total: 0, pageSize: 10, current: 1, onChange: () => { }, onInit: undefined } + const params = { ...defaults, ...opts } + // 在 DOM 渲染完成后的下一个帧触发初始化回调 + if (typeof params.onInit === 'function') { + try { + const total = await params.onInit() + if (total && typeof total === "number") { + params.total = total + } + } catch (e) { + console.warn('[rendererVideoPage] onInit 回调执行异常', e) + } + } const $wsControl = document.querySelector(".ws-control") if (!$wsControl) return clearClss($wsControl) // 先查找有没有 video-page 元素 let $page = $wsControl.querySelector(`#${pageDivId}`) - const defaults = { total: 0, pageSize: 10, current: 1, onChange: () => { } } - const params = { ...defaults, ...opts } if (!$page) { const node = rendererPage(params.current, params.pageSize, params.total, params.onChange) if (typeof $wsControl.prepend === 'function') { diff --git a/src/views/device/components/preview-video/index.vue b/src/views/device/components/preview-video/index.vue index d0a2d73..a3c8d8f 100644 --- a/src/views/device/components/preview-video/index.vue +++ b/src/views/device/components/preview-video/index.vue @@ -54,7 +54,7 @@ async function init(channelCodelist: any, deviceCode: any) { } state.current = 1 state.num = 16 - initVideo() + refreshPage() } catch (error: any) { console.error("|视频预览初始化|,意外的错误", error); } @@ -63,7 +63,10 @@ async function init(channelCodelist: any, deviceCode: any) { // 初始化视频 async function initVideo() { if (query.list && query.list.length) { - state.num = findSuitableNum(query.list.length, state.numList) + const length = query.list.length + if (length < 16) { + state.num = findSuitableNum(length, state.numList) + } } const _params = { deviceChannelCodeList: query.list ?? [], @@ -121,7 +124,6 @@ function initPlayerManager() { realPlayer.setPlayerAdapter("stretching"); } playReal(); - refreshPage() break; // 主/辅码流切换回调 case "changeStreamType": @@ -154,6 +156,7 @@ function initPlayerManager() { case "windowNumChanged": console.log("每页", data); if (data == state.num) return + state.current = 1 state.num = data refreshPage() break; @@ -216,11 +219,15 @@ async function playReal() { } function refreshPage() { - console.log("total:", state.total); rendererVideoPage({ current: state.current, pageSize: state.num, total: state.total, + onInit: async () => { + destroy(); + await initVideo(); + return state.total + }, onChange: (page: any, pageSize: any) => { console.log("分页", page, pageSize); if (page == state.current && pageSize == state.num) { @@ -228,8 +235,7 @@ function refreshPage() { } state.current = page; state.num = pageSize; - destroy() - initVideo(); + refreshPage() } }) }