1. 新增BoxCounter类统一管理技能和装备盒的槽位占用 2. 调整技能/装备槽位布局使用常量对齐 3. 任务开始时重置共享计数器 4. 添加槽位已满的拦截逻辑和提示 5. 槽位增减时同步更新计数器
188 lines
6.6 KiB
TypeScript
188 lines
6.6 KiB
TypeScript
|
||
/**
|
||
* @file MissEquipComp.ts
|
||
* @description 场上装备卡槽位管理器组件(UI 视图层)
|
||
*
|
||
* 职责:
|
||
* 1. 管理场上已使用的 **装备卡** 的可视化槽位(最多 10 个)。
|
||
* 2. 监听 UseEquipCard 事件,当玩家使用装备卡时实例化 EquipBoxComp 并放入空闲槽位。
|
||
* 3. 监听 RemoveEquipBox 事件,当装备生效完毕后回收槽位并重新排列。
|
||
*
|
||
* 关键设计:
|
||
* - slots 数组预定义了 10 个固定坐标位(2 行 × 5 列),s
|
||
* 每个槽位记录是否占用及对应节点引用。
|
||
* - 当某个 EquipBox 销毁时,触发 rearrangeSlots 将剩余节点
|
||
* 紧凑地重排到前置槽位,避免视觉空洞。
|
||
* - EquipBox 的实例化使用 equip_box Prefab,在编辑器中绑定。
|
||
*
|
||
* 依赖:
|
||
* - EquipBoxComp(EquipBoxComp.ts)—— 单个装备卡的效果控制组件
|
||
* - GameEvent.UseEquipCard —— 装备卡使用事件
|
||
* - GameEvent.RemoveEquipBox —— 装备卡移除事件
|
||
* - smc.map.MapView.scene.entityLayer —— 装备节点的父容器(EQUIP 节点)
|
||
*/
|
||
import { mLogger } from "../common/Logger";
|
||
import { _decorator, Node, Prefab, instantiate, Vec3 } from "cc";
|
||
import { ecs } from "../../../../extensions/oops-plugin-framework/assets/libs/ecs/ECS";
|
||
import { CCComp } from "../../../../extensions/oops-plugin-framework/assets/module/common/CCComp";
|
||
import { EBox } from "./EBox";
|
||
import { oops } from "db://oops-framework/core/Oops";
|
||
import { GameEvent } from "../common/config/GameEvent";
|
||
import { BoxSet } from "../common/config/GameSet";
|
||
const { ccclass, property } = _decorator;
|
||
|
||
/** 技能槽位数据结构 */
|
||
interface SkillBoxSlot {
|
||
/** 该槽位的固定 X 坐标 */
|
||
x: number;
|
||
/** 该槽位的固定 Y 坐标 */
|
||
y: number;
|
||
/** 是否已被占用 */
|
||
used: boolean;
|
||
/** 占用该槽位的节点引用 */
|
||
node: Node | null;
|
||
}
|
||
|
||
/**
|
||
* MissEquipComp —— 场上装备卡槽位管理器
|
||
*
|
||
* 在战斗场景中管理已激活的装备卡显示位置。
|
||
* 2 行 × 5 列 = 10 个槽位,不足时提示已满。
|
||
*/
|
||
@ccclass('MissEquipComp')
|
||
@ecs.register('MissEquipComp', false)
|
||
export class MissEquipComp extends CCComp {
|
||
/** 调试日志开关 */
|
||
private debugMode: boolean = true;
|
||
|
||
/** 技能卡 Prefab(在编辑器中赋值) */
|
||
@property({ type: Prefab })
|
||
private equip_box: Prefab = null;
|
||
/**
|
||
* 预定义的 6 个槽位坐标(单行):
|
||
*/
|
||
private slots: SkillBoxSlot[] = [
|
||
{ x: -310, y: BoxSet.GAME_LINE-70, used: false, node: null },
|
||
{ x: -230, y: BoxSet.GAME_LINE-70, used: false, node: null },
|
||
{ x: -150, y: BoxSet.GAME_LINE-70, used: false, node: null },
|
||
{ x: -70, y: BoxSet.GAME_LINE-70, used: false, node: null },
|
||
{ x: 10, y: BoxSet.GAME_LINE-70, used: false, node: null },
|
||
{ x: 90, y: BoxSet.GAME_LINE-70, used: false, node: null },
|
||
];
|
||
|
||
/** 注册事件监听 */
|
||
onLoad() {
|
||
oops.message.on(GameEvent.UseEquipCard, this.onUseEquipCard, this);
|
||
oops.message.on(GameEvent.RemoveEquipBox, this.onRemoveEquipBox, this);
|
||
}
|
||
|
||
/** 移除事件监听 */
|
||
onDestroy() {
|
||
super.onDestroy();
|
||
oops.message.off(GameEvent.UseEquipCard, this.onUseEquipCard, this);
|
||
oops.message.off(GameEvent.RemoveEquipBox, this.onRemoveEquipBox, this);
|
||
}
|
||
|
||
/**
|
||
* 处理装备卡移除事件:
|
||
* 1. 在 slots 中找到对应节点并释放。
|
||
* 2. 调用 rearrangeSlots 紧凑重排。
|
||
*
|
||
* @param event 事件名
|
||
* @param args 要移除的节点引用
|
||
*/
|
||
private onRemoveEquipBox(event: string, args: any) {
|
||
const node = args as Node;
|
||
let removed = false;
|
||
for (let i = 0; i < this.slots.length; i++) {
|
||
if (this.slots[i].node === node) {
|
||
this.slots[i].used = false;
|
||
this.slots[i].node = null;
|
||
removed = true;
|
||
break;
|
||
}
|
||
}
|
||
if (removed) {
|
||
this.rearrangeSlots();
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 紧凑重排:将所有有效节点按顺序移到前置槽位。
|
||
* 确保视觉上不会出现中间空洞。
|
||
*/
|
||
private rearrangeSlots() {
|
||
// 收集所有有效节点
|
||
const validNodes: Node[] = [];
|
||
for (let i = 0; i < this.slots.length; i++) {
|
||
if (this.slots[i].used && this.slots[i].node && this.slots[i].node.isValid) {
|
||
validNodes.push(this.slots[i].node);
|
||
}
|
||
this.slots[i].used = false;
|
||
this.slots[i].node = null;
|
||
}
|
||
// 按顺序重新分配
|
||
for (let i = 0; i < validNodes.length; i++) {
|
||
if (i < this.slots.length) {
|
||
this.slots[i].used = true;
|
||
this.slots[i].node = validNodes[i];
|
||
validNodes[i].setPosition(new Vec3(this.slots[i].x, this.slots[i].y, 0));
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 处理使用装备卡事件:提取 uuid 和 card_lv 后调用 addEquip。
|
||
* @param event 事件名
|
||
* @param args 卡牌数据(含 uuid、card_lv)
|
||
*/
|
||
private onUseEquipCard(event: string, args: any) {
|
||
const payload = args ?? event;
|
||
const uuid = Number(payload?.uuid ?? 0);
|
||
const card_lv = Math.max(1, Math.floor(Number(payload?.card_lv ?? 1)));
|
||
if (!uuid) return;
|
||
this.addSkill(uuid, card_lv);
|
||
}
|
||
|
||
start() {
|
||
|
||
}
|
||
|
||
/**
|
||
* 在场上添加一个装备卡:
|
||
* 1. 在 slots 中查找空闲位。
|
||
* 2. 实例化 equip_box Prefab 并放置在空闲位坐标。
|
||
* 3. 获取或添加 EquipBoxComp 并初始化。
|
||
*
|
||
* @param uuid 装备 UUID
|
||
* @param card_lv 装备卡等级
|
||
*/
|
||
addSkill(uuid: number, card_lv: number) {
|
||
if (!this.equip_box) {
|
||
mLogger.error(this.debugMode, "MissEquipComp", "equip_box prefab not set");
|
||
return;
|
||
}
|
||
|
||
// 查找空闲槽位
|
||
const emptyIndex = this.slots.findIndex(slot => !slot.used);
|
||
if (emptyIndex === -1) {
|
||
mLogger.warn(this.debugMode, "MissEquipComp", "equip_box slots are full");
|
||
oops.gui.toast("装备槽位已满");
|
||
return;
|
||
}
|
||
|
||
// 使用 ECS 实体创建装备节点
|
||
let ebox = ecs.getEntity<EBox>(EBox);
|
||
let pos = new Vec3(this.slots[emptyIndex].x, this.slots[emptyIndex].y, 0);
|
||
let node = ebox.load(uuid, card_lv, pos, this.equip_box);
|
||
|
||
this.slots[emptyIndex].used = true;
|
||
this.slots[emptyIndex].node = node;
|
||
}
|
||
|
||
/** ECS 组件移除时销毁节点 */
|
||
reset() {
|
||
this.node.destroy();
|
||
}
|
||
}
|