From eecd7b766f87538fc1e74b158b8809744d48e559 Mon Sep 17 00:00:00 2001 From: callmeyan Date: Tue, 24 Dec 2024 18:47:53 +0800 Subject: [PATCH] =?UTF-8?q?fixed=20=E7=9B=B4=E6=92=AD=E9=97=B4=E5=9B=A0?= =?UTF-8?q?=E4=B8=BA=E5=AD=97=E4=BD=93=E5=A4=A7=E5=B0=8F=E9=97=AE=E9=A2=98?= =?UTF-8?q?=E5=AF=BC=E8=87=B4=E6=97=A0=E6=B3=95=E5=AF=B9=E9=BD=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/button-batch.tsx | 4 +- src/components/video/player.tsx | 7 ++++ src/hooks/useCache.ts | 5 ++- src/pages/live/index.tsx | 37 +++++++++++-------- .../news/components/button-delete-batch.tsx | 1 - src/pages/video/index.tsx | 2 +- src/routes/layout/dashboard-layout.tsx | 14 ++++++- 7 files changed, 48 insertions(+), 22 deletions(-) diff --git a/src/components/button-batch.tsx b/src/components/button-batch.tsx index 83e9026..8d990bb 100644 --- a/src/components/button-batch.tsx +++ b/src/components/button-batch.tsx @@ -3,6 +3,7 @@ import {Modal} from "antd"; import {ButtonType} from "antd/es/button"; import {showErrorToast, showToast} from "@/components/message.ts"; import {BizError} from "@/service/types.ts"; +import {IconWarningCircle} from "@/components/icons"; type Props = { selected: any[], @@ -47,7 +48,8 @@ export default function ButtonBatch( return; } Modal.confirm({ - rootClassName:'root-modal-confirm', + wrapClassName:'root-modal-confirm', + icon: , title: title || '操作提示', centered: true, content: confirmMessage, diff --git a/src/components/video/player.tsx b/src/components/video/player.tsx index 213bc66..d76fc51 100644 --- a/src/components/video/player.tsx +++ b/src/components/video/player.tsx @@ -2,6 +2,7 @@ // import {PauseOutlined, PlayCircleOutlined, FullscreenOutlined, FullscreenExitOutlined} from "@ant-design/icons" // import {Progress} from "antd"; import React, {useEffect, useState} from "react"; +import {PlayerInstance} from "@/hooks/useCache.ts"; import TCPlayer from 'tcplayer.js'; import 'tcplayer.js/dist/tcplayer.min.css'; @@ -58,6 +59,10 @@ export const Player = React.forwardRef((props, ref) => { },[props.url, tcPlayer]) useEffect(() => { + if(PlayerInstance.length != 0){ + PlayerInstance.forEach(player => player.pause()) + PlayerInstance.length = 0 + } const playerVideo = document.createElement('video'); const playerId = `player-container-${Date.now().toString(16)}`; playerVideo.setAttribute('id', playerId) @@ -65,6 +70,8 @@ export const Player = React.forwardRef((props, ref) => { playerVideo.setAttribute('playsInline', 'true') playerVideo.setAttribute('webkit-playsinline', 'true') if(props.className) playerVideo.setAttribute('className', props.className) + playerVideo.classList.add('digital-video-player') + PlayerInstance.push(playerVideo) document.querySelector('.video-player-container-inner')!.appendChild(playerVideo) const player = TCPlayer(playerId, { diff --git a/src/hooks/useCache.ts b/src/hooks/useCache.ts index b89034f..bcccc33 100644 --- a/src/hooks/useCache.ts +++ b/src/hooks/useCache.ts @@ -1,6 +1,9 @@ import {create} from "zustand" - +export const PlayerInstance: HTMLVideoElement[] = []; +export const defaultCache:{ + firstLoadPath?: string +} = {}; type StoreInstance = { cache: T[]; clear: () => void; diff --git a/src/pages/live/index.tsx b/src/pages/live/index.tsx index d042402..05f92f4 100644 --- a/src/pages/live/index.tsx +++ b/src/pages/live/index.tsx @@ -1,5 +1,5 @@ import React, {useEffect, useMemo, useRef, useState} from "react"; -import {Checkbox, Modal} from "antd"; +import {Checkbox, Empty, Modal} from "antd"; import {SortableContext, arrayMove} from '@dnd-kit/sortable'; import {DndContext} from "@dnd-kit/core"; @@ -130,11 +130,14 @@ export default function LiveIndex() { loadList() return ()=>{ clearAllTimer(); - try{ - Array.from(document.querySelectorAll('video')).forEach(v => v.pause()) - }catch (e){ - console.log(e) - } + setTimeout(()=>{ + console.log('pause all video') + try{ + Array.from(document.querySelectorAll('video')).forEach(v => v.pause()) + }catch (e){ + console.log(e) + } + },20) } }, []) @@ -203,7 +206,6 @@ export default function LiveIndex() { }, [checkedIdArray, state.activeIndex]) return (
- {contextHolder}
@@ -226,26 +228,27 @@ export default function LiveIndex() {
- -
+
-
- 当前{state.activeIndex == -1 ? '暂未播放' : `播放到${state.activeIndex}条`}, - 共{videoData.length}条 +
+
+ 当前{state.activeIndex == -1 ? '暂未播放' : `播放到${state.activeIndex}条`}, + 共{videoData.length}条 +
-
+
{editable ? '已解锁' : '锁定状态不可排序'} - + {editable ? : }
- handleAllCheckedChange()}/> @@ -270,6 +273,7 @@ export default function LiveIndex() { onCallback={() => { }} > + {videoData.length == 0 &&
}
{ const {active, over} = e; @@ -327,5 +331,6 @@ export default function LiveIndex() { }
+ {contextHolder}
) } \ No newline at end of file diff --git a/src/pages/news/components/button-delete-batch.tsx b/src/pages/news/components/button-delete-batch.tsx index 8df378a..4060f68 100644 --- a/src/pages/news/components/button-delete-batch.tsx +++ b/src/pages/news/components/button-delete-batch.tsx @@ -26,7 +26,6 @@ export default function ButtonDeleteBatch(props: { ids: Id[];onSuccess?: () => v } modal.confirm({ wrapClassName:'root-modal-confirm', - className:'modal-confirm', title: `你确定要删除选择的 ${props.ids.length} 条新闻吗？`, content: '删除后需从新闻素材中重新选择', onOk: handlePush, diff --git a/src/pages/video/index.tsx b/src/pages/video/index.tsx index 2939d98..4e4cc63 100644 --- a/src/pages/video/index.tsx +++ b/src/pages/video/index.tsx @@ -180,7 +180,7 @@ export default function VideoIndex() {
setState({showToTop: top > 30})}> { - videoData.length == 0 ?
: + videoData.length == 0 ?
:
{ const {active, over} = e; diff --git a/src/routes/layout/dashboard-layout.tsx b/src/routes/layout/dashboard-layout.tsx index 5db3593..41648b0 100644 --- a/src/routes/layout/dashboard-layout.tsx +++ b/src/routes/layout/dashboard-layout.tsx @@ -1,6 +1,6 @@ -import {Outlet, useNavigate} from "react-router-dom"; +import {Outlet, useLocation, useNavigate} from "react-router-dom"; import {Dropdown, MenuProps} from "antd"; -import React from "react"; +import React, {useEffect} from "react"; import AuthGuard from "@/routes/layout/auth-guard.tsx"; import {LogoText} from "@/components/icons/logo.tsx"; @@ -10,6 +10,7 @@ import {DashboardNavigation} from "@/routes/layout/dashboard-navigation.tsx"; import useAuth from "@/hooks/useAuth.ts"; import {hidePhone} from "@/util/strings.ts"; +import {defaultCache} from "@/hooks/useCache.ts"; type LayoutProps = { @@ -70,7 +71,16 @@ export const BaseLayout: React.FC = ({children}) => { const DashboardLayout: React.FC<{ children?: React.ReactNode }> = ({children}) => { + const loc = useLocation() + const navigate = useNavigate() + useEffect(()=>{ + if(!defaultCache.firstLoadPath && loc.pathname == '/live'){ + defaultCache.firstLoadPath = loc.pathname; + navigate('/') + } + },[]) return +
first path:{defaultCache.firstLoadPath}
{children ? children : }