# 菜单显示问题修复说明

## 问题原因

在实现动态路由权限时，我们将路由名称从连字符改为下划线格式：
- `user-manage` → `user_manage`
- `my-device` → `my_device`
- `my-application` → `my_application`

但是，**组件路径(component)必须与实际文件夹结构保持一致**，而实际文件夹使用的是连字符：
- `src/views/user-manage/`
- `src/views/my-device/`
- `src/views/my-application/`

这导致前端无法找到对应的组件文件，出现错误和菜单显示异常。

## 解决方案

保持以下规则：
1. **路由名称(name)** 使用下划线：`user_manage`, `my_device`, `my_application`
2. **组件路径(component)** 使用连字符匹配实际文件夹：`view.user-manage`, `view.my-device`

## 修复步骤

### 方法一：使用批处理脚本（推荐）

1. 双击运行 `fix_database.bat`
2. 按任意键开始执行
3. 等待修复完成
4. 重启后端服务
5. 刷新浏览器测试

### 方法二：手动执行 SQL

1. 打开 MySQL 客户端或命令行
2. 连接到数据库：
   ```bash
   mysql -h localhost -P 3306 -u root -proot soybean_admin
   ```
3. 执行 SQL 文件：
   ```sql
   source EXECUTE_THIS_FIX.sql;
   ```
   或者直接复制 `EXECUTE_THIS_FIX.sql` 中的 SQL 语句执行

4. 重启后端服务
5. 刷新浏览器测试

## 验证修复

执行 SQL 后，应该看到类似以下的结果：

| 路由名称(下划线) | 路径 | 组件路径(连字符) |
|---|---|---|
| user_manage | /user-manage | layout.base$view.user-manage |
| user_manage_list | /user-manage/list | layout.base$view.user-manage_list |
| my_device | /my-device | layout.base$view.my-device |
| my_device_status | /my-device/status | layout.base$view.my-device_status |

## 重启服务

修复数据库后，必须重启后端服务：

```bash
cd backend
start.bat
```

## 测试

1. 清除浏览器缓存（Ctrl+Shift+Delete）
2. 强制刷新页面（Ctrl+Shift+R）
3. 重新登录
4. 检查菜单是否正常显示
5. 检查是否还有重复菜单
6. 检查父子菜单层级是否正确

## 如果还有问题

如果修复后仍有问题，请检查：

1. 后端日志中是否有错误信息
2. 浏览器控制台是否有错误
3. 数据库中的 component 字段是否已正确更新
4. 是否已重启后端服务
5. 是否已清除浏览器缓存

## 技术细节

### 路由名称规则（用于权限判断）
- 使用下划线分隔
- 父菜单：0-1个下划线（如 `user_manage`, `device`）
- 子菜单：2个或以上下划线（如 `user_manage_list`, `device_online`）

### 组件路径规则（用于加载 Vue 组件）
- 必须与实际文件夹结构完全一致
- 文件夹使用连字符：`user-manage`, `my-device`
- 子文件夹也使用连字符：`power-control`, `my-list`
- 格式：`layout.base$view.{folder}_{subfolder}`

### 示例对照表

| 路由名称 | 文件夹路径 | 组件路径 |
|---|---|---|
| user_manage | src/views/user-manage/ | layout.base$view.user-manage |
| user_manage_list | src/views/user-manage/list/ | layout.base$view.user-manage_list |
| my_device | src/views/my-device/ | layout.base$view.my-device |
| my_device_status | src/views/my-device/status/ | layout.base$view.my-device_status |
| my_device_power | src/views/my-device/power-control/ | layout.base$view.my-device_power-control |