@spacego/fe-components 0.0.1-alpha.1 → 0.0.1-alpha.3

package/src/store/modules/layout-config.store.ts

@@ -1,343 +0,0 @@
-/*
- * @Author: dushuai
- * @Date: 2026-01-27
- * @LastEditors: dushuai
- * @LastEditTime: 2026-01-31 23:34:31
- * @description: layout config store
- */
-import type { AxiosRequestConfig } from 'axios';
-import { create } from 'zustand';
-import { combine, createJSONStorage, persist } from 'zustand/middleware';
-
-import { STORE_KEY } from '@/index';
-import type { TUpdateStore } from '@/typings';
-
-export interface TabItem {
-  key: string
-  label: string
-  path: string
-  closable?: boolean
-}
-
-type State = {
-  /** Tabs 配置 */
-  tabsAttribute: {
-    /** 已打开的页面标签列表 */
-    tabsList: TabItem[]
-    /** 当前激活的标签页 key */
-    tabsActiveKey: string
-  }
-  /** Loading 配置 */
-  loadingConfig: {
-    show: boolean
-    limit: number
-    timer: number | null
-  }
-  /** 侧边栏折叠状态 */
-  sidebarCollapsed: boolean
-}
-
-type Update = TUpdateStore<State>;
-
-type Actions = {
-  SET_STATE: (data: Update) => void
-  /** 添加标签页 */
-  ADD_TAB: (tab: TabItem) => void
-  /** 移除标签页 */
-  REMOVE_TAB: (key: string) => void
-  /** 设置当前激活的标签页 */
-  SET_ACTIVE_TAB_KEY: (key: string) => void
-  /** 清空所有标签页 */
-  CLEAR_TABS: () => void
-  /** 设置loading配置 */
-  SET_LOADING: (config?: AxiosRequestConfig) => void
-  /** 取消loading */
-  HIDE_LOADING: (config?: AxiosRequestConfig) => void
-  /** 清除loading定时器 */
-  CLEAR_LOADING_TIMER: () => void
-  /** 设置侧边栏折叠状态 */
-  SET_SIDEBAR_COLLAPSED: (collapsed: boolean) => void
-  /** 切换侧边栏折叠状态 */
-  TOGGLE_SIDEBAR_COLLAPSED: () => void
-  /** 重置 */
-  RESET: () => void
-  /** 设置通知的reactNode */
-  SET_NOTICE_RENDER: (render: React.ReactNode) => void
-}
-
-// 定义完整的 Store 类型
-type LayoutConfigStore = State & Actions;
-
-// define the initial state
-const initialState = (): State => ({
-  tabsAttribute: {
-    tabsList: [{
-      key: 'Home',
-      label: '首页',
-      path: '/',
-      closable: false // 首页标签不可关闭
-    }],
-    tabsActiveKey: ''
-  },
-  loadingConfig: {
-    show: false,
-    limit: 0,
-    timer: null
-  },
-  sidebarCollapsed: false
-});
-
-/**
- * 当前store版本
- * 更改后需要手动修改并添加migrate逻辑
- */
-const APP_STORE_VERSION: number = 0.1;
-
-export const useLayoutConfigStore = create(persist(
-  combine(
-  initialState() as LayoutConfigStore,
-
-  (set, get) => ({
-
-    SET_STATE: (data: Update) => set(data),
-
-    /**
-     * 添加标签页
-     */
-    ADD_TAB: (tab: TabItem) => {
-      const { tabsAttribute } = get();
-      const { tabsList } = tabsAttribute;
-      // 检查是否已存在
-      const exists = tabsList.find(t => t.key === tab.key);
-      if(!exists) {
-        set({
-          tabsAttribute: {
-            ...tabsAttribute,
-            tabsList: [...tabsList, tab],
-            tabsActiveKey: tab.key
-          }
-        });
-      } else {
-        set({
-          tabsAttribute: {
-            ...tabsAttribute,
-            tabsActiveKey: tab.key
-          }
-        });
-      }
-    },
-
-    /**
-     * 移除标签页
-     */
-    REMOVE_TAB: (key: string): TabItem => {
-      const { tabsAttribute } = get();
-      const { tabsList, tabsActiveKey } = tabsAttribute;
-      const newTabs = tabsList.filter(t => t.key !== key);
-
-      let newActiveKey = tabsActiveKey;
-      // 如果关闭的是当前激活的标签，切换到最后一个标签
-      if(tabsActiveKey === key && newTabs.length > 0) {
-        newActiveKey = newTabs[newTabs.length - 1].key;
-      } else if(newTabs.length === 0) {
-        newActiveKey = '';
-      }
-
-      set({
-        tabsAttribute: {
-          tabsList: newTabs,
-          tabsActiveKey: newActiveKey
-        }
-      });
-
-      return tabsList.find(item => item.key === newActiveKey) ?? {} as TabItem;
-    },
-
-    /**
-     * 设置当前激活的标签页
-     */
-    SET_ACTIVE_TAB_KEY: (key: string) => {
-      const { tabsAttribute } = get();
-      set({
-        tabsAttribute: {
-          ...tabsAttribute,
-          tabsActiveKey: key
-        }
-      });
-    },
-
-    /**
-     * 清空所有标签页
-     */
-    CLEAR_TABS: () => {
-      set({
-        tabsAttribute: {
-          tabsList: [],
-          tabsActiveKey: ''
-        }
-      });
-    },
-
-    /**
-     * 设置loading配置
-     */
-    SET_LOADING: (config?: AxiosRequestConfig) => {
-      if(!!config && config.showLoading === false) return;
-      const { CLEAR_LOADING_TIMER, HIDE_LOADING } = get();
-
-      set((state) => {
-        const { loadingConfig } = state;
-        const shouldShow = loadingConfig.show === false;
-        const newLimit = loadingConfig.limit + 1;
-        const newLoadingConfig = {
-          show: shouldShow ? true : loadingConfig.show,
-          limit: newLimit,
-          timer: loadingConfig.timer
-        };
-
-        // 如果limit为1，需要设置定时器
-        if(newLimit === 1) {
-          CLEAR_LOADING_TIMER();
-          const timer = setTimeout(() => {
-            const currentState = get();
-            if(currentState.loadingConfig.limit === 1 && currentState.loadingConfig.show) {
-              HIDE_LOADING(config);
-            }
-          }, 20 * 1000);
-          return {
-            loadingConfig: {
-              ...newLoadingConfig,
-              timer
-            }
-          };
-        } else {
-          CLEAR_LOADING_TIMER();
-          return {
-            loadingConfig: newLoadingConfig
-          };
-        }
-      });
-    },
-
-    /**
-     * 取消loading
-     */
-    HIDE_LOADING: (config?: AxiosRequestConfig) => {
-      if(!!config && config.showLoading === false) return;
-      const { CLEAR_LOADING_TIMER, HIDE_LOADING } = get();
-
-      set((state) => {
-        const { loadingConfig } = state;
-
-        if(loadingConfig.limit <= 0) {
-          return state;
-        }
-
-        const newLimit = loadingConfig.limit - 1;
-        const newLoadingConfig = {
-          ...loadingConfig,
-          limit: newLimit
-        };
-
-        // 如果limit变为0，需要隐藏loading
-        if(newLimit === 0) {
-          newLoadingConfig.show = false;
-          // message.destroy();
-          CLEAR_LOADING_TIMER();
-          return {
-            loadingConfig: {
-              ...newLoadingConfig,
-              timer: null
-            }
-          };
-        }
-
-        // 如果limit为1，需要设置定时器
-        if(newLimit === 1) {
-          CLEAR_LOADING_TIMER();
-          const timer = setTimeout(() => {
-            const currentState = get();
-            if(currentState.loadingConfig.limit === 1 && currentState.loadingConfig.show) {
-              HIDE_LOADING(config);
-            }
-          }, 20 * 1000);
-          return {
-            loadingConfig: {
-              ...newLoadingConfig,
-              timer
-            }
-          };
-        }
-
-        // 其他情况只更新limit
-        return {
-          loadingConfig: newLoadingConfig
-        };
-      });
-    },
-
-    /**
-     * 清除loading定时器
-     */
-    CLEAR_LOADING_TIMER() {
-      const { loadingConfig } = get();
-      if(loadingConfig.timer) {
-        clearTimeout(loadingConfig.timer);
-        set({
-          loadingConfig: {
-            ...loadingConfig,
-            timer: null
-          }
-        });
-      }
-    },
-
-    /**
-     * 设置侧边栏折叠状态
-     */
-    SET_SIDEBAR_COLLAPSED: (collapsed: boolean) => {
-      set({ sidebarCollapsed: collapsed });
-    },
-
-    /**
-     * 切换侧边栏折叠状态
-     */
-    TOGGLE_SIDEBAR_COLLAPSED: () => {
-      const { sidebarCollapsed } = get();
-      set({ sidebarCollapsed: !sidebarCollapsed });
-    },
-
-    /**
-     * 重置
-     */
-    RESET: () => {
-      const { sidebarCollapsed, ...rest } = initialState();
-      set(rest);
-    }
-
-  })
-  ),
-  {
-    name: STORE_KEY.LAYOUT_CONFIG, // unique name
-    storage: createJSONStorage(() => localStorage),
-    version: APP_STORE_VERSION, // a migration will be triggered if the version in the storage mismatches this one
-
-    // 部分持久化
-    partialize: (state) => {
-      const { ...rest } = state;
-      return rest;
-    },
-
-    // migration logic
-    migrate: (persistedState, version) => {
-
-      const state = initialState();
-
-      if(version !== APP_STORE_VERSION) {
-        Object.assign(state, persistedState);
-      }
-
-      return state;
-    }
-  }
-));

