feat:碎片完善

src/pages/chenyun/reflection/mimian/MimianBattle.tsx

@@ -7,6 +7,9 @@ import { MimianFile } from "./MimianFile";
 import { MimianClues } from "./MimianClues";
 import { MimianQuizzes } from "./MimianQuizzes";
 import { useMimianState } from "./useMimianState";
+import { usePuzzleAnimation } from "@/contexts/PuzzleAnimationContext";
+import { usePuzzleStore } from "@/store/puzzleStore";
+import { starName } from "../constants";
 import type { FileType } from "../shared/types";
 import type { ClueData } from "@/components/layout";
 
@@ -41,6 +44,8 @@ export const MimianBattle = ({
   onEnd,
 }: MimianBattleProps) => {
   const state = useMimianState();
+  const { triggerPuzzleAnimation } = usePuzzleAnimation();
+  const { isPuzzleUnlocked } = usePuzzleStore();
 
   // 如果所有米棉之战线索都已查看，自动显示单选题1
   useEffect(() => {
@@ -104,6 +109,12 @@ export const MimianBattle = ({
     state.setMimianSuccessAlertContent("");
     // 显示旁白2（图4）
     state.setShowMimianNarration2(true);
+    
+    // 检查碎片14是否已解锁，如果未解锁则触发动画
+    const pieceId = 14;
+    if (!isPuzzleUnlocked(starName, pieceId)) {
+      triggerPuzzleAnimation(pieceId);
+    }
   };
 
   // 处理错误提示框继续

src/pages/chenyun/reflection/mimian/useMimianState.ts

@@ -3,12 +3,21 @@
  * 管理米棉之战相关的所有状态
  */
 import { useState } from "react";
+import { useChenyunStore } from "@/store/chenyunStore";
 
 /**
  * 米棉之战状态管理 Hook
  * @returns 米棉之战的所有状态和更新函数
  */
 export const useMimianState = () => {
+  // 直接从 store 获取持久化的解决状态，不需要本地状态
+  const { isMimianSolved, setMimianSolved } = useChenyunStore();
+  
+  // 更新解决状态时，直接更新 store
+  const handleSetIsMimianSolved = (solved: boolean) => {
+    setMimianSolved(solved);
+  };
+  
   // 单选题1相关状态
   const [showMimianQuiz1, setShowMimianQuiz1] = useState(false);
   
@@ -36,9 +45,6 @@ export const useMimianState = () => {
   // 旁白5相关状态（结束语）
   const [showMimianNarration5, setShowMimianNarration5] = useState(false);
   
-  // 米棉之战解决状态
-  const [isMimianSolved, setIsMimianSolved] = useState(false);
-  
   // 米棉之战成功提示框状态
   const [showMimianSuccessAlert, setShowMimianSuccessAlert] = useState(false);
   const [mimianSuccessAlertContent, setMimianSuccessAlertContent] =
@@ -75,7 +81,7 @@ export const useMimianState = () => {
     
     // 解决状态
     isMimianSolved,
-    setIsMimianSolved,
+    setIsMimianSolved: handleSetIsMimianSolved,
   };
 };