import { mLogger } from "../common/Logger"; import { _decorator, instantiate, Label, Node, NodeEventType, Prefab, SpriteAtlas, Tween, tween, 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 { GameEvent } from "../common/config/GameEvent"; import { CARD_POOL_INIT_LEVEL, CARD_POOL_MAX_LEVEL, CardConfig, CardInitCoins, CardsUpSet, getCardsByLv } from "../common/config/CardSet"; import { smc } from "../common/SingletonModuleComp"; import { CardComp } from "./CardComp"; import { oops } from "db://oops-framework/core/Oops"; import { HeroAttrsComp } from "../hero/HeroAttrsComp"; const { ccclass, property } = _decorator; /** 视图层对象 */ @ccclass('MissionCardComp') @ecs.register('MissionCard', false) export class MissionCardComp extends CCComp { private debugMode: boolean = true; private readonly cardWidth: number = 175; private readonly buttonNormalScale: number = 1; private readonly buttonPressScale: number = 0.94; private readonly buttonClickScale: number = 1.06; /** 四个插卡槽位(固定顺序分发:1~4) */ @property(Node) card1:Node = null! @property(Node) card2:Node = null! @property(Node) card3:Node = null! @property(Node) card4:Node = null! @property(Node) cards_chou:Node = null! @property(Node) cards_up:Node = null! @property(Node) coins_node:Node = null! @property(Node) pool_lv_node:Node = null! @property(Node) hero_info_node:Node = null! //场上英雄信息面板所在节点 @property(Prefab) hero_info_prefab:Prefab=null! //场上英雄信息面板Prefab /** 预留图集缓存(后续接入按钮/卡面图标时复用) */ private uiconsAtlas: SpriteAtlas | null = null; /** 四个槽位对应的单卡控制器缓存 */ private cardComps: CardComp[] = []; /** 当前卡池等级(仅影响抽卡来源,不直接改卡槽现有内容) */ private poolLv: number = CARD_POOL_INIT_LEVEL; private coin: number = CardInitCoins; private readonly heroInfoItemGap: number = 86; private heroInfoSyncTimer: number = 0; private heroInfoItems: Map = new Map(); onLoad() { /** 绑定事件 -> 缓存子控制器 -> 初始化UI状态 */ this.bindEvents(); this.cacheCardComps(); this.layoutCardSlots(); this.onMissionStart(); mLogger.log(this.debugMode, "MissionCardComp", "onLoad init", { slots: this.cardComps.length, poolLv: this.poolLv }); } onDestroy() { this.unbindEvents(); this.clearHeroInfoPanels(); } init(){ this.onMissionStart(); } /** 任务开始时:重置卡池等级、清空4槽、显示面板 刷新一次卡池*/ onMissionStart() { this.poolLv = CARD_POOL_INIT_LEVEL; this.coin = CardInitCoins this.clearHeroInfoPanels(); this.layoutCardSlots(); this.clearAllCards(); if (this.cards_up) { this.cards_up.active = true; } this.resetButtonScale(this.cards_chou); this.resetButtonScale(this.cards_up); this.updatePoolLvUI(); this.updateCoinUI(); this.node.active = true; const cards = this.buildDrawCards(); this.dispatchCardsToSlots(cards); mLogger.log(this.debugMode, "MissionCardComp", "mission start", { poolLv: this.poolLv }); } /** 任务结束时:清空4槽并隐藏面板 */ onMissionEnd() { this.clearAllCards(); this.clearHeroInfoPanels(); this.node.active = false; } start() { } update(dt: number) { this.heroInfoSyncTimer += dt; if (this.heroInfoSyncTimer < 0.15) return; this.heroInfoSyncTimer = 0; this.refreshHeroInfoPanels(); } /** 关闭面板(不销毁数据模型,仅隐藏) */ close() { this.node.active = false; } /** 只处理UI层事件,不做卡牌效果分发 */ private bindEvents() { /** 生命周期事件 */ this.on(GameEvent.MissionStart, this.onMissionStart, this); this.on(GameEvent.MissionEnd, this.onMissionEnd, this); this.on(GameEvent.CoinAdd, this.onCoinAdd, this); oops.message.on(GameEvent.MasterCalled, this.onMasterCalled, this); /** 按钮事件:抽卡与卡池升级 */ this.cards_chou?.on(NodeEventType.TOUCH_START, this.onDrawTouchStart, this); this.cards_chou?.on(NodeEventType.TOUCH_END, this.onDrawTouchEnd, this); this.cards_chou?.on(NodeEventType.TOUCH_CANCEL, this.onDrawTouchCancel, this); this.cards_up?.on(NodeEventType.TOUCH_START, this.onUpgradeTouchStart, this); this.cards_up?.on(NodeEventType.TOUCH_END, this.onUpgradeTouchEnd, this); this.cards_up?.on(NodeEventType.TOUCH_CANCEL, this.onUpgradeTouchCancel, this); } private onCoinAdd(args:any){ const v = typeof args === 'number' ? args : (args?.delta ?? args?.value ?? 0); this.coin = Math.max(0, (this.coin ?? 0) + v); this.updatePoolLvUI(); this.updateCoinUI(); } /** 解除按钮监听,避免节点销毁后回调泄漏 */ private unbindEvents() { oops.message.off(GameEvent.MasterCalled, this.onMasterCalled, this); this.cards_chou?.off(NodeEventType.TOUCH_START, this.onDrawTouchStart, this); this.cards_chou?.off(NodeEventType.TOUCH_END, this.onDrawTouchEnd, this); this.cards_chou?.off(NodeEventType.TOUCH_CANCEL, this.onDrawTouchCancel, this); this.cards_up?.off(NodeEventType.TOUCH_START, this.onUpgradeTouchStart, this); this.cards_up?.off(NodeEventType.TOUCH_END, this.onUpgradeTouchEnd, this); this.cards_up?.off(NodeEventType.TOUCH_CANCEL, this.onUpgradeTouchCancel, this); } private onMasterCalled(event: string, args: any) { const payload = args ?? event; const eid = Number(payload?.eid ?? 0); const model = payload?.model as HeroAttrsComp | undefined; if (!eid || !model) return; this.ensureHeroInfoPanel(eid, model); } private onDrawTouchStart() { this.playButtonPressAnim(this.cards_chou); } private onDrawTouchEnd() { this.playButtonClickAnim(this.cards_chou, () => this.onClickDraw()); } private onDrawTouchCancel() { this.playButtonResetAnim(this.cards_chou); } private onUpgradeTouchStart() { this.playButtonPressAnim(this.cards_up); } private onUpgradeTouchEnd() { this.playButtonClickAnim(this.cards_up, () => this.onClickUpgrade()); } private onUpgradeTouchCancel() { this.playButtonResetAnim(this.cards_up); } /** 将四个卡槽节点映射为 CardComp,形成固定顺序控制数组 */ private cacheCardComps() { const nodes = [this.card1, this.card2, this.card3, this.card4]; this.cardComps = nodes .map(node => node?.getComponent(CardComp)) .filter((comp): comp is CardComp => !!comp); } /** 抽卡按钮:每次固定抽4张,然后顺序分发给4个单卡脚本 */ private onClickDraw() { mLogger.log(this.debugMode, "MissionCardComp", "click draw", { poolLv: this.poolLv }); this.layoutCardSlots(); const cards = this.buildDrawCards(); this.dispatchCardsToSlots(cards); } /** 升级按钮:仅提升卡池等级,卡槽是否更新由下一次抽卡触发 */ private onClickUpgrade() { if (this.poolLv >= CARD_POOL_MAX_LEVEL) { mLogger.log(this.debugMode, "MissionCardComp", "pool already max", this.poolLv); return; } const cost = this.getUpgradeCost(this.poolLv); const currentCoin = this.coin ?? 0; if (currentCoin < cost) { oops.gui.toast(`金币不足,升级需要${cost}`); this.updatePoolLvUI(); mLogger.log(this.debugMode, "MissionCardComp", "pool upgrade coin not enough", { poolLv: this.poolLv, currentCoin, cost }); return; } this.coin = currentCoin - cost; this.poolLv += 1; this.updateCoinUI(); this.updatePoolLvUI(); mLogger.log(this.debugMode, "MissionCardComp", "pool level up", { poolLv: this.poolLv, cost, leftCoin: this.coin }); } /** 构建本次抽卡结果,保证最终可分发4条数据 */ private buildDrawCards(): CardConfig[] { const cards = getCardsByLv(this.poolLv); /** 正常情况下直接取前4 */ if (cards.length >= 4) return cards.slice(0, 4); /** 兜底:当返回不足4张时循环补齐,保证分发不缺位 */ const filled = [...cards]; while (filled.length < 4) { const fallback = getCardsByLv(this.poolLv); if (fallback.length === 0) break; filled.push(fallback[filled.length % fallback.length]); } return filled; } /** 全量分发给4槽;每个槽位是否接收由 CardComp 自己判断(锁定可跳过) */ private dispatchCardsToSlots(cards: CardConfig[]) { for (let i = 0; i < this.cardComps.length; i++) { const accepted = this.cardComps[i].applyDrawCard(cards[i] ?? null); mLogger.log(this.debugMode, "MissionCardComp", "dispatch card", { index: i, card: cards[i]?.uuid ?? 0, accepted }); } } /** 系统清空4槽(用于任务切换) */ private clearAllCards() { this.cardComps.forEach(comp => comp.clearBySystem()); } private layoutCardSlots() { const count = this.cardComps.length; if (count === 0) return; const startX = -((count - 1) * this.cardWidth) / 2; for (let i = 0; i < count; i++) { const x = startX + i * this.cardWidth; this.cardComps[i].setSlotPosition(x); } mLogger.log(this.debugMode, "MissionCardComp", "layout card slots", { count, cardWidth: this.cardWidth, startX }); } private playButtonPressAnim(node: Node | null) { if (!node || !node.isValid) return; Tween.stopAllByTarget(node); tween(node) .to(0.06, { scale: new Vec3(this.buttonPressScale, this.buttonPressScale, 1) }) .start(); } private playButtonClickAnim(node: Node | null, onComplete: () => void) { if (!node || !node.isValid) { onComplete(); return; } Tween.stopAllByTarget(node); tween(node) .to(0.05, { scale: new Vec3(this.buttonClickScale, this.buttonClickScale, 1) }) .call(onComplete) .to(0.08, { scale: new Vec3(this.buttonNormalScale, this.buttonNormalScale, 1) }) .start(); } private playButtonResetAnim(node: Node | null) { if (!node || !node.isValid) return; Tween.stopAllByTarget(node); tween(node) .to(0.08, { scale: new Vec3(this.buttonNormalScale, this.buttonNormalScale, 1) }) .start(); } private resetButtonScale(node: Node | null) { if (!node || !node.isValid) return; Tween.stopAllByTarget(node); node.setScale(this.buttonNormalScale, this.buttonNormalScale, 1); } private canUpPool() { if (this.poolLv >= CARD_POOL_MAX_LEVEL) return false; const currentCoin = this.coin ?? 0; return currentCoin >= this.getUpgradeCost(this.poolLv); } /** 更新升级按钮上的等级文案,反馈当前卡池层级 */ private updatePoolLvUI() { if (!this.cards_up) return; const nobg = this.cards_up.getChildByName("nobg"); if (nobg) { nobg.active = !this.canUpPool(); } const label = this.cards_up.getChildByName("coin").getChildByName("num").getComponent(Label); if (!label) return; if (this.poolLv >= CARD_POOL_MAX_LEVEL) { label.string = `0`; } else { label.string = `${this.getUpgradeCost(this.poolLv)}`; } if (this.pool_lv_node) { for (let i = 1; i <= CARD_POOL_MAX_LEVEL; i++) { const n = this.pool_lv_node.getChildByName(`lv${i}`); if (n) n.active = i === this.poolLv; } } mLogger.log(this.debugMode, "MissionCardComp", "pool lv ui update", { poolLv: this.poolLv, cost: this.getUpgradeCost(this.poolLv) }); } private updateCoinUI() { if (!this.coins_node) return; const label = this.coins_node.getChildByName("num")?.getComponent(Label); if (!label) return; label.string = `${this.coin ?? 0}`; } private getUpgradeCost(lv: number): number { return CardsUpSet[lv] ?? 0; } private ensureHeroInfoPanel(eid: number, model: HeroAttrsComp) { if (!this.hero_info_node || !this.hero_info_prefab) return; this.hero_info_node.active = true; const current = this.heroInfoItems.get(eid); if (current) { current.model = model; this.updateHeroInfoPanel(current); return; } const node = instantiate(this.hero_info_prefab); node.parent = this.hero_info_node; node.active = true; const item = { node, model, apLabel: this.resolvePanelLabel(node, [["ap", "val"]]), hpLabel: this.resolvePanelLabel(node, [["hp", "val"]]) }; this.heroInfoItems.set(eid, item); this.relayoutHeroInfoPanels(); this.updateHeroInfoPanel(item); } private refreshHeroInfoPanels() { const removeKeys: number[] = []; this.heroInfoItems.forEach((item, eid) => { if (!item.node || !item.node.isValid) { removeKeys.push(eid); return; } const ent = (item.model as any)?.ent; if (!ent) { if (item.node.isValid) item.node.destroy(); removeKeys.push(eid); return; } this.updateHeroInfoPanel(item); }); for (let i = 0; i < removeKeys.length; i++) { this.heroInfoItems.delete(removeKeys[i]); } if (removeKeys.length > 0) { this.relayoutHeroInfoPanels(); } } private updateHeroInfoPanel(item: { node: Node, model: HeroAttrsComp, apLabel: Label | null, hpLabel: Label | null }) { if (item.apLabel) item.apLabel.string = `${Math.max(0, Math.floor(item.model.ap ?? 0))}`; if (item.hpLabel) item.hpLabel.string = `${Math.max(0, Math.floor(item.model.hp_max ?? 0))}`; } 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; }); } private clearHeroInfoPanels() { this.heroInfoItems.forEach(item => { if (item.node && item.node.isValid) { item.node.destroy(); } }); this.heroInfoItems.clear(); if (this.hero_info_node && this.hero_info_node.isValid) { for (let i = this.hero_info_node.children.length - 1; i >= 0; i--) { const child = this.hero_info_node.children[i]; if (child && child.isValid) child.destroy(); } } this.heroInfoSyncTimer = 0; } private resolvePanelLabel(root: Node, paths: string[][]): Label | null { for (let i = 0; i < paths.length; i++) { const node = this.findNodeByPath(root, paths[i]); if (!node) continue; const label = node.getComponent(Label) || node.getComponentInChildren(Label); if (label) return label; } return null; } private findNodeByPath(root: Node, path: string[]): Node | null { let current: Node | null = root; for (let i = 0; i < path.length; i++) { current = current?.getChildByName(path[i]) ?? null; if (!current) return null; } return current; } /** 视图对象通过 ecs.Entity.remove(ModuleViewComp) 删除组件是触发组件处理自定义释放逻辑 */ reset() { this.clearHeroInfoPanels(); this.resetButtonScale(this.cards_chou); this.resetButtonScale(this.cards_up); this.node.destroy(); } }