feat:黄炎培对话对接中

src/pages/huangyanpei/place/place4.tsx

@@ -1,15 +1,22 @@
 import { useState } from "react";
-import { ExhibitOverlay, Title, Image, Cursor } from "@/components";
+import {
+  ExhibitOverlay,
+  Title,
+  Image,
+  Cursor,
+  StudyGuideModal,
+} from "@/components";
 import { getBackgroundImage, getStaticImage } from "@/lib/utils";
 import { useNavigate, useParams } from "react-router-dom";
 
 const starName = "huangyanpei";
 
-const exhibitSrcMap: Record<1 | 2 | 3 | 4, string> = {
+const exhibitSrcMap: Record<1 | 2 | 3 | 4 | 5, string> = {
   1: "huangyanpei/place4/6_006",
   2: "huangyanpei/place4/6_007",
   3: "huangyanpei/place4/6_008",
   4: "huangyanpei/place4/6_009",
+  5: "huangyanpei/place4/6_010",
 };
 
 const HuangyanpeiPlace4 = () => {
@@ -18,17 +25,19 @@ const HuangyanpeiPlace4 = () => {
     moduleName: string;
   }>();
 
-  const [activeExhibitId, setActiveExhibitId] = useState<1 | 2 | 3 | 4 | null>(
-    null
-  );
+  // 学习引导弹窗（进入场景即显示）
+  const [showGuideModal, setShowGuideModal] = useState(true);
+  const [activeExhibitId, setActiveExhibitId] = useState<
+    1 | 2 | 3 | 4 | 5 | null
+  >(null);
   const [visited, setVisited] = useState<Set<number>>(new Set());
 
-  const handleOpenExhibit = (index: 1 | 2 | 3 | 4) => {
+  const handleOpenExhibit = (index: 1 | 2 | 3 | 4 | 5) => {
     setActiveExhibitId(index);
   };
 
   const progressCount = visited.size;
-  const total = 4;
+  const total = 5;
   const completed = progressCount >= total;
   const subtitle = completed
     ? "探索黄炎培创立职教(已完成)"
@@ -82,6 +91,11 @@ const HuangyanpeiPlace4 = () => {
         onClick={() => handleOpenExhibit(4)}
         read={visited.has(4)}
       />
+      <Cursor
+        className="absolute right-205 top-110"
+        onClick={() => handleOpenExhibit(5)}
+        read={visited.has(5)}
+      />
 
       {completed && (
         <Image
@@ -108,6 +122,19 @@ const HuangyanpeiPlace4 = () => {
           setActiveExhibitId(null);
         }}
       />
+
+      {/* 学习引导（进入场景即显示，与 place1 保持一致） */}
+      <StudyGuideModal
+        visible={showGuideModal}
+        onContinue={() => setShowGuideModal(false)}
+        ailgn="left"
+      >
+        1、场景中出现动态光点的展品表示未浏览，可通过点击光点来了解展品背后的故事，通过滚轮可以放大展品，浏览展品后蓝色动态光点会变为已浏览状态；
+        {"\n"}
+        2、在学习过程中会掉落拼图碎片，拼图碎片会自动收入拼图盒中，拼图盒可以点击查看当前拼图收集情况，点击单个拼图可以回到获得拼图的场景再次学习；
+        {"\n"}
+        3、所有动态光点的展品全部学习后才能进入下一个场景学习；
+      </StudyGuideModal>
     </div>
   );
 };