18xchat/assets/Scripts/chat18x/ui/panels/GirlListPanel.ts

import {
  _decorator,
  Component,
  Node,
  instantiate,
  tween,
  Vec3,
  Label,
} from "cc";
import li_BaseView from "db://assets/Scripts/Main/Common/li_BaseView";
import Utils from "db://assets/Scripts/Main/Common/Utils";
import { GButton } from "db://assets/Scripts/Main/Common/GButton";
import { GirlListItem } from "../../uiitems/GirlListItem";
import { GirlService } from "db://assets/Scripts/chat18x/network/services/GirlService";
import { DataManager, DataId } from "../../data/DataManager";
import { GirlData } from "../../data/GirlData";
import proto from "db://assets/Scripts/proto/proto.pb.js";
import { NavigationManager, PanelType } from "../../manager/NavigationManager";
import { ThemeData } from "../../data/ThemeData";
import LanguageUtils from "../../../Main/Common/LanguageUtils";

const { ccclass, property } = _decorator;

@ccclass("GirlListPanel")
export class GirlListPanel extends li_BaseView {
  private _nodeTab: any = {};

  itemInst: GirlListItem;
  content: Node;

  cache: GirlListItem[] = [];

  // 缓存池相关属性
  private itemPool: GirlListItem[] = [];
  private maxPoolSize: number = 20;

  private title1: Label;
  private title2: Label;

  category: number;

  onLoadCT() {
    this.node.active = false;
    this.scheduleOnce(() => {
      this.node.active = true;
    }, 0.1);
    Utils.parseNode(this.node, this._nodeTab);
    this.registerListener();
    this.itemInst = this._nodeTab.BubbleItem.getComponent(GirlListItem);
    this.itemInst.node.active = false;
    this.content = this._nodeTab.content;

    this.title1 = this._nodeTab.title1.getComponent(Label);
    this.title2 = this._nodeTab.title2.getComponent(Label);

    this.refresh();
  }

  cacheCategory: number = -1;

  // 从缓存池获取节点
  private getItemFromPool(): GirlListItem {
    if (this.itemPool.length > 0) {
      return this.itemPool.pop();
    } else {
      // 缓存池为空，检查是否有隐藏的节点可以复用
      for (let i = 0; i < this.content.children.length; i++) {
        let childNode = this.content.children[i];
        if (!childNode.active && childNode !== this.itemInst.node) {
          let item = childNode.getComponent(GirlListItem);
          if (item) {
            return item;
          }
        }
      }

      // 没有可复用的节点，创建新节点
      let newNode = instantiate(this.itemInst.node);
      let item = newNode.getComponent(GirlListItem);
      this.content.addChild(newNode);
      return item;
    }
  }

  // 将节点回收到缓存池
  private returnItemToPool(item: GirlListItem) {
    if (this.itemPool.length < this.maxPoolSize) {
      item.reset();
      this.itemPool.push(item);
    } else {
      // 缓存池已满，隐藏节点但不销毁
      item.reset();
    }
  }

  async refresh() {
    const category = NavigationManager.Instance.getSelectedCategoryId();
    if (category == this.cacheCategory) return;
    this.cacheCategory = category;

    // 回收当前显示的节点到缓存池
    if (this.cache) {
      for (let i = this.cache.length - 1; i >= 0; i--) {
        let item = this.cache[i];
        this.returnItemToPool(item);
      }
      this.cache = [];
    }

    // 主题数据
    const themeData = DataManager.I.getDataById<ThemeData>(DataId.Theme);
    const key = themeData.getLanKeyById(1001 + category);
    this.title1.string = this.title2.string = LanguageUtils.getText(key);

    // 请求列表
    const reqData = {
      category,
      page: 1,
      limit: 10,
    };
    let res = await GirlService.I.reqGetGirlList(reqData);
    if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
      // 保存数据
      const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
      girlData.setGirlList(category.toString(), res.data);
      // 根据数据，刷新界面
      const allId = girlData.getGirlIds(category.toString());
      for (let i = 0; i < allId.length; i++) {
        let id = allId[i];
        let item = this.getItemFromPool();
        item.refreshData(category, id, this.node);
        item.node.active = true;
        this.cache.push(item);

        // 确保节点在 content 中（可能已经在了）
        if (item.node.parent !== this.content) {
          this.content.addChild(item.node);
        }
      }
    }
  }

  private addSlideInAnimation(itemNode: Node, index: number) {
    // 保存节点的目标位置
    const targetPosition = itemNode.getPosition();

    // 设置初始位置为屏幕右侧外（偏移300像素）
    const startPosition = new Vec3(
      targetPosition.x + 300,
      targetPosition.y,
      targetPosition.z
    );
    itemNode.setPosition(startPosition);

    // 添加递进延时，每个item延迟0.05秒
    const delay = index * 0.05;

    // 执行滑入动画
    tween(itemNode)
      .delay(delay)
      .to(0.4, { position: targetPosition }, { easing: "cubicOut" })
      .start();
  }

  hide() {
    this.node.active = false;
  }

  private registerListener() {
    GButton.BandClick(this._nodeTab.ReturnBtn, this.Return, this);
  }
  Return() {
    NavigationManager.Instance.closeSubPanel(this);
  }

  onDestroy() {
    // 清理缓存池，销毁所有缓存的节点
    for (let item of this.itemPool) {
      if (item && item.node) {
        item.node.destroy();
      }
    }
    this.itemPool = [];

    // 清理当前显示的节点
    for (let item of this.cache) {
      if (item && item.node) {
        item.node.destroy();
      }
    }
    this.cache = [];
  }
}