FastapiAdmin/frontend/web/src/store/modules/menu.store.ts

/**
 * 菜单状态管理模块
 *
 * 提供菜单数据和动态路由的状态管理
 *
 * ## 主要功能
 *
 * - 菜单列表存储和管理
 * - 首页路径配置
 * - 动态路由注册和移除
 * - 路由移除函数管理
 * - 菜单宽度配置
 *
 * ## 使用场景
 *
 * - 动态菜单加载和渲染
 * - 路由权限控制
 * - 首页路径动态设置
 * - 登出时清理动态路由
 *
 * ## 工作流程
 *
 * 1. 获取菜单数据（前端/后端模式）
 * 2. 设置菜单列表和首页路径
 * 3. 注册动态路由并保存移除函数
 * 4. 登出时调用移除函数清理路由
 *
 * @module store/modules/menu.store
 * @author FastapiAdmin Team
 */
import { defineStore } from "pinia";
import { ref, computed } from "vue";
import { AppRouteRecord } from "@/types/router";
import { getFirstMenuPath } from "@utils";
import { HOME_PAGE_PATH } from "@/router";
import { mergeShellRoutesIntoMenu } from "@/router/staticRoutes";
import { useUserStore } from "./user.store";

/**
 * 菜单状态管理
 * 管理应用的菜单列表、首页路径、菜单宽度和动态路由移除函数
 */
export const useMenuStore = defineStore(
  "menuStore",
  () => {
    /** 首页路径 */
    const homePath = ref(HOME_PAGE_PATH);
    /** 菜单列表 */
    const menuList = ref<AppRouteRecord[]>([]);
    /** 菜单宽度 */
    const menuWidth = ref("");
    /** 存储路由移除函数的数组 */
    const removeRouteFns = ref<(() => void)[]>([]);

    /**
     * 按当前工作区模式过滤后的可见菜单
     * 平台模式仅显示 scope="platform" 的菜单，租户模式仅显示 scope="tenant" 的菜单
     * 菜单未设置 scope 时默认在两种模式下均可见（向后兼容）
     */
    const visibleMenus = computed(() => {
      const userStore = useUserStore();
      const targetScope = userStore.isPlatformMode ? "platform" : "tenant";
      return menuList.value.filter((menu) => {
        if (!menu.meta?.scope) return true;
        return menu.meta.scope === targetScope;
      });
    });

    /**
     * 设置菜单列表
     * @param list 菜单路由记录数组
     */
    const setMenuList = (list: AppRouteRecord[]) => {
      const merged = mergeShellRoutesIntoMenu(list);
      menuList.value = merged;
      setHomePath(HOME_PAGE_PATH || getFirstMenuPath(merged));
    };

    /**
     * 获取首页路径
     * @returns 首页路径字符串
     */
    const getHomePath = () => homePath.value;

    /**
     * 设置主页路径
     * @param path 主页路径
     */
    const setHomePath = (path: string) => {
      homePath.value = path;
    };

    /**
     * 添加路由移除函数
     * @param fns 要添加的路由移除函数数组
     */
    const addRemoveRouteFns = (fns: (() => void)[]) => {
      removeRouteFns.value.push(...fns);
    };

    /**
     * 移除所有动态路由
     * 执行所有存储的路由移除函数并清空数组
     */
    const removeAllDynamicRoutes = () => {
      removeRouteFns.value.forEach((fn) => fn());
      removeRouteFns.value = [];
    };

    /**
     * 清空路由移除函数数组
     */
    const clearRemoveRouteFns = () => {
      removeRouteFns.value = [];
    };

    return {
      menuList,
      visibleMenus,
      menuWidth,
      removeRouteFns,
      setMenuList,
      getHomePath,
      setHomePath,
      addRemoveRouteFns,
      removeAllDynamicRoutes,
      clearRemoveRouteFns,
    };
  },
  {
    persist: {
      pick: ["homePath", "menuWidth"],
    },
  }
);