From 2d132d7b66ea7354729cce46ab59d42e318152e2 Mon Sep 17 00:00:00 2001
From: mtvpls <mtvpls@redaaa.ip-ddns.com>
Date: Sun, 28 Dec 2025 23:08:19 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=BD=91=E9=A1=B5=E5=85=A8?=
 =?UTF-8?q?=E5=B1=8F=E8=BF=98=E6=98=BE=E7=A4=BA=E9=A1=B6=E9=83=A8=E5=92=8C?=
 =?UTF-8?q?=E5=BA=95=E9=83=A8=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/play/page.tsx         | 15 +++++++++++---
 src/components/PageLayout.tsx | 37 ++++++++++++++++++++++-------------
 2 files changed, 35 insertions(+), 17 deletions(-)

diff --git a/src/app/play/page.tsx b/src/app/play/page.tsx
index aa370d0..99e394e 100644
--- a/src/app/play/page.tsx
+++ b/src/app/play/page.tsx
@@ -104,6 +104,9 @@ function PlayPageClient() {
   // 网盘搜索弹窗状态
   const [showPansouDialog, setShowPansouDialog] = useState(false);
 
+  // 网页全屏状态 - 控制导航栏的显示隐藏
+  const [isWebFullscreen, setIsWebFullscreen] = useState(false);
+
   // 跳过片头片尾配置
   const [skipConfig, setSkipConfig] = useState<{
     enable: boolean;
@@ -4248,6 +4251,12 @@ function PlayPageClient() {
         lastPlaybackRateRef.current = artPlayerRef.current.playbackRate;
       });
 
+      // 监听网页全屏事件，控制导航栏显示隐藏
+      artPlayerRef.current.on('fullscreenWeb', (isFullscreen: boolean) => {
+        console.log('网页全屏状态变化:', isFullscreen);
+        setIsWebFullscreen(isFullscreen);
+      });
+
       // 监听视频可播放事件，这时恢复播放进度更可靠
       artPlayerRef.current.on('video:canplay', () => {
         // 若存在需要恢复的播放进度，则跳转
@@ -4509,7 +4518,7 @@ function PlayPageClient() {
 
   if (loading) {
     return (
-      <PageLayout activePath='/play'>
+      <PageLayout activePath='/play' hideNavigation={isWebFullscreen}>
         <div className='flex items-center justify-center min-h-screen bg-transparent'>
           <div className='text-center max-w-md mx-auto px-6'>
             {/* 动画影院图标 */}
@@ -4601,7 +4610,7 @@ function PlayPageClient() {
 
   if (error) {
     return (
-      <PageLayout activePath='/play'>
+      <PageLayout activePath='/play' hideNavigation={isWebFullscreen}>
         <div className='flex items-center justify-center min-h-screen bg-transparent'>
           <div className='text-center max-w-md mx-auto px-6'>
             {/* 错误图标 */}
@@ -4668,7 +4677,7 @@ function PlayPageClient() {
   }
 
   return (
-    <PageLayout activePath='/play'>
+    <PageLayout activePath='/play' hideNavigation={isWebFullscreen}>
       {/* TMDB背景图 */}
       {tmdbBackdrop && (
         <div
diff --git a/src/components/PageLayout.tsx b/src/components/PageLayout.tsx
index 29cf2d7..6c06380 100644
--- a/src/components/PageLayout.tsx
+++ b/src/components/PageLayout.tsx
@@ -10,37 +10,44 @@ import { VersionCheckProvider } from './VersionCheckProvider';
 interface PageLayoutProps {
   children: React.ReactNode;
   activePath?: string;
+  hideNavigation?: boolean; // 控制是否隐藏顶部和底部导航栏
 }
 
-const PageLayout = ({ children, activePath = '/' }: PageLayoutProps) => {
+const PageLayout = ({ children, activePath = '/', hideNavigation = false }: PageLayoutProps) => {
   return (
     <VersionCheckProvider>
       <div className='w-full min-h-screen'>
         {/* 移动端头部 */}
-        <MobileHeader showBackButton={['/play', '/live'].includes(activePath)} />
+        {!hideNavigation && (
+          <MobileHeader showBackButton={['/play', '/live'].includes(activePath)} />
+        )}
 
         {/* 主要布局容器 */}
         <div className='flex md:grid md:grid-cols-[auto_1fr] w-full min-h-screen md:min-h-auto'>
           {/* 侧边栏 - 桌面端显示，移动端隐藏 */}
-          <div className='hidden md:block'>
-            <Sidebar activePath={activePath} />
-          </div>
+          {!hideNavigation && (
+            <div className='hidden md:block'>
+              <Sidebar activePath={activePath} />
+            </div>
+          )}
 
           {/* 主内容区域 */}
           <div className='relative min-w-0 flex-1 transition-all duration-300'>
             {/* 桌面端左上角返回按钮 */}
-            {['/play', '/live'].includes(activePath) && (
+            {!hideNavigation && ['/play', '/live'].includes(activePath) && (
               <div className='absolute top-3 left-1 z-20 hidden md:flex'>
                 <BackButton />
               </div>
             )}
 
             {/* 桌面端顶部按钮 */}
-            <div className='absolute top-2 right-4 z-20 hidden md:flex items-center gap-2'>
-              <ThemeToggle />
-              <UserMenu />
-              <UpdateNotification />
-            </div>
+            {!hideNavigation && (
+              <div className='absolute top-2 right-4 z-20 hidden md:flex items-center gap-2'>
+                <ThemeToggle />
+                <UserMenu />
+                <UpdateNotification />
+              </div>
+            )}
 
             {/* 主内容 */}
             <main
@@ -55,9 +62,11 @@ const PageLayout = ({ children, activePath = '/' }: PageLayoutProps) => {
         </div>
 
         {/* 移动端底部导航 */}
-        <div className='md:hidden'>
-          <MobileBottomNav activePath={activePath} />
-        </div>
+        {!hideNavigation && (
+          <div className='md:hidden'>
+            <MobileBottomNav activePath={activePath} />
+          </div>
+        )}
       </div>
     </VersionCheckProvider>
   );