fixed 直播间因为字体大小问题导致无法对齐

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: <IconWarningCircle/>,
 			title: title || '操作提示',
 			centered: true,
 			content: confirmMessage,

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<PlayerInstance, Props>((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<PlayerInstance, Props>((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, {

src/hooks/useCache.ts

@@ -1,6 +1,9 @@
 import {create} from "zustand"
 
-
+export const PlayerInstance: HTMLVideoElement[] = [];
+export const defaultCache:{
+	firstLoadPath?: string
+} = {};
 type StoreInstance<T> = {
 	cache: T[];
 	clear: () => void;

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{
+			setTimeout(()=>{
-				Array.from(document.querySelectorAll('video')).forEach(v => v.pause())
+				console.log('pause all video')
-			}catch (e){
+				try{
-				console.log(e)
+					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 (<div className="container py-5 page-live">
-		{contextHolder}
 		<div className="h-[36px]"></div>
 		<div className="flex">
 			<div className="video-player-container mr-16 flex items-center">
@@ -226,26 +228,27 @@ export default function LiveIndex() {
 					</div>
 				</div>
 			</div>
-
+			<div className="video-list-container video-list-sort-container flex flex-col flex-1 mt-2">
-			<div className="video-list-container video-list-sort-container flex-1 mt-1">
 				<div className="live-control flex justify-between mb-1">
-					<div className="text-sm">
+					<div>
-						<span>当前{state.activeIndex == -1 ? '暂未播放' : `播放到${state.activeIndex}条`},</span>
+						<div className="text-sm">
-						<span>共{videoData.length}条</span>
+							<span>当前{state.activeIndex == -1 ? '暂未播放' : `播放到${state.activeIndex}条`},</span>
+							<span>共{videoData.length}条</span>
+						</div>
 					</div>
 
-					<div className="flex gap-2 items-center text-sm">
+					<div className="flex items-center">
 						<div className={'flex items-center text-gray-400 cursor-pointer select-none'}
 						     onClick={handleConfirm}>
 							<span>{editable ? '已解锁' : '锁定状态不可排序'}</span>
-							<span className="ml-2">
+							<span className="ml-2 text-sm">
 								{editable ? <IconUnlock/> : <IconLocked/>}
 							</span>
 						</div>
 						<div className="check-all ml-10">
-							<button className="hover:text-blue-300 text-gray-400 text-lg"
+							<button className="hover:text-blue-300 text-gray-400"
 							        onClick={handleAllCheckedChange}>
-								<span className="text-sm mr-2">全选</span>
+								<span className="text-sm mr-2 whitespace-nowrap">全选</span>
 								{/*<CheckCircleFilled className={clsx({'text-blue-500': state.checkedAll})}/>*/}
 							</button>
 							<Checkbox checked={state.checkedAll} onChange={() => handleAllCheckedChange()}/>
@@ -270,6 +273,7 @@ export default function LiveIndex() {
 							onCallback={() => {
 							}}
 						>
+							{videoData.length == 0 && <div className="m-auto py-16"><Empty/></div>}
 							<div className="sort-list-container flex-1">
 								<DndContext onDragEnd={(e) => {
 									const {active, over} = e;
@@ -327,5 +331,6 @@ export default function LiveIndex() {
                 <IconDelete/>
             </ButtonBatch>}
 		</div>
+		{contextHolder}
 	</div>)
 }

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,

src/pages/video/index.tsx

@@ -180,7 +180,7 @@ export default function VideoIndex() {
 					</div>
 					<InfiniteScroller loading={state.loading} ref={scrollerRef} onScroll={top => setState({showToTop: top > 30})}>
 						{
-							videoData.length == 0 ? <div className="m-auto"><Empty/></div> :
+							videoData.length == 0 ? <div className="m-auto py-16"><Empty/></div> :
 								<div className="sort-list-container flex-1">
 									<DndContext onDragEnd={(e) => {
 										const {active, over} = e;

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<LayoutProps> = ({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 <AuthGuard>
+		<div className="fixed">first path:{defaultCache.firstLoadPath}</div>
 		<BaseLayout>
 			{children ? children : <Outlet/>}
 		</BaseLayout>