refactor(map): 重构天赋系统为驻场技能展示组件
1. 将原天赋系统页面重构成驻场技能信息展示页 2. 移除升级、重置等旧功能,仅保留基础数据展示逻辑 3. 新增数值格式化工具函数,兼容百分比与整数加成显示 4. 简化组件依赖,仅保留必要的配置与UI渲染逻辑 5. 统一组件命名与注释,明确职责边界
This commit is contained in:
@@ -1,125 +1,64 @@
|
||||
/**
|
||||
* @file TalentItemComp.ts
|
||||
* @description 单个天赋项组件
|
||||
* @description 驻场技能项组件(UI 视图层)
|
||||
*
|
||||
* 职责:
|
||||
* 1. 接收 TalentsComp 下发的 FieldSkillConfig 与当前场上总加成值。
|
||||
* 2. 渲染名称 / 基础值 / 当前值 / 描述四段信息。
|
||||
* 3. 兼容旧的 `@ecs.register('TalentItem')` 资源引用。
|
||||
*
|
||||
* 依赖:
|
||||
* - SkillSet.FieldSkillConfig —— 单条驻场技能配置
|
||||
*/
|
||||
import { _decorator, Node, Label, Button, resources, SpriteAtlas, Sprite } from "cc";
|
||||
import { _decorator, Label } 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 { TalentInfo, TalentType } from "../common/config/TalentSet";
|
||||
import { smc } from "../common/SingletonModuleComp";
|
||||
import { FieldSkillConfig } from "../common/config/SkillSet";
|
||||
|
||||
const { ccclass, property } = _decorator;
|
||||
|
||||
/**
|
||||
* 将驻场配置值统一格式化为可读字符串。
|
||||
* 兼容"小数"(0.1 表示 10%)与"整数百分点"(10 表示 10%)两种口径。
|
||||
*/
|
||||
function formatBuffValue(value: number): string {
|
||||
if (Math.abs(value) < 1) {
|
||||
return `${(value * 100).toFixed(0)}%`;
|
||||
}
|
||||
return value.toString();
|
||||
}
|
||||
|
||||
/** TalentItemComp —— 驻场技能项组件 */
|
||||
@ccclass('TalentItemComp')
|
||||
@ecs.register('TalentItem', false)
|
||||
export class TalentItemComp extends CCComp {
|
||||
|
||||
@property({ type: Label, tooltip: "天赋名称" })
|
||||
@property({ type: Label, tooltip: "驻场技能名称" })
|
||||
lbl_name: Label = null!;
|
||||
|
||||
@property({ type: Node, tooltip: "图标节点" })
|
||||
icon_node: Node = null!;
|
||||
@property({ type: Label, tooltip: "基础值(来自配置)" })
|
||||
lbl_base: Label = null!;
|
||||
|
||||
@property({ type: Label, tooltip: "描述" })
|
||||
lbl_desc: Label = null!;
|
||||
@property({ type: Label, tooltip: "当前场上总加成(实时聚合)" })
|
||||
lbl_current: Label = null!;
|
||||
|
||||
@property({ type: Label, tooltip: "等级进度" })
|
||||
lbl_level: Label = null!;
|
||||
|
||||
@property({ type: Label, tooltip: "升级消耗" })
|
||||
lbl_cost: Label = null!;
|
||||
|
||||
@property({ type: Button, tooltip: "升级按钮" })
|
||||
btn_upgrade: Button = null!;
|
||||
|
||||
@property({ type: Node, tooltip: "背景" })
|
||||
item_bg: Node = null!;
|
||||
|
||||
@property({ type: Node, tooltip: "图标背景" })
|
||||
icon_bg: Node = null!;
|
||||
|
||||
private _talentId: TalentType = TalentType.Attack;
|
||||
private _onClickCallback: ((talentId: TalentType, currentLevel: number) => void) | null = null;
|
||||
private _currentLevel: number = 0;
|
||||
|
||||
private _talentInfo: TalentInfo | null = null;
|
||||
|
||||
protected onLoad(): void {
|
||||
if (this.btn_upgrade && this.btn_upgrade.node) {
|
||||
this.btn_upgrade.node.on(Button.EventType.CLICK, this.onUpgradeClicked, this);
|
||||
}
|
||||
}
|
||||
@property({ type: Label, tooltip: "驻场技能描述" })
|
||||
lbl_info: Label = null!;
|
||||
|
||||
/**
|
||||
* 更新天赋项显示
|
||||
* @param talentInfo 天赋配置数据
|
||||
* @param currentLevel 当前等级
|
||||
* @param onClickCallback 点击升级按钮的回调
|
||||
* 刷新单条驻场技能展示
|
||||
* @param config FieldSkillSet 中的单条配置
|
||||
* @param currentTotal 当前场上同 type 累加值(实时聚合)
|
||||
*/
|
||||
public updateItem(talentInfo: TalentInfo, currentLevel: number, onClickCallback: (talentId: TalentType, currentLevel: number) => void) {
|
||||
this._talentInfo = talentInfo;
|
||||
this._talentId = talentInfo.id;
|
||||
this._currentLevel = currentLevel;
|
||||
this._onClickCallback = onClickCallback;
|
||||
|
||||
if (this.lbl_name) {
|
||||
this.lbl_name.string = talentInfo.name;
|
||||
}
|
||||
|
||||
// 同步尝试刷新一次图标(如果图集已经缓存过,比如重新打开界面时)
|
||||
this.refreshIcon();
|
||||
|
||||
if (this.lbl_desc) {
|
||||
let currentVal = currentLevel === 0 ? 0 : talentInfo.values[currentLevel - 1];
|
||||
this.lbl_desc.string = talentInfo.desc.replace('{value}', currentVal.toString());
|
||||
}
|
||||
|
||||
if (this.lbl_level) {
|
||||
this.lbl_level.string = `${currentLevel}/${talentInfo.maxLevel}`;
|
||||
}
|
||||
|
||||
let isMax = currentLevel >= talentInfo.maxLevel;
|
||||
let cost = isMax ? 0 : (talentInfo.costs[currentLevel] ?? 0);
|
||||
let canUpgrade = !isMax && smc.vmdata.gold >= cost;
|
||||
|
||||
if (this.lbl_cost) {
|
||||
this.lbl_cost.string = isMax ? "已满级" : `${cost}`;
|
||||
}
|
||||
|
||||
if (this.btn_upgrade) {
|
||||
this.btn_upgrade.interactable = canUpgrade;
|
||||
}
|
||||
public updateItem(config: FieldSkillConfig, currentTotal: number): void {
|
||||
if (!config) return;
|
||||
if (this.lbl_name) this.lbl_name.string = config.name ?? "";
|
||||
if (this.lbl_base) this.lbl_base.string = `基础 +${formatBuffValue(config.value)}`;
|
||||
if (this.lbl_current) this.lbl_current.string = `当前 +${formatBuffValue(currentTotal)}`;
|
||||
if (this.lbl_info) this.lbl_info.string = config.info ?? "";
|
||||
}
|
||||
|
||||
/** 单独更新图标,供父节点加载完图集后回调或自身更新时调用 */
|
||||
public refreshIcon() {
|
||||
if (!this._talentInfo || !this.icon_node || !this._talentInfo.icon) return;
|
||||
|
||||
if (smc.uiconsAtlas && smc.uiconsAtlas.spriteFrames) {
|
||||
// 确保 icon 是字符串类型,防止配置写成纯数字导致底层 getSpriteFrame 报错
|
||||
const iconStr = String(this._talentInfo.icon);
|
||||
const frame = smc.uiconsAtlas.getSpriteFrame(iconStr);
|
||||
if (frame && this.icon_node.isValid) {
|
||||
const sprite = this.icon_node.getComponent(Sprite) || this.icon_node.addComponent(Sprite);
|
||||
sprite.spriteFrame = frame;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private onUpgradeClicked() {
|
||||
if (this._onClickCallback) {
|
||||
this._onClickCallback(this._talentId, this._currentLevel);
|
||||
}
|
||||
}
|
||||
|
||||
protected onDestroy(): void {
|
||||
super.onDestroy();
|
||||
if (this.btn_upgrade && this.btn_upgrade.node && this.btn_upgrade.node.isValid) {
|
||||
this.btn_upgrade.node.off(Button.EventType.CLICK, this.onUpgradeClicked, this);
|
||||
}
|
||||
}
|
||||
|
||||
/** ECS 组件移除时销毁节点 */
|
||||
/** ECS 组件移除时销毁节点(CCComp 抽象方法实现) */
|
||||
reset() {
|
||||
this.node.destroy();
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user