118 lines
3.7 KiB
Markdown
118 lines
3.7 KiB
Markdown
# 首页修改说明
|
||
|
||
## 🎯 修改目标
|
||
|
||
将系统首页从原来的"首页"改为"文章病例库管理"，用户登录后直接进入文章病例库管理页面。
|
||
|
||
## 🔧 修改内容
|
||
|
||
### 1. 修改常量配置
|
||
|
||
#### `src/constants/system/home-const.js`
|
||
- **HOME_PAGE_NAME**: 从 `'Home'` 改为 `'CaseClinicalArticleList'`
|
||
- **HOME_PAGE_PATH**: 从 `'/home'` 改为 `'/case-clinical-article/list'`
|
||
|
||
#### `src/constants/common-const.js`
|
||
- **HOME_PAGE_PATH**: 从 `'/home'` 改为 `'/case-clinical-article/list'`
|
||
|
||
### 2. 修改路由配置
|
||
|
||
#### `src/router/system/home.js`
|
||
- **路径**: 从 `/home` 改为 `/case-clinical-article/list`
|
||
- **标题**: 从"首页"改为"文章病例库管理"
|
||
- **图标**: 从 `HomeOutlined` 改为 `FileTextOutlined`
|
||
- **组件**: 从首页组件改为文章病例库列表组件
|
||
|
||
#### 新增 `src/router/system/case-clinical-article.js`
|
||
- 创建完整的文章病例库管理路由配置
|
||
- 包含列表页和表单页两个子路由
|
||
|
||
#### `src/router/routers.js`
|
||
- 引入文章病例库管理路由配置
|
||
- 将新路由添加到主路由数组中
|
||
|
||
## 📁 文件结构
|
||
|
||
```
|
||
src/
|
||
├── constants/
|
||
│ ├── system/
|
||
│ │ └── home-const.js # 首页常量配置
|
||
│ └── common-const.js # 通用常量配置
|
||
├── router/
|
||
│ ├── system/
|
||
│ │ ├── home.js # 首页路由配置
|
||
│ │ └── case-clinical-article.js # 文章病例库路由配置
|
||
│ └── routers.js # 主路由配置
|
||
└── views/
|
||
└── business/
|
||
└── case-clinical-article/
|
||
├── case-clinical-article-list.vue # 列表页面
|
||
└── case-clinical-article-form.vue # 表单页面
|
||
```
|
||
|
||
## 🚀 使用方法
|
||
|
||
### 1. 用户登录后
|
||
- 系统自动跳转到 `/case-clinical-article/list`
|
||
- 显示文章病例库管理列表页面
|
||
|
||
### 2. 访问路径
|
||
- **首页**: `/case-clinical-article/list`
|
||
- **新增**: `/case-clinical-article/form?type=add`
|
||
- **编辑**: `/case-clinical-article/form?type=edit&id=xxx`
|
||
|
||
### 3. 菜单显示
|
||
- 主菜单显示"文章病例库管理"
|
||
- 子菜单显示"文章病例库列表"
|
||
- 表单页面在菜单中隐藏（hideInMenu: true）
|
||
|
||
## 🎨 界面变化
|
||
|
||
### 修改前
|
||
- 首页显示系统概览信息
|
||
- 图标：🏠 HomeOutlined
|
||
- 标题：首页
|
||
|
||
### 修改后
|
||
- 首页显示文章病例库管理列表
|
||
- 图标：📄 FileTextOutlined
|
||
- 标题：文章病例库管理
|
||
|
||
## ⚠️ 注意事项
|
||
|
||
1. **路由重定向**: 根路径 `/` 会自动重定向到文章病例库管理页面
|
||
2. **权限控制**: 确保用户有访问文章病例库管理的权限
|
||
3. **面包屑导航**: 面包屑会显示"文章病例库管理 > 文章病例库列表"
|
||
4. **页面缓存**: 如果启用了keepAlive，文章病例库列表页面会被缓存
|
||
|
||
## 🔍 验证方法
|
||
|
||
### 1. 登录测试
|
||
- 用户登录后应该直接进入文章病例库管理页面
|
||
- URL应该是 `/case-clinical-article/list`
|
||
|
||
### 2. 菜单测试
|
||
- 主菜单应该显示"文章病例库管理"
|
||
- 点击应该能正常跳转
|
||
|
||
### 3. 路由测试
|
||
- 访问根路径 `/` 应该重定向到文章病例库管理
|
||
- 直接访问 `/case-clinical-article/list` 应该正常显示
|
||
|
||
## 📝 后续优化
|
||
|
||
1. **添加首页统计**: 在文章病例库列表页面添加统计信息
|
||
2. **优化加载性能**: 考虑使用懒加载优化页面加载
|
||
3. **添加快捷操作**: 在首页添加常用的快捷操作按钮
|
||
4. **个性化配置**: 允许用户自定义首页显示内容
|
||
|
||
## ✅ 完成状态
|
||
|
||
- [x] 修改首页常量配置
|
||
- [x] 修改首页路由配置
|
||
- [x] 创建文章病例库路由配置
|
||
- [x] 更新主路由配置
|
||
- [x] 创建说明文档
|
||
|
||
**首页修改已完成！** 用户登录后将直接进入文章病例库管理页面。 |