Skip to content

项目结构

├── src
│   ├── api                     # API 接口相关代码
│   │   ├── auth.ts             # 认证相关的 API 接口定义(如登录、注册、用户信息)
│   │   └── system-manage.ts    # 系统管理相关的 API 接口定义(如菜单、用户、角色管理)
│   ├── App.vue                 # Vue 根组件,定义应用的全局结构和入口
│   ├── assets                  # 静态资源目录
│   │   ├── images              # 图片资源目录
│   │   ├── styles              # 全局样式文件
│   │   │   ├── core            # 核心样式(系统级样式)
│   │   │   ├── custom          # 自定义样式(业务级样式)
│   │   │   └── index.scss      # 样式入口文件
│   │   └── svg                 # SVG 相关资源
│   │       └── loading.ts      # 加载动画 SVG 定义
│   ├── components              # 组件目录
│   │   ├── business            # 业务组件(业务相关的自定义组件)
│   │   │   └── comment-widget  # 评论组件
│   │   └── core                # 核心组件(系统级通用组件库)
│   │       ├── banners         # 横幅组件
│   │       ├── base            # 基础组件
│   │       ├── cards           # 卡片组件
│   │       ├── charts          # 图表组件
│   │       ├── forms           # 表单组件
│   │       ├── layouts         # 布局组件
│   │       ├── media           # 媒体组件
│   │       ├── others          # 其他组件
│   │       ├── tables          # 表格组件
│   │       ├── text-effect     # 文本特效组件
│   │       ├── theme           # 主题相关组件
│   │       ├── views           # 视图组件
│   │       └── widget          # 小部件组件
│   ├── config                  # 项目配置目录
│   │   ├── assets              # 静态资源配置
│   │   │   └── images.ts       # 图片资源路径配置
│   │   ├── modules             # 模块化配置
│   │   │   ├── component.ts    # 组件配置
│   │   │   ├── fastEnter.ts    # 快捷入口配置
│   │   │   ├── festival.ts     # 节日/活动配置
│   │   │   └── headerBar.ts    # 顶部栏配置
│   │   ├── index.ts            # 配置入口文件
│   │   └── setting.ts          # 系统设置配置
│   ├── directives              # Vue 自定义指令
│   │   ├── business            # 业务指令
│   │   │   ├── highlight.ts    # 高亮指令
│   │   │   └── ripple.ts       # 波纹效果指令
│   │   ├── core                # 核心指令
│   │   │   ├── auth.ts         # 认证指令
│   │   │   └── roles.ts        # 角色权限指令
│   │   └── index.ts            # 指令入口文件
│   ├── enums                   # 枚举定义
│   │   ├── appEnum.ts          # 应用级枚举(如主题类型、语言类型)
│   │   └── formEnum.ts         # 表单相关枚举(如表单状态、验证规则)
│   ├── env.d.ts                # TypeScript 环境声明文件
│   ├── hooks                   # Vue 3 Composable 函数(可复用逻辑)
│   │   ├── core                # 核心 Hooks
│   │   │   ├── useAppMode.ts   # 应用模式相关逻辑
│   │   │   ├── useAuth.ts      # 认证相关逻辑
│   │   │   ├── useCeremony.ts  # 节日/仪式相关逻辑
│   │   │   ├── useChart.ts     # 图表相关逻辑
│   │   │   ├── useCommon.ts    # 通用逻辑
│   │   │   ├── useFastEnter.ts # 快捷入口逻辑
│   │   │   ├── useHeaderBar.ts # 顶部栏逻辑
│   │   │   ├── useLayoutHeight.ts # 布局高度计算逻辑
│   │   │   ├── useTable.ts     # 表格逻辑
│   │   │   ├── useTableColumns.ts # 表格列配置逻辑
│   │   │   ├── useTableHeight.ts # 表格高度计算逻辑
│   │   │   └── useTheme.ts     # 主题切换逻辑
│   │   └── index.ts            # Hooks 入口文件
│   ├── locales                 # 国际化(i18n)资源
│   │   ├── index.ts            # 国际化入口文件
│   │   └── langs               # 多语言文件
│   │       ├── en.json         # 英文语言包
│   │       └── zh.json         # 中文语言包
│   ├── main.ts                 # 项目主入口文件
│   ├── mock                    # Mock 数据目录
│   │   ├── json                # JSON 格式的 Mock 数据
│   │   │   └── chinaMap.json   # 中国地图数据
│   │   ├── temp                # 临时 Mock 数据
│   │   │   ├── articleList.ts  # 文章列表数据
│   │   │   ├── commentDetail.ts # 评论详情数据
│   │   │   ├── commentList.ts  # 评论列表数据
│   │   │   └── formData.ts     # 表单数据
│   │   └── upgrade             # 更新日志数据
│   │       └── changeLog.ts    # 变更日志数据
│   ├── plugins                 # 插件配置
│   │   ├── echarts.ts          # ECharts 图表库配置
│   │   └── index.ts            # 插件入口文件
│   ├── router                  # Vue Router 路由相关代码
│   │   ├── core                # 路由核心功能
│   │   │   ├── ComponentLoader.ts # 组件加载器
│   │   │   ├── IframeRouteManager.ts # Iframe 路由管理器
│   │   │   ├── MenuProcessor.ts # 菜单处理器
│   │   │   ├── RouteRegistry.ts # 路由注册器
│   │   │   ├── RouteTransformer.ts # 路由转换器
│   │   │   ├── RouteValidator.ts # 路由验证器
│   │   │   └── index.ts        # 核心功能入口
│   │   ├── guards              # 路由守卫
│   │   │   ├── afterEach.ts    # 全局后置守卫
│   │   │   └── beforeEach.ts   # 全局前置守卫
│   │   ├── modules             # 路由模块定义
│   │   │   ├── article.ts      # 文章模块路由
│   │   │   ├── dashboard.ts    # 仪表盘路由
│   │   │   ├── examples.ts     # 示例页面路由
│   │   │   ├── exception.ts    # 异常页面路由
│   │   │   ├── help.ts         # 帮助页面路由
│   │   │   ├── index.ts        # 路由模块入口
│   │   │   ├── result.ts       # 结果页面路由
│   │   │   ├── safeguard.ts    # 安全防护路由
│   │   │   ├── system.ts       # 系统管理路由
│   │   │   ├── template.ts     # 模板页面路由
│   │   │   └── widgets.ts      # 小组件路由
│   │   ├── routes              # 路由配置
│   │   │   ├── asyncRoutes.ts  # 异步路由(动态路由)
│   │   │   └── staticRoutes.ts # 静态路由(固定路由)
│   │   ├── index.ts            # 路由主入口
│   │   └── routesAlias.ts      # 路由别名定义
│   ├── store                   # Pinia 状态管理
│   │   ├── modules             # 状态管理模块
│   │   │   ├── menu.ts         # 菜单状态管理
│   │   │   ├── setting.ts      # 设置状态管理
│   │   │   ├── table.ts        # 表格状态管理
│   │   │   ├── user.ts         # 用户状态管理
│   │   │   └── worktab.ts      # 工作标签页状态管理
│   │   └── index.ts            # Pinia 入口文件
│   ├── types                   # TypeScript 类型定义
│   │   ├── api                 # API 相关类型
│   │   │   └── api.d.ts        # API 接口类型定义
│   │   ├── common              # 通用类型定义
│   │   │   ├── index.ts        # 通用类型入口
│   │   │   └── response.ts     # 响应类型定义
│   │   ├── component           # 组件相关类型
│   │   │   ├── chart.ts        # 图表组件类型
│   │   │   └── index.ts        # 组件类型入口
│   │   ├── config              # 配置相关类型
│   │   │   └── index.ts        # 配置类型定义
│   │   ├── import              # 自动导入类型声明
│   │   │   ├── auto-imports.d.ts # 自动导入的函数类型
│   │   │   └── components.d.ts # 自动导入的组件类型
│   │   ├── router              # 路由相关类型
│   │   │   └── index.ts        # 路由类型定义
│   │   ├── store               # 状态管理相关类型
│   │   │   └── index.ts        # Store 类型定义
│   │   └── index.ts            # 类型定义总入口
│   ├── utils                   # 工具函数目录
│   │   ├── constants           # 常量定义
│   │   │   ├── index.ts        # 常量入口
│   │   │   └── links.ts        # 链接常量
│   │   ├── form                # 表单相关工具
│   │   │   ├── index.ts        # 表单工具入口
│   │   │   ├── responsive.ts   # 响应式表单工具
│   │   │   └── validator.ts    # 表单验证工具
│   │   ├── http                # HTTP 请求工具
│   │   │   ├── error.ts        # 错误处理
│   │   │   ├── index.ts        # HTTP 工具入口
│   │   │   └── status.ts       # 状态码处理
│   │   ├── navigation          # 导航相关工具
│   │   │   ├── index.ts        # 导航工具入口
│   │   │   ├── jump.ts         # 页面跳转工具
│   │   │   ├── route.ts        # 路由工具
│   │   │   └── worktab.ts      # 工作标签页工具
│   │   ├── storage             # 存储相关工具
│   │   │   ├── index.ts        # 存储工具入口
│   │   │   ├── storage-config.ts # 存储配置
│   │   │   ├── storage-key-manager.ts # 存储键管理
│   │   │   └── storage.ts      # 存储工具实现
│   │   ├── sys                 # 系统相关工具
│   │   │   ├── console.ts      # 控制台工具
│   │   │   ├── error-handle.ts # 错误处理
│   │   │   ├── index.ts        # 系统工具入口
│   │   │   ├── mittBus.ts      # 事件总线
│   │   │   └── upgrade.ts      # 升级相关工具
│   │   ├── table               # 表格相关工具
│   │   │   ├── tableCache.ts   # 表格缓存
│   │   │   ├── tableConfig.ts  # 表格配置
│   │   │   └── tableUtils.ts   # 表格工具函数
│   │   ├── ui                  # UI 相关工具
│   │   │   ├── animation.ts    # 动画工具
│   │   │   ├── colors.ts       # 颜色工具
│   │   │   ├── emojo.ts        # 表情工具
│   │   │   ├── index.ts        # UI 工具入口
│   │   │   ├── loading.ts      # 加载动画工具
│   │   │   └── tabs.ts         # 标签页工具
│   │   ├── index.ts            # 工具函数总入口
│   │   └── router.ts           # 路由工具函数
│   └── views                   # 页面组件目录
├── tsconfig.json               # TypeScript 配置文件
└── vite.config.ts              # Vite 配置文件

根据 MIT 许可证发布