188 lines
5.1 KiB
Markdown
188 lines
5.1 KiB
Markdown
# 机房管控系统菜单配置指南
|
|
|
|
## 📋 菜单结构
|
|
|
|
### 管理员菜单 (R_SUPER, R_ADMIN)
|
|
|
|
1. **首页** 🏠
|
|
- 系统概览和统计信息
|
|
|
|
2. **设备管理** 💻
|
|
- 设备列表 - 所有设备的增删改查
|
|
- 在线状态 - 实时监控设备在线情况
|
|
- 电源管理 - 远程控制设备电源
|
|
- 远程监控 - 查看设备屏幕
|
|
- 设备分组 - 按维度分组管理（未来扩展）
|
|
|
|
3. **屏幕监控** 🖥
|
|
- 监控墙 - 多屏幕同时监控
|
|
- 单屏控制 - 单个设备控制
|
|
- 控制记录 - 操作审计
|
|
|
|
4. **用户管理** 👤
|
|
- 用户列表 - 用户增删改查
|
|
- 角色管理 - 角色配置
|
|
- 权限管理 - 权限分配（仅超级管理员）
|
|
|
|
5. **使用申请** 📄
|
|
- 申请审批 - 审批用户申请
|
|
- 使用记录 - 查看使用历史
|
|
|
|
6. **系统设置** ⚙ (仅超级管理员)
|
|
- AMT设置 - Intel AMT配置
|
|
- Agent设置 - 客户端程序管理
|
|
- 日志中心 - 系统日志查询
|
|
|
|
### 普通用户菜单 (R_USER)
|
|
|
|
1. **首页** 🏠
|
|
- 个人使用概览
|
|
|
|
2. **我的设备** 💻
|
|
- 设备状态 - 查看我的设备
|
|
- 电源控制 - 控制设备电源
|
|
- 远程控制 - 远程操作设备
|
|
|
|
3. **设备申请** 📄
|
|
- 申请使用 - 提交使用申请
|
|
- 我的申请 - 查看申请状态
|
|
|
|
## 🚀 部署步骤
|
|
|
|
### 1. 执行数据库脚本
|
|
|
|
```bash
|
|
# 登录 MySQL
|
|
mysql -u root -p
|
|
|
|
# 执行路由初始化脚本
|
|
source backend/src/main/resources/sql/add_all_routes.sql
|
|
```
|
|
|
|
或者在 MySQL 客户端中直接执行 `backend/src/main/resources/sql/add_all_routes.sql` 文件。
|
|
|
|
### 2. 生成前端路由
|
|
|
|
```bash
|
|
# 在项目根目录执行
|
|
pnpm gen-route
|
|
```
|
|
|
|
这会自动扫描 `src/views` 目录并生成路由配置。
|
|
|
|
### 3. 重启服务
|
|
|
|
**后端：**
|
|
```bash
|
|
cd backend
|
|
mvn spring-boot:run
|
|
```
|
|
|
|
**前端：**
|
|
```bash
|
|
pnpm dev
|
|
```
|
|
|
|
### 4. 测试菜单
|
|
|
|
**管理员账号：**
|
|
- 用户名：`admin`
|
|
- 密码：`admin123`
|
|
- 可见菜单：所有管理员菜单
|
|
|
|
**普通用户账号：**
|
|
- 用户名：`user`
|
|
- 密码：`user123`
|
|
- 可见菜单：仅普通用户菜单
|
|
|
|
## 📁 文件结构
|
|
|
|
```
|
|
src/views/
|
|
├── home/ # 首页
|
|
├── device/ # 设备管理
|
|
│ ├── index.vue
|
|
│ ├── _meta.ts
|
|
│ ├── list/ # 设备列表
|
|
│ ├── online/ # 在线状态
|
|
│ ├── power/ # 电源管理
|
|
│ ├── monitor/ # 远程监控
|
|
│ └── group/ # 设备分组
|
|
├── screen/ # 屏幕监控
|
|
│ ├── index.vue
|
|
│ ├── _meta.ts
|
|
│ ├── wall/ # 监控墙
|
|
│ ├── control/ # 单屏控制
|
|
│ └── record/ # 控制记录
|
|
├── user-manage/ # 用户管理
|
|
│ ├── index.vue
|
|
│ ├── _meta.ts
|
|
│ ├── list/ # 用户列表
|
|
│ ├── role/ # 角色管理
|
|
│ └── permission/ # 权限管理
|
|
├── application/ # 申请管理
|
|
│ ├── index.vue
|
|
│ ├── _meta.ts
|
|
│ ├── approval/ # 申请审批
|
|
│ └── history/ # 使用记录
|
|
├── system/ # 系统设置
|
|
│ ├── index.vue
|
|
│ ├── _meta.ts
|
|
│ ├── amt/ # AMT设置
|
|
│ ├── agent/ # Agent设置
|
|
│ └── log/ # 日志中心
|
|
├── my-device/ # 我的设备（普通用户）
|
|
│ ├── index.vue
|
|
│ ├── _meta.ts
|
|
│ ├── status/ # 设备状态
|
|
│ ├── power-control/ # 电源控制
|
|
│ └── remote-control/ # 远程控制
|
|
└── my-application/ # 设备申请（普通用户）
|
|
├── index.vue
|
|
├── _meta.ts
|
|
├── apply/ # 申请使用
|
|
└── my-list/ # 我的申请
|
|
```
|
|
|
|
## 🎨 路由元信息配置
|
|
|
|
每个页面的 `_meta.ts` 文件配置示例：
|
|
|
|
```typescript
|
|
export default {
|
|
title: '设备管理', // 菜单标题
|
|
i18nKey: 'route.device', // 国际化key
|
|
icon: 'mdi:desktop-classic', // 图标
|
|
order: 2, // 排序
|
|
roles: ['R_SUPER', 'R_ADMIN'] // 可访问角色（可选）
|
|
};
|
|
```
|
|
|
|
## 🔐 权限说明
|
|
|
|
- **R_SUPER**: 超级管理员 - 所有权限
|
|
- **R_ADMIN**: 管理员 - 除系统设置外的所有权限
|
|
- **R_USER**: 普通用户 - 仅个人相关功能
|
|
|
|
## 📝 注意事项
|
|
|
|
1. 当前使用的是**静态路由模式** (`VITE_AUTH_ROUTE_MODE=static`)
|
|
2. 路由根据角色自动过滤，不同角色看到不同菜单
|
|
3. 所有页面都是示例页面，需要根据实际需求开发具体功能
|
|
4. 图标使用 Material Design Icons (mdi)
|
|
|
|
## 🔄 如何添加新菜单
|
|
|
|
1. 在 `src/views` 下创建新的页面文件夹
|
|
2. 创建 `index.vue` 页面组件
|
|
3. 创建 `_meta.ts` 配置文件
|
|
4. 运行 `pnpm gen-route` 生成路由
|
|
5. 在 `src/locales/langs/zh-cn.ts` 添加国际化配置
|
|
|
|
## 📞 技术支持
|
|
|
|
如有问题，请查看：
|
|
- 前端路由配置：`src/router/elegant/routes.ts`
|
|
- 后端路由数据：数据库 `sys_route` 表
|
|
- 国际化配置：`src/locales/langs/zh-cn.ts`
|