lrj
昨天 f04f35b562760afbac0c477357e2a29f77aec3b9
web/src/layout/index.vue
@@ -3,7 +3,10 @@
    <!-- 顶部栏 -->
    <el-header class="layout-header">
      <div class="header-content">
        <span class="system-title">蓉易创管理系统</span>
        <div class="title-container">
          <img src="/logo.jpg" alt="蓉易创" class="logo-icon" />
          <span class="system-title">蓉易创比赛管理</span>
        </div>
        <el-dropdown @command="handleCommand">
          <span class="el-dropdown-link">
            {{ currentUserName }}
@@ -26,16 +29,17 @@
      <el-aside width="200px" class="layout-aside">
        <el-menu
          :default-active="$route.path"
          class="sidebar-menu"
          router
          background-color="#545c64"
          text-color="#fff"
          active-text-color="#ffd04b"
          background-color="transparent"
          text-color="#666666"
          active-text-color="#1E3A8A"
        >
        >
          <el-menu-item index="/dashboard">
            <el-icon><House /></el-icon>
            <span>工作台</span>
          </el-menu-item>
          <el-menu-item index="/activity">
            <el-icon><Calendar /></el-icon>
            <span>比赛信息</span>
@@ -86,14 +90,11 @@
import { computed } from 'vue'
import { useRouter } from 'vue-router'
import { House, Calendar, User, Document, UserFilled, Files, TrendCharts, Picture, Location, Avatar, ArrowDown } from '@element-plus/icons-vue'
import { clearAuth, getCurrentUserDisplayName } from '@/utils/auth'
const router = useRouter()
const userInfo = computed(() => ({
  name: '管理员'
}))
const currentUserName = computed(() => userInfo.value.name || '用户')
const currentUserName = computed(() => getCurrentUserDisplayName())
const handleCommand = (command: string) => {
  switch (command) {
@@ -101,7 +102,9 @@
      router.push('/profile')
      break
    case 'logout':
      localStorage.removeItem('token')
      // 清除所有认证数据
      clearAuth()
      // 跳转到登录页面
      router.push('/login')
      break
  }
@@ -117,11 +120,11 @@
/* 顶部栏样式 */
.layout-header {
  background-color: #B3C0D1;
  background-color: #FFFFFF;
  color: #333;
  line-height: 60px;
  padding: 0 20px;
  border-bottom: 1px solid #dcdfe6;
  border-bottom: 1px solid #E5E7EB;
}
.header-content {
@@ -131,8 +134,19 @@
  height: 100%;
}
.title-container {
  display: flex;
  align-items: center;
  gap: 8px;
}
.logo-icon {
  width: 48px;
  height: 48px;
}
.system-title {
  font-size: 18px;
  font-size: 20px;
  font-weight: bold;
  color: #333;
}
@@ -144,8 +158,9 @@
/* 侧边栏样式 */
.layout-aside {
  background-color: #545c64;
  background-color: #FFFFFF;
  height: 100%;
  border-right: 1px solid #E5E7EB;
}
.sidebar-menu {
@@ -153,9 +168,24 @@
  border-right: none;
}
/* 菜单项样式 */
.el-menu-item.is-active {
  background-color: #3B82F6 !important;
  color: #FFFFFF !important;
  border-radius: 6px;
  margin: 2px 8px;
}
.el-menu-item:hover {
  background-color: #EBF4FF !important;
  color: #1E3A8A !important;
  border-radius: 6px;
  margin: 2px 8px;
}
/* 主内容区域 */
.layout-main {
  background-color: #f5f5f5;
  background-color: #FFFFFF;
  padding: 20px;
}