fix(play): 修复鱼点击事件和可见性检查问题

src/app/play/play.component.ts

@@ -375,6 +375,8 @@ export class PlayComponent implements OnInit, OnDestroy {
    * @param dataIndex 数据索引
    */
   toggleItemSelection(itemNode, dataIndex) {
+    if (!this.layoutPage.ref.visible) return;
+
     const isSelected = itemNode.ref.isSelected || false;
     const selectMark = itemNode.ref.selectMark;
 
@@ -695,9 +697,9 @@ export class PlayComponent implements OnInit, OnDestroy {
       this.cat_center = this.createCat('center'); // 创建中间猫
     }
 
-    const type = 'big'
-    const data = this.g_formData.questions[0];
-    const fish = this.createFish(type, data);
+    // const type = 'big'
+    // const data = this.g_formData.questions[0];
+    // const fish = this.createFish(type, data);
     // const paopao = this.brokePaopao(fish);
   }
 
@@ -873,11 +875,16 @@ export class PlayComponent implements OnInit, OnDestroy {
   }
 
   createFish(type, data) {
+    const fishId = `fish_${Math.floor(Math.random() * 1000)}_${Date.now()}`
+
     // 创建鱼元素
-    const fish = this.g_cartoon.createCartoonElement('fish', 'MySprite');
+    const fish = this.g_cartoon.createCartoonElement(fishId, 'MySprite');
     fish.ref.init(this.g_cartoon.images.get('fish'));
     fish.ref.scaleX = this.g_mapScale;
     fish.ref.scaleY = this.g_mapScale;
+
+    fish.ref.width = localImagesSize['pao_pao_da_png'].width * this.g_mapScale;
+    fish.ref.height = localImagesSize['pao_pao_da_png'].height * this.g_mapScale;
     fish.ref.x = this.g_canvasWidth / 2;
     fish.ref.y = this.g_canvasHeight / 2;
     let itemWidth = 300 * this.g_mapScale;
@@ -900,6 +907,7 @@ export class PlayComponent implements OnInit, OnDestroy {
     pao_pao_po_ani.ref.x = 0
     pao_pao_po_ani.ref.y = -90 * this.g_mapScale;
     fish.ref.addChild(pao_pao_po_ani.ref);
+    pao_pao_po_ani.ref.visible = false;
     // 一条小鱼
     const colors = ['huang', 'ju', 'lan', 'lv']
     const nameYu = colors[Math.floor(Math.random() * colors.length)] + '_yu'
@@ -946,6 +954,14 @@ export class PlayComponent implements OnInit, OnDestroy {
     this.render(fish.ref, zIndexMap.card);
     fish['child_paopao_bg'] = pao_pao_da_png;
     fish['child_paopao_ani'] = pao_pao_po_ani;
+
+    // 注册点击事件处理函数
+    this.subscribeMapDownEvent(fishId, () => {
+      console.log('fish click', fish);
+      // 点击气泡时执行brokePaopao方法
+      this.brokePaopao(fish);
+      this.g_enableMapDown = true;
+    })
     return fish;
   }
 
@@ -1392,7 +1408,7 @@ export class PlayComponent implements OnInit, OnDestroy {
   private m_fishArray = [];
   private m_lastFishTime = 0;
   private m_fishInterval = 3000; // 每隔10秒生成一条新鱼
-  
+
   /**
    * 更新游戏画面
    * 负责清除画布、更新动画和渲染所有元素
@@ -1413,7 +1429,7 @@ export class PlayComponent implements OnInit, OnDestroy {
     // 更新鱼的运动
     this.updateFish();
   }
-  
+
   /**
    * 更新鱼的运动
    * 管理鱼从右侧游到左侧的动画效果
@@ -1427,39 +1443,39 @@ export class PlayComponent implements OnInit, OnDestroy {
         // 随机选择一个问题数据
         const randomIndex = Math.floor(Math.random() * this.g_formData.questions.length);
         const fishData = this.g_formData.questions[randomIndex];
-        
+
         // 创建小型鱼
         const fish = this.createFish('small', fishData);
-        
+
         // 设置鱼的初始位置在屏幕右侧外部
         fish.ref.x = this.g_canvasWidth + fish.ref.width * fish.ref.scaleX / 2;
         fish.ref.y = Math.random() * (this.g_canvasHeight * 0.6) + this.g_canvasHeight * 0.2; // 在屏幕中间区域随机高度
-        
+
         // 设置鱼的游动速度
         fish.speed = 0.3; // 0.5-1.5的随机速度，降低游动速度
-        
+
         // 确保鱼已添加到渲染队列中
         // createFish 方法中已经调用了 render 方法，但为了确保，这里再次检查
         const existsInRenderObject = this.m_renderObject.some(item => item.element === fish.ref);
         if (!existsInRenderObject) {
           this.render(fish.ref, 1000); // 使用 zIndexMap.card 的值 1000
         }
-        
+
         // 将鱼添加到管理数组
         this.m_fishArray.push(fish);
-        
+
         // 更新最后创建鱼的时间
         this.m_lastFishTime = currentTime;
       }
     }
-    
+
     // 更新所有鱼的位置
     for (let i = this.m_fishArray.length - 1; i >= 0; i--) {
       const fish = this.m_fishArray[i];
-      
+
       // 向左移动鱼
       fish.ref.x -= fish.speed;
-      
+
       // 如果鱼游出了屏幕左侧，从数组中移除
       if (fish.ref.x < -fish.ref.width * fish.ref.scaleX / 2) {
         // 从渲染对象数组中移除
@@ -1469,7 +1485,7 @@ export class PlayComponent implements OnInit, OnDestroy {
         this.m_renderObject.forEach(item => {
           this.m_renderArr.push(item.element);
         });
-        
+
         // 从鱼群数组中移除
         this.m_fishArray.splice(i, 1);
       }