bot_pm
575b2138c1
#20 通用模块: - MinioService: MinIO 文件上传/下载/桶管理 - @DataScope 注解: 数据权限切片 - ExcelUtils: EasyExcel 导出 - IdUtils: Snowflake ID 生成器 - BaseEntity: MyBatis-Plus 基础实体 #23 前端框架: - Vue3 + TypeScript + Vite + Element Plus + ECharts + Pinia - 路由系统: 登录守卫 + 动态路由 - 登录页: 渐变背景 + Axios+Sa-Token 认证 - 仪表盘: 统计卡片 + 供水趋势折线图 + 片区饼图 - MainLayout: 侧边栏菜单 + 顶栏用户下拉(退出) - API 层: Axios 请求/响应拦截器 + Token 自动注入 - 系统管理骨架: 用户/角色/菜单/部门 列表页
54 lines
2.2 KiB
Vue
54 lines
2.2 KiB
Vue
<template>
|
|
<el-container style="height:100vh">
|
|
<el-aside width="220px" class="sidebar">
|
|
<div class="logo">💧 智慧水务</div>
|
|
<el-menu :default-active="route.path" router background-color="#304156" text-color="#bfcbd9" active-text-color="#409EFF">
|
|
<el-menu-item index="/dashboard"><el-icon><DataAnalysis /></el-icon>供水总览</el-menu-item>
|
|
<el-sub-menu index="system">
|
|
<template #title><el-icon><Setting /></el-icon>系统管理</template>
|
|
<el-menu-item index="/system/user">用户管理</el-menu-item>
|
|
<el-menu-item index="/system/role">角色管理</el-menu-item>
|
|
<el-menu-item index="/system/menu">菜单管理</el-menu-item>
|
|
<el-menu-item index="/system/dept">部门管理</el-menu-item>
|
|
</el-sub-menu>
|
|
</el-menu>
|
|
</el-aside>
|
|
<el-container>
|
|
<el-header class="topbar">
|
|
<span class="title">精河县供水工程综合管理平台</span>
|
|
<el-dropdown @command="handleCommand">
|
|
<span class="user">{{ userStore.realName || '管理员' }} <el-icon><ArrowDown /></el-icon></span>
|
|
<template #dropdown>
|
|
<el-dropdown-menu>
|
|
<el-dropdown-item>个人中心</el-dropdown-item>
|
|
<el-dropdown-item command="logout">退出登录</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</template>
|
|
</el-dropdown>
|
|
</el-header>
|
|
<el-main><router-view /></el-main>
|
|
</el-container>
|
|
</el-container>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
import { useUserStore } from '@/store/user'
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
const userStore = useUserStore()
|
|
|
|
function handleCommand(cmd: string) {
|
|
if (cmd === 'logout') { userStore.logout(); router.push('/login') }
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.sidebar { background:#304156; overflow-y:auto }
|
|
.logo { color:#fff; text-align:center; padding:16px; font-size:18px; font-weight:bold; border-bottom:1px solid rgba(255,255,255,.1) }
|
|
.topbar { background:#fff; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #e6e6e6 }
|
|
.title { font-size:16px; color:#333 }
|
|
.user { cursor:pointer; color:#666 }
|
|
</style>
|