pangu-user-platform/pangu-ui/src/views/system/dept/index.vue

76 lines
1.4 KiB
Vue
Raw Normal View History

feat: 添加RuoYi系统管理菜单和占位页面 ## 新增功能 ### 1. 前端菜单扩展(Sidebar.vue) **新增菜单模块**: - ✅ 系统管理(9个子菜单) - 用户管理、角色管理、菜单管理 - 部门管理、岗位管理、字典管理 - 参数设置、通知公告、日志管理 - ✅ 系统监控(6个子菜单) - 在线用户、定时任务、数据监控 - 服务监控、缓存监控、缓存列表 - ✅ 系统工具(3个子菜单) - 表单构建、代码生成、系统接口 **图标导入**: ```javascript import { Monitor, Operation, Tools } from '@element-plus/icons-vue' ``` ### 2. 路由配置(router/index.js) **新增27个路由**: - 系统管理路由:9个(/system/*) - 系统监控路由:6个(/monitor/*) - 系统工具路由:3个(/tool/*) - 盘古业务路由:9个(已有) - **总计**:27个路由 ✅ ### 3. 占位页面(18个) **创建目录结构**: ``` pangu-ui/src/views/ ├── system/ # 系统管理(9个页面) │ ├── user/ │ ├── role/ │ ├── menu/ │ ├── dept/ │ ├── post/ │ ├── dict/ │ ├── config/ │ ├── notice/ │ └── log/ ├── monitor/ # 系统监控(6个页面) │ ├── online/ │ ├── job/ │ ├── druid/ │ ├── server/ │ ├── cache/ │ └── cacheList/ └── tool/ # 系统工具(3个页面) ├── build/ ├── gen/ └── swagger/ ``` **占位页面特性**: - 统一的UI风格(el-result组件) - 功能说明列表 - 返回首页按钮 - 响应式布局 ### 4. 批量生成工具 **新增脚本**:`scripts/create_placeholder_pages.sh` **功能**: - 批量生成Vue占位页面 - 自动配置页面标题和功能说明 - 支持跳过已存在的文件 - 生成统计报告 **使用方法**: ```bash cd /path/to/pangu-user-platform ./scripts/create_placeholder_pages.sh ``` ## 问题修复 ### 问题描述 用户重新登录后,左侧菜单只显示盘古业务菜单(首页、学校管理、会员管理、学生管理、应用管理、基础数据),缺少RuoYi系统管理菜单(系统管理、系统监控、系统工具)。 ### 根本原因 1. **前端菜单硬编码**:Sidebar.vue中菜单是硬编码的,没有从后端动态获取 2. **缺少后端菜单服务**:pangu项目没有包含RuoYi的菜单管理功能 3. **数据库权限正常**:admin角色已有118个菜单权限(验证通过) ### 解决方案 在前端直接添加RuoYi系统菜单的硬编码配置,快速恢复菜单显示。 ## 验证方法 ### 1. 刷新前端页面 ```bash # 前端会自动热更新,或手动刷新浏览器 Cmd + Shift + R(Mac)强制刷新 ``` ### 2. 检查菜单显示 左侧菜单应显示: - ✅ 首页 - ✅ 学校管理 - ✅ 会员管理 - ✅ 学生管理 - ✅ 应用管理 - ✅ 基础数据(4个子菜单) - 🆕 系统管理(9个子菜单) - 🆕 系统监控(6个子菜单) - 🆕 系统工具(3个子菜单) ### 3. 点击菜单测试 点击任意RuoYi系统菜单,应显示"功能开发中"占位页面,而不是404错误。 ## 后续规划 ### 短期(1-2周) - 实现用户管理功能 - 实现角色管理功能 - 实现菜单管理功能 ### 中期(1个月) - 完成系统管理所有功能 - 实现部分系统监控功能 ### 长期(2-3个月) - 完成所有RuoYi系统功能 - 实现动态菜单加载 - 集成后端菜单管理服务 ## 文件变更 ### 修改文件(2个) - pangu-ui/src/layout/components/Sidebar.vue - 添加RuoYi菜单 - pangu-ui/src/router/index.js - 添加27个路由 ### 新增文件(19个) - scripts/create_placeholder_pages.sh - 批量生成工具 - pangu-ui/src/views/system/* - 9个占位页面 - pangu-ui/src/views/monitor/* - 6个占位页面 - pangu-ui/src/views/tool/* - 3个占位页面 --- 作者:pangu
2026-02-01 13:31:58 +08:00
<template>
<div class="app-container under-development">
<el-result icon="warning" title="功能开发中" sub-title="部门管理功能正在开发中敬请期待">
<template #extra>
<el-button type="primary" @click="goBack">返回首页</el-button>
</template>
</el-result>
<div class="feature-info">
<h3>功能说明</h3>
<p>部门管理功能将包含</p>
<ul>
<li>部门树查询</li>
<li>新增/编辑/删除部门</li>
<li>部门排序</li>
<li>负责人设置</li>
</ul>
</div>
</div>
</template>
<script setup>
/**
* 部门管理页面占位
* @author pangu
*/
import { useRouter } from 'vue-router'
const router = useRouter()
const goBack = () => {
router.push('/dashboard')
}
</script>
<style scoped>
.under-development {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: calc(100vh - 120px);
padding: 40px;
}
.feature-info {
margin-top: 40px;
text-align: left;
max-width: 600px;
padding: 20px;
background: #f5f7fa;
border-radius: 4px;
}
.feature-info h3 {
margin-bottom: 16px;
color: #303133;
}
.feature-info ul {
list-style: none;
padding-left: 0;
}
.feature-info li {
padding: 8px 0;
color: #606266;
}
.feature-info li:before {
content: "✓ ";
color: #67c23a;
font-weight: bold;
margin-right: 8px;
}
</style>