1132 lines
43 KiB
TypeScript
1132 lines
43 KiB
TypeScript
import {
|
||
Image,
|
||
Video,
|
||
Narration,
|
||
Spotlight,
|
||
MultipleChoiceQuizPanel,
|
||
SingleChoiceQuizPanel,
|
||
ExhibitOverlay,
|
||
} from "@/components";
|
||
import Alert from "@/components/layout/alert";
|
||
import SuccessAlert from "@/components/layout/success-alert";
|
||
import ClueOverlay from "@/components/layout/clue";
|
||
import { ClueData } from "@/components/layout";
|
||
import {
|
||
cn,
|
||
getBackgroundImage,
|
||
getPublicPath,
|
||
getStaticImage,
|
||
} from "@/lib/utils";
|
||
import { useState, useMemo } from "react";
|
||
import { useNavigate, useParams } from "react-router-dom";
|
||
|
||
// starName 固定为 chenyun
|
||
const starName = "chenyun";
|
||
|
||
// 视频配置
|
||
const VIDEO_CONFIG = {
|
||
yinyuan: {
|
||
src: getPublicPath("video/chenyun/chenyun_15.mp4"),
|
||
narration: `1949年5月，上海解放，此时上海经济秩序混乱，一些资本家甚至说"共产党是军事一百分，政治八十分，财经打零分。"上海经济旧势力利用人们长期以来形成的担心钞票贬值的心理，大肆贩卖银元，掀起投机风潮。上海证券交易所是投机商的大本营，而大街小巷的银元贩子却更多。原来的一块银元值100人民币，到了6月4日已经涨到1100元，而涨势仍在继续。事实上，银元已经是上海市场的主要货币。有些商号只认银元，把人民币排斥到市场之外。上海，这个全国的经济心脏，能否在新政权手中恢复跳动？一场没有硝烟的经济战争即将打响。面对这硝烟弥漫的经济战线，陈云同志亲自参与指导了同旧经济势力间的"银元之战。你将化身陈云同志的特派员，直面这场'银元之战'。"`,
|
||
alert: {
|
||
title: '第一幕:"银元之战"--人民币的阵地争夺战',
|
||
subtitle: "上海目前出现大肆贩卖银元的情况,请你了解情况!",
|
||
},
|
||
},
|
||
mimian: {
|
||
src: getPublicPath("video/chenyun/chenyun_16.mp4"),
|
||
narration: "", // 没有旁白
|
||
alert: {
|
||
title: '第二幕:"米棉之战"--全国一盘棋的战略调度',
|
||
subtitle: "上海目前出现米棉物资短缺的情况,请你先了解情况!",
|
||
},
|
||
},
|
||
};
|
||
|
||
// 线索数据配置
|
||
const CLUE_DATA: Record<string, ClueData> = {
|
||
// 银元之战 - 线索1
|
||
"yinyuan-clue1": {
|
||
type: "text",
|
||
title: "线索一",
|
||
content: `沪市银元价格连日暴涨,
|
||
5月27日一块银元值100人民币,
|
||
6月3日涨到720元,
|
||
6月4日涨到1100元。`,
|
||
},
|
||
// 银元之战 - 线索2
|
||
"yinyuan-clue2": {
|
||
type: "text",
|
||
title: "线索二",
|
||
content: (
|
||
<div className="flex flex-col items-start text-left gap-2 px-14">
|
||
<div className="mb-8">
|
||
南京路的先施、永安、大新、新新等四大公司率先拒收人民币,甚至用银元标价。
|
||
</div>
|
||
<div>其他商户纷纷仿效,人民币在市场交易中地位下降。</div>
|
||
</div>
|
||
),
|
||
},
|
||
// 米棉之战 - 投机商情报
|
||
"mimian-intelligence": {
|
||
type: "text",
|
||
title: "投机商情报",
|
||
content: `申新财团囤积棉纱3万件,
|
||
扬言"控制纱布就能控制上海"。`,
|
||
},
|
||
// 米棉之战 - 全国物资分布
|
||
"mimian-distribution": {
|
||
type: "map",
|
||
mapImage: "chenyun/reflection/全国物资分布",
|
||
},
|
||
// 米棉之战 - 对话线索
|
||
"mimian-dialogue": {
|
||
type: "dialogue",
|
||
dialogues: [
|
||
{
|
||
character: "群众1",
|
||
avatar: "chenyun/reflection/群众1",
|
||
text: "米价一天涨三次，家里快断粮了",
|
||
},
|
||
{
|
||
character: "群众2",
|
||
avatar: "chenyun/reflection/群众2",
|
||
text: "钱庄都在囤媒，冬天没法取暖",
|
||
},
|
||
],
|
||
},
|
||
// 银元之战 - 电话线索
|
||
"yinyuan-phone": {
|
||
type: "audio",
|
||
text: `人民币进不了上海市场,问题很严重。必须让人民币站稳脚跟。`,
|
||
audioImage: "chenyun/reflection/录音",
|
||
},
|
||
};
|
||
|
||
const ChenyunReflection = () => {
|
||
const navigate = useNavigate();
|
||
const [expandedFile, setExpandedFile] = useState<"yinyuan" | "mimian" | null>(
|
||
null
|
||
);
|
||
const [playingVideo, setPlayingVideo] = useState<"yinyuan" | "mimian" | null>(
|
||
null
|
||
);
|
||
const [narrationText, setNarrationText] = useState(
|
||
`同学你好，欢迎来到跨越时空-体悟学习模块！
|
||
|
||
我们即将跨越时空，穿越到"银元之战"和"米棉之战"两个沉浸式场景，来感受陈云同志在1949年的上海是如何应对当时混乱的经济秩序的。`
|
||
);
|
||
const [showNarration, setShowNarration] = useState(true);
|
||
const [showAlert, setShowAlert] = useState(false);
|
||
const [alertConfig, setAlertConfig] = useState({ title: "", subtitle: "" });
|
||
const [currentClue, setCurrentClue] = useState<ClueData | null>(null);
|
||
const [currentClueKey, setCurrentClueKey] = useState<string | null>(null);
|
||
const [showClueOverlay, setShowClueOverlay] = useState(false);
|
||
// 记录每个线索的查看状态
|
||
const [clueStates, setClueStates] = useState<Record<string, boolean>>({
|
||
"yinyuan-clue1": false,
|
||
"yinyuan-clue2": false,
|
||
"mimian-intelligence": false,
|
||
"mimian-distribution": false,
|
||
"mimian-dialogue": false,
|
||
"yinyuan-phone": false,
|
||
});
|
||
|
||
// 判断银元之战的所有线索是否都已查看
|
||
const isYinyuanAllViewed = useMemo(() => {
|
||
return (
|
||
clueStates["yinyuan-clue1"] &&
|
||
clueStates["yinyuan-clue2"] &&
|
||
clueStates["yinyuan-phone"]
|
||
);
|
||
}, [clueStates]);
|
||
|
||
// 判断米棉之战的所有线索是否都已查看（用于自动显示题目）
|
||
const _isMimianAllViewed = useMemo(() => {
|
||
return (
|
||
clueStates["mimian-intelligence"] &&
|
||
clueStates["mimian-distribution"] &&
|
||
clueStates["mimian-dialogue"]
|
||
);
|
||
}, [clueStates]);
|
||
|
||
// 多选题1相关状态
|
||
const [showQuiz1, setShowQuiz1] = useState(false);
|
||
// 旁白文字状态（图2）
|
||
const [showNarration2, setShowNarration2] = useState(false);
|
||
const [narration2Text, setNarration2Text] = useState("");
|
||
// 多选题2相关状态
|
||
const [showQuiz2, setShowQuiz2] = useState(false);
|
||
// 成功提示框状态
|
||
const [showSuccessAlert, setShowSuccessAlert] = useState(false);
|
||
// 银元之战解决状态
|
||
const [isYinyuanSolved, setIsYinyuanSolved] = useState(false);
|
||
// 走势图图标显示状态（控制文件上的走势图图标是否显示）
|
||
const [showTrendChartIcon, setShowTrendChartIcon] = useState(true);
|
||
// 走势图大图显示状态
|
||
const [showTrendChartDetail, setShowTrendChartDetail] = useState(false);
|
||
|
||
// 米棉之战相关状态
|
||
const [showMimianQuiz1, setShowMimianQuiz1] = useState(false);
|
||
const [showMimianNarration1, setShowMimianNarration1] = useState(false);
|
||
const [showMimianQuiz2, setShowMimianQuiz2] = useState(false);
|
||
const [showMimianNarration2, setShowMimianNarration2] = useState(false);
|
||
const [showMimianQuiz3, setShowMimianQuiz3] = useState(false);
|
||
const [showMimianQuiz4, setShowMimianQuiz4] = useState(false);
|
||
const [showMimianNarration3, setShowMimianNarration3] = useState(false);
|
||
const [showMimianQuiz5, setShowMimianQuiz5] = useState(false);
|
||
const [showMimianNarration4, setShowMimianNarration4] = useState(false);
|
||
const [showMimianNarration5, setShowMimianNarration5] = useState(false);
|
||
const [isMimianSolved, setIsMimianSolved] = useState(false);
|
||
// 米棉之战成功提示框状态
|
||
const [showMimianSuccessAlert, setShowMimianSuccessAlert] = useState(false);
|
||
const [mimianSuccessAlertContent, setMimianSuccessAlertContent] =
|
||
useState("");
|
||
|
||
const { moduleName } = useParams<{
|
||
moduleName: string;
|
||
}>();
|
||
|
||
const handleFileClick = (fileType: "yinyuan" | "mimian") => {
|
||
// 如果已经展开，则收起
|
||
if (expandedFile === fileType) {
|
||
setExpandedFile(null);
|
||
return;
|
||
}
|
||
|
||
// 播放视频
|
||
setPlayingVideo(fileType);
|
||
};
|
||
|
||
const handleVideoEnd = () => {
|
||
if (!playingVideo) return;
|
||
|
||
const config = VIDEO_CONFIG[playingVideo];
|
||
|
||
// 银元之战：视频结束后显示旁白
|
||
if (playingVideo === "yinyuan") {
|
||
setNarrationText(config.narration);
|
||
setShowNarration(true);
|
||
}
|
||
// 米棉之战：视频结束后直接显示提示框
|
||
else if (playingVideo === "mimian") {
|
||
setPlayingVideo(null);
|
||
setAlertConfig(config.alert);
|
||
setShowAlert(true);
|
||
}
|
||
};
|
||
|
||
const handleNarrationClose = () => {
|
||
// 关闭旁白和视频后显示提示框
|
||
setShowNarration(false);
|
||
|
||
// 保存当前的文件类型用于后续展开
|
||
const currentFile = playingVideo;
|
||
setPlayingVideo(null);
|
||
|
||
if (currentFile) {
|
||
setAlertConfig(VIDEO_CONFIG[currentFile].alert);
|
||
setShowAlert(true);
|
||
}
|
||
};
|
||
|
||
const handleAlertClose = () => {
|
||
// 关闭提示框后展开线索
|
||
setShowAlert(false);
|
||
|
||
// 从 alertConfig 的 title 判断是哪个文件
|
||
if (alertConfig.title.includes("银元之战")) {
|
||
setExpandedFile("yinyuan");
|
||
} else if (alertConfig.title.includes("米棉之战")) {
|
||
setExpandedFile("mimian");
|
||
}
|
||
};
|
||
|
||
return (
|
||
<div
|
||
className="w-full h-full bg-cover bg-center bg-no-repeat"
|
||
style={{
|
||
backgroundImage: getBackgroundImage(`chenyun/reflection/底图`),
|
||
}}
|
||
>
|
||
{/* 离开按钮 */}
|
||
{expandedFile == null && (
|
||
<Image
|
||
className="absolute right-5 top-5"
|
||
src={getStaticImage("components/离开")}
|
||
button
|
||
onClick={() => {
|
||
if (moduleName && starName) {
|
||
navigate(`/${moduleName}/${starName}/home`);
|
||
}
|
||
}}
|
||
/>
|
||
)}
|
||
|
||
{/* 桌子位置 */}
|
||
<div className="relative w-full top-145 flex">
|
||
{/* 文件1:银元之战 */}
|
||
<div
|
||
id="yinyuan-file"
|
||
className={cn([
|
||
"relative left-60 cursor-pointer transition-all duration-500",
|
||
expandedFile === null || expandedFile === "yinyuan"
|
||
? "opacity-100 scale-100"
|
||
: "opacity-0 scale-75 pointer-events-none",
|
||
expandedFile !== "yinyuan" &&
|
||
"hover:scale-105 hover:brightness-115",
|
||
])}
|
||
onClick={() => handleFileClick("yinyuan")}
|
||
>
|
||
<Image src={getStaticImage("chenyun/reflection/文件1")} />
|
||
<span
|
||
className={cn([
|
||
"absolute left-0 bottom-1/2 z-10",
|
||
"w-full bg-black/60 px-4 py-2 rounded-2xl text-center",
|
||
"text-white text-3xl font-bold tracking-widest",
|
||
])}
|
||
>
|
||
{isYinyuanSolved ? "01银元之战(已解决)" : "01银元之战(未解决)"}
|
||
</span>
|
||
|
||
{/* 走势图 - 银元之战解决后显示，点击后隐藏 */}
|
||
{isYinyuanSolved && showTrendChartIcon && (
|
||
<div
|
||
className="absolute -top-40 left-1/2 -translate-x-1/2 cursor-pointer transition-all duration-300 hover:scale-105 z-2"
|
||
onClick={(e) => {
|
||
e.stopPropagation();
|
||
setShowTrendChartDetail(true);
|
||
}}
|
||
>
|
||
<Image src={getStaticImage("chenyun/reflection/走势图")} />
|
||
</div>
|
||
)}
|
||
|
||
{/* 引导标志 - 只在所有线索查看完后显示-前往解决按钮-去做题 */}
|
||
{isYinyuanAllViewed &&
|
||
!isYinyuanSolved &&
|
||
!showQuiz1 &&
|
||
!showNarration2 &&
|
||
!showQuiz2 &&
|
||
!showSuccessAlert && (
|
||
<div
|
||
className="absolute top-0 w-full h-full"
|
||
onClick={(e) => {
|
||
e.stopPropagation();
|
||
// 显示多选题1
|
||
setShowQuiz1(true);
|
||
}}
|
||
>
|
||
<Image
|
||
className="translate-x-26 -translate-y-2"
|
||
src={getStaticImage("chenyun/reflection/点击前往解决")}
|
||
button
|
||
/>
|
||
</div>
|
||
)}
|
||
</div>
|
||
|
||
{/* 银元之战：线索1 */}
|
||
<div
|
||
className={cn([
|
||
"absolute left-190 bottom-8 transition-all duration-300 delay-100 cursor-pointer",
|
||
"hover:scale-105 hover:brightness-115",
|
||
expandedFile === "yinyuan"
|
||
? "opacity-100 translate-y-0"
|
||
: "opacity-0 translate-y-10 pointer-events-none",
|
||
])}
|
||
onClick={() => {
|
||
const clue = CLUE_DATA["yinyuan-clue1"];
|
||
if (clue) {
|
||
setCurrentClue(clue);
|
||
setCurrentClueKey("yinyuan-clue1");
|
||
setShowClueOverlay(true);
|
||
}
|
||
}}
|
||
>
|
||
{/* 线索图片 */}
|
||
<Image src={getStaticImage("chenyun/reflection/线索1")} />
|
||
{/* 搜索图标 */}
|
||
{!clueStates["yinyuan-clue1"] && (
|
||
<Image
|
||
className="absolute left-1/2 top-[45%] pointer-events-none animate-search"
|
||
src={getStaticImage("chenyun/reflection/探索")}
|
||
/>
|
||
)}
|
||
{/* 已浏览标记 */}
|
||
{clueStates["yinyuan-clue1"] && (
|
||
<div className="absolute left-1/2 -translate-x-1/2 bottom-0 ml-5">
|
||
<span
|
||
className={cn([
|
||
"text-[#ae6400] text-3xl font-bold",
|
||
"[text-shadow:_-4px_-4px_0_#ffffff,_4px_-4px_0_#ffffff,_-4px_4px_0_#ffffff,_4px_4px_0_#ffffff,_-5px_0_0_#ffffff,_5px_0_0_#ffffff,_0_-5px_0_#ffffff,_0_5px_0_#ffffff]",
|
||
])}
|
||
>
|
||
已浏览
|
||
</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
{/* 银元之战：线索2 */}
|
||
<div
|
||
className={cn([
|
||
"absolute left-265 bottom-8 transition-all duration-300 delay-150 cursor-pointer",
|
||
"hover:scale-105 hover:brightness-115",
|
||
expandedFile === "yinyuan"
|
||
? "opacity-100 translate-y-0"
|
||
: "opacity-0 translate-y-10 pointer-events-none",
|
||
])}
|
||
onClick={() => {
|
||
const clue = CLUE_DATA["yinyuan-clue2"];
|
||
if (clue) {
|
||
setCurrentClue(clue);
|
||
setCurrentClueKey("yinyuan-clue2");
|
||
setShowClueOverlay(true);
|
||
}
|
||
}}
|
||
>
|
||
{/* 线索图片 */}
|
||
<Image src={getStaticImage("chenyun/reflection/线索2")} />
|
||
{/* 搜索图标 */}
|
||
{!clueStates["yinyuan-clue2"] && (
|
||
<Image
|
||
className="absolute left-1/2 top-[45%] pointer-events-none animate-search"
|
||
src={getStaticImage("chenyun/reflection/探索")}
|
||
/>
|
||
)}
|
||
{/* 已浏览标记 */}
|
||
{clueStates["yinyuan-clue2"] && (
|
||
<div className="absolute left-1/2 -translate-x-1/2 bottom-0 ml-5">
|
||
<span
|
||
className={cn([
|
||
"text-[#ae6400] text-3xl font-bold",
|
||
"[text-shadow:_-4px_-4px_0_#ffffff,_4px_-4px_0_#ffffff,_-4px_4px_0_#ffffff,_4px_4px_0_#ffffff,_-5px_0_0_#ffffff,_5px_0_0_#ffffff,_0_-5px_0_#ffffff,_0_5px_0_#ffffff]",
|
||
])}
|
||
>
|
||
已浏览
|
||
</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
|
||
{/* 文件2:米棉之战 */}
|
||
<div
|
||
className={cn([
|
||
"relative left-90 cursor-pointer transition-all duration-500",
|
||
expandedFile === null || expandedFile === "mimian"
|
||
? "opacity-100 scale-100"
|
||
: "opacity-0 scale-75 pointer-events-none",
|
||
expandedFile !== "mimian" && "hover:scale-105 hover:brightness-115",
|
||
])}
|
||
onClick={() => handleFileClick("mimian")}
|
||
>
|
||
<Image src={getStaticImage("chenyun/reflection/文件2")} />
|
||
<span
|
||
className={cn([
|
||
"absolute left-0 bottom-1/2",
|
||
"w-full bg-black/60 px-4 py-2 rounded-2xl text-center",
|
||
"text-white text-3xl font-bold tracking-widest",
|
||
])}
|
||
>
|
||
{isMimianSolved ? "02米棉之战(已解决)" : "02米棉之战(未解决)"}
|
||
</span>
|
||
</div>
|
||
|
||
{/* 米棉之战：线索-投机商情报 */}
|
||
<div
|
||
className={cn([
|
||
"absolute left-70 bottom-8 transition-all duration-300 delay-100 cursor-pointer",
|
||
"hover:scale-105 hover:brightness-115",
|
||
expandedFile === "mimian"
|
||
? "opacity-100 translate-y-0"
|
||
: "opacity-0 translate-y-10 pointer-events-none",
|
||
])}
|
||
onClick={() => {
|
||
const clue = CLUE_DATA["mimian-intelligence"];
|
||
if (clue) {
|
||
setCurrentClue(clue);
|
||
setCurrentClueKey("mimian-intelligence");
|
||
setShowClueOverlay(true);
|
||
}
|
||
}}
|
||
>
|
||
{/* 线索图片 */}
|
||
<Image src={getStaticImage("chenyun/reflection/投机商情报桌上")} />
|
||
{/* 搜索图标 */}
|
||
{!clueStates["mimian-intelligence"] && (
|
||
<Image
|
||
className="absolute left-1/2 top-[45%] pointer-events-none animate-search"
|
||
src={getStaticImage("chenyun/reflection/探索")}
|
||
/>
|
||
)}
|
||
{/* 已浏览标记 */}
|
||
{clueStates["mimian-intelligence"] && (
|
||
<div className="absolute left-1/2 -translate-x-1/2 bottom-0 ml-1">
|
||
<span
|
||
className={cn([
|
||
"text-[#ae6400] text-3xl font-bold whitespace-nowrap",
|
||
"[text-shadow:_-4px_-4px_0_#ffffff,_4px_-4px_0_#ffffff,_-4px_4px_0_#ffffff,_4px_4px_0_#ffffff,_-5px_0_0_#ffffff,_5px_0_0_#ffffff,_0_-5px_0_#ffffff,_0_5px_0_#ffffff]",
|
||
])}
|
||
>
|
||
已浏览
|
||
</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
{/* 米棉之战：线索-全国物资分布 */}
|
||
<div
|
||
className={cn([
|
||
"absolute left-135 bottom-8 transition-all duration-300 delay-150 cursor-pointer",
|
||
"hover:scale-105 hover:brightness-115",
|
||
expandedFile === "mimian"
|
||
? "opacity-100 translate-y-0"
|
||
: "opacity-0 translate-y-10 pointer-events-none",
|
||
])}
|
||
onClick={() => {
|
||
const clue = CLUE_DATA["mimian-distribution"];
|
||
if (clue) {
|
||
setCurrentClue(clue);
|
||
setCurrentClueKey("mimian-distribution");
|
||
setShowClueOverlay(true);
|
||
}
|
||
}}
|
||
>
|
||
{/* 线索图片 */}
|
||
<Image src={getStaticImage("chenyun/reflection/全国物资分布桌上")} />
|
||
{/* 搜索图标 */}
|
||
{!clueStates["mimian-distribution"] && (
|
||
<Image
|
||
className="absolute left-1/2 top-[45%] pointer-events-none animate-search"
|
||
src={getStaticImage("chenyun/reflection/探索")}
|
||
/>
|
||
)}
|
||
{/* 已浏览标记 */}
|
||
{clueStates["mimian-distribution"] && (
|
||
<div className="absolute left-1/2 -translate-x-1/2 bottom-0 ml-3">
|
||
<span
|
||
className={cn([
|
||
"text-[#ae6400] text-3xl font-bold whitespace-nowrap",
|
||
"[text-shadow:_-4px_-4px_0_#ffffff,_4px_-4px_0_#ffffff,_-4px_4px_0_#ffffff,_4px_4px_0_#ffffff,_-5px_0_0_#ffffff,_5px_0_0_#ffffff,_0_-5px_0_#ffffff,_0_5px_0_#ffffff]",
|
||
])}
|
||
>
|
||
已浏览
|
||
</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
|
||
{/* 米棉之战：消息（对话线索） */}
|
||
<div
|
||
className={cn([
|
||
"absolute left-155 -top-118 transition-all duration-300 delay-200 cursor-pointer",
|
||
"hover:scale-105 hover:brightness-115",
|
||
expandedFile === "mimian"
|
||
? "opacity-100 translate-y-0"
|
||
: "opacity-0 -translate-y-10 pointer-events-none",
|
||
])}
|
||
onClick={() => {
|
||
const clue = CLUE_DATA["mimian-dialogue"];
|
||
if (clue) {
|
||
setCurrentClue(clue);
|
||
setCurrentClueKey("mimian-dialogue");
|
||
setShowClueOverlay(true);
|
||
}
|
||
}}
|
||
>
|
||
<Image src={getStaticImage("chenyun/reflection/对话气泡")} button />
|
||
{/* 未倾听时显示三个点动画 */}
|
||
{!clueStates["mimian-dialogue"] && (
|
||
<div className="absolute left-1/2 -translate-x-1/2 top-1/2 -translate-y-1/2 flex items-center justify-center">
|
||
<div className="animate-dots flex gap-2">
|
||
<span className="w-3 h-3 bg-gray-500 rounded-full inline-block" />
|
||
<span className="w-3 h-3 bg-gray-500 rounded-full inline-block" />
|
||
<span className="w-3 h-3 bg-gray-500 rounded-full inline-block" />
|
||
</div>
|
||
</div>
|
||
)}
|
||
{/* 已倾听标记 */}
|
||
{clueStates["mimian-dialogue"] && (
|
||
<div className="absolute left-1/2 -translate-x-1/2 bottom-16">
|
||
<span
|
||
className={cn([
|
||
"text-[#ae6400] text-3xl font-bold whitespace-nowrap",
|
||
"[text-shadow:_-4px_-4px_0_#ffffff,_4px_-4px_0_#ffffff,_-4px_4px_0_#ffffff,_4px_4px_0_#ffffff,_-5px_0_0_#ffffff,_5px_0_0_#ffffff,_0_-5px_0_#ffffff,_0_5px_0_#ffffff]",
|
||
])}
|
||
>
|
||
已倾听
|
||
</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
|
||
{/* 电话 - 只有银元之战有 */}
|
||
<div className="absolute right-50.5 -top-41">
|
||
<div className="relative">
|
||
{/* 响铃图标 */}
|
||
{!clueStates["yinyuan-phone"] && expandedFile === "yinyuan" && (
|
||
<Image
|
||
className="absolute left-[45%] -translate-x-1/2 -top-32 animate-bounce"
|
||
src={getStaticImage("chenyun/reflection/电话响")}
|
||
/>
|
||
)}
|
||
{/* 电话 */}
|
||
<Image
|
||
src={getStaticImage("chenyun/reflection/电话")}
|
||
button
|
||
onClick={() => {
|
||
if (expandedFile !== "yinyuan") return;
|
||
const clue = CLUE_DATA["yinyuan-phone"];
|
||
if (clue) {
|
||
setCurrentClue(clue);
|
||
setCurrentClueKey("yinyuan-phone");
|
||
setShowClueOverlay(true);
|
||
}
|
||
}}
|
||
/>
|
||
{/* 已接听标记 */}
|
||
{clueStates["yinyuan-phone"] && expandedFile === "yinyuan" && (
|
||
<div className="absolute left-[40%] -translate-x-1/2 bottom-0">
|
||
<span
|
||
className={cn([
|
||
"text-[#ae6400] text-3xl font-bold",
|
||
"[text-shadow:_-4px_-4px_0_#ffffff,_4px_-4px_0_#ffffff,_-4px_4px_0_#ffffff,_4px_4px_0_#ffffff,_-5px_0_0_#ffffff,_5px_0_0_#ffffff,_0_-5px_0_#ffffff,_0_5px_0_#ffffff]",
|
||
])}
|
||
>
|
||
已接听
|
||
</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
{/* 拼图盒 */}
|
||
<Image
|
||
className="absolute left-4 bottom-4"
|
||
src={getStaticImage("components/拼图盒")}
|
||
/>
|
||
|
||
{/* 视频播放层 */}
|
||
{playingVideo && (
|
||
<div className="absolute inset-0 z-40">
|
||
<Video
|
||
src={VIDEO_CONFIG[playingVideo].src}
|
||
autoPlay
|
||
showSkipButton
|
||
onEnded={handleVideoEnd}
|
||
className="w-full h-full"
|
||
/>
|
||
</div>
|
||
)}
|
||
|
||
{/* 旁白层（包含欢迎语和视频后的旁白） */}
|
||
<Narration
|
||
text={narrationText}
|
||
visible={showNarration}
|
||
onClose={handleNarrationClose}
|
||
enableAnimation={playingVideo === "yinyuan"}
|
||
/>
|
||
|
||
{/* 提示框 */}
|
||
{showAlert && (
|
||
<Alert
|
||
visible={showAlert}
|
||
title={alertConfig.title}
|
||
subtitle={alertConfig.subtitle}
|
||
onClose={handleAlertClose}
|
||
/>
|
||
)}
|
||
|
||
{/* 展示线索 */}
|
||
{currentClue && (
|
||
<ClueOverlay
|
||
visible={showClueOverlay}
|
||
clue={currentClue}
|
||
onClose={() => {
|
||
setShowClueOverlay(false);
|
||
// 标记当前线索为已查看
|
||
if (currentClueKey) {
|
||
const newClueStates = {
|
||
...clueStates,
|
||
[currentClueKey]: true,
|
||
};
|
||
setClueStates(newClueStates);
|
||
|
||
// 检查米棉之战所有线索是否都已查看
|
||
const allMimianViewed =
|
||
newClueStates["mimian-intelligence"] &&
|
||
newClueStates["mimian-distribution"] &&
|
||
newClueStates["mimian-dialogue"];
|
||
|
||
// 如果所有米棉之战线索都已查看，自动显示单选题1
|
||
if (allMimianViewed && !showMimianQuiz1) {
|
||
setShowMimianQuiz1(true);
|
||
}
|
||
}
|
||
setCurrentClue(null);
|
||
setCurrentClueKey(null);
|
||
}}
|
||
/>
|
||
)}
|
||
|
||
{/* 遮罩层 - 当银元之战所有线索都已查看时显示 */}
|
||
<Spotlight
|
||
targetSelector="#yinyuan-file"
|
||
visible={
|
||
isYinyuanAllViewed &&
|
||
!showQuiz1 &&
|
||
!showNarration2 &&
|
||
!showQuiz2 &&
|
||
!showSuccessAlert &&
|
||
!isYinyuanSolved
|
||
}
|
||
padding={10}
|
||
borderRadius={8}
|
||
/>
|
||
|
||
{/* 成功提示框 - 多选题2答对后显示 */}
|
||
<SuccessAlert
|
||
visible={showSuccessAlert}
|
||
title="恭喜你, 选择正确!"
|
||
content="陈云同志的意见是:三管齐下,但核心是查封投机核心场所,逮捕首要分子。擒贼先擒王,打掉指挥部。"
|
||
onContinue={() => {
|
||
// 关闭聚光灯、标记银元之战为已解决、显示走势图
|
||
setIsYinyuanSolved(true);
|
||
setShowSuccessAlert(false);
|
||
}}
|
||
/>
|
||
|
||
{/* 走势图大图展示 - 使用 ExhibitOverlay */}
|
||
<ExhibitOverlay
|
||
visible={showTrendChartDetail}
|
||
src="chenyun/reflection/银元价格走势图"
|
||
description={`以上海为中心，代表"人民币信用"的绿色区域迅速覆盖全市，并向外辐射。`}
|
||
clickableAreas={[
|
||
{
|
||
name: "走势图",
|
||
// 假设走势图在图片的中心区域，可以根据实际图片调整位置
|
||
position: { left: 20, top: 20, width: 60, height: 60 },
|
||
onClick: () => {
|
||
// 点击走势图：隐藏文件上的走势图图标，播放米棉之战视频
|
||
setShowTrendChartIcon(false);
|
||
setShowTrendChartDetail(false);
|
||
// 播放米棉之战视频
|
||
setPlayingVideo("mimian");
|
||
},
|
||
},
|
||
]}
|
||
onClose={() => {
|
||
setShowTrendChartDetail(false);
|
||
// 普通关闭：进入米棉之战（展开米棉之战文件）
|
||
// setExpandedFile("mimian");
|
||
}}
|
||
/>
|
||
|
||
{/* 多选题1 - 点击引导图标后显示 */}
|
||
<MultipleChoiceQuizPanel
|
||
visible={showQuiz1}
|
||
title="面对银元投机狂潮,你认为首要突破口是? ()"
|
||
options={[
|
||
{ value: "A", label: "A. 政治攻势（警告、约谈）" },
|
||
{ value: "B", label: "B. 经济手段（抛售银元,以银元打银元）" },
|
||
{ value: "C", label: "C. 舆论动员（宣传人民币信用,发动群众）" },
|
||
]}
|
||
correctAnswer={["A", "B", "C"]}
|
||
errorMessage="单一措施效果有限,请尝试综合施策。"
|
||
minSelections={1}
|
||
maxSelections={3}
|
||
minSelectionsErrorMessage="单一措施效果有限,请尝试综合施策。"
|
||
submitText="提交"
|
||
onSubmit={(values, isCorrect) => {
|
||
if (isCorrect) {
|
||
// 关闭多选题1，显示旁白文字（图2）
|
||
setShowQuiz1(false);
|
||
setNarration2Text(
|
||
`六月五日,上海政府抛出十万银元,力图以银元制服银元,使价格回跌。全市举行了"反对银元投机,保障人民生活"的游行和宣传。上海市军委会主任陈毅在全市集会上警告投机奸商"赶快洗手不干,否则勿谓言之不预"。但这两手收效仍微。十万银元被投机商人一吸而空,六月七日银元每元的价格涨到一千八百元人民币。陈云同志判断:'单纯的经济手段已不足以震慑敌人,必须辅以坚定的行政与法律手段。`
|
||
);
|
||
setShowNarration2(true);
|
||
}
|
||
}}
|
||
onError={(error) => {
|
||
console.log("错误信息:", error);
|
||
}}
|
||
/>
|
||
|
||
{/* 旁白文字2（图2）- 多选题1答对后显示 */}
|
||
<Narration
|
||
text={narration2Text}
|
||
visible={showNarration2}
|
||
onClose={() => {
|
||
setShowNarration2(false);
|
||
// 关闭旁白后显示多选题2
|
||
setShowQuiz2(true);
|
||
}}
|
||
enableAnimation={false}
|
||
/>
|
||
|
||
{/* 多选题2（图3）- 关闭旁白后显示 */}
|
||
<MultipleChoiceQuizPanel
|
||
visible={showQuiz2}
|
||
title="面对投机商的猖狂反扑,下一步应采取何种决定性措施?"
|
||
options={[
|
||
{ value: "A", label: "A. 加大银元抛售量,耗尽投机资本。" },
|
||
{ value: "B", label: "B. 查封投机核心场所,逮捕首要分子。" },
|
||
{ value: "C", label: "C. 颁布法令,严禁银元计价流通。" },
|
||
]}
|
||
correctAnswer={["A", "B", "C"]}
|
||
errorMessage="单一措施效果有限,请尝试综合施策。"
|
||
minSelections={1}
|
||
maxSelections={3}
|
||
minSelectionsErrorMessage="单一措施效果有限,请尝试综合施策。"
|
||
submitText="提交"
|
||
onSubmit={(values, isCorrect) => {
|
||
if (isCorrect) {
|
||
// 关闭多选题2，显示成功提示框
|
||
setShowQuiz2(false);
|
||
setShowSuccessAlert(true);
|
||
}
|
||
}}
|
||
onError={(error) => {
|
||
console.log("错误信息:", error);
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题1（图1） */}
|
||
<SingleChoiceQuizPanel
|
||
visible={showMimianQuiz1}
|
||
title='题目1（单选题）:投机商集中冲击"两白一黑"的核心目的是( )。'
|
||
options={[
|
||
{ value: "A", label: "A. 满足市场需求" },
|
||
{ value: "B", label: "B. 扰乱经济秩序、动摇政权" },
|
||
]}
|
||
correctAnswer="B"
|
||
errorMessage="很抱歉,你选错了!请你再思考一下吧!"
|
||
onSubmit={(value, isCorrect) => {
|
||
if (isCorrect) {
|
||
setShowMimianQuiz1(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent("恭喜你,选择正确!");
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 成功提示框1 */}
|
||
<SuccessAlert
|
||
visible={
|
||
showMimianSuccessAlert &&
|
||
mimianSuccessAlertContent === "恭喜你,选择正确!"
|
||
}
|
||
title="恭喜你,选择正确!"
|
||
onContinue={() => {
|
||
setShowMimianSuccessAlert(false);
|
||
setMimianSuccessAlertContent("");
|
||
// 显示旁白1（图2）
|
||
setShowMimianNarration1(true);
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 旁白1（图2） */}
|
||
<Narration
|
||
text="为了打击投机资本势力,面对上海米价、纱价等上涨,又同时影响到整个华东和华北、中南等地的情况。陈云于1949年7月17日率领中财委抵达上海,开展了一系列的举措,7月27日至8月15日,陈云主持召开了华东、华北、华中、东北、西北5个大区的财经会议,商讨解决上海和全国面临的严峻经济形势问题和对策。"
|
||
visible={showMimianNarration1}
|
||
onClose={() => {
|
||
setShowMimianNarration1(false);
|
||
// 显示单选题2
|
||
setShowMimianQuiz2(true);
|
||
}}
|
||
enableAnimation={false}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题2（图3） */}
|
||
<SingleChoiceQuizPanel
|
||
visible={showMimianQuiz2}
|
||
title="你觉得此时解决上海和全国面临的严峻经济形势问题的对策应该是( )。"
|
||
options={[
|
||
{ value: "A", label: "A. 局部限购" },
|
||
{ value: "B", label: "B. 增发货币" },
|
||
{ value: "C", label: "C. 全国调运+集中抛售" },
|
||
]}
|
||
correctAnswer="C"
|
||
errorMessage="很抱歉,你选错了!请你再思考一下吧!"
|
||
onSubmit={(value, isCorrect) => {
|
||
if (isCorrect) {
|
||
setShowMimianQuiz2(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
`恭喜你,选择正确!结合当时市场情况,陈云同志在会上做出了"全国一盘棋"的指示。全国统筹调运粮食、棉花、煤炭填补缺口,筑牢物资基础。关键节点集中抛售,让跟风囤货的投机商无力承接,因亏本和高利贷纷纷破产,快速平抑物价、稳固人民币地位。`
|
||
);
|
||
} else {
|
||
// 根据选项显示不同的错误信息
|
||
if (value === "A") {
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"很抱歉,你选错了!当时物价上涨已波及多地区,局部限购无法阻止投机商转移物资炒作。上海米、棉依赖外部供应,本地物资匮乏,限购既不解决缺口,还会加剧民众恐慌,扰乱市场秩序。请你再思考一下吧!"
|
||
);
|
||
} else if (value === "B") {
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"很抱歉,你选错了!当时国民党滥发货币导致的贬值阴影未消,民众对新货币缺乏信任。此时增发人民币,会使货币供应量远超物资总量,重蹈贬值覆辙,削弱人民币信用,让投机气焰更盛。请你再思考一下吧!"
|
||
);
|
||
}
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 成功提示框2（单选题2答对后） */}
|
||
<SuccessAlert
|
||
visible={
|
||
showMimianSuccessAlert &&
|
||
mimianSuccessAlertContent.includes("全国一盘棋")
|
||
}
|
||
title="恭喜你,选择正确!"
|
||
content={mimianSuccessAlertContent}
|
||
onContinue={() => {
|
||
setShowMimianSuccessAlert(false);
|
||
setMimianSuccessAlertContent("");
|
||
// 显示旁白2（图4）
|
||
setShowMimianNarration2(true);
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 错误提示框（单选题2答错后） */}
|
||
<SuccessAlert
|
||
visible={
|
||
showMimianSuccessAlert &&
|
||
mimianSuccessAlertContent.includes("很抱歉") &&
|
||
!mimianSuccessAlertContent.includes("全国一盘棋")
|
||
}
|
||
title="很抱歉,你选错了!"
|
||
content={mimianSuccessAlertContent}
|
||
onContinue={() => {
|
||
setShowMimianSuccessAlert(false);
|
||
setMimianSuccessAlertContent("");
|
||
// 重新显示单选题2
|
||
setShowMimianQuiz2(true);
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 旁白2（图4） */}
|
||
<Narration
|
||
text={`根据"全国一盘棋"的指示,中央政府通过全国范围内的物资调配体系,从多个区域调运米、棉、煤等关键物资支援上海。可是地方在落实推进过程中碰到了现实问题,作为陈云同志的特派员,你应该如何与地方沟通。`}
|
||
visible={showMimianNarration2}
|
||
onClose={() => {
|
||
setShowMimianNarration2(false);
|
||
// 显示单选题3
|
||
setShowMimianQuiz3(true);
|
||
}}
|
||
enableAnimation={false}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题3（图5） */}
|
||
<SingleChoiceQuizPanel
|
||
visible={showMimianQuiz3}
|
||
title='某地方粮站反馈"本地冬储粮不足,不愿外运"。'
|
||
options={[
|
||
{ value: "A", label: "A. 强制调运,否则追责" },
|
||
{
|
||
value: "B",
|
||
label: "B. 中央已协调东北补充常州冬储粮,先保障全国物价稳定",
|
||
},
|
||
]}
|
||
correctAnswer="B"
|
||
errorMessage="地方抵触,调运延误多天"
|
||
onSubmit={(value, isCorrect) => {
|
||
if (isCorrect) {
|
||
setShowMimianQuiz3(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"恭喜你,选择正确!地方配合,调运按时推进。"
|
||
);
|
||
} else {
|
||
setShowMimianQuiz3(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"很抱歉,你选错了!地方抵触,调运延误多天。请你再思考一下吧!"
|
||
);
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题3成功/错误提示 */}
|
||
<SuccessAlert
|
||
visible={
|
||
showMimianSuccessAlert &&
|
||
(mimianSuccessAlertContent.includes("地方配合") ||
|
||
mimianSuccessAlertContent.includes("地方抵触"))
|
||
}
|
||
title={
|
||
mimianSuccessAlertContent.includes("恭喜")
|
||
? "恭喜你,选择正确!"
|
||
: "很抱歉,你选错了!"
|
||
}
|
||
content={mimianSuccessAlertContent}
|
||
onContinue={() => {
|
||
setShowMimianSuccessAlert(false);
|
||
setMimianSuccessAlertContent("");
|
||
if (mimianSuccessAlertContent.includes("地方配合")) {
|
||
// 答对后显示单选题4
|
||
setShowMimianQuiz4(true);
|
||
} else {
|
||
// 答错后重新显示单选题3
|
||
setShowMimianQuiz3(true);
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题4（图6） */}
|
||
<SingleChoiceQuizPanel
|
||
visible={showMimianQuiz4}
|
||
title="某地方棉农担心外运后本地纱厂缺原料。"
|
||
options={[
|
||
{ value: "A", label: "A. 全国优先上海,本地暂时忍耐" },
|
||
{
|
||
value: "B",
|
||
label: "B. 上海纱厂稳定后,会优先供应本地布匹,实现全国共赢",
|
||
},
|
||
]}
|
||
correctAnswer="B"
|
||
errorMessage="棉农抵触,调运量减少"
|
||
onSubmit={(value, isCorrect) => {
|
||
if (isCorrect) {
|
||
setShowMimianQuiz4(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"恭喜你,选择正确!棉农支持,调运量足额完成。"
|
||
);
|
||
} else {
|
||
setShowMimianQuiz4(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"很抱歉,你选错了!棉农抵触,调运量减少。请你再思考一下吧!"
|
||
);
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题4成功/错误提示 */}
|
||
<SuccessAlert
|
||
visible={
|
||
showMimianSuccessAlert &&
|
||
(mimianSuccessAlertContent.includes("棉农支持") ||
|
||
mimianSuccessAlertContent.includes("棉农抵触"))
|
||
}
|
||
title={
|
||
mimianSuccessAlertContent.includes("恭喜")
|
||
? "恭喜你,选择正确!"
|
||
: "很抱歉,你选错了!"
|
||
}
|
||
content={mimianSuccessAlertContent}
|
||
onContinue={() => {
|
||
setShowMimianSuccessAlert(false);
|
||
setMimianSuccessAlertContent("");
|
||
if (mimianSuccessAlertContent.includes("棉农支持")) {
|
||
// 答对后显示旁白3
|
||
setShowMimianNarration3(true);
|
||
} else {
|
||
// 答错后重新显示单选题4
|
||
setShowMimianQuiz4(true);
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 旁白3（图7） */}
|
||
<Narration
|
||
text="在以陈云为首的中财委的统一部署下,人民政府在全国范围内调配粮食、棉布和煤炭等商品,在准备充分后,政府开始行动。11月25日,市场物价处在高峰,进入总攻阶段。"
|
||
visible={showMimianNarration3}
|
||
onClose={() => {
|
||
setShowMimianNarration3(false);
|
||
// 显示单选题5
|
||
setShowMimianQuiz5(true);
|
||
}}
|
||
enableAnimation={false}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题5（图8） */}
|
||
<SingleChoiceQuizPanel
|
||
visible={showMimianQuiz5}
|
||
title="弹出选择题:此时,以下哪种举措能够一举获得胜利?"
|
||
options={[
|
||
{
|
||
value: "A",
|
||
label:
|
||
"A:突然性、连续性大量抛售。在全国各地同时行动,上海、武汉、西安等地国营公司连续降价抛售粮棉,不给投机资本喘息之机",
|
||
},
|
||
{
|
||
value: "B",
|
||
label: `B:逐步降价,配合舆论引导,每日小幅降价,并通过报纸宣传政府物资充足,试图"劝退"投机商`,
|
||
},
|
||
]}
|
||
correctAnswer="A"
|
||
errorMessage="很抱歉,你选错了!投机商此前曾吃下政府平价抛售物资获利。逐步降价加舆论引导难让其信服,他们会持续囤货,政府储备会被消耗,反而让投机商掌控节奏,无法遏制物价上涨。请你再思考一下吧!"
|
||
onSubmit={(value, isCorrect) => {
|
||
if (isCorrect) {
|
||
setShowMimianQuiz5(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"恭喜你,选择正确!这契合米棉之战史实,多地同步大量抛售,让借高利贷囤货的投机商措手不及。连续抛售使其无力承接,只得亏本抛售,最终纷纷破产,快速稳住物价。"
|
||
);
|
||
} else {
|
||
setShowMimianQuiz5(false);
|
||
setShowMimianSuccessAlert(true);
|
||
setMimianSuccessAlertContent(
|
||
"很抱歉,你选错了!投机商此前曾吃下政府平价抛售物资获利。逐步降价加舆论引导难让其信服,他们会持续囤货,政府储备会被消耗,反而让投机商掌控节奏,无法遏制物价上涨。请你再思考一下吧!"
|
||
);
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 单选题5成功/错误提示 */}
|
||
<SuccessAlert
|
||
visible={
|
||
showMimianSuccessAlert &&
|
||
(mimianSuccessAlertContent.includes("这契合米棉之战史实") ||
|
||
mimianSuccessAlertContent.includes("投机商此前曾吃下"))
|
||
}
|
||
title={
|
||
mimianSuccessAlertContent.includes("恭喜")
|
||
? "恭喜你,选择正确!"
|
||
: "很抱歉,你选错了!"
|
||
}
|
||
content={mimianSuccessAlertContent}
|
||
onContinue={() => {
|
||
setShowMimianSuccessAlert(false);
|
||
setMimianSuccessAlertContent("");
|
||
if (mimianSuccessAlertContent.includes("这契合米棉之战史实")) {
|
||
// 答对后显示旁白4
|
||
setShowMimianNarration4(true);
|
||
} else {
|
||
// 答错后重新显示单选题5
|
||
setShowMimianQuiz5(true);
|
||
}
|
||
}}
|
||
/>
|
||
|
||
{/* 米棉之战 - 旁白4（图9） */}
|
||
<Narration
|
||
text='毛泽东:"这场经济战线上的"淮海战役",其意义不亚于一场军事决战,它证明了我们不仅会打仗,也能管好经济。"'
|
||
visible={showMimianNarration4}
|
||
onClose={() => {
|
||
setShowMimianNarration4(false);
|
||
// 显示旁白5（结束语）
|
||
setShowMimianNarration5(true);
|
||
}}
|
||
enableAnimation={false}
|
||
/>
|
||
|
||
{/* 米棉之战 - 旁白5（结束语） */}
|
||
<Narration
|
||
text='从"银元之战"查封投机枢纽、稳固人民币根基,到"米棉之战"全国统筹调运、集中抛售击溃投机势力,这场经济战线的"淮海战役",不仅平定了物价、安定了民心,更印证了"全国一盘棋"的战略智慧与制度优势。当市场秩序重归稳定,新生政权在经济领域站稳脚跟,这份由陈云同志等老一辈革命家铸就的治理经验,也为新时代经济建设埋下了思想伏笔,等待我们在传承中探索新的实践路径。'
|
||
visible={showMimianNarration5}
|
||
onClose={() => {
|
||
setShowMimianNarration5(false);
|
||
// 标记米棉之战为已解决
|
||
setIsMimianSolved(true);
|
||
}}
|
||
enableAnimation={false}
|
||
/>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default ChenyunReflection;
|