feat:黄炎培对话对接中

This commit is contained in:
zhongyidian committed 2026-01-07 21:08:38 +08:00
1 parent 3611a0857a
commit 6ab184b328
125 files changed
+6617 -2391

No files matched your search

@@ -0,0 +1,281 @@
/**
* 米棉之战主组件
* 整合米棉之战的所有子组件:文件、线索、题目
*/
import { useEffect } from "react";
import { MimianFile } from "./MimianFile";
import { MimianClues } from "./MimianClues";
import { MimianQuizzes } from "./MimianQuizzes";
import { useMimianState } from "./useMimianState";
import type { FileType } from "../shared/types";
import type { ClueData } from "@/components/layout";
export interface MimianBattleProps {
/** 当前展开的文件 */
expandedFile: FileType | null;
/** 线索状态 */
clueStates: Record<string, boolean>;
/** 文件点击回调 */
onFileClick: () => void;
/** 线索点击回调 */
onClueClick: (clue: ClueData, clueKey: string) => void;
/** 是否所有线索都已查看 */
isAllViewed: boolean;
/** 收起文件回调 */
onCollapseFile: () => void;
/** 结束回调(返回首页) */
onEnd: () => void;
}
/**
* 米棉之战主组件
* 管理米棉之战的所有状态和逻辑
*/
export const MimianBattle = ({
expandedFile,
clueStates,
onFileClick,
onClueClick,
isAllViewed,
onCollapseFile,
onEnd,
}: MimianBattleProps) => {
const state = useMimianState();
// 如果所有米棉之战线索都已查看,自动显示单选题1
useEffect(() => {
if (isAllViewed && !state.showMimianQuiz1) {
state.setShowMimianQuiz1(true);
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [isAllViewed]);
// 处理单选题1提交
const handleQuiz1Submit = (value: string, isCorrect: boolean) => {
if (isCorrect) {
state.setShowMimianQuiz1(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent("恭喜你,选择正确!");
}
};
// 处理成功提示框1继续
const handleSuccessAlert1Continue = () => {
state.setShowMimianSuccessAlert(false);
state.setMimianSuccessAlertContent("");
// 显示旁白1(图2)
state.setShowMimianNarration1(true);
};
// 处理旁白1关闭
const handleNarration1Close = () => {
state.setShowMimianNarration1(false);
// 显示单选题2
state.setShowMimianQuiz2(true);
};
// 处理单选题2提交
const handleQuiz2Submit = (value: string, isCorrect: boolean) => {
if (isCorrect) {
state.setShowMimianQuiz2(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
`恭喜你,选择正确!结合当时市场情况,陈云同志在会上做出了"全国一盘棋"的指示。全国统筹调运粮食、棉花、煤炭填补缺口,筑牢物资基础。关键节点集中抛售,让跟风囤货的投机商无力承接,因亏本和高利贷纷纷破产,快速平抑物价、稳固人民币地位。`
);
} else {
// 根据选项显示不同的错误信息
if (value === "A") {
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"很抱歉,你选错了!当时物价上涨已波及多地区,局部限购无法阻止投机商转移物资炒作。上海米、棉依赖外部供应,本地物资匮乏,限购既不解决缺口,还会加剧民众恐慌,扰乱市场秩序。请你再思考一下吧!"
);
} else if (value === "B") {
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"很抱歉,你选错了!当时国民党滥发货币导致的贬值阴影未消,民众对新货币缺乏信任。此时增发人民币,会使货币供应量远超物资总量,重蹈贬值覆辙,削弱人民币信用,让投机气焰更盛。请你再思考一下吧!"
);
}
}
};
// 处理成功提示框2继续
const handleSuccessAlert2Continue = () => {
state.setShowMimianSuccessAlert(false);
state.setMimianSuccessAlertContent("");
// 显示旁白2(图4)
state.setShowMimianNarration2(true);
};
// 处理错误提示框继续
const handleErrorAlertContinue = () => {
state.setShowMimianSuccessAlert(false);
state.setMimianSuccessAlertContent("");
// 重新显示单选题2
state.setShowMimianQuiz2(true);
};
// 处理旁白2关闭
const handleNarration2Close = () => {
state.setShowMimianNarration2(false);
// 显示单选题3
state.setShowMimianQuiz3(true);
};
// 处理单选题3提交
const handleQuiz3Submit = (value: string, isCorrect: boolean) => {
if (isCorrect) {
state.setShowMimianQuiz3(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"恭喜你,选择正确!地方配合,调运按时推进。"
);
} else {
state.setShowMimianQuiz3(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"很抱歉,你选错了!地方抵触,调运延误多天。请你再思考一下吧!"
);
}
};
// 处理单选题3成功/错误提示继续
const handleQuiz3AlertContinue = (isCorrect: boolean) => {
state.setShowMimianSuccessAlert(false);
state.setMimianSuccessAlertContent("");
if (isCorrect) {
// 答对后显示单选题4
state.setShowMimianQuiz4(true);
} else {
// 答错后重新显示单选题3
state.setShowMimianQuiz3(true);
}
};
// 处理单选题4提交
const handleQuiz4Submit = (value: string, isCorrect: boolean) => {
if (isCorrect) {
state.setShowMimianQuiz4(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"恭喜你,选择正确!棉农支持,调运量足额完成。"
);
} else {
state.setShowMimianQuiz4(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"很抱歉,你选错了!棉农抵触,调运量减少。请你再思考一下吧!"
);
}
};
// 处理单选题4成功/错误提示继续
const handleQuiz4AlertContinue = (isCorrect: boolean) => {
state.setShowMimianSuccessAlert(false);
state.setMimianSuccessAlertContent("");
if (isCorrect) {
// 答对后显示旁白3
state.setShowMimianNarration3(true);
} else {
// 答错后重新显示单选题4
state.setShowMimianQuiz4(true);
}
};
// 处理旁白3关闭
const handleNarration3Close = () => {
state.setShowMimianNarration3(false);
// 显示单选题5
state.setShowMimianQuiz5(true);
};
// 处理单选题5提交
const handleQuiz5Submit = (value: string, isCorrect: boolean) => {
if (isCorrect) {
// 标记米棉之战为已解决,并收起文件
state.setIsMimianSolved(true);
onCollapseFile();
state.setShowMimianQuiz5(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"恭喜你,选择正确!这契合米棉之战史实,多地同步大量抛售,让借高利贷囤货的投机商措手不及。连续抛售使其无力承接,只得亏本抛售,最终纷纷破产,快速稳住物价。"
);
} else {
state.setShowMimianQuiz5(false);
state.setShowMimianSuccessAlert(true);
state.setMimianSuccessAlertContent(
"很抱歉,你选错了!投机商此前曾吃下政府平价抛售物资获利。逐步降价加舆论引导难让其信服,他们会持续囤货,政府储备会被消耗,反而让投机商掌控节奏,无法遏制物价上涨。请你再思考一下吧!"
);
}
};
// 处理单选题5成功/错误提示继续
const handleQuiz5AlertContinue = (isEndSuccess: boolean) => {
state.setShowMimianSuccessAlert(false);
state.setMimianSuccessAlertContent("");
if (isEndSuccess) {
// 成功结束:保持 expandedFile 为 null,1 秒后弹出结束语 StudyGuideModal
setTimeout(() => {
state.setShowMimianNarration5(true);
}, 1000);
} else {
// 答错后重新显示单选题5
state.setShowMimianQuiz5(true);
}
};
// 处理结束语继续
const handleNarration5Continue = () => {
state.setShowMimianNarration5(false);
onEnd();
};
return (
<>
{/* 文件组件 */}
<MimianFile
expandedFile={expandedFile}
isSolved={state.isMimianSolved}
onFileClick={onFileClick}
/>
{/* 线索组件 */}
<MimianClues
expandedFile={expandedFile}
clueStates={clueStates}
onClueClick={onClueClick}
/>
{/* 题目组件 */}
<MimianQuizzes
showQuiz1={state.showMimianQuiz1}
showNarration1={state.showMimianNarration1}
showQuiz2={state.showMimianQuiz2}
showNarration2={state.showMimianNarration2}
showQuiz3={state.showMimianQuiz3}
showQuiz4={state.showMimianQuiz4}
showNarration3={state.showMimianNarration3}
showQuiz5={state.showMimianQuiz5}
showNarration5={state.showMimianNarration5}
showSuccessAlert={state.showMimianSuccessAlert}
successAlertContent={state.mimianSuccessAlertContent}
onQuiz1Submit={handleQuiz1Submit}
onSuccessAlert1Continue={handleSuccessAlert1Continue}
onNarration1Close={handleNarration1Close}
onQuiz2Submit={handleQuiz2Submit}
onSuccessAlert2Continue={handleSuccessAlert2Continue}
onErrorAlertContinue={handleErrorAlertContinue}
onNarration2Close={handleNarration2Close}
onQuiz3Submit={handleQuiz3Submit}
onQuiz3AlertContinue={handleQuiz3AlertContinue}
onQuiz4Submit={handleQuiz4Submit}
onQuiz4AlertContinue={handleQuiz4AlertContinue}
onNarration3Close={handleNarration3Close}
onQuiz5Submit={handleQuiz5Submit}
onQuiz5AlertContinue={handleQuiz5AlertContinue}
onNarration5Continue={handleNarration5Continue}
/>
</>
);
};