feat(ui): 调整英雄信息面板布局和排序逻辑

- 将英雄信息面板从垂直排列改为水平排列，增加间距
- 实现按英雄位置、生成顺序和实体ID的排序逻辑
- 调整相关UI元素的锚点、位置和组件状态
- 更新预制体引用和布局参数以支持新的排列方式

assets/script/game/map/MissionCardComp.ts

@@ -12,6 +12,7 @@ import { smc } from "../common/SingletonModuleComp";
 import { HeroInfo, HType } from "../common/config/heroSet";
 import { HeroViewComp } from "../hero/HeroViewComp";
 import { FacSet } from "../common/config/GameSet";
+import { MoveComp } from "../hero/MoveComp";
 
 const { ccclass, property } = _decorator;
 
@@ -60,7 +61,8 @@ export class MissionCardComp extends CCComp {
     private cardComps: CardComp[] = [];
     /** 当前卡池等级（仅影响抽卡来源，不直接改卡槽现有内容） */
     private poolLv: number = CARD_POOL_INIT_LEVEL;
-    private readonly heroInfoItemGap: number = 86;
+    private readonly heroInfoItemGap: number = 110;
+    private readonly heroInfoItemSpacing: number = 10;
     private heroInfoSyncTimer: number = 0;
     private hasCachedCardsBaseScale: boolean = false;
     private cardsBaseScale: Vec3 = new Vec3(1, 1, 1);
@@ -613,9 +615,7 @@ export class MissionCardComp extends CCComp {
         for (let i = 0; i < removeKeys.length; i++) {
             this.heroInfoItems.delete(removeKeys[i]);
         }
-        if (removeKeys.length > 0) {
-            this.relayoutHeroInfoPanels();
-        }
+        this.relayoutHeroInfoPanels();
         this.updateHeroNumUI(false, false);
     }
 
@@ -628,13 +628,30 @@ export class MissionCardComp extends CCComp {
     }
 
     private relayoutHeroInfoPanels() {
-        let index = 0;
-        this.heroInfoItems.forEach(item => {
-            if (!item.node || !item.node.isValid) return;
-            const pos = item.node.position;
-            item.node.setPosition(pos.x, -index * this.heroInfoItemGap, pos.z);
-            index += 1;
+        const sortedItems = [...this.heroInfoItems.values()].sort((a, b) => {
+            const aEnt = (a.model as any)?.ent as ecs.Entity | undefined;
+            const bEnt = (b.model as any)?.ent as ecs.Entity | undefined;
+            const aView = aEnt?.get(HeroViewComp);
+            const bView = bEnt?.get(HeroViewComp);
+            const aMove = aEnt?.get(MoveComp);
+            const bMove = bEnt?.get(MoveComp);
+            const aFrontScore = aView?.node?.position?.x ?? -999999;
+            const bFrontScore = bView?.node?.position?.x ?? -999999;
+            if (aFrontScore !== bFrontScore) return aFrontScore - bFrontScore;
+            const aSpawnOrder = aMove?.spawnOrder ?? 0;
+            const bSpawnOrder = bMove?.spawnOrder ?? 0;
+            if (aSpawnOrder !== bSpawnOrder) return aSpawnOrder - bSpawnOrder;
+            const aEid = aEnt?.eid ?? 0;
+            const bEid = bEnt?.eid ?? 0;
+            return aEid - bEid;
         });
+        for (let index = 0; index < sortedItems.length; index++) {
+            const item = sortedItems[index];
+            if (!item.node || !item.node.isValid) continue;
+            const pos = item.node.position;
+            item.node.setPosition(index * (this.heroInfoItemGap + this.heroInfoItemSpacing), pos.y, pos.z);
+            item.node.setSiblingIndex(index);
+        }
     }
 
     private clearHeroInfoPanels() {