调整布局、新增导航栏，调整页面跳转逻辑

assets/Scripts/chat18x/core/MainController.ts

@@ -0,0 +1,218 @@
+import { _decorator, Component, Node } from "cc";
+import { ThemeService } from "../network/services/ThemeService";
+import { GirlService } from "../network/services/GirlService";
+import { ShopService } from "../network/services/ShopService";
+import { DataManager, DataId } from "../data/DataManager";
+import { ThemeData } from "../data/ThemeData";
+import { GirlData } from "../data/GirlData";
+import { ShopData } from "../data/ShopData";
+import proto from "db://assets/Scripts/proto/proto.pb.js";
+
+const { ccclass, property } = _decorator;
+
+@ccclass("MainController")
+export class MainController {
+  private static _instance: MainController;
+  public static get I(): MainController {
+    if (!MainController._instance) {
+      MainController._instance = new MainController();
+    }
+    return MainController._instance;
+  }
+  private constructor() {}
+
+  // 数据预加载状态标记
+  private isThemeDataPreloaded: boolean = false;
+  private isDailyRecommendPreloaded: boolean = false;
+  private isShopListPreloaded: boolean = false;
+
+  /**
+   * 初始化并预加载数据
+   */
+  async init(): Promise<void> {
+    console.log("[MainController] 开始初始化并预加载数据");
+    
+    // 并行预加载所有数据
+    await Promise.all([
+      this.preloadThemeData(),
+      this.preloadDailyRecommend(),
+      this.preloadShopList()
+    ]);
+    
+    console.log("[MainController] 数据预加载完成");
+  }
+
+  /**
+   * 预加载主题数据
+   */
+  async preloadThemeData(): Promise<boolean> {
+    if (this.isThemeDataPreloaded) {
+      console.log("[MainController] 主题数据已预加载");
+      return true;
+    }
+
+    try {
+      console.log("[MainController] 开始预加载主题数据");
+      const reqData = {};
+      const res = await ThemeService.I.reqHallTheme(reqData);
+      
+      if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
+        // 保存数据到DataManager
+        const themeData = DataManager.I.getDataById<ThemeData>(DataId.Theme);
+        themeData.themes = res.data;
+        this.isThemeDataPreloaded = true;
+        console.log("[MainController] 主题数据预加载成功");
+        return true;
+      } else {
+        console.warn("[MainController] 主题数据预加载失败:", res);
+        return false;
+      }
+    } catch (error) {
+      console.error("[MainController] 主题数据预加载异常:", error);
+      return false;
+    }
+  }
+
+  /**
+   * 预加载每日推荐
+   */
+  async preloadDailyRecommend(): Promise<boolean> {
+    if (this.isDailyRecommendPreloaded) {
+      console.log("[MainController] 每日推荐数据已预加载");
+      return true;
+    }
+
+    try {
+      console.log("[MainController] 开始预加载每日推荐数据");
+      const reqData = {};
+      const res = await GirlService.I.reqDailyRecommend(reqData);
+      
+      if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
+        // 保存数据到DataManager
+        const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
+        girlData.setDailyRecommend(res.data);
+        this.isDailyRecommendPreloaded = true;
+        console.log("[MainController] 每日推荐数据预加载成功");
+        return true;
+      } else {
+        console.warn("[MainController] 每日推荐数据预加载失败:", res);
+        return false;
+      }
+    } catch (error) {
+      console.error("[MainController] 每日推荐数据预加载异常:", error);
+      return false;
+    }
+  }
+
+  /**
+   * 预加载商品列表
+   */
+  async preloadShopList(): Promise<boolean> {
+    if (this.isShopListPreloaded) {
+      console.log("[MainController] 商品列表数据已预加载");
+      return true;
+    }
+
+    try {
+      console.log("[MainController] 开始预加载商品列表数据");
+      const reqData = {};
+      const res = await ShopService.I.reqShopList(reqData);
+      
+      if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
+        // 保存数据到DataManager
+        const shopData = DataManager.I.getDataById<ShopData>(DataId.Shop);
+        shopData.goods = res.data;
+        this.isShopListPreloaded = true;
+        console.log("[MainController] 商品列表数据预加载成功");
+        return true;
+      } else {
+        console.warn("[MainController] 商品列表数据预加载失败:", res);
+        return false;
+      }
+    } catch (error) {
+      console.error("[MainController] 商品列表数据预加载异常:", error);
+      return false;
+    }
+  }
+
+  /**
+   * 检查数据是否已预加载
+   */
+  isDataPreloaded(): boolean {
+    return this.isThemeDataPreloaded && this.isDailyRecommendPreloaded && this.isShopListPreloaded;
+  }
+
+  /**
+   * 获取预加载状态
+   */
+  getPreloadStatus() {
+    return {
+      themeData: this.isThemeDataPreloaded,
+      dailyRecommend: this.isDailyRecommendPreloaded,
+      shopList: this.isShopListPreloaded,
+      allComplete: this.isDataPreloaded()
+    };
+  }
+
+  /**
+   * 重置预加载状态（用于重新加载数据）
+   */
+  resetPreloadStatus(): void {
+    this.isThemeDataPreloaded = false;
+    this.isDailyRecommendPreloaded = false;
+    this.isShopListPreloaded = false;
+    console.log("[MainController] 预加载状态已重置");
+  }
+
+  /**
+   * 强制刷新主题数据
+   */
+  async refreshThemeData(): Promise<boolean> {
+    console.log("[MainController] 开始强制刷新主题数据");
+    try {
+      const reqData = {};
+      const res = await ThemeService.I.reqHallTheme(reqData);
+      
+      if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
+        // 保存数据到DataManager
+        const themeData = DataManager.I.getDataById<ThemeData>(DataId.Theme);
+        themeData.themes = res.data;
+        this.isThemeDataPreloaded = true;
+        console.log("[MainController] 主题数据刷新成功");
+        return true;
+      } else {
+        console.warn("[MainController] 主题数据刷新失败:", res);
+        return false;
+      }
+    } catch (error) {
+      console.error("[MainController] 主题数据刷新异常:", error);
+      return false;
+    }
+  }
+
+  /**
+   * 强制刷新每日推荐数据
+   */
+  async refreshDailyRecommend(): Promise<boolean> {
+    console.log("[MainController] 开始强制刷新每日推荐数据");
+    try {
+      const reqData = {};
+      const res = await GirlService.I.reqDailyRecommend(reqData);
+      
+      if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
+        // 保存数据到DataManager
+        const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
+        girlData.setDailyRecommend(res.data);
+        this.isDailyRecommendPreloaded = true;
+        console.log("[MainController] 每日推荐数据刷新成功");
+        return true;
+      } else {
+        console.warn("[MainController] 每日推荐数据刷新失败:", res);
+        return false;
+      }
+    } catch (error) {
+      console.error("[MainController] 每日推荐数据刷新异常:", error);
+      return false;
+    }
+  }
+}

assets/Scripts/chat18x/core/MainController.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.24",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "d3917420-e17a-46f9-8864-4f4997a10ddc",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}

assets/Scripts/chat18x/manager/NavigationManager.ts

@@ -1,6 +1,10 @@
 import { ViewManager } from "db://assets/Scripts/Main/Manager/ViewManager";
 import { UITransitionHelper } from "../utils/UITransitionHelper";
 import GameRootUI from "../../Main/Common/GameRootUI";
+import { Node } from "cc";
+import li_EventManager from "../../Main/Common/li_EventManager";
+import { InnerMsgCode } from "../../Main/Config/InnerMsgCode";
+import { ThemePanel } from "../ui/panels/ThemePanel";
 
 /**
  * 页面过渡动画类型枚举
@@ -11,6 +15,16 @@ export enum PageTransitionType {
   SLIDE_RIGHT = "slide_right",
 }
 
+/**
+ * NavigationPanel面板类型枚举
+ */
+export enum PanelType {
+  THEME = "ThemePanel",
+  GIRL_DETAIL = "GirlDetailPanel",
+  CHAT = "ChatPanel",
+  SETTING = "SettingPanel",
+}
+
 /**
  * 页面过渡动画配置接口
  */
