feat:黄炎培对话对接中

src/pages/chenyun/reflection/shared/VideoHandler.tsx

@@ -0,0 +1,88 @@
+/**
+ * 视频处理组件
+ * 处理视频播放、旁白、提示框的展示逻辑
+ */
+import { Video, Narration } from "@/components";
+import Alert from "@/components/layout/alert/title-alert";
+import type { FileType } from "./types";
+import { YINYUAN_VIDEO_CONFIG } from "../constants/yinyuan";
+import { MIMIAN_VIDEO_CONFIG } from "../constants/mimian";
+
+export interface VideoHandlerProps {
+  /** 当前播放的视频类型 */
+  playingVideo: FileType | null;
+  /** 旁白文本 */
+  narrationText: string;
+  /** 是否显示旁白 */
+  showNarration: boolean;
+  /** 是否显示提示框 */
+  showAlert: boolean;
+  /** 提示框配置 */
+  alertConfig: { title: string; subtitle: string };
+  /** 视频结束回调 */
+  onVideoEnd: () => void;
+  /** 旁白关闭回调 */
+  onNarrationClose: () => void;
+  /** 提示框关闭回调 */
+  onAlertClose: () => void;
+}
+
+/**
+ * 视频处理组件
+ * 根据 playingVideo 显示对应的视频，处理视频结束后的旁白和提示框
+ */
+export const VideoHandler = ({
+  playingVideo,
+  narrationText,
+  showNarration,
+  showAlert,
+  alertConfig,
+  onVideoEnd,
+  onNarrationClose,
+  onAlertClose,
+}: VideoHandlerProps) => {
+  // 获取当前视频配置
+  const getVideoConfig = () => {
+    if (playingVideo === "yinyuan") return YINYUAN_VIDEO_CONFIG;
+    if (playingVideo === "mimian") return MIMIAN_VIDEO_CONFIG;
+    return null;
+  };
+
+  const videoConfig = getVideoConfig();
+
+  return (
+    <>
+      {/* 视频播放层 */}
+      {playingVideo && videoConfig && (
+        <div className="absolute inset-0 z-40">
+          <Video
+            src={videoConfig.src}
+            autoPlay
+            showSkipButton
+            onEnded={onVideoEnd}
+            className="w-full h-full"
+          />
+        </div>
+      )}
+
+      {/* 旁白层（仅用于视频后的旁白，不再包含欢迎语） */}
+      <Narration
+        text={narrationText}
+        visible={showNarration}
+        onClose={onNarrationClose}
+        enableAnimation={playingVideo === "yinyuan"}
+      />
+
+      {/* 提示框 */}
+      {showAlert && (
+        <Alert
+          visible={showAlert}
+          title={alertConfig.title}
+          subtitle={alertConfig.subtitle}
+          onClose={onAlertClose}
+        />
+      )}
+    </>
+  );
+};
+