♻️ refactor(classroom): 重构视频状态管理逻辑

- 将showVideo状态从ClassroomLayout组件迁移至useClassroom上下文
- 实现视频流订阅时自动显示视频区域的功能
- 在订阅用户视频流和屏幕分享流时自动设置showVideo为true

src/client/mobile/components/Classroom/ClassroomLayout.tsx

@@ -33,7 +33,6 @@ interface ClassroomLayoutProps {
 }
 
 export const ClassroomLayout = ({ children, role }: ClassroomLayoutProps) => {
-  const [showVideo, setShowVideo] = React.useState(false);
   const [showShareLink, setShowShareLink] = React.useState(false);
   const [isLandscape, setIsLandscape] = React.useState(false);
   const {
@@ -56,7 +55,9 @@ export const ClassroomLayout = ({ children, role }: ClassroomLayoutProps) => {
     showCameraOverlay,
     setShowCameraOverlay,
     showToast,
-    isPrivateClass
+    isPrivateClass,
+    showVideo,
+    setShowVideo
   } = useClassroomContext();
 
   // 检测是否为移动设备

src/client/mobile/components/Classroom/useClassroom.ts

@@ -110,6 +110,7 @@ export const useClassroom = ({ user }:{ user : User }) => {
   const [showCameraOverlay, setShowCameraOverlay] = useState<boolean>(true);
   const [onlineCount, setOnlineCount] = useState<number>(0);
   const [pvCount, setPvCount] = useState<number>(0);
+  const [showVideo, setShowVideo] = useState<boolean>(false);
 
   // SDK实例
   const imEngine = useRef<ImEngine | null>(null);
@@ -580,6 +581,8 @@ export const useClassroom = ({ user }:{ user : User }) => {
             
             console.log(`已订阅用户 ${userId} 的视频流`);
             showSystemMessage(`已显示用户 ${getUserNameByIdSync(userId)} 的视频`);
+            // 自动显示视频区域
+            setShowVideo(true);
           } catch (err) {
             console.error(`订阅用户 ${userId} 视频流失败:`, err);
             showSystemMessage(`订阅用户 ${getUserNameByIdSync(userId)} 视频流失败`);
@@ -641,6 +644,8 @@ export const useClassroom = ({ user }:{ user : User }) => {
             
             console.log(`已订阅用户 ${userId} 的屏幕分享流`);
             showSystemMessage(`已显示用户 ${getUserNameByIdSync(userId)} 的屏幕分享`);
+            // 自动显示视频区域
+            setShowVideo(true);
           } catch (err) {
             console.error(`订阅用户 ${userId} 屏幕分享流失败:`, err);
             showSystemMessage(`订阅用户 ${getUserNameByIdSync(userId)} 屏幕分享流失败`);
@@ -1614,6 +1619,8 @@ export const useClassroom = ({ user }:{ user : User }) => {
     remoteCameraContainer, // 导出摄像头容器ref
     showCameraOverlay,
     setShowCameraOverlay,
+    showVideo,
+    setShowVideo,
 
     // 方法
     login,