@@ -25,6 +39,7 @@ export interface PageTransitionConfig {
  * 导航管理器
  *
  * 负责管理游戏中的页面导航和路由，将导航逻辑从业务逻辑中分离出来
+ * 统一管理NavigationPanel和其他面板的切换
  *
  * @author AI Chat System
  * @version 1.0.0
@@ -32,6 +47,16 @@ export interface PageTransitionConfig {
 export class NavigationManager {
   private static _instance: NavigationManager;
 
+  // NavigationPanel相关属性
+  private navigationPanel: any = null; // NavigationPanel实例引用
+  private currentActivePanel: PanelType = PanelType.THEME;
+  private panelCache: Map<PanelType, Node> = new Map(); // 面板缓存
+  private currentVisiblePanel: Node = null;
+
+  // 选中的角色相关信息
+  private selectedGirlId: number = 1; // 当前选中的角色ID
+  private selectedThemeId: number = 1; // 当前选中的主题ID
+
   /**
    * 获取NavigationManager的单例实例
    *
@@ -45,7 +70,350 @@ export class NavigationManager {
     return this._instance;
   }
 
-  private constructor() {}
+  private constructor() {
+    // 初始化事件监听
+    this.initEventListeners();
+  }
+
+  /**
+   * 初始化事件监听
+   */
+  private initEventListeners(): void {
+    // 监听导航面板切换事件
+    li_EventManager.I.addInnerEL(
+      InnerMsgCode.Navigation_PanelSwitch,
+      this.onNavigationEvent,
+      this
+    );
+  }
+
+  /**
+   * 处理导航事件
+   */
+  private onNavigationEvent(panelType: PanelType): void {
+    console.log(
+      "[NavigationManager] Received navigation event for:",
+      panelType
+    );
+    this.switchToPanel(panelType);
+  }
+
+  /**
+   * 注册NavigationPanel实例
+   * @param panel NavigationPanel实例
+   */
+  public registerNavigationPanel(panel: any): void {
+    this.navigationPanel = panel;
+    console.log("[NavigationManager] NavigationPanel registered");
+  }
+
+  /**
+   * 统一的面板切换方法
+   * @param panelType 目标面板类型
+   */
+  public switchToPanel(panelType: PanelType, force: boolean = false): void {
+    if (this.currentActivePanel === panelType && !force) {
+      return;
+    }
+
+    if (!this.navigationPanel) {
+      console.warn(
+        "[NavigationManager] NavigationPanel not registered, fallback to direct ViewManager call"
+      );
+      this.fallbackSwitchPanel(panelType);
+      return;
+    }
+
+    // 通知NavigationPanel显示加载状态
+    this.navigationPanel.showLoading?.();
+
+    // 计算动画方向
+    const currentIndex = this.getPanelIndex(this.currentActivePanel);
+    const targetIndex = this.getPanelIndex(panelType);
+    const isMovingRight = currentIndex < targetIndex;
+
+    const hideDirection = isMovingRight ? "left" : "right";
+    const showDirection = isMovingRight ? "right" : "left";
+
+    // 隐藏当前面板（包括子页面）
+    this.hideCurrentPanelWithChildren(hideDirection);
+
+    // 加载并显示目标面板
+    this.loadOrGetPanel(panelType, (panel: Node) => {
+      this.currentActivePanel = panelType;
+      this.currentVisiblePanel = panel;
+
+      // 更新NavigationPanel按钮状态
+      this.navigationPanel.updateButtonStates?.(panelType);
+
+      // 显示面板
+      this.showPanelWithAnimation(panel, showDirection, () => {
+        this.navigationPanel.hideLoading?.();
+      });
+    });
+  }
+
+  /**
+   * 获取面板索引（用于动画方向计算）
+   */
+  private getPanelIndex(panelType: PanelType): number {
+    switch (panelType) {
+      case PanelType.THEME:
+        return 0;
+      case PanelType.GIRL_DETAIL:
+        return 1;
+      case PanelType.CHAT:
+        return 2;
+      case PanelType.SETTING:
+        return 3;
+      default:
+        return 0;
+    }
+  }
+
+  /**
+   * 获取面板名称
+   */
+  private getPanelName(panelType: PanelType): string {
+    return panelType as string;
+  }
+
+  /**
+   * 获取面板数据
+   */
+  private getPanelData(panelType: PanelType): any {
+    switch (panelType) {
+      case PanelType.GIRL_DETAIL:
+        return this.selectedGirlId; // 使用当前选中的角色ID
+      case PanelType.CHAT:
+        return { girlId: this.selectedGirlId }; // 使用当前选中的角色ID
+      default:
+        return null;
+    }
+  }
+
+  /**
+   * 加载或获取面板
+   */
+  private loadOrGetPanel(
+    panelType: PanelType,
+    callback: (panel: Node) => void
+  ) {
+    // 检查缓存
+    if (this.panelCache.has(panelType)) {
+      const cachedPanel = this.panelCache.get(panelType);
+      if (cachedPanel && cachedPanel.isValid) {
+        // 特殊处理：主题面板刷新（避免重复调用Show）
+        if (panelType === PanelType.THEME) {
+          const themePanel = cachedPanel.getComponent(ThemePanel);
+          if (themePanel) {
+            // 不在这里调用Show()，因为ThemePanel已经有加载状态保护
+            // 只在必要时调用onHide()确保子页面状态正确
+            if (typeof themePanel.onHide === "function") {
+              console.log("[NavigationManager] 确保主题面板子页面状态正确");
+              themePanel.onHide();
+            }
+          }
+        }
+        callback(cachedPanel);
+        return;
+      } else {
+        this.panelCache.delete(panelType);
+      }
+    }
+
+    // 加载新面板
+    const panelName = this.getPanelName(panelType);
+    const openData = this.getPanelData(panelType);
+
+    ViewManager.I.openBundlesView(panelName, openData, (panel: Node) => {
+      if (panel && panel.isValid) {
+        this.panelCache.set(panelType, panel);
+        callback(panel);
+      }
+    });
+  }
+
+  /**
+   * 隐藏当前面板及其子页面
+   */
+  private hideCurrentPanelWithChildren(direction: "left" | "right") {
+    if (!this.currentVisiblePanel) {
+      return;
+    }
+
+    // 如果当前是ThemePanel，需要同时处理可能的子页面（GirlListPanel）
+    if (this.currentActivePanel === PanelType.THEME) {
+      // 查找并隐藏GirlListPanel子页面
+      this.hideThemePanelChildren(direction);
+
+      // 隐藏ThemePanel主面板
+      this.hidePanelWithAnimation(this.currentVisiblePanel, direction);
+    } else {
+      // 其他面板直接隐藏
+      this.hidePanelWithAnimation(this.currentVisiblePanel, direction);
+    }
+  }
+
+  /**
+   * 隐藏ThemePanel的子页面
+   */
+  private hideThemePanelChildren(direction: "left" | "right") {
+    const themePanelNode = this.findThemePanelNode();
+    if (themePanelNode) {
+      const themePanelComponent = themePanelNode.getComponent("ThemePanel");
+      if (themePanelComponent) {
+        // 获取子页面节点
+        const childPanel = this.getThemePanelChildNode(themePanelComponent);
+        if (childPanel && childPanel.active) {
+          console.log(
+            "[NavigationManager] Hiding ThemePanel child with animation"
+          );
+          this.hidePanelWithAnimation(childPanel, direction);
+        }
+      }
+    }
+  }
+
+  /**
+   * 获取ThemePanel的子页面节点
+   */
+  private getThemePanelChildNode(themePanelComponent: any): Node | null {
+    try {
+      // ThemePanel存储子页面在currentChildPanel属性中
+      if (
+        themePanelComponent.currentChildPanel &&
+        themePanelComponent.currentChildPanel.node
+      ) {
+        return themePanelComponent.currentChildPanel.node;
+      }
+
+      // 如果没有直接的引用，尝试通过ViewManager查找GirlListPanel
+      const viewList = (ViewManager.I as any).m_viewList;
+      if (viewList) {
+        for (let i = 0; i < viewList.length; i++) {
+          const view = viewList[i];
+          if (
+            view &&
+            view.isValid &&
+            view.name === "GirlListPanel" &&
+            view.active
+          ) {
+            return view;
+          }
+        }
+      }
+      return null;
+    } catch (error) {
+      console.error(
+        "[NavigationManager] Error getting child panel node:",
+        error
+      );
+      return null;
+    }
+  }
+
+  /**
+   * 隐藏面板动画
+   */
+  private hidePanelWithAnimation(
+    panel: Node,
+    direction: "left" | "right",
+    callback?: Function
+  ) {
+    if (!panel || !panel.isValid || !panel.active) {
+      callback && callback();
+      return;
+    }
+
+    if (direction === "left") {
+      UITransitionHelper.slideOutToLeft(panel, 0.3, () => {
+        panel.active = false;
+        callback && callback();
+      });
+    } else {
+      UITransitionHelper.slideOutToRight(panel, 0.3, () => {
+        panel.active = false;
+        callback && callback();
+      });
+    }
+  }
+
+  /**
+   * 显示面板动画
+   */
+  private showPanelWithAnimation(
+    panel: Node,
+    direction: "left" | "right",
+    callback?: Function
+  ) {
+    if (!panel || !panel.isValid) {
+      callback && callback();
+      return;
+    }
+
+    panel.active = true;
+
+    if (direction === "right") {
+      UITransitionHelper.slideInFromRight(panel, 0.3, () => {
+        callback && callback();
+      });
+    } else {
+      UITransitionHelper.slideInFromLeft(panel, 0.3, () => {
+        callback && callback();
+      });
+    }
+  }
+
+  /**
+   * 后备切换方法（当NavigationPanel未注册时）
+   */
+  private fallbackSwitchPanel(panelType: PanelType): void {
+    const panelName = this.getPanelName(panelType);
+    const openData = this.getPanelData(panelType);
+    ViewManager.I.openBundlesView(panelName, openData);
+  }
+
+  /**
+   * 获取当前激活的面板类型
+   */
+  public getCurrentActivePanel(): PanelType {
+    return this.currentActivePanel;
+  }
+
+  /**
+   * 设置选中的角色ID
+   * @param girlId 角色ID
+   */
+  public setSelectedGirlId(girlId: number): void {
+    this.selectedGirlId = girlId;
+    console.log("[NavigationManager] Selected girl ID set to:", girlId);
+  }
+
+  /**
+   * 获取当前选中的角色ID
+   * @returns 当前选中的角色ID
+   */
+  public getSelectedGirlId(): number {
+    return this.selectedGirlId;
+  }
+
+  /**
+   * 设置选中的主题ID
+   * @param themeId 主题ID
+   */
+  public setSelectedThemeId(themeId: number): void {
+    this.selectedThemeId = themeId;
+    console.log("[NavigationManager] Selected theme ID set to:", themeId);
+  }
+
+  /**
+   * 获取当前选中的主题ID
+   * @returns 当前选中的主题ID
+   */
+  public getSelectedThemeId(): number {
+    return this.selectedThemeId;
+  }
 
   /**
    * 通用页面导航方法，支持过渡动画
@@ -89,6 +457,11 @@ export class NavigationManager {
       transitionConfig.outgoingTransition !== PageTransitionType.NONE;
 
     if (!useTransition) {
+      // 在没有过渡动画的情况下，也需要处理子页面逻辑
+      if (targetPanel && targetPanel !== "GirlListPanel") {
+        this.handleThemePanelChildPanelsOnNavigation();
+      }
+
       ViewManager.I.openBundlesView(targetPanel, navigationData, onComplete);
       if (
         currentPanel &&
@@ -129,6 +502,7 @@ export class NavigationManager {
     duration: number,
     onComplete?: Function
   ): void {
+    const targetPanelName = targetNode ? targetNode.name : null;
     const executeIncomingAnimation = (callback?: Function) => {
       if (
         config.incomingTransition === PageTransitionType.NONE ||
@@ -191,8 +565,27 @@ export class NavigationManager {
         currentPanel.onClose &&
         typeof currentPanel.onClose === "function"
       ) {
-        if (currentPanel.node.name !== "ThemePanel") currentPanel.onClose();
+        if (currentPanel.node.name !== "ThemePanel") {
+          currentPanel.onClose();
+        } else {
+          // 如果当前面板是 ThemePanel，检查是否需要关闭子页面
+          console.log(
+            "[NavigationManager] ThemePanel detected, checking for child panels"
+          );
+          if (
+            currentPanel.closeChildPanel &&
+            typeof currentPanel.closeChildPanel === "function"
+          ) {
+            currentPanel.closeChildPanel();
+          }
+        }
       }
+
+      // 检查目标面板是否会导致需要隐藏 ThemePanel 的子页面
+      if (targetPanelName && targetPanelName !== "GirlListPanel") {
+        this.handleThemePanelChildPanelsOnNavigation();
+      }
+
       onComplete && onComplete();
     };
 
@@ -215,7 +608,7 @@ export class NavigationManager {
   }
 
   /**
-   * 进入角色列表页面
+   * 进入角色列表页面（作为 ThemePanel 的子页面）
    *
    * @param {number} themeId - 主题ID，用于筛选角色
    *
@@ -224,55 +617,180 @@ export class NavigationManager {
    * NavigationManager.Instance.navigateToGirlList(1);
    * ```
    */
-  public navigateToGirlList(themeId: number): void;
-  /**
-   * 进入角色列表页面（带过渡动画）
-   *
-   * @param {number} themeId - 主题ID，用于筛选角色
-   * @param {PageTransitionConfig} transitionConfig - 过渡动画配置
-   * @param {any} currentPanel - 当前面板实例（可选）
-   *
-   * @example
-   * ```typescript
-   * NavigationManager.Instance.navigateToGirlList(1,
-   *   { incomingTransition: PageTransitionType.SLIDE_RIGHT, outgoingTransition: PageTransitionType.FADE },
-   *   this
-   * );
-   * ```
-   */
-  public navigateToGirlList(
-    themeId: number,
-    transitionConfig?: PageTransitionConfig,
-    currentPanel?: any
-  ): void;
-  public navigateToGirlList(
-    themeId: number,
-    transitionConfig?: PageTransitionConfig,
-    currentPanel?: any
-  ): void {
+  public navigateToGirlList(themeId: number): void {
     if (themeId == null || themeId < 0) {
       console.warn("Invalid theme ID for girl list navigation:", themeId);
       return;
     }
 
-    console.log(`Navigating to girl list with theme ID: ${themeId}`);
+    // 更新选中的主题ID
+    this.setSelectedThemeId(themeId);
 
-    if (transitionConfig) {
-      const navigationData = {
-        category: themeId,
-        withTransition: true,
-      };
-      this.navigateWithTransition(
+    console.log(
+      `[NavigationManager] Navigating to girl list with theme ID: ${themeId}`
+    );
+
+    // 先检查是否已有GirlListPanel存在
+    const existingGirlListPanel = this.findExistingGirlListPanel();
+
+    if (existingGirlListPanel) {
+      // 如果面板已存在，重新显示并刷新数据
+      console.log("[NavigationManager] Reactivating existing GirlListPanel");
+      this.reactivateGirlListPanel(existingGirlListPanel, themeId);
+    } else {
+      // 如果面板不存在，创建新的
+      console.log("[NavigationManager] Creating new GirlListPanel");
+      ViewManager.I.openBundlesView(
         "GirlListPanel",
-        themeId,
-        transitionConfig,
-        currentPanel,
-        () => {
-          GameRootUI.I.hideDefaultView();
+        {
+          themeId: themeId,
+          parentPanel: "ThemePanel", // 标记父页面
+        },
+        (girlListPanelNode) => {
+          // 获取 ThemePanel 实例并设置子页面关系
+          console.log(
+            "[NavigationManager] GirlListPanel opened, setting up parent-child relationship"
+          );
+          this.setupParentChildRelationship(girlListPanelNode);
         }
       );
-    } else {
-      ViewManager.I.openBundlesView("GirlListPanel", themeId);
+    }
+  }
+
+  /**
+   * 查找已存在的GirlListPanel
+   */
+  private findExistingGirlListPanel(): any {
+    try {
+      const viewList = (ViewManager.I as any).m_viewList;
+      if (viewList) {
+        for (let i = 0; i < viewList.length; i++) {
+          const view = viewList[i];
+          if (view && view.isValid && view.name === "GirlListPanel") {
+            return view;
+          }
+        }
+      }
+      return null;
+    } catch (error) {
+      console.error(
+        "[NavigationManager] Error finding existing GirlListPanel:",
+        error
+      );
+      return null;
+    }
+  }
+
+  /**
+   * 重新激活已存在的GirlListPanel
+   */
+  private reactivateGirlListPanel(panelNode: any, themeId: number): void {
+    try {
+      // 重新激活面板
+      panelNode.active = true;
+
+      // 获取面板组件并刷新数据
+      const girlListComponent = panelNode.getComponent("GirlListPanel");
+      if (girlListComponent) {
+        // 如果有刷新方法，调用它来更新主题数据
+        if (typeof girlListComponent.refreshWithTheme === "function") {
+          girlListComponent.refreshWithTheme(themeId);
+        } else if (typeof girlListComponent.Show === "function") {
+          girlListComponent.Show(themeId);
+        }
+        console.log(
+          "[NavigationManager] GirlListPanel reactivated with theme:",
+          themeId
+        );
+      }
+
+      // 重新建立父子关系
+      this.setupParentChildRelationship(panelNode);
+    } catch (error) {
+      console.error(
+        "[NavigationManager] Error reactivating GirlListPanel:",
+        error
+      );
+    }
+  }
+
+  /**
+   * 建立父子页面关系的私有方法
+   * @private
+   * @param girlListPanelNode GirlListPanel 节点
+   */
+  private setupParentChildRelationship(girlListPanelNode: any): void {
+    try {
+      // 查找 ThemePanel 实例
+      const themePanelNode = this.findThemePanelNode();
+      if (themePanelNode) {
+        const themePanelComponent = themePanelNode.getComponent("ThemePanel");
+        const girlListPanelComponent =
+          girlListPanelNode.getComponent("GirlListPanel");
+
+        if (themePanelComponent && girlListPanelComponent) {
+          console.log(
+            "[NavigationManager] Setting up parent-child relationship"
+          );
+          themePanelComponent.setChildPanel(girlListPanelComponent);
+        } else {
+          console.warn("[NavigationManager] Failed to get panel components");
+        }
+      } else {
+        console.warn("[NavigationManager] ThemePanel not found");
+      }
+    } catch (error) {
+      console.error(
+        "[NavigationManager] Error setting up parent-child relationship:",
+        error
+      );
+    }
+  }
+
+  /**
+   * 查找 ThemePanel 节点的私有方法
+   * @private
+   * @returns ThemePanel 节点或 null
+   */
+  private findThemePanelNode(): any {
+    console.log("[NavigationManager] Finding ThemePanel node...");
+    try {
+      // 通过 ViewManager 的视图列表查找 ThemePanel
+      const viewList = (ViewManager.I as any).m_viewList;
+      if (viewList) {
+        for (let i = 0; i < viewList.length; i++) {
+          const view = viewList[i];
+          if (view && view.isValid && view.name === "ThemePanel") {
+            console.log("[NavigationManager] Found ThemePanel node");
+            return view;
+          }
+        }
+      }
+
+      console.log("[NavigationManager] ThemePanel not found in view list");
+      return null;
+    } catch (error) {
+      console.error("[NavigationManager] Error finding ThemePanel:", error);
+      return null;
+    }
+  }
+
+  /**
+   * 处理导航时 ThemePanel 子页面的隐藏逻辑
+   * @private
+   */
+  private handleThemePanelChildPanelsOnNavigation(): void {
+    console.log(
+      "[NavigationManager] Handling ThemePanel child panels on navigation"
+    );
+
+    const themePanelNode = this.findThemePanelNode();
+    if (themePanelNode) {
+      const themePanelComponent = themePanelNode.getComponent("ThemePanel");
+      if (themePanelComponent && themePanelComponent.closeChildPanel) {
+        console.log("[NavigationManager] Closing ThemePanel child panels");
+        themePanelComponent.closeChildPanel();
+      }
     }
   }
 
@@ -316,7 +834,11 @@ export class NavigationManager {
       console.warn("Invalid role ID for chat navigation:", roleId);
       return;
     }
-    GameRootUI.I.hideDefaultView();
+
+    // 更新选中的角色ID
+    this.setSelectedGirlId(roleId);
+
+    // NavigationPanel 始终显示，不需要隐藏 DefaultView
     console.log(`Navigating to chat with role ID: ${roleId}`);
 
     if (transitionConfig) {
@@ -357,6 +879,12 @@ export class NavigationManager {
       return;
     }
 
+    // 更新选中的角色ID和主题ID
+    this.setSelectedGirlId(roleId);
+    if (categoryId != null) {
+      this.setSelectedThemeId(parseInt(categoryId));
+    }
+
     const navigationData = {
       categoryId: categoryId,
       roleId: roleId,
@@ -418,6 +946,9 @@ export class NavigationManager {
       return;
     }
 
+    // 更新选中的角色ID
+    this.setSelectedGirlId(roleId);
+
     console.log(`Navigating to girl detail with role ID: ${roleId}`);
 
     if (transitionConfig) {

assets/Scripts/chat18x/ui/panels/ChatPanel.ts

@@ -30,7 +30,7 @@ import { PayToTalkSubpanel } from "./PayToTalkSubpanel";
 import { DataId, DataManager } from "../../data/DataManager";
 import { GirlData } from "../../data/GirlData";
 import { SceneBgVideoLayer } from "../../../Sub/UI/SceneBgVideoLayer";
-import { NavigationManager } from "../../manager/NavigationManager";
+import { NavigationManager, PanelType } from "../../manager/NavigationManager";
 const { ccclass, property } = _decorator;
 
 @ccclass("ChatPanel")
@@ -79,22 +79,79 @@ export class ChatPanel extends li_BaseView implements IChatPanelCallback {
     this.girlName.string = LanguageUtils.getText(this.nameKey);
   };
 
-  openUIDataCT(data) {
-    const newRoleId =
-      typeof data === "object" && data.roleId !== undefined
-        ? data.roleId
-        : data;
+  targetSize;
+  videoAreaPos;
+  onLoadCT() {
+    Utils.parseNode(this.node, this._nodeTab);
+
+    // 获取 videoArea 的尺寸和位置
+    this.targetSize = this.videoArea.contentSize;
+    this.videoAreaPos = new Vec3(540, 1170, 0);
+
+    this.register();
+    //this.refresh();
+    this.payToTalkPanel.node.active = false;
+
+    // 检查 SceneBgVideoLayer 是否可用
+    if (!this.videoLayer) {
+      console.error("ChatPanel: SceneBgVideoLayer.handle 未初始化");
+    } else {
+      console.log("ChatPanel: 成功获取 SceneBgVideoLayer 实例");
+    }
+  }
+
+  register() {
+    Utils.addInnerEL(
+      InnerMsgCode.LanguageChange,
+      this,
+      this.onLanguageChangeCallback
+    );
+
+    Utils.addInnerEL(
+      InnerMsgCode.Chat_EmotionInitialized,
+      this,
+      this.onEmotionInitialized
+    );
+
+    Utils.addInnerEL(
+      InnerMsgCode.ChatTotalCountChange,
+      this,
+      this.onChatCountChange
+    );
+  }
+
+  onDestroy(): void {
+    Utils.removeInnerEL(
+      InnerMsgCode.LanguageChange,
+      this,
+      this.onLanguageChangeCallback
+    );
+    Utils.removeInnerEL(
+      InnerMsgCode.ChatTotalCountChange,
+      this,
+      this.onChatCountChange
+    );
+    Utils.removeInnerEL(
+      InnerMsgCode.Chat_EmotionInitialized,
+      this,
+      this.onEmotionInitialized
+    );
+
+    // 解绑ChatController（不销毁，因为它是单例）
+    if (this.chatController) {
+      this.chatController.unbindView();
+      this.chatController = null;
+    }
+  }
+  refresh() {
+    const newRoleId = NavigationManager.Instance.getSelectedGirlId();
 
     // 检查是否是切换角色
     const isRoleSwitch = this.id && this.id !== newRoleId;
 
     this.id = newRoleId;
-    this.categoryId = data.categoryId;
-    // 如果标记了需要滑入动画，则执行动画
-    // 延迟一帧执行动画，确保节点已正确加载到场景中
-    this.scheduleOnce(() => {
-      UITransitionHelper.slideInFromRight(this.node, 0.3);
-    }, 0);
+    this.categoryId =
+      NavigationManager.Instance.getSelectedThemeId().toString();
 
     // 获取ChatController单例并绑定当前Panel
     this.chatController = ChatController.Instance;
@@ -119,83 +176,7 @@ export class ChatPanel extends li_BaseView implements IChatPanelCallback {
         this.chatController.initialize(this.categoryId, this.id);
       }
     }
-  }
-  targetSize;
-  videoAreaPos;
-  onLoadCT() {
-    Utils.parseNode(this.node, this._nodeTab);
 
-    // 获取 videoArea 的尺寸和位置
-    this.targetSize = this.videoArea.contentSize;
-    this.videoAreaPos = new Vec3(540, 1170, 0);
-
-    this.register();
-    this.refresh();
-    this.payToTalkPanel.node.active = false;
-
-    // 检查 SceneBgVideoLayer 是否可用
-    if (!this.videoLayer) {
-      console.error("ChatPanel: SceneBgVideoLayer.handle 未初始化");
-    } else {
-      console.log("ChatPanel: 成功获取 SceneBgVideoLayer 实例");
-    }
-  }
-
-  register() {
-    Utils.addInnerEL(
-      InnerMsgCode.Chat_DialogRefresh,
-      this,
-      this.onDialogUpdate
-    );
-
-    Utils.addInnerEL(
-      InnerMsgCode.LanguageChange,
-      this,
-      this.onLanguageChangeCallback
-    );
-
-    Utils.addInnerEL(
-      InnerMsgCode.Chat_EmotionInitialized,
-      this,
-      this.onEmotionInitialized
-    );
-
-    Utils.addInnerEL(
-      InnerMsgCode.ChatTotalCountChange,
-      this,
-      this.onChatCountChange
-    );
-  }
-
-  onDestroy(): void {
-    Utils.removeInnerEL(
-      InnerMsgCode.Chat_DialogRefresh,
-      this,
-      this.onDialogUpdate
-    );
-    Utils.removeInnerEL(
-      InnerMsgCode.LanguageChange,
-      this,
-      this.onLanguageChangeCallback
-    );
-    Utils.removeInnerEL(
-      InnerMsgCode.ChatTotalCountChange,
-      this,
-      this.onChatCountChange
-    );
-    Utils.removeInnerEL(
-      InnerMsgCode.Chat_EmotionInitialized,
-      this,
-      this.onEmotionInitialized
-    );
-
-    // 解绑ChatController（不销毁，因为它是单例）
-    if (this.chatController) {
-      this.chatController.unbindView();
-      this.chatController = null;
-    }
-  }
-  refresh() {
     const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
 
     this.nameKey = girlData.getGrilName(this.categoryId, this.id);
@@ -372,6 +353,8 @@ export class ChatPanel extends li_BaseView implements IChatPanelCallback {
   }
   protected onEnable(): void {
     if (!this.manager) this.manager = DialogManager.getInstance();
+
+    this.refresh();
   }
 
   public async OnClickSend() {
@@ -465,11 +448,7 @@ export class ChatPanel extends li_BaseView implements IChatPanelCallback {
 
   returnBtn() {
     // Navigate back to GirlDetailPanel with current girlId using smooth transition
-    NavigationManager.Instance.navigateToGirlDetail(
-      this.id,
-      NavigationManager.getTransitionPresets().SLIDE_RIGHT_TO_LEFT,
-      this
-    );
+    NavigationManager.Instance.switchToPanel(PanelType.GIRL_DETAIL);
   }
   onClickRecord() {
     ViewManager.I.openBundlesView("RecordPanel", this.id);

assets/Scripts/chat18x/ui/panels/GirlDetailPanel.ts

@@ -13,7 +13,7 @@ import {
 import li_BaseView from "db://assets/Scripts/Main/Common/li_BaseView";
 import ResManager from "db://assets/Scripts/Main/Manager/ResManager";
 import { DetailImageItem } from "../../uiitems/DetailImageItem";
-import { NavigationManager } from "../../manager/NavigationManager";
+import { NavigationManager, PanelType } from "../../manager/NavigationManager";
 import { ConfigManager } from "../../manager/ConfigManager";
 import LanguageUtils from "../../../Main/Common/LanguageUtils";
 import Utils from "../../../Main/Common/Utils";
@@ -71,36 +71,16 @@ export class GirlDetailPanel extends li_BaseView {
   @property(Node)
   imgsLayout: Node;
 
-  openUIDataCT(data) {
-    this.id = data;
-  }
   videoAreaPos;
+
+  protected onEnable(): void {
+    this.refresh();
+  }
+
   onLoadCT() {
     super.onLoadCT();
-    this.imgItemInst.node.active = false;
-    this.videoAreaPos = new Vec3(540, 1384);
 
-    const pos = new Vec3(
-      this.descContent.position.x,
-      this.descContent.position.y,
-      this.descContent.position.z
-    );
-    this.descContent.position = new Vec3(pos.x, pos.y - 1000, pos.z);
-    //this.node.scale = Vec3.ZERO;
-    tween(this.descContent)
-      .to(0.3, { position: pos }, { easing: "quadOut" })
-      .start();
-
-    // 检查 SceneBgVideoLayer 是否可用
-    if (!this.videoLayer) {
-      console.error("GirlDetailPanel: SceneBgVideoLayer.handle 未初始化");
-    } else {
-      console.log("GirlDetailPanel: 成功获取 SceneBgVideoLayer 实例");
-      // 初始化视频显示位置
-      //this.initVideoPosition();
-    }
-
-    this.refresh(this.id);
+    //this.refresh();
 
     Utils.addInnerEL(InnerMsgCode.LanguageChange, this, () => {
       this.girlName.string = LanguageUtils.getText(this.nameKey);
@@ -153,7 +133,32 @@ export class GirlDetailPanel extends li_BaseView {
   tagKey: string;
   descKey: string;
   category: number;
-  async refresh(index: number) {
+  async refresh() {
+    this.id = NavigationManager.Instance.getSelectedGirlId();
+
+    this.imgItemInst.node.active = false;
+    this.videoAreaPos = new Vec3(540, 1384);
+
+    const pos = new Vec3(
+      this.descContent.position.x,
+      this.descContent.position.y,
+      this.descContent.position.z
+    );
+    this.descContent.position = new Vec3(pos.x, pos.y - 1000, pos.z);
+    //this.node.scale = Vec3.ZERO;
+    tween(this.descContent)
+      .to(0.3, { position: pos }, { easing: "quadOut" })
+      .start();
+
+    // 检查 SceneBgVideoLayer 是否可用
+    if (!this.videoLayer) {
+      console.error("GirlDetailPanel: SceneBgVideoLayer.handle 未初始化");
+    } else {
+      console.log("GirlDetailPanel: 成功获取 SceneBgVideoLayer 实例");
+      // 初始化视频显示位置
+      //this.initVideoPosition();
+    }
+
     const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
     this.category = girlData.getGrilCategoryById(this.id);
     // 请求详细数据
@@ -305,18 +310,11 @@ export class GirlDetailPanel extends li_BaseView {
 
   OnClickChatBtn() {
     // 使用带过渡动画的导航方法
-    NavigationManager.Instance.navigateToChatWithTransition(
-      this.category.toString(),
-      this.id,
-      this
-    );
-    // 注意：不在这里直接调用onClose，而是在动画完成后由NavigationManager调用
+    NavigationManager.Instance.switchToPanel(PanelType.CHAT);
   }
 
   returnBtn() {
-    this.onClose();
-    NavigationManager.Instance.navigateToGirlList(this.category);
-    //ViewManager.I.openBundlesView("GirlListPanel");
+    NavigationManager.Instance.switchToPanel(PanelType.THEME);
   }
 
   /**

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

@@ -10,6 +10,7 @@ import { GirlData } from "../../data/GirlData";
 import proto from "db://assets/Scripts/proto/proto.pb.js";
 import GameRootUI from "../../../Main/Common/GameRootUI";
 import { UITransitionHelper } from "../../utils/UITransitionHelper";
+import { NavigationManager, PanelType } from "../../manager/NavigationManager";
 
 const { ccclass, property } = _decorator;
 
@@ -23,14 +24,19 @@ export class GirlListPanel extends li_BaseView {
   cache: GirlListItem[] = [];
 
   category: number;
-  openUIDataCT(data) {
-    // 支持新的数据格式：既可以是单纯的数字，也可以是包含过渡动画信息的对象
-    this.category =
-      typeof data === "object" && data.category !== undefined
-        ? data.category
-        : data;
+  private parentPanelName: string = null;
 
-    const withAnimation = typeof data === "object" && data.withTransition;
+  openUIDataCT(data) {
+    console.log("[GirlListPanel] openUIDataCT called with data:", data);
+
+    // 支持新的数据格式：既可以是单纯的数字，也可以是包含主题ID和父页面信息的对象
+    if (typeof data === "object") {
+      this.category = data.themeId;
+      this.parentPanelName = data.parentPanel;
+      console.log("[GirlListPanel] Set parent panel:", this.parentPanelName);
+    } else {
+      this.category = data;
+    }
   }
   onLoadCT() {
     Utils.parseNode(this.node, this._nodeTab);
@@ -76,37 +82,7 @@ export class GirlListPanel extends li_BaseView {
     GButton.BandClick(this._nodeTab.ReturnBtn, this.Return, this);
   }
   Return() {
-    console.log("GirlListPanel: Return button clicked");
-
-    // 执行同步的过渡动画：GirlListPanel向右滑出，ThemePanel从左滑入
-    const duration = 0.1;
-    let animationsCompleted = 0;
-    const totalAnimations = 2;
-
-    const onAnimationComplete = (source: string) => {
-      console.log(`GirlListPanel: Animation completed from ${source}`);
-      animationsCompleted++;
-      console.log(
-        `GirlListPanel: ${animationsCompleted}/${totalAnimations} animations completed`
-      );
-
-      if (animationsCompleted >= totalAnimations) {
-        console.log("GirlListPanel: All animations completed, closing panel");
-        // 所有动画完成后关闭当前面板
-        this.onClose();
-      }
-    };
-
-    // 1. GirlListPanel向右滑出
-    console.log("GirlListPanel: Starting slideOutToRight animation");
-    UITransitionHelper.slideOutToRight(this.node, duration, () =>
-      onAnimationComplete("slideOutToRight")
-    );
-
-    // 2. ThemePanel从左侧滑入
-    console.log("GirlListPanel: Starting ThemePanel slide_left animation");
-    GameRootUI.I.showDefaultViewWithTransition("slide_left", duration, () =>
-      onAnimationComplete("ThemePanel_slide_left")
-    );
+    // 直接关闭，不需要动画
+    this.node.active = false;
   }
 }

assets/Scripts/chat18x/ui/panels/NavigationPanel.ts

@@ -0,0 +1,130 @@
+import { _decorator, Component, Label, Node } 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 { ViewManager } from "db://assets/Scripts/Main/Manager/ViewManager";
+import {
+  NavigationManager,
+  PageTransitionType,
+  PanelType,
+} from "../../manager/NavigationManager";
+import { InnerMsgCode } from "../../../Main/Config/InnerMsgCode";
+import GameRootUI from "../../../Main/Common/GameRootUI";
+import { UITransitionHelper } from "../../utils/UITransitionHelper";
+import { ThemePanel } from "./ThemePanel";
+
+const { ccclass, property } = _decorator;
+
+@ccclass("NavigationPanel")
+export class NavigationPanel extends li_BaseView {
+  private _nodeTab: any = {};
+  private currentActivePanel: PanelType = PanelType.THEME;
+
+  private themeBtn: Node;
+  private girlDetailBtn: Node;
+  private chatBtn: Node;
+  private settingBtn: Node;
+
+  private loadingView: Node;
+
+  onLoadCT() {
+    Utils.parseNode(this.node, this._nodeTab);
+
+    this.themeBtn = this._nodeTab.themeBtn;
+    this.girlDetailBtn = this._nodeTab.girlDetailBtn;
+    this.chatBtn = this._nodeTab.chatBtn;
+    this.settingBtn = this._nodeTab.settingBtn;
+    this.loadingView = this._nodeTab.loadingView;
+
+    this.hideLoading();
+
+    // 注册到NavigationManager
+    NavigationManager.Instance.registerNavigationPanel(this);
+
+    this.registerListener();
+    this.updateButtonStates(PanelType.THEME);
+
+    // 初次打开时通过NavigationManager切换到主题面板
+    this.initializeFirstPanel();
+  }
+
+  private registerListener() {
+    // 所有按钮点击都通过NavigationManager处理
+    GButton.BandClick(
+      this.themeBtn,
+      () => NavigationManager.Instance.switchToPanel(PanelType.THEME),
+      this
+    );
+    GButton.BandClick(
+      this.girlDetailBtn,
+      () => NavigationManager.Instance.switchToPanel(PanelType.GIRL_DETAIL),
+      this
+    );
+    GButton.BandClick(
+      this.chatBtn,
+      () => NavigationManager.Instance.switchToPanel(PanelType.CHAT),
+      this
+    );
+    GButton.BandClick(
+      this.settingBtn,
+      () => NavigationManager.Instance.switchToPanel(PanelType.SETTING),
+      this
+    );
+  }
+
+  /**
+   * 更新按钮状态（公开方法，供NavigationManager调用）
+   * @param activePanel 当前激活的面板类型
+   */
+  public updateButtonStates(activePanel: PanelType) {
+    this.currentActivePanel = activePanel;
+    this._nodeTab.CurrentPanel.getComponent(Label).string =
+      this.currentActivePanel;
+    this.refreshButtonVisuals();
+  }
+
+  /**
+   * 刷新按钮的视觉状态
+   */
+  private refreshButtonVisuals() {
+    // TODO: 实现按钮状态更新的视觉效果
+    // 根据 currentActivePanel 更新按钮的选中状态
+    console.log(
+      "[NavigationPanel] Button states updated for:",
+      this.currentActivePanel
+    );
+  }
+
+  private initializeFirstPanel() {
+    // 初次打开时通过NavigationManager切换到主题面板
+    NavigationManager.Instance.switchToPanel(PanelType.THEME, true);
+  }
+
+  public showPanel() {
+    this.node.active = true;
+  }
+
+  public hidePanel() {
+    this.node.active = false;
+  }
+
+  /**
+   * 显示加载状态（公开方法，供NavigationManager调用）
+   */
+  public showLoading() {
+    if (this.loadingView) {
+      this.loadingView.active = true;
+    }
+  }
+
+  /**
+   * 隐藏加载状态（公开方法，供NavigationManager调用）
+   */
+  public hideLoading() {
+    if (this.loadingView) {
+      this.loadingView.active = false;
+    }
+  }
+
+  onDestroy(): void {}
+}

assets/Scripts/chat18x/ui/panels/NavigationPanel.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.24",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "58d92549-54a9-4f98-94af-5c0c3ac2f853",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}

assets/Scripts/chat18x/ui/panels/PurchasePanel.ts

@@ -78,7 +78,7 @@ export class PurchasePanel extends li_BaseView {
       this._nodeTab.ReturnBtn,
       () => {
         this.onClose();
-        GameRootUI.I.showDefaultView();
+        // NavigationPanel 始终显示，不需要显示 DefaultView
       },
       this
     );

assets/Scripts/chat18x/ui/panels/RecordPanel.ts

@@ -286,7 +286,7 @@ export class RecordPanel extends li_BaseView {
   }
 
   protected onEnable(): void {
-    GameRootUI.I.hideDefaultView();
+    // NavigationPanel 始终显示，不需要隐藏 DefaultView
   }
 
   /**

assets/Scripts/chat18x/ui/panels/ThemePanel.ts

@@ -12,7 +12,11 @@ import Utils from "db://assets/Scripts/Main/Common/Utils";
 import { GButton } from "db://assets/Scripts/Main/Common/GButton";
 import ResManager from "db://assets/Scripts/Main/Manager/ResManager";
 import { ThemeItem } from "../../uiitems/ThemeItem";
-import { NavigationManager, PageTransitionType } from "../../manager/NavigationManager";
+import {
+  NavigationManager,
+  PageTransitionType,
+  PanelType,
+} from "../../manager/NavigationManager";
 import { GirlListItem } from "../../uiitems/GirlListItem";
 import LanguageUtils from "../../../Main/Common/LanguageUtils";
 import { ViewManager } from "../../../Main/Manager/ViewManager";
@@ -29,6 +33,7 @@ import { AccountData } from "../../data/AccountData";
 import { ShopData } from "../../data/ShopData";
 import proto from "db://assets/Scripts/proto/proto.pb.js";
 import GameRootUI from "../../../Main/Common/GameRootUI";
+import { MainController } from "../../core/MainController";
 
 const { ccclass, property } = _decorator;
 
@@ -38,7 +43,7 @@ export class ThemePanel extends li_BaseView {
 
   coinNum: Label;
   uid: Label;
-  itemInst: GirlListItem;
+  itemInst: ThemeItem;
   content: Node;
   private vipLeftTime: Label;
   recId: number;
@@ -47,6 +52,14 @@ export class ThemePanel extends li_BaseView {
 
   cache: ThemeItem[] = [];
 
+  // 子页面管理
+  private currentChildPanel: any = null;
+
+  // 加载状态保护
+  private isLoading: boolean = false;
+  private loadingPromise: Promise<void> | null = null;
+  private abortController: AbortController | null = null;
+
   onLoadCT() {
     Utils.parseNode(this.node, this._nodeTab);
 
@@ -65,67 +78,206 @@ export class ThemePanel extends li_BaseView {
   }
 
   rectNameKey: string;
-  async Show() {
-    this._nodeTab.loadingRec.active = true;
-    //some temp data
-    this.refreshCoinNum();
-    this.refreshVipExpire();
-    const accountData = DataManager.I.getDataById<AccountData>(DataId.Account);
-    this.uid.string = "uid: " + accountData.accId;
-    this.recId = 1;
-    if (this.cache) {
-      for (let i = this.cache.length - 1; i >= 0; i--) {
-        this.cache[i].node.destroy();
+  async Show(forceRefresh: boolean = false) {
+    // 防止重复加载
+    if (this.isLoading) {
+      console.log("[ThemePanel] 已在加载中，等待当前加载完成");
+      if (this.loadingPromise) {
+        await this.loadingPromise;
+      }
+      return;
+    }
+
+    this.isLoading = true;
+    this.loadingPromise = this._showInternal(forceRefresh);
+
+    try {
+      await this.loadingPromise;
+    } finally {
+      this.isLoading = false;
+      this.loadingPromise = null;
+    }
+  }
+
+  private async _showInternal(forceRefresh: boolean = false) {
+    // 创建新的AbortController用于取消操作
+    this.abortController = new AbortController();
+    const signal = this.abortController.signal;
+
+    try {
+      this._nodeTab.loadingRec.active = true;
+      //some temp data
+      this.refreshCoinNum();
+      this.refreshVipExpire();
+      const accountData = DataManager.I.getDataById<AccountData>(
+        DataId.Account
+      );
+      this.uid.string = "uid: " + accountData.accId;
+      this.recId = 1;
+
+      // 检查是否已被取消
+      if (signal.aborted) {
+        throw new Error("Operation was aborted");
+      }
+
+      // 清理旧的cache节点（每次都清理，解决内存泄漏问题）
+      this.clearCache();
+
+      // 如果需要强制刷新，先刷新数据
+      if (forceRefresh) {
+        console.log("[ThemePanel] 开始强制刷新数据");
+        await Promise.all([
+          MainController.I.refreshThemeData(),
+          MainController.I.refreshDailyRecommend(),
+        ]);
+        console.log("[ThemePanel] 数据刷新完成");
+
+        // 再次检查是否已被取消
+        if (signal.aborted) {
+          throw new Error("Operation was aborted");
+        }
+      }
+
+      // 优先使用MainController中预加载的数据
+      const preloadStatus = MainController.I.getPreloadStatus();
+      console.log("[ThemePanel] 预加载状态:", preloadStatus);
+
+      // 处理主题数据
+      await this.handleThemeData(preloadStatus.themeData);
+
+      // 检查是否已被取消
+      if (signal.aborted) {
+        throw new Error("Operation was aborted");
+      }
+
+      // 处理每日推荐数据
+      await this.handleDailyRecommendData(preloadStatus.dailyRecommend);
+
+      // 检查是否已被取消
+      if (signal.aborted) {
+        throw new Error("Operation was aborted");
+      }
+
+      this._nodeTab.loadingRec.active = false;
+
+      // 处理商品列表数据
+      await this.handleShopListData(preloadStatus.shopList);
+    } catch (error) {
+      console.error("[ThemePanel] Show操作出错:", error);
+      this._nodeTab.loadingRec.active = false;
+
+      // 如果不是取消操作导致的错误，可以考虑显示错误提示
+      if (error.message !== "Operation was aborted") {
+        // 这里可以添加错误提示逻辑
+        console.error("[ThemePanel] 数据加载失败，请稍后重试");
+      }
+    } finally {
+      this.abortController = null;
+    }
+  }
+
+  /**
+   * 处理主题数据
+   */
+  private async handleThemeData(isPreloaded: boolean): Promise<void> {
+    if (isPreloaded) {
+      console.log("[ThemePanel] 使用预加载的主题数据");
+      // 直接使用预加载的数据渲染界面
+      const themeData = DataManager.I.getDataById<ThemeData>(DataId.Theme);
+      if (themeData && themeData.themes) {
+        this.renderThemeData(themeData);
+        return;
       }
     }
-    // 请求主题数据
+
+    // 如果没有预加载数据，则请求数据
+    console.log("[ThemePanel] 请求主题数据");
     const reqData = {};
     let res = await ThemeService.I.reqHallTheme(reqData);
     if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
       // 保存数据
       const themeData = DataManager.I.getDataById<ThemeData>(DataId.Theme);
       themeData.themes = res.data;
-      // 根据数据，刷新界面
-      const themeIds = themeData.themeIds;
-      for (let id of themeIds) {
-        let newNode = instantiate(this.itemInst.node);
-        let item = newNode.getComponent(ThemeItem);
-        item.refresh(id, this);
-        newNode.active = true;
-        this.cache.push(item);
-        this.content.addChild(newNode);
+      this.renderThemeData(themeData);
+    }
+  }
+
+  /**
+   * 渲染主题数据
+   */
+  private renderThemeData(themeData: ThemeData): void {
+    const themeIds = themeData.themeIds;
+    for (let id of themeIds) {
+      let newNode = instantiate(this.itemInst.node);
+      let item = newNode.getComponent(ThemeItem);
+      item.refresh(id, this);
+      newNode.active = true;
+      this.cache.push(item);
+      this.content.addChild(newNode);
+    }
+  }
+
+  /**
+   * 处理每日推荐数据
+   */
+  private async handleDailyRecommendData(isPreloaded: boolean): Promise<void> {
+    if (isPreloaded) {
+      console.log("[ThemePanel] 使用预加载的每日推荐数据");
+      // 直接使用预加载的数据渲染界面
+      const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
+      if (girlData) {
+        this.renderDailyRecommendData(girlData);
+        return;
       }
     }
 
-    // 请求每日推荐
-    const reqData2 = {};
-    let res2 = await GirlService.I.reqDailyRecommend(reqData2);
-    if (res2 && res2.code === proto.cs.EnmRetCode.SUCCESS) {
+    // 如果没有预加载数据，则请求数据
+    console.log("[ThemePanel] 请求每日推荐数据");
+    const reqData = {};
+    let res = await GirlService.I.reqDailyRecommend(reqData);
+    if (res && res.code === proto.cs.EnmRetCode.SUCCESS) {
       const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
-      girlData.setDailyRecommend(res2.data);
-      // 根据数据，刷新界面
-      this.recId = girlData.getRecommendGirlId();
-      this.rectNameKey = girlData.getRecommendGrilName();
-      let avatarPath = girlData.getRecommendGrilAvatar();
-      this.recName.string = LanguageUtils.getText(this.rectNameKey);
-      ResManager.I.changeBundleSpriteFrame(
-        this.recSprite,
-        avatarPath,
-        "Girls",
-        () => {
-          let sizeTran = this.recSprite.node.parent.getComponent(UITransform);
-          Utils.adjustBgPixelRatioToSize(
-            sizeTran.contentSize,
-            this.recSprite.node,
-            1
-          );
-        }
-      );
+      girlData.setDailyRecommend(res.data);
+      this.renderDailyRecommendData(girlData);
     }
-    this._nodeTab.loadingRec.active = false;
+  }
 
-    // 获取商品列表，提前把数据拿下来
-    this.reqShopList();
+  /**
+   * 渲染每日推荐数据
+   */
+  private renderDailyRecommendData(girlData: GirlData): void {
+    this.recId = girlData.getRecommendGirlId();
+    this.rectNameKey = girlData.getRecommendGrilName();
+    let avatarPath = girlData.getRecommendGrilAvatar();
+    this.recName.string = LanguageUtils.getText(this.rectNameKey);
+    ResManager.I.changeBundleSpriteFrame(
+      this.recSprite,
+      avatarPath,
+      "Girls",
+      () => {
+        let sizeTran = this.recSprite.node.parent.getComponent(UITransform);
+        Utils.adjustBgPixelRatioToSize(
+          sizeTran.contentSize,
+          this.recSprite.node,
+          1
+        );
+      }
+    );
+  }
+
+  /**
+   * 处理商品列表数据
+   */
+  private async handleShopListData(isPreloaded: boolean): Promise<void> {
+    if (isPreloaded) {
+      console.log("[ThemePanel] 商品列表数据已预加载");
+      // 数据已经在DataManager中，不需要额外处理
+      return;
+    }
+
+    // 如果没有预加载数据，则请求数据
+    console.log("[ThemePanel] 请求商品列表数据");
+    await this.reqShopList();
   }
 
   private registerListener() {
@@ -136,15 +288,13 @@ export class ThemePanel extends li_BaseView {
 
     GButton.BandClick(this._nodeTab.ShopPanelEntry, this.enterShop, this);
 
-    Utils.addInnerEL(InnerMsgCode.LanguageChange, this, () => {
-      this.recName.string = LanguageUtils.getText(this.rectNameKey);
-    });
-    Utils.addInnerEL(InnerMsgCode.BalanceChange, this, () => {
-      this.refreshCoinNum();
-    });
-    Utils.addInnerEL(InnerMsgCode.VipExpireChange, this, () => {
-      this.refreshVipExpire();
-    });
+    Utils.addInnerEL(InnerMsgCode.LanguageChange, this, this.onLanguageChange);
+    Utils.addInnerEL(InnerMsgCode.BalanceChange, this, this.onBalanceChange);
+    Utils.addInnerEL(
+      InnerMsgCode.VipExpireChange,
+      this,
+      this.onVipExpireChange
+    );
   }
 
   enterShop() {
@@ -165,9 +315,11 @@ export class ThemePanel extends li_BaseView {
         this.recId
       ) == 0;
     if (isRelease || isFree) {
-      const transitionConfig = NavigationManager.getTransitionPresets().SLIDE_LEFT_TO_RIGHT;
-      NavigationManager.Instance.navigateToGirlDetail(this.recId, transitionConfig, this);
-      GameRootUI.I.hideDefaultView();
+      NavigationManager.Instance.setSelectedGirlId(this.recId);
+      NavigationManager.Instance.setSelectedThemeId(
+        girlData.getGrilCategoryById(this.recId)
+      );
+      NavigationManager.Instance.switchToPanel(PanelType.GIRL_DETAIL);
     } else {
       //未解锁
       ViewManager.I.openBundlesPopupView("GirlListPopupPanel", {
@@ -179,7 +331,8 @@ export class ThemePanel extends li_BaseView {
   }
 
   openSetting() {
-    ViewManager.I.openBundlesView("SettingPanel");
+    // 通过NavigationManager切换到设置面板，保持动画和状态同步
+    NavigationManager.Instance.switchToPanel(PanelType.SETTING);
   }
 
   openMsgBox() {
@@ -216,11 +369,107 @@ export class ThemePanel extends li_BaseView {
     }
   }
 
-  onDestroy(): void {
-    Utils.removeInnerEL(InnerMsgCode.LanguageChange, this, () => {
-      this.recName.string = LanguageUtils.getText(this.rectNameKey);
-    });
-    Utils.removeInnerEL(InnerMsgCode.BalanceChange, this, () => {});
-    Utils.removeInnerEL(InnerMsgCode.VipExpireChange, this, () => {});
+  /**
+   * 清理缓存节点
+   */
+  private clearCache(): void {
+    if (this.cache && this.cache.length > 0) {
+      console.log(`[ThemePanel] 清理 ${this.cache.length} 个缓存节点`);
+      for (let i = this.cache.length - 1; i >= 0; i--) {
+        if (this.cache[i] && this.cache[i].node && this.cache[i].node.isValid) {
+          this.cache[i].node.destroy();
+        }
+      }
+      this.cache = [];
+    }
   }
+
+  /**
+   * 设置子页面
+   * @param panel 子页面实例
+   */
+  public setChildPanel(panel: any): void {
+    console.log("[ThemePanel] Setting child panel:", panel);
+    // 先关闭旧的子页面
+    this.closeChildPanel();
+    this.currentChildPanel = panel;
+  }
+
+  /**
+   * 关闭子页面
+   */
+  public closeChildPanel(): void {
+    if (this.currentChildPanel) {
+      console.log("[ThemePanel] Closing child panel");
+      if (this.currentChildPanel.onClose) {
+        this.currentChildPanel.onClose();
+      } else if (this.currentChildPanel.destroy) {
+        this.currentChildPanel.destroy();
+      }
+      this.currentChildPanel = null;
+    }
+  }
+
+  /**
+   * 页面被隐藏时调用
+   */
+  public onHide(): void {
+    console.log("[ThemePanel] onHide called");
+    this.closeChildPanel();
+    this.cancelCurrentOperation();
+  }
+
+  /**
+   * 取消当前操作
+   */
+  private cancelCurrentOperation(): void {
+    if (this.abortController) {
+      console.log("[ThemePanel] 取消当前操作");
+      this.abortController.abort();
+      this.abortController = null;
+    }
+  }
+
+  onDestroy(): void {
+    console.log("[ThemePanel] onDestroy called");
+
+    // 取消当前操作
+    this.cancelCurrentOperation();
+
+    // 关闭子页面
+    this.closeChildPanel();
+
+    // 清理缓存
+    this.clearCache();
+
+    // 重置加载状态
+    this.isLoading = false;
+    this.loadingPromise = null;
+
+    // 移除事件监听器（修复回调函数引用问题）
+    Utils.removeInnerEL(
+      InnerMsgCode.LanguageChange,
+      this,
+      this.onLanguageChange
+    );
+    Utils.removeInnerEL(InnerMsgCode.BalanceChange, this, this.onBalanceChange);
+    Utils.removeInnerEL(
+      InnerMsgCode.VipExpireChange,
+      this,
+      this.onVipExpireChange
+    );
+  }
+
+  // 事件回调函数（避免匿名函数导致的内存泄漏）
+  private onLanguageChange = () => {
+    this.recName.string = LanguageUtils.getText(this.rectNameKey);
+  };
+
+  private onBalanceChange = () => {
+    this.refreshCoinNum();
+  };
+
+  private onVipExpireChange = () => {
+    this.refreshVipExpire();
+  };
 }

assets/Scripts/chat18x/uiitems/DetailImageItem.ts

@@ -48,11 +48,9 @@ export class DetailImageItem extends Component {
   resId: number;
   type: proto.cs.EnmResType;
 
-  test_resID: Node;
   onLoad() {
     GButton.BandClick(this.node, this.onClickThis, this);
     this.uitransform = this.node.getComponent(UITransform);
-    this.test_resID.active = false;
   }
   isVisible: boolean;
   onClickThis() {
@@ -146,10 +144,6 @@ export class DetailImageItem extends Component {
     //this.question.active = true; // 显示问号，表示加载中
 
     this.loading.active = true;
-    this.test_resID = this.node.getChildByName("resID");
-
-    this.test_resID.getComponent(Label).string =
-      this.girlId.toString() + this.resId;
 
     const girlData = DataManager.I.getDataById<GirlData>(DataId.Girl);
     let imgPath = "";

assets/Scripts/chat18x/uiitems/GirlListItem.ts

@@ -12,7 +12,7 @@ import { Config18x } from "db://assets/Scripts/Main/Config/Config18x";
 import { ViewManager } from "db://assets/Scripts/Main/Manager/ViewManager";
 import ResManager from "db://assets/Scripts/Main/Manager/ResManager";
 import Utils from "db://assets/Scripts/Main/Common/Utils";
-import { NavigationManager } from "../manager/NavigationManager";
+import { NavigationManager, PanelType } from "../manager/NavigationManager";
 import { PriceType } from "../../schema/schema";
 import LanguageUtils from "../../Main/Common/LanguageUtils";
 import { InnerMsgCode } from "../../Main/Config/InnerMsgCode";
@@ -134,10 +134,7 @@ export class GirlListItem extends Component {
     // this.price.node.active = priceType == PriceType.pay;
     // this.freeNode.active = priceType == PriceType.free;
     //this.tryNode.active = priceType == PriceType.first_time_free;
-    let avatarPath = girlData.getGrilAvatar(
-      this.category.toString(),
-      this.id
-    );
+    let avatarPath = girlData.getGrilAvatar(this.category.toString(), this.id);
     this.loading.active = true;
 
     //listAvatarPath = listAvatarPath.replace("Avatar", "avatar"); //临时
@@ -182,8 +179,11 @@ export class GirlListItem extends Component {
     // 是否已经解锁
     const isRelease = girlData.getIsRelease(this.category.toString(), this.id);
     if (isRelease) {
-      NavigationManager.Instance.navigateToGirlDetail(this.id);
-      ViewManager.I.closeView(this.baseNode);
+      // 先设置选中的角色ID
+      NavigationManager.Instance.setSelectedGirlId(this.id);
+
+      // 通过switchToPanel切换到角色详情面板，保持动画和状态同步
+      NavigationManager.Instance.switchToPanel(PanelType.GIRL_DETAIL);
     } else {
       //未解锁
       ViewManager.I.openBundlesPopupView("GirlListPopupPanel", {

assets/Scripts/chat18x/uiitems/ThemeItem.ts

@@ -74,8 +74,8 @@ export class ThemeItem extends Component {
       return;
     }
 
-    // 使用预设的过渡动画配置
-    const transitionConfig = NavigationManager.getTransitionPresets().SLIDE_LEFT_TO_RIGHT;
-    NavigationManager.Instance.navigateToGirlList(this.category, transitionConfig, this.parentPanel);
+    console.log("[ThemeItem] Opening GirlListPanel for category:", this.category);
+    // 不使用过渡动画，直接打开
+    NavigationManager.Instance.navigateToGirlList(this.category);
   }
 }

assets/Scripts/chat18x/utils/UITransitionHelper.ts

@@ -13,7 +13,7 @@ const { ccclass, property } = _decorator;
 @ccclass("UITransitionHelper")
 export class UITransitionHelper {
   /**
-   * 让节点从右侧滑入到原位置
+   * 让节点从右侧滑入到屏幕中心
    *
    * @param {Node} node - 要执行动画的节点
    * @param {number} duration - 动画持续时间（秒），默认0.3秒
@@ -21,7 +21,7 @@ export class UITransitionHelper {
    */
   public static slideInFromRight(
     node: Node,
-    duration: number = 0.1,
+    duration: number = 0.3,
     callback?: Function
   ): void {
     if (!node || !node.isValid) {
@@ -30,18 +30,18 @@ export class UITransitionHelper {
     }
 
     const screenWidth = view.getVisibleSize().width;
-    const originalPosition = node.getPosition();
+    const targetPosition = new Vec3(0, 0, 0);
 
     // 设置初始位置为屏幕右侧外
-    node.setPosition(screenWidth, originalPosition.y, originalPosition.z);
+    node.setPosition(screenWidth, 0, 0);
 
-    // 执行滑入动画
+    // 执行滑入动画到屏幕中心
     tween(node)
       .to(
         duration,
-        { position: originalPosition },
+        { position: targetPosition },
         {
-          easing: "linear",
+          easing: "cubicOut",
         }
       )
       .call(() => {
@@ -61,7 +61,7 @@ export class UITransitionHelper {
    */
   public static slideOutToLeft(
     node: Node,
-    duration: number = 0.1,
+    duration: number = 0.3,
     callback?: Function
   ): void {
     if (!node || !node.isValid) {
@@ -83,7 +83,7 @@ export class UITransitionHelper {
         duration,
         { position: targetPosition },
         {
-          easing: "linear",
+          easing: "cubicOut",
         }
       )
       .call(() => {
@@ -95,7 +95,7 @@ export class UITransitionHelper {
   }
 
   /**
-   * 让节点从左侧滑入到原位置
+   * 让节点从左侧滑入到屏幕中心
    *
    * @param {Node} node - 要执行动画的节点
    * @param {number} duration - 动画持续时间（秒），默认0.3秒
@@ -103,7 +103,7 @@ export class UITransitionHelper {
    */
   public static slideInFromLeft(
     node: Node,
-    duration: number = 0.1,
+    duration: number = 0.3,
     callback?: Function
   ): void {
     if (!node || !node.isValid) {
@@ -112,18 +112,18 @@ export class UITransitionHelper {
     }
 
     const screenWidth = view.getVisibleSize().width;
-    const originalPosition = node.getPosition();
+    const targetPosition = new Vec3(0, 0, 0);
 
     // 设置初始位置为屏幕左侧外
-    node.setPosition(-screenWidth, originalPosition.y, originalPosition.z);
+    node.setPosition(-screenWidth, 0, 0);
 
-    // 执行滑入动画
+    // 执行滑入动画到屏幕中心
     tween(node)
       .to(
         duration,
-        { position: originalPosition },
+        { position: targetPosition },
         {
-          easing: "linear",
+          easing: "cubicOut",
         }
       )
       .call(() => {
@@ -143,7 +143,7 @@ export class UITransitionHelper {
    */
   public static slideOutToRight(
     node: Node,
-    duration: number = 0.1,
+    duration: number = 0.3,
     callback?: Function
   ): void {
     if (!node || !node.isValid) {
@@ -165,7 +165,7 @@ export class UITransitionHelper {
         duration,
         { position: targetPosition },
         {
-          easing: "linear",
+          easing: "cubicOut",
         }
       )
       .call(() => {