# xk-admin 设计思路

## 架构决策

### Monorepo 结构

采用 pnpm workspace + Turborepo 的 Monorepo 架构：
- **apps/web-antd**: 主应用，包含所有业务页面
- **internal/**: 内部共享包（构建配置、工具）
- **packages/**: 共享工作区包（可复用的组件库）
- **playground/**: 开发调试环境

### Vben Admin Pro

选择 Vben Admin Pro 作为基础框架：
- 开箱即用的管理后台模板
- 完善的权限体系（菜单权限 + 按钮权限）
- 丰富的布局和主题配置
- TypeScript 支持

### 多角色菜单

通过后端动态菜单接口 (`auth/menu`) 加载菜单，不同角色看到不同菜单：
- 前端不硬编码菜单结构
- 菜单数据由后端 `xk_menu` 表管理
- 支持菜单层级、图标、排序、隐藏

### 按钮权限

使用 `v-access:code` 自定义指令控制按钮级权限：
- 权限码从后端 `auth/codes` 接口获取
- 指令在元素级别控制显示/隐藏
- 避免前端硬编码权限判断

## 技术选型

| 决策 | 选择 | 理由 |
|------|------|------|
| 框架 | Vue 3 + Vben Admin Pro | 成熟的管理后台方案 |
| UI 库 | Ant Design Vue | 企业级 UI 组件库 |
| 状态管理 | Pinia | Vue 3 官方推荐 |
| 路由 | Vue Router | Vue 生态标准 |
| 构建 | Vite + Turborepo | 快速开发和构建 |
| 包管理 | pnpm | 高效的依赖管理 |
| 语言 | TypeScript | 类型安全 |