签入版本

2026-09-29 10:14:04 +08:00
parent 3e5fc01124
commit d6b552103d
1664 changed files with 298944 additions and 0 deletions
@@ -0,0 +1,61 @@
+# 9.2 目录结构详解
+
+:::tip 概述
+本节详细介绍前端项目的目录结构，帮助开发者快速定位代码和理解项目组织方式。
+:::
+
+```text
+ui/src/
+├── api/                        # API 接口层（按业务域分组）
+│   ├── common/                 # 公共接口（登录/菜单/用户信息/城市）
+│   ├── system/                 # 系统管理（用户/角色/菜单/部门/岗位/职级/日志/租户）
+│   ├── content/                # 内容管理（文章/分类/链接）
+│   ├── data/                   # 数据管理（城市/配置/字典/公告/参数）
+│   ├── dashboard/              # 仪表盘（控制台/消息）
+│   ├── file/                   # 文件管理（文件模板）
+│   ├── monitor/                # 监控管理（定时任务）
+│   ├── region/                 # 行政区划
+│   ├── setting/                # 设置（个人资料/网站配置）
+│   └── tool/                   # 工具（示例/代码生成器）
+├── components/                 # 公共组件库（20+ 个）
+│   ├── Table/                  # 数据表格
+│   ├── Form/                   # 动态表单
+│   ├── Modal/                  # 弹窗
+│   ├── Upload/                 # 文件上传
+│   ├── Editor/                 # 富文本编辑器
+│   ├── Excel/                  # Excel 导入导出
+│   ├── Cropper/                # 头像裁剪
+│   ├── Region/                 # 行政区划
+│   ├── Password/               # 密码强度
+│   ├── Qrcode/                 # 二维码
+│   └── ...
+├── directives/                 # 自定义指令
+│   └── permission.ts           # v-perm / v-perms 权限指令
+├── enums/                      # 枚举常量
+│   ├── httpEnum.ts             # HTTP 枚举
+│   └── pageEnum.ts             # 页面枚举
+├── hooks/                      # 组合式函数
+├── layout/                     # 布局组件
+├── router/                     # 路由配置
+│   ├── index.ts                # 路由实例
+│   ├── base.ts                 # 静态路由
+│   ├── generator-routers.ts    # 动态路由生成
+│   └── router-guards.ts        # 路由守卫
+├── store/                      # Pinia 状态管理
+│   └── modules/
+│       ├── user.ts             # 用户 Store
+│       ├── asyncRoute.ts       # 动态路由 Store
+│       └── ...
+├── styles/                     # 全局样式
+├── utils/                      # 工具函数
+│   └── http/                   # HTTP 请求封装
+└── views/                      # 页面视图
+    ├── login/                  # 登录页
+    ├── dashboard/              # 仪表盘
+    ├── system/                 # 系统管理页面
+    ├── content/                # 内容管理页面
+    ├── data/                   # 数据管理页面
+    ├── monitor/                # 监控管理页面
+    ├── tool/                   # 工具页面
+    └── exception/              # 异常页面
+```