diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索1-详情的详情.png b/src/assets/images/sunzhongshan/reflection/scene2/线索1-详情的详情.png new file mode 100644 index 0000000..2f1cbb4 Binary files /dev/null and b/src/assets/images/sunzhongshan/reflection/scene2/线索1-详情的详情.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索2-详情的详情.png b/src/assets/images/sunzhongshan/reflection/scene2/线索2-详情的详情.png new file mode 100644 index 0000000..c1c0409 Binary files /dev/null and b/src/assets/images/sunzhongshan/reflection/scene2/线索2-详情的详情.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索3-详情.png b/src/assets/images/sunzhongshan/reflection/scene2/线索3-详情.png new file mode 100644 index 0000000..0ad24dc Binary files /dev/null and b/src/assets/images/sunzhongshan/reflection/scene2/线索3-详情.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索3-详情的详情.png b/src/assets/images/sunzhongshan/reflection/scene2/线索3-详情的详情.png new file mode 100644 index 0000000..2c2c913 Binary files /dev/null and b/src/assets/images/sunzhongshan/reflection/scene2/线索3-详情的详情.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索3.png b/src/assets/images/sunzhongshan/reflection/scene2/线索3.png index 4529b53..7375555 100644 Binary files a/src/assets/images/sunzhongshan/reflection/scene2/线索3.png and b/src/assets/images/sunzhongshan/reflection/scene2/线索3.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索4-详情.png b/src/assets/images/sunzhongshan/reflection/scene2/线索4-详情.png index 0ad24dc..bd2eb3b 100644 Binary files a/src/assets/images/sunzhongshan/reflection/scene2/线索4-详情.png and b/src/assets/images/sunzhongshan/reflection/scene2/线索4-详情.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索4-详情的详情.png b/src/assets/images/sunzhongshan/reflection/scene2/线索4-详情的详情.png new file mode 100644 index 0000000..6dc2896 Binary files /dev/null and b/src/assets/images/sunzhongshan/reflection/scene2/线索4-详情的详情.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene2/线索4.png b/src/assets/images/sunzhongshan/reflection/scene2/线索4.png index 9dd3052..299b52b 100644 Binary files a/src/assets/images/sunzhongshan/reflection/scene2/线索4.png and b/src/assets/images/sunzhongshan/reflection/scene2/线索4.png differ diff --git a/src/assets/images/sunzhongshan/reflection/scene3/线索3-详情的详情.png b/src/assets/images/sunzhongshan/reflection/scene3/线索3-详情的详情.png new file mode 100644 index 0000000..f2a79ba Binary files /dev/null and b/src/assets/images/sunzhongshan/reflection/scene3/线索3-详情的详情.png differ diff --git a/src/assets/images/sunzhongshan/reflection/内置线索提示按钮.png b/src/assets/images/sunzhongshan/reflection/内置线索提示按钮.png new file mode 100644 index 0000000..2620556 Binary files /dev/null and b/src/assets/images/sunzhongshan/reflection/内置线索提示按钮.png differ diff --git a/src/components/clue/ClueBookModal.tsx b/src/components/clue/ClueBookModal.tsx index abbdb57..0e62372 100644 --- a/src/components/clue/ClueBookModal.tsx +++ b/src/components/clue/ClueBookModal.tsx @@ -10,6 +10,7 @@ export interface ClueBookModalProps { onClose: () => void; getClueImage: (clueId: string) => string; getClueDetailImage: (clueId: string) => string; + getClueHintImage?: (clueId: string) => string | null; } /** @@ -21,8 +22,10 @@ export const ClueBookModal = ({ onClose, getClueImage, getClueDetailImage, + getClueHintImage, }: ClueBookModalProps) => { const [selectedClueId, setSelectedClueId] = useState(null); + const [showClueHint, setShowClueHint] = useState(false); // 默认选中第一个已收集的线索 useEffect(() => { @@ -34,6 +37,18 @@ export const ClueBookModal = ({ } }, [visible, clues, selectedClueId]); + // 当切换线索时，关闭线索提示 + useEffect(() => { + setShowClueHint(false); + }, [selectedClueId]); + + // 检查当前线索是否有提示 + const hasClueHint = (clueId: string): boolean => { + if (!getClueHintImage) return false; + const hintImage = getClueHintImage(clueId); + return hintImage !== null && hintImage !== undefined; + }; + if (!visible) return null; const selectedClue = clues.find((c) => c.id === selectedClueId); @@ -108,13 +123,45 @@ export const ClueBookModal = ({ {/* 右侧：线索详情或对话 */}
{selectedClue && selectedClue.collected ? ( -
+
{/* 显示线索详情图片 */} -
+
+ {/* 线索提示描述（覆盖在详情图片上） */} + {showClueHint && + hasClueHint(selectedClue.id) && + getClueHintImage && ( +
+
+ + {/* 关闭按钮 */} + setShowClueHint(false)} + /> +
+
+ )} + {/* 线索提示按钮（右下角） */} + {hasClueHint(selectedClue.id) && ( +
+ setShowClueHint(true)} + /> +
+ )}
) : ( diff --git a/src/pages/sunzhongshan/reflection/scene1.tsx b/src/pages/sunzhongshan/reflection/scene1.tsx index 79d2cf7..099c371 100644 --- a/src/pages/sunzhongshan/reflection/scene1.tsx +++ b/src/pages/sunzhongshan/reflection/scene1.tsx @@ -237,6 +237,9 @@ const SunzhongshanReflectionScene1 = () => { setShowCompleteGuide(false); // 保存场景1完成状态 localStorage.setItem(`${starName}-reflection-scene1-completed`, "true"); + if (moduleName && starName) { + navigate(`/${moduleName}/${starName}/reflection2`); + } }; // 获取线索图片 @@ -446,7 +449,7 @@ const SunzhongshanReflectionScene1 = () => { {/* 题目1：今天的日期是？ */} { {/* 题目2：今天的日记写什么呢？ */} { {/* 题目3：作为五四运动的见证者、参与者,你觉得中国革命有望通过怎样的方式实现? */} { {/* 完成提示弹窗 */}
diff --git a/src/pages/sunzhongshan/reflection/scene2.tsx b/src/pages/sunzhongshan/reflection/scene2.tsx index cccbfc6..6518ef1 100644 --- a/src/pages/sunzhongshan/reflection/scene2.tsx +++ b/src/pages/sunzhongshan/reflection/scene2.tsx @@ -247,6 +247,9 @@ const SunzhongshanReflectionScene2 = () => { setShowCompleteGuide(false); // 保存场景2完成状态 localStorage.setItem(`${starName}-reflection-scene2-completed`, "true"); + if (moduleName && starName) { + navigate(`/${moduleName}/${starName}/reflection3`); + } }; // 获取线索图片 @@ -259,12 +262,22 @@ const SunzhongshanReflectionScene2 = () => { const getClueDetailImage = (clueId: string) => { const clueNumber = clueId.split("clue")[1]; // 线索3没有详情图片，返回线索图片 - if (clueNumber === "3") { - return getStaticImage(`${sceneId}/线索${clueNumber}`); - } + // if (clueNumber === "4") { + // return getStaticImage(`${sceneId}/线索${clueNumber}`); + // } return getStaticImage(`${sceneId}/线索${clueNumber}-详情`); }; + // 获取线索提示图片 + const getClueHintImage = (clueId: string): string | null => { + const clueNumber = clueId.split("clue")[1]; + // 场景2中线索1、2、3、4有提示 + if (clueNumber && ["1", "2", "3", "4"].includes(clueNumber)) { + return getStaticImage(`${sceneId}/线索${clueNumber}-详情的详情`); + } + return null; + }; + // 初始化线索（如果还没有） useEffect(() => { clueConfigs.forEach((clue) => { @@ -405,6 +418,7 @@ const SunzhongshanReflectionScene2 = () => { onClose={handleClueBookClose} getClueImage={getClueImage} getClueDetailImage={getClueDetailImage} + getClueHintImage={getClueHintImage} /> {/* 成功提示弹窗 */} @@ -460,7 +474,7 @@ const SunzhongshanReflectionScene2 = () => { {/* 题目1：当下无产阶级工人运动面对的敌人主要有哪些? */} { {/* 题目2：今天的日记写什么呢? */} { {/* 题目3：当下无产阶级工人运动面临困境,你觉得谁可以成为工人们的朋友? */} { {/* 完成提示弹窗 */}
diff --git a/src/pages/sunzhongshan/reflection/scene3.tsx b/src/pages/sunzhongshan/reflection/scene3.tsx index 4e2ab74..3e4b9cd 100644 --- a/src/pages/sunzhongshan/reflection/scene3.tsx +++ b/src/pages/sunzhongshan/reflection/scene3.tsx @@ -148,7 +148,11 @@ const SunzhongshanReflectionScene3 = () => { const handleBackpackClick = () => { // 如果不在主场景，提示需要先获取线索1 if (!isMainScene) { - setErrorAlertContent(showCursor ? "该线索已收集" : "请先获取线索1"); + setErrorAlertContent( + showCursor + ? "请点击光标进入下一个场景，再点击背包吧！" + : "请先获取线索1" + ); setShowErrorAlert(true); return; } @@ -255,6 +259,9 @@ const SunzhongshanReflectionScene3 = () => { setShowCompleteGuide(false); // 保存场景3完成状态 localStorage.setItem(`${starName}-reflection-scene3-completed`, "true"); + if (moduleName && starName) { + navigate(`/${moduleName}/${starName}/home`); + } }; // 处理 Cursor 点击 - 切换到主场景 @@ -275,6 +282,16 @@ const SunzhongshanReflectionScene3 = () => { return getStaticImage(`${sceneId}/线索${clueNumber}-详情`); }; + // 获取线索提示图片 + const getClueHintImage = (clueId: string): string | null => { + const clueNumber = clueId.split("clue")[1]; + // 场景3中只有线索3有提示 + if (clueNumber === "3") { + return getStaticImage(`${sceneId}/线索${clueNumber}-详情的详情`); + } + return null; + }; + // 初始化线索（如果还没有） useEffect(() => { clueConfigs.forEach((clue) => { @@ -447,6 +464,7 @@ const SunzhongshanReflectionScene3 = () => { onClose={handleClueBookClose} getClueImage={getClueImage} getClueDetailImage={getClueDetailImage} + getClueHintImage={getClueHintImage} /> {/* 成功提示弹窗 */} @@ -510,7 +528,7 @@ const SunzhongshanReflectionScene3 = () => { {/* 题目1：冯玉祥发动"北京政变"后邀请孙中山北上共商国是,各界对此事的看法如何? */} { {/* 题目2：毅然北上赴会的孙中山先生,为争取国家和平统一作出了哪些努力? */} { {/* 题目3：今天的日记写什么呢? */} { 'B.孙中山先生抵沪,来自百年后的我站在欢迎的人群中,终于亲眼见到了这位伟大的革命先行者。1924年的秋天,冯玉祥北京政变为国家的和平统一带来一线契机。回望历史,我们知道,这在中国近代的民族民主革命路途上,不过是一个插曲。但对于孙中山先生而言,抱病北上,不遗余力地宣传反帝反封建主张,几乎成为他为国家前途命运而作的最后争取。他在迷途中坚守,在变局中担当,穷极一生从未停下脚步。伟大复兴的新征程上,我们早已摆脱了屈辱与苦难,向着国家富强的光明前景、人民幸福的美好未来进发。先生"振兴中华"的呐喊犹在耳畔,"天下为公"的初心始终滚烫。今天我们所能做的,便是铭记这份坚守与担当,做跨越百年的追梦路上最坚定的继承者与前行者。', }, ]} - correctAnswer="A" + correctAnswer={undefined} errorMessage="" onSubmit={handleQuiz3Submit} zIndex={10001} @@ -567,7 +585,8 @@ const SunzhongshanReflectionScene3 = () => { {/* 完成提示弹窗 */}