package/src/store/modules/theme.store.ts

@@ -1,99 +0,0 @@
-/*
- * @Author: dushuai
- * @Date: 2026-01-28
- * @LastEditors: dushuai
- * @LastEditTime: 2026-01-31 23:33:29
- * @description: 主题管理 store
- */
-import { create } from 'zustand';
-import { combine, createJSONStorage, devtools, persist } from 'zustand/middleware';
-
-import { applyTheme, applyThemeColor, STORE_KEY } from '@/index';
-import type { TUpdateStore } from '@/typings';
-
-export type ThemeMode = 'light' | 'dark' | 'system';
-
-type State = {
-  theme: ThemeMode
-  themeColor: string
-  /** 是否是自定义主题色 */
-  isCustomThemeColor: boolean
-}
-
-type Actions = {
-  SET_THEME: (theme: ThemeMode) => void
-  TOGGLE_THEME: () => void
-  SET_THEME_COLOR: (color: string) => void
-  SET_IS_CUSTOM_THEME_COLOR: (isCustom: boolean) => void
-  SET_STATE: (data: { key: keyof State, val: State[keyof State] }) => void
-}
-
-type Update = TUpdateStore<State>;
-
-type ThemeStore = State & Actions;
-
-const initialState = (): State => ({
-  theme: 'light',
-  themeColor: '#006BE6', // 默认主题色
-  isCustomThemeColor: false
-});
-
-const THEME_STORE_VERSION: number = 0.1;
-
-export const useThemeStore = create((devtools(
-  persist(
-    combine(
-      initialState() as ThemeStore,
-
-      (set, get) => ({
-        SET_STATE: (data: Update) => set(data),
-
-        SET_THEME: (theme: ThemeMode) => {
-          set({ theme });
-          // 同步应用到 DOM，确保 Tailwind 和 Antd 主题一致
-          applyTheme(theme);
-        },
-
-        TOGGLE_THEME: () => {
-          const currentTheme = get().theme;
-          // system 模式下 toggle 会切换到 dark 或 light? 这里简单处理为 light/dark 切换
-          // 或者如果当前是 system，toggle 会切换到相反的非 system 模式
-          let newTheme: ThemeMode;
-          if(currentTheme === 'system') {
-            // 如果是 system，获取当前系统颜色，然后取反
-            const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
-            newTheme = isDark ? 'light' : 'dark';
-          } else {
-            newTheme = currentTheme === 'light' ? 'dark' : 'light';
-          }
-          set({ theme: newTheme });
-          // 同步应用到 DOM，确保 Tailwind 和 Antd 主题一致
-          applyTheme(newTheme);
-        },
-
-        SET_THEME_COLOR: (color: string) => {
-          set({ themeColor: color });
-          // 同步应用到 DOM，更新 #root 内的 --color-primary CSS 变量
-          applyThemeColor(color);
-        },
-
-        SET_IS_CUSTOM_THEME_COLOR: (isCustom: boolean) => {
-          set({ isCustomThemeColor: isCustom });
-        }
-      })
-    ),
-    {
-      name: STORE_KEY.THEME,
-      storage: createJSONStorage(() => localStorage),
-      version: THEME_STORE_VERSION,
-      migrate: (persistedState, version) => {
-        const state = initialState();
-        if(version !== THEME_STORE_VERSION) {
-          Object.assign(state, persistedState);
-        }
-        return state;
-      }
-    }
-  ),
-  { name: STORE_KEY.THEME, enabled: true }
-)));

package/src/typings/index.d.ts

@@ -1,59 +0,0 @@
-/*
- * @Author: dushuai
- * @Date: 2026-01-13 20:55:57
- * @LastEditors: dushuai
- * @LastEditTime: 2026-01-26 23:49:50
- * @description: 类型声明
- */
-/// <reference types="vite-plugin-svgr/client" />
-
-/**
- * 菜单类型枚举
- * @1 目录 - 仅用于菜单分组，不对应实际页面
- * @2 菜单 - 对应实际页面路由
- * @3 按钮 - 页面内的按钮权限
- */
-export type MenuType = 1 | 2 | 3;
-
-/**
- * 路由类型
- */
-export interface IRoute {
-  /** 数据库主键id */
-  id: number
-  /** 菜单类型：1目录、2菜单、3按钮 */
-  menuType: MenuType
-  /** 菜单唯一标识，必填且唯一 */
-  menuId: string
-  /** 路由路径 */
-  path?: string
-  /**
-   * 菜单标识
-   * - 菜单类型：对应 pages 目录下文件夹名称（如 home、system/user）
-   * - 按钮类型：权限标识（如 user:add、user:edit）
-   */
-  menuCode?: string
-  /** 父级菜单的menuId */
-  parentId?: string
-  /** 是否受保护，默认true */
-  protected?: boolean
-  /** 是否是首页（仅菜单类型有效） */
-  index?: boolean
-  /** 路由/菜单标题 */
-  title?: string
-  /** 路由/菜单图标 */
-  icon?: string
-  /** 排序，数字越小越靠前 */
-  sort?: number
-  /** 是否在侧边栏菜单中显示，默认true（详情页等不需要显示在菜单中的页面设为false） */
-  isShowMenu?: boolean
-  /** 是否独立菜单 */
-  isIndependentMenu?: boolean
-  /** 激活路由的menuId */
-  activeRouteMenuId?: string
-}
-
-/**
- * 更新store
- */
-export type TUpdateStore<T> = T | Partial<T> | ((state: T) => T | Partial<T>);

package/src/typings/shims-axios.d.ts

@@ -1,38 +0,0 @@
-/*
- * @Author: dushuai
- * @Date: 2025-12-07 16:31:57
- * @LastEditors: dushuai
- * @LastEditTime: 2026-01-13 22:14:53
- * @description: 请求config配置
- */
-declare module 'axios' {
-  export interface AxiosRequestConfig {
-    /**
-     * @name 是否单独处理请求数据，true：返回结构为Response类型(且不处理错误码)，false：返回结构为data类型，默认false
-     */
-    isCheck?: boolean;
-    /**
-     * @name 是否加载loading
-     * @default true
-     */
-    showLoading?: boolean;
-    /**
-     * @name 加载loading的文本，最多七个字
-     */
-    loadingText?: string;
-  }
-}
-
-export interface IResponse<T = unknown> {
-  code: number;
-  data: T;
-  msg: string;
-}
-
-export interface IRecord<T = unknown> {
-  pageNum: number;
-  pageSize: number;
-  records: T[];
-  total: number;
-  totalPage?: number;
-}

package/src/utils/icon.tsx

@@ -1,32 +0,0 @@
-/*
- * @Author: dushuai
- * @Date: 2026-01-27
- * @LastEditors: dushuai
- * @LastEditTime: 2026-01-27
- * @description: 图标工具函数
- */
-import * as Icons from '@ant-design/icons';
-import type { ComponentType } from 'react';
-
-/**
- * 根据图标名称获取图标组件
- * @param iconName 图标名称，如 'HomeOutlined'
- * @returns 图标组件
- */
-export function getIcon(iconName?: string): ComponentType<any> | null {
-  if(!iconName) return null;
-
-  const IconComponent = (Icons as unknown as Record<string, ComponentType<any>>)[iconName];
-  return IconComponent || null;
-}
-
-/**
- * 渲染图标
- * @param iconName 图标名称
- * @param props 图标属性
- * @returns JSX元素
- */
-export function renderIcon(iconName?: string, props?: any) {
-  const IconComponent = getIcon(iconName);
-  return IconComponent ? <IconComponent {...props} /> : null;
-}

package/src/utils/index.ts

@@ -1,9 +0,0 @@
-/*
- * @Author: dushuai
- * @Date: 2026-01-31 23:25:51
- * @LastEditors: dushuai
- * @LastEditTime: 2026-02-01 01:48:55
- * @description: utils
- */
-export * from './icon';
-export * from './theme';