refactor(play): 重构鱼点击处理逻辑，拆分动画和存储功能

src/app/play/play.component.ts

@@ -1052,7 +1052,7 @@ export class PlayComponent implements OnInit, OnDestroy {
       console.log('fish click', fish);
       // 点击气泡时执行brokePaopao方法
       this.touchFish = fish;
-      this.brokePaopao(fish);
+      this.onTouchFish(fish);
       setTimeout(() => {
         this.touchFish = null;
       }, 100);
@@ -1067,7 +1067,7 @@ export class PlayComponent implements OnInit, OnDestroy {
    * 存储用户点击的鱼的数据，检查是否有两个正确数据
    * @param fish 被点击的鱼对象
    */
-  brokePaopao(fish) {
+  onTouchFish(fish) {
     // 获取当前游戏阶段
     const currentStage = this.gameStages[this.currentStageIndex];
 
@@ -1094,37 +1094,10 @@ export class PlayComponent implements OnInit, OnDestroy {
 
       // 创建飞向水桶的小鱼动画
       this.createFlyingFish(fish);
+      this.brokePaopaoAni(fish);
+      this.saveFishRight(fish);
 
       // 存储用户点击的鱼的数据
-      if (fish.questionData) {
-        this.clickedFishData.push(fish.questionData);
-
-        console.log('Clicked fish count:', this.clickedFishData.length);
-
-        // 计算正确点击的次数
-        const correctClicks = this.clickedFishData.filter(data =>
-          data.audio === currentStage.correctQuestion.audio &&
-          data.image === currentStage.correctQuestion.image
-        ).length;
-
-        console.log('Correct clicks:', correctClicks);
-
-        // 如果有两个数据为当前Stage的正确数据，则清空画面，等待1秒后进入下一轮游戏
-        if (correctClicks >= 2) {
-          console.log('Stage completed! Moving to next stage...');
-
-          // 清空画面（清除所有鱼）
-          this.clearFishes();
-
-          // 增加当前阶段索引
-          this.currentStageIndex++;
-
-          // 等待1秒后进入下一轮游戏
-          setTimeout(() => {
-            this.initNextStage();
-          }, 1000);
-        }
-      }
     } else {
       // 错误小鱼的处理逻辑
       // 播放错误音效
@@ -1136,35 +1109,68 @@ export class PlayComponent implements OnInit, OnDestroy {
         fish.speed = originalSpeed;
       }, 1000);
     }
-
+    return fish;
+  }
+  brokePaopaoAni(fish) {
     // 对于正确的鱼，显示泡泡破裂动画
-    if (isCorrect) {
-      // 按顺序切换序列帧 pao_pao_xu_lie_zhen_1 到 pao_pao_xu_lie_zhen_9
-      let currentFrame = 1;
-      const maxFrame = 9;
-      const frameInterval = 100; // 每帧间隔时间，可以根据需要调整
-
-      const playNextFrame = () => {
-        if (currentFrame <= maxFrame) {
-          // 设置当前帧的图像
-          fish['child_paopao_ani'].ref.init(this.g_cartoon.images.get(`pao_pao_xu_lie_zhen_${currentFrame}`));
-          currentFrame++;
-          // 设置下一帧的定时器
-          setTimeout(playNextFrame, frameInterval);
-        }
-      };
+    // 按顺序切换序列帧 pao_pao_xu_lie_zhen_1 到 pao_pao_xu_lie_zhen_9
+    let currentFrame = 1;
+    const maxFrame = 9;
+    const frameInterval = 100; // 每帧间隔时间，可以根据需要调整
+
+    const playNextFrame = () => {
+      if (currentFrame <= maxFrame) {
+        // 设置当前帧的图像
+        fish['child_paopao_ani'].ref.init(this.g_cartoon.images.get(`pao_pao_xu_lie_zhen_${currentFrame}`));
+        currentFrame++;
+        // 设置下一帧的定时器
+        setTimeout(playNextFrame, frameInterval);
+      }
+    };
 
-      // 开始播放序列帧动画
-      playNextFrame();
+    // 开始播放序列帧动画
+    playNextFrame();
 
-      // 正确的鱼不需要恢复运动，因为它们已经被处理了
-      // 确保鱼保持停止状态
-      fish.speed = 0;
-    }
+    // 正确的鱼不需要恢复运动，因为它们已经被处理了
+    // 确保鱼保持停止状态
+    fish.speed = 0;
+  }
 
-    return fish;
+  saveFishRight(fish) {
+    const currentStage = this.gameStages[this.currentStageIndex];
+    if (fish.questionData) {
+      this.clickedFishData.push(fish.questionData);
+
+      console.log('Clicked fish count:', this.clickedFishData.length);
+
+      // 计算正确点击的次数
+      const correctClicks = this.clickedFishData.filter(data =>
+        data.audio === currentStage.correctQuestion.audio &&
+        data.image === currentStage.correctQuestion.image
+      ).length;
+
+      console.log('Correct clicks:', correctClicks);
+
+      // 如果有两个数据为当前Stage的正确数据，则清空画面，等待1秒后进入下一轮游戏
+      if (correctClicks >= 2) {
+        console.log('Stage completed! Moving to next stage...');
+
+        // 清空画面（清除所有鱼）
+        this.clearFishes();
+
+        // 增加当前阶段索引
+        this.currentStageIndex++;
+
+        // 等待1秒后进入下一轮游戏
+        setTimeout(() => {
+          this.initNextStage();
+        }, 1000);
+      }
+    }
   }
 
+
+
   aniOpacity(fish) {
     // 使用alphaItem创建平滑的透明度变化动画
     const childNames = ['child_image', 'child_paopao_bg']