158 lines
3.1 KiB
Markdown
158 lines
3.1 KiB
Markdown
|
||
## 功能特性
|
||
|
||
### 1. 权限管理
|
||
- 基于角色的权限控制 (RBAC)
|
||
- 动态路由生成
|
||
- 菜单权限过滤
|
||
- 按钮级权限控制
|
||
|
||
### 2. 布局系统
|
||
- 响应式布局设计
|
||
- 顶部导航栏
|
||
- 侧边菜单栏
|
||
- 面包屑导航
|
||
- 标签页导航
|
||
- 设置面板
|
||
|
||
### 3. 国际化支持
|
||
- 多语言切换 (中文/英文)
|
||
- 动态加载语言包
|
||
- 支持自定义语言扩展
|
||
|
||
### 4. 组件库
|
||
- 自定义表格组件 (scTable)
|
||
- 自定义表单组件 (scForm)
|
||
- 自定义上传组件 (scUpload)
|
||
- 其他常用业务组件
|
||
|
||
### 5. 系统功能
|
||
- 用户登录/注册/重置密码
|
||
- 仪表盘
|
||
- 系统设置
|
||
- 用户管理
|
||
- 角色管理
|
||
- 菜单管理
|
||
- 区域管理
|
||
|
||
## 安装和运行
|
||
|
||
### 环境要求
|
||
- Node.js >= 20.19.0 || >= 22.12.0
|
||
|
||
### 安装依赖
|
||
|
||
```bash
|
||
npm install
|
||
```
|
||
|
||
### 开发模式
|
||
|
||
```bash
|
||
npm run dev
|
||
```
|
||
|
||
项目将在 `http://localhost:5173` 启动。
|
||
|
||
### 构建生产版本
|
||
|
||
```bash
|
||
npm run build
|
||
```
|
||
|
||
构建后的文件将输出到 `dist` 目录。
|
||
|
||
### 预览生产版本
|
||
|
||
```bash
|
||
npm run preview
|
||
```
|
||
|
||
### 代码检查和格式化
|
||
|
||
```bash
|
||
# ESLint 检查并修复
|
||
npm run lint
|
||
|
||
# Prettier 格式化代码
|
||
npm run format
|
||
```
|
||
|
||
## 配置说明
|
||
|
||
项目的主要配置文件位于 `src/config/index.js`，包含以下配置项：
|
||
|
||
```javascript
|
||
{
|
||
APP_NAME: 'vueadmin', // 应用名称
|
||
DASHBOARD_URL: '/dashboard', // 仪表盘URL
|
||
API_URL: 'https://www.tensent.cn/admin/', // API接口地址
|
||
TIMEOUT: 50000, // 请求超时时间
|
||
TOKEN_NAME: 'authorization', // Token名称
|
||
TOKEN_PREFIX: 'Bearer ', // Token前缀
|
||
LANG: 'zh-cn', // 默认语言
|
||
// 更多配置...
|
||
}
|
||
```
|
||
|
||
## 开发指南
|
||
|
||
### 路由配置
|
||
|
||
路由配置分为两部分：
|
||
1. 系统基础路由 (`src/router/systemRoutes.js`)
|
||
2. 动态生成的业务路由 (由后端菜单数据转换)
|
||
|
||
### 组件开发
|
||
|
||
自定义组件位于 `src/components/` 目录，每个组件有独立的文件夹，包含组件文件和相关资源。
|
||
|
||
### API 调用
|
||
|
||
API 接口定义位于 `src/api/` 目录，使用 Axios 封装，支持拦截器、请求缓存等功能。
|
||
|
||
### 状态管理
|
||
|
||
使用 Pinia 进行状态管理，store 定义位于 `src/stores/` 目录，支持模块化管理。
|
||
|
||
## 国际化
|
||
|
||
国际化配置位于 `src/i18n/` 目录，支持中英文切换，可通过以下方式扩展其他语言：
|
||
|
||
1. 在 `src/i18n/locales/` 目录下添加新的语言文件
|
||
2. 在 `src/i18n/index.js` 中注册新语言
|
||
|
||
## 权限管理
|
||
|
||
系统采用基于角色的权限控制 (RBAC)，权限信息由后端提供，前端根据权限信息动态生成路由和菜单。
|
||
|
||
## 浏览器支持
|
||
|
||
- Chrome (最新版本)
|
||
- Firefox (最新版本)
|
||
- Safari (最新版本)
|
||
- Edge (最新版本)
|
||
|
||
## 注意事项
|
||
|
||
1. 确保 Node.js 版本符合要求
|
||
2. 开发环境下 API 请求可能需要配置代理
|
||
3. 生产环境需要配置正确的 API 地址
|
||
4. 首次运行需要先安装依赖
|
||
|
||
## License
|
||
|
||
MIT License
|
||
|
||
## 更新日志
|
||
|
||
### v1.6.6
|
||
- 升级 Vue 3 到 3.5.26
|
||
- 升级 Vite 到 7.3.0
|
||
- 升级 Ant Design Vue 到 4.2.6
|
||
- 优化路由管理和权限控制
|
||
- 修复已知 bug
|
||
|
||
### 贡献
|
||
|
||
欢迎提交 Issue 和 Pull Request 来帮助改进这个项目！ |