From 3c19173c24295d043c6f9a36e6c6ee2c7dee1910 Mon Sep 17 00:00:00 2001
From: sladro <sladro@163.com>
Date: Tue, 16 Sep 2025 10:23:36 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96BigScreenPortrait?=
 =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E9=A1=B5=E9=9D=A2=E6=98=BE=E7=A4=BA=E5=92=8C?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=E5=AE=8C=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🔧 显示问题修复：
- 修复参与学生人数显示布局问题，优化number-gauge-combined容器
- 调整迷你仪表盘尺寸从60px到45px，适配紧凑布局
- 优化数字显示样式，使用clamp()确保响应式适配
- 完善ECharts仪表盘配置，简化为迷你版本显示

🎯 功能按钮完善：
- 实现"生成报告"和"历史记录"按钮完整功能
- 集成权限验证系统，需要教师权限才能访问
- 添加智能权限提示，未登录时引导用户登录
- 保持按钮原有美观样式，权限不足时仅显示小锁图标

🎨 界面文本优化：
- 清理Login.vue中的"演示"字样，改为"登录"
- 移除版权信息中的"演示版本"标识
- 优化组件中的演示相关文本，提升专业性

🚀 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 CLAUDE.md                           |   30 +-
 src/components/FileUpload.vue       |    2 +-
 src/components/SubmissionDialog.vue |    2 +-
 src/router/index.js                 |    6 +
 src/utils/mockData.js               |   39 +
 src/views/BigScreenPortrait.vue     | 2578 +++++++++++++++++++++++++++
 src/views/Login.vue                 |    6 +-
 7 files changed, 2657 insertions(+), 6 deletions(-)
 create mode 100644 src/views/BigScreenPortrait.vue

diff --git a/CLAUDE.md b/CLAUDE.md
index a77eaf1..be4053c 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -92,7 +92,35 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
   - 能力分析页面：六维雷达图、优劣势分析、发展建议
 - **侧边栏导航系统**：固定导航，角色权限适配，所有功能已连通
 
-### 最近更新（2025-01-15）
+### 最近更新（2025-01-16）
+
+#### 🔧 BigScreenPortrait大屏页面全面优化
+- **显示问题修复**：
+  - 修复参与学生人数显示布局问题，优化number-gauge-combined容器
+  - 调整迷你仪表盘尺寸从60px到45px，适配紧凑布局
+  - 优化数字显示样式，使用clamp()确保响应式适配
+  - 完善ECharts仪表盘配置，简化为迷你版本显示
+
+- **功能按钮完善**：
+  - 实现"生成报告"和"历史记录"按钮完整功能
+  - 集成权限验证系统，需要教师权限才能访问
+  - 添加智能权限提示，未登录时引导用户登录
+  - 保持按钮原有美观样式，权限不足时仅显示小锁图标
+
+- **用户体验优化**：
+  - 权限检查的通用方法checkPermissionAndNavigate
+  - 动态按钮状态和tooltip提示
+  - 友好的权限错误提示和登录引导流程
+  - 响应式布局适配，支持多种屏幕尺寸
+
+#### 🎨 界面清理和文本优化
+- **去除演示标识**：
+  - 清理Login.vue中的"演示"字样，改为"登录"
+  - 移除版权信息中的"演示版本"标识
+  - 优化SubmissionDialog和FileUpload组件中的演示相关文本
+  - 统一界面文本，提升专业性
+
+### 历史更新（2025-01-15）
 
 #### 🎯 学生画像系统完成
 - **ECharts图表组件**：
diff --git a/src/components/FileUpload.vue b/src/components/FileUpload.vue
index 87d9f9c..f47bade 100644
--- a/src/components/FileUpload.vue
+++ b/src/components/FileUpload.vue
@@ -334,7 +334,7 @@ export default {
       const typeMap = {
         pdf: 'PDF文档',
         doc: 'Word文档', docx: 'Word文档',
-        ppt: 'PPT演示文稿', pptx: 'PPT演示文稿',
+        ppt: 'PPT文稿', pptx: 'PPT文稿',
         xls: 'Excel表格', xlsx: 'Excel表格',
         jpg: 'JPEG图片', jpeg: 'JPEG图片',
         png: 'PNG图片', gif: 'GIF图片',
diff --git a/src/components/SubmissionDialog.vue b/src/components/SubmissionDialog.vue
index bcd9f7d..273781c 100644
--- a/src/components/SubmissionDialog.vue
+++ b/src/components/SubmissionDialog.vue
@@ -124,7 +124,7 @@
             <div class="link-input">
               <el-input
                 v-model="linkInput.demo"
-                placeholder="演示链接（可选）"
+                placeholder="项目链接（可选）"
                 prefix-icon="Link"
               />
             </div>
diff --git a/src/router/index.js b/src/router/index.js
index 6432e87..c704521 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -7,6 +7,12 @@ const routes = [
     name: 'Login',
     component: () => import('@/views/Login.vue')
   },
+  {
+    path: '/big-screen-portrait',
+    name: 'BigScreenPortrait',
+    component: () => import('@/views/BigScreenPortrait.vue'),
+    meta: { layout: 'fullscreen' }
+  },
   {
     path: '/home',
     name: 'Home',
diff --git a/src/utils/mockData.js b/src/utils/mockData.js
index fb966b4..a6e5674 100644
--- a/src/utils/mockData.js
+++ b/src/utils/mockData.js
@@ -406,6 +406,45 @@ export const mockPortraitData = {
   }
 }
 
+// 大屏专用数据
+export const bigScreenData = {
+  // 成绩分布数据
+  gradeDistribution: [
+    { grade: '优秀(90-100)', count: 23, color: '#10b981' },
+    { grade: '良好(80-89)', count: 45, color: '#3b82f6' },
+    { grade: '中等(70-79)', count: 62, color: '#f59e0b' },
+    { grade: '及格(60-69)', count: 21, color: '#ef4444' },
+    { grade: '不及格(0-59)', count: 5, color: '#6b7280' }
+  ],
+  
+  // 能力矩阵数据（三角形雷达图）
+  abilityMatrix: {
+    dimensions: ['专业基础', '专业综合', '数智应用'],
+    students: [
+      { name: '张志明', values: [85, 92, 78], color: '#06b6d4' },
+      { name: '李梦瑶', values: [90, 88, 95], color: '#3b82f6' },
+      { name: '王浩然', values: [82, 85, 88], color: '#10b981' }
+    ]
+  },
+  
+  // 实习统计数据
+  practiceStats: [
+    { label: '实习课程数', value: 24, icon: 'Reading', trend: '+5%' },
+    { label: '专业数', value: 8, icon: 'OfficeBuilding', trend: '+2' },
+    { label: '实习人数', value: 156, icon: 'User', trend: '+12%' },
+    { label: '辅导老师数', value: 32, icon: 'UserFilled', trend: '+8%' },
+    { label: '实习企业数', value: 18, icon: 'School', trend: '+3' }
+  ],
+  
+  // 实时数据更新
+  realTimeData: {
+    studentCount: 156,
+    evaluationCount: 1247,
+    completionRate: 87.5,
+    averageScore: 82.3
+  }
+}
+
 // Mock图表数据生成器
 export const generateChartData = () => {
   return {
diff --git a/src/views/BigScreenPortrait.vue b/src/views/BigScreenPortrait.vue
new file mode 100644
index 0000000..6285996
--- /dev/null
+++ b/src/views/BigScreenPortrait.vue
@@ -0,0 +1,2578 @@
+<template>
+  <div class="big-screen-container">
+    <!-- 背景动画效果 -->
+    <div class="background-animation">
+      <div class="particle-network"></div>
+    </div>
+    
+    <!-- 主标题区域 -->
+    <div class="header-section">
+      <h1 class="main-title">学生能力评价画像系统</h1>
+      <div class="subtitle">STUDENT CAPABILITY EVALUATION PORTRAIT</div>
+      <div class="current-time">{{ currentTime }}</div>
+    </div>
+
+    <!-- 主要内容区域 -->
+    <div class="main-content">
+      <!-- 左侧区域 -->
+      <div class="left-section">
+        <!-- 成绩分布 -->
+        <div class="module-container grade-distribution">
+          <div class="module-header">
+            <el-icon><TrendCharts /></el-icon>
+            <span>成绩分布</span>
+          </div>
+          <div ref="gradeChart" class="chart-container"></div>
+        </div>
+        
+        <!-- 能力矩阵三角形 -->
+        <div class="module-container ability-matrix">
+          <div class="module-header">
+            <el-icon><Grid /></el-icon>
+            <span>能力矩阵</span>
+          </div>
+          <div ref="abilityChart" class="chart-container"></div>
+        </div>
+      </div>
+
+      <!-- 中间区域 -->
+      <div class="center-section">
+        <!-- 核心指标展示区 -->
+        <div class="module-container core-metrics">
+          <div class="metrics-layout">
+            <!-- 左侧大区域 - 学生人数和仪表盘 -->
+            <div class="metric-main-area">
+              <div class="main-metric-header">
+                <el-icon><UserFilled /></el-icon>
+                <span>参与实习学生人数</span>
+                <div class="real-time-indicator">
+                  <div class="pulse-dot"></div>
+                  <span>实时</span>
+                </div>
+              </div>
+              <div class="main-metric-content ultra-compact">
+                <div class="metric-integrated-display">
+                  <div class="number-gauge-combined">
+                    <div class="number-display-section">
+                      <div class="big-number">{{ studentCount }}</div>
+                      <div class="number-unit">人</div>
+                    </div>
+                    <div ref="gaugeChart" class="gauge-mini"></div>
+                  </div>
+                  <div class="stats-grid-compact">
+                    <div class="stat-pill">
+                      <span class="stat-icon">📈</span>
+                      <div class="stat-data">
+                        <span class="stat-value positive">+12%</span>
+                        <span class="stat-label">较上月</span>
+                      </div>
+                    </div>
+                    <div class="stat-pill">
+                      <span class="stat-icon">👥</span>
+                      <div class="stat-data">
+                        <span class="stat-value">+18人</span>
+                        <span class="stat-label">新增</span>
+                      </div>
+                    </div>
+                    <div class="stat-pill">
+                      <span class="stat-icon">🎯</span>
+                      <div class="stat-data">
+                        <span class="stat-value">92%</span>
+                        <span class="stat-label">活跃率</span>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            
+            <!-- 右侧指标墙 - 自适应显示 -->
+            <div class="metrics-wall">
+              <div class="wall-grid adaptive">
+                <!-- 完成率卡片 -->
+                <div class="wall-card completion-rate compact">
+                  <div class="wall-icon">
+                    <el-icon><TrendCharts /></el-icon>
+                  </div>
+                  <div class="wall-content">
+                    <div class="wall-number">87.5%</div>
+                    <div class="wall-label">完成率</div>
+                    <div class="wall-trend positive">↗ +5.2%</div>
+                  </div>
+                  <div class="wall-progress mini">
+                    <div class="progress-ring">
+                      <div class="progress-fill" style="--progress: 87.5%"></div>
+                    </div>
+                  </div>
+                </div>
+                
+                <!-- 平均评分卡片 -->
+                <div class="wall-card average-score compact">
+                  <div class="wall-icon">
+                    <el-icon><StarFilled /></el-icon>
+                  </div>
+                  <div class="wall-content">
+                    <div class="wall-number">82.3</div>
+                    <div class="wall-label">评分</div>
+                    <div class="wall-trend positive">↗ +2.1%</div>
+                  </div>
+                  <div class="wall-rating mini">
+                    <div class="stars">★★★★☆</div>
+                  </div>
+                </div>
+                
+                <!-- 活跃课程数 -->
+                <div class="wall-card active-courses compact">
+                  <div class="wall-icon">
+                    <el-icon><Reading /></el-icon>
+                  </div>
+                  <div class="wall-content">
+                    <div class="wall-number">24</div>
+                    <div class="wall-label">课程</div>
+                    <div class="wall-trend positive">↗ +8%</div>
+                  </div>
+                </div>
+                
+                <!-- 教师参与度 -->
+                <div class="wall-card teacher-participation compact">
+                  <div class="wall-icon">
+                    <el-icon><UserFilled /></el-icon>
+                  </div>
+                  <div class="wall-content">
+                    <div class="wall-number">32</div>
+                    <div class="wall-label">教师</div>
+                    <div class="wall-trend positive">↗ +6%</div>
+                  </div>
+                </div>
+                
+                <!-- 企业合作数 -->
+                <div class="wall-card enterprise-cooperation compact">
+                  <div class="wall-icon">
+                    <el-icon><OfficeBuilding /></el-icon>
+                  </div>
+                  <div class="wall-content">
+                    <div class="wall-number">18</div>
+                    <div class="wall-label">企业</div>
+                    <div class="wall-trend positive">↗ +12%</div>
+                  </div>
+                </div>
+                
+                <!-- 评价总数 -->
+                <div class="wall-card total-evaluations compact">
+                  <div class="wall-icon">
+                    <el-icon><DocumentChecked /></el-icon>
+                  </div>
+                  <div class="wall-content">
+                    <div class="wall-number">1,247</div>
+                    <div class="wall-label">评价</div>
+                    <div class="wall-trend positive">↗ +15%</div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        
+        <!-- 详细数据统计 -->
+        <div class="module-container detailed-stats">
+          <div class="module-header">
+            <el-icon><DataAnalysis /></el-icon>
+            <span>实习数据统计</span>
+            <div class="header-extra">
+              <span class="update-time">实时更新</span>
+              <div class="status-indicator"></div>
+            </div>
+          </div>
+          <div class="stats-overview">
+            <div class="overview-item">
+              <div class="overview-icon">
+                <el-icon><Reading /></el-icon>
+              </div>
+              <div class="overview-content">
+                <div class="overview-number">24</div>
+                <div class="overview-label">实习课程</div>
+                <div class="overview-trend">
+                  <span class="trend-value">+5%</span>
+                  <el-icon><Top /></el-icon>
+                </div>
+              </div>
+            </div>
+            <div class="overview-item">
+              <div class="overview-icon">
+                <el-icon><OfficeBuilding /></el-icon>
+              </div>
+              <div class="overview-content">
+                <div class="overview-number">8</div>
+                <div class="overview-label">专业覆盖</div>
+                <div class="overview-trend">
+                  <span class="trend-value">+2</span>
+                  <el-icon><Top /></el-icon>
+                </div>
+              </div>
+            </div>
+            <div class="overview-item">
+              <div class="overview-icon">
+                <el-icon><UserFilled /></el-icon>
+              </div>
+              <div class="overview-content">
+                <div class="overview-number">32</div>
+                <div class="overview-label">辅导老师</div>
+                <div class="overview-trend">
+                  <span class="trend-value">+8%</span>
+                  <el-icon><Top /></el-icon>
+                </div>
+              </div>
+            </div>
+            <div class="overview-item">
+              <div class="overview-icon">
+                <el-icon><School /></el-icon>
+              </div>
+              <div class="overview-content">
+                <div class="overview-number">18</div>
+                <div class="overview-label">合作企业</div>
+                <div class="overview-trend">
+                  <span class="trend-value">+3</span>
+                  <el-icon><Top /></el-icon>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="stats-chart">
+            <div ref="trendChart" class="trend-container"></div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 右侧区域 -->
+      <div class="right-section">
+        <!-- 学生名单 -->
+        <div class="module-container student-list">
+          <div class="module-header ultra-compact">
+            <el-icon><List /></el-icon>
+            <span>学生名单</span>
+            <div class="header-counter">共{{ studentList.length }}人</div>
+          </div>
+          <div class="student-table-enhanced">
+            <div class="table-header-enhanced">
+              <span>姓名</span>
+              <span>学号</span>
+              <span>状态</span>
+              <span>操作</span>
+            </div>
+            <div class="table-body-enhanced">
+              <div class="table-row-enhanced" v-for="student in studentList" :key="student.id">
+                <div class="student-info">
+                  <div class="student-avatar">{{ student.name.charAt(0) }}</div>
+                  <span class="student-name">{{ student.name }}</span>
+                </div>
+                <span class="student-id">{{ student.studentId }}</span>
+                <div class="student-status">
+                  <span class="status-badge completed">已完成</span>
+                  <span class="grade-indicator">{{ student.grade }}</span>
+                </div>
+                <div class="action-group">
+                  <button class="action-btn primary" @click="viewReport(student.id)">
+                    <el-icon><Document /></el-icon>
+                  </button>
+                  <button class="action-btn secondary">
+                    <el-icon><View /></el-icon>
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        
+        <!-- 多维度检测 -->
+        <div class="module-container multi-dimension">
+          <div class="module-header ultra-compact">
+            <el-icon><Monitor /></el-icon>
+            <span>智能分析</span>
+            <div class="analysis-status">
+              <div class="status-dot active"></div>
+              <span>就绪</span>
+            </div>
+          </div>
+          <div class="analysis-grid">
+            <div class="analysis-card" @click="analyzeDimension('image')">
+              <div class="card-icon image">
+                <el-icon><Picture /></el-icon>
+              </div>
+              <div class="card-content">
+                <span class="card-title">影像</span>
+                <span class="card-subtitle">AI视觉分析</span>
+              </div>
+              <div class="card-indicator">
+                <div class="progress-ring small">
+                  <div class="progress-fill" style="--progress: 85%"></div>
+                </div>
+              </div>
+            </div>
+            <div class="analysis-card" @click="analyzeDimension('audio')">
+              <div class="card-icon audio">
+                <el-icon><Microphone /></el-icon>
+              </div>
+              <div class="card-content">
+                <span class="card-title">音频</span>
+                <span class="card-subtitle">语音识别</span>
+              </div>
+              <div class="card-indicator">
+                <div class="progress-ring small">
+                  <div class="progress-fill" style="--progress: 72%"></div>
+                </div>
+              </div>
+            </div>
+            <div class="analysis-card" @click="analyzeDimension('text')">
+              <div class="card-icon text">
+                <el-icon><Edit /></el-icon>
+              </div>
+              <div class="card-content">
+                <span class="card-title">文本</span>
+                <span class="card-subtitle">NLP分析</span>
+              </div>
+              <div class="card-indicator">
+                <div class="progress-ring small">
+                  <div class="progress-fill" style="--progress: 94%"></div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <!-- 底部操作按钮 -->
+          <div class="action-buttons-enhanced">
+            <button
+              class="action-btn-large primary"
+              :class="{ 'requires-auth': !authStore.isLoggedIn || authStore.user?.role !== 'teacher' }"
+              @click="generateReport"
+              :title="!authStore.isLoggedIn ? '需要登录教师账号' : authStore.user?.role !== 'teacher' ? '需要教师权限' : '生成学生评价报告'"
+            >
+              <el-icon><DocumentAdd /></el-icon>
+              <span>生成报告</span>
+            </button>
+            <button
+              class="action-btn-large secondary"
+              :class="{ 'requires-auth': !authStore.isLoggedIn || authStore.user?.role !== 'teacher' }"
+              @click="viewHistory"
+              :title="!authStore.isLoggedIn ? '需要登录教师账号' : authStore.user?.role !== 'teacher' ? '需要教师权限' : '查看历史评价记录'"
+            >
+              <el-icon><Clock /></el-icon>
+              <span>历史记录</span>
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { ref, onMounted, onUnmounted, reactive } from 'vue'
+import * as echarts from 'echarts'
+import { useRouter } from 'vue-router'
+import { ElMessage } from 'element-plus'
+import { useAuthStore } from '@/stores/auth'
+import { mockStudents, mockPortraitData, generateChartData, generateStatsData, bigScreenData } from '@/utils/mockData'
+
+export default {
+  name: 'BigScreenPortrait',
+  setup() {
+    const router = useRouter()
+    const authStore = useAuthStore()
+    const currentTime = ref('')
+    const studentCount = ref(156)
+    const studentList = ref([])
+    const practiceStats = ref([])
+    
+    // 图表实例
+    const gradeChart = ref(null)
+    const abilityChart = ref(null)
+    const gaugeChart = ref(null)
+    const trendChart = ref(null)
+    
+    let chartInstances = []
+    let timer = null
+    
+    // 初始化数据
+    const initData = () => {
+      studentList.value = mockStudents.slice(0, 8)
+      practiceStats.value = bigScreenData.practiceStats
+      studentCount.value = bigScreenData.realTimeData.studentCount
+      // 检查登录状态
+      authStore.checkAuth()
+    }
+
+    // 权限检查和导航的通用方法
+    const checkPermissionAndNavigate = (targetPath, requiredRole = null) => {
+      if (!authStore.isLoggedIn) {
+        ElMessage.warning('请先登录以使用此功能')
+        router.push('/')
+        return false
+      }
+
+      if (requiredRole && authStore.user?.role !== requiredRole) {
+        ElMessage.warning('权限不足，需要教师账号才能访问此功能')
+        return false
+      }
+
+      router.push(targetPath)
+      return true
+    }
+    
+    // 更新时间
+    const updateTime = () => {
+      const now = new Date()
+      currentTime.value = now.toLocaleString('zh-CN', {
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit'
+      })
+    }
+    
+    // 初始化成绩分布图表
+    const initGradeChart = () => {
+      const chart = echarts.init(gradeChart.value)
+      const data = bigScreenData.gradeDistribution
+      
+      const option = {
+        backgroundColor: 'transparent',
+        grid: {
+          left: '10%',
+          right: '10%',
+          top: '15%',
+          bottom: '15%'
+        },
+        xAxis: {
+          type: 'category',
+          data: data.map(item => item.grade),
+          axisLine: {
+            lineStyle: { color: '#3b82f6' }
+          },
+          axisLabel: {
+            color: '#e2e8f0',
+            fontSize: 12,
+            rotate: 45
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            lineStyle: { color: '#3b82f6' }
+          },
+          axisLabel: {
+            color: '#e2e8f0',
+            fontSize: 12
+          },
+          splitLine: {
+            lineStyle: { color: 'rgba(59, 130, 246, 0.2)' }
+          }
+        },
+        series: [{
+          data: data.map((item, index) => ({
+            value: item.count,
+            itemStyle: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                { offset: 0, color: item.color },
+                { offset: 1, color: `${item.color}80` }
+              ]),
+              borderRadius: [4, 4, 0, 0]
+            }
+          })),
+          type: 'bar',
+          barWidth: '50%',
+          label: {
+            show: true,
+            position: 'top',
+            color: '#e2e8f0',
+            fontSize: 14,
+            fontWeight: 'bold',
+            formatter: '{c}人'
+          },
+          animationDuration: 2000,
+          animationEasing: 'elasticOut'
+        }]
+      }
+      
+      chart.setOption(option)
+      chartInstances.push(chart)
+    }
+    
+    // 初始化能力矩阵图表
+    const initAbilityChart = () => {
+      const chart = echarts.init(abilityChart.value)
+      const abilityData = bigScreenData.abilityMatrix
+      
+      const option = {
+        backgroundColor: 'transparent',
+        radar: {
+          indicator: abilityData.dimensions.map(dim => ({
+            name: dim,
+            max: 100
+          })),
+          center: ['50%', '50%'],
+          radius: '70%',
+          axisName: {
+            color: '#e2e8f0',
+            fontSize: 14,
+            fontWeight: 'bold',
+            backgroundColor: 'rgba(30, 58, 138, 0.8)',
+            borderRadius: 4,
+            padding: [4, 8]
+          },
+          splitLine: {
+            lineStyle: { 
+              color: 'rgba(59, 130, 246, 0.3)',
+              width: 2
+            }
+          },
+          splitArea: {
+            areaStyle: {
+              color: [
+                'rgba(6, 182, 212, 0.1)',
+                'rgba(6, 182, 212, 0.2)',
+                'rgba(59, 130, 246, 0.1)',
+                'rgba(59, 130, 246, 0.2)'
+              ]
+            }
+          },
+          axisLine: {
+            lineStyle: {
+              color: 'rgba(59, 130, 246, 0.5)',
+              width: 2
+            }
+          }
+        },
+        series: [{
+          type: 'radar',
+          data: abilityData.students.map((student, index) => ({
+            value: student.values,
+            name: student.name,
+            areaStyle: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                { offset: 0, color: `${student.color}80` },
+                { offset: 1, color: `${student.color}20` }
+              ])
+            },
+            lineStyle: {
+              color: student.color,
+              width: 3,
+              shadowBlur: 10,
+              shadowColor: student.color
+            },
+            symbol: 'circle',
+            symbolSize: 10,
+            itemStyle: {
+              color: student.color,
+              borderColor: '#fff',
+              borderWidth: 2,
+              shadowBlur: 10,
+              shadowColor: student.color
+            }
+          })),
+          animationDuration: 2000,
+          animationEasing: 'elasticOut'
+        }],
+        legend: {
+          data: abilityData.students.map(s => s.name),
+          textStyle: {
+            color: '#e2e8f0',
+            fontSize: 12
+          },
+          bottom: 10,
+          itemWidth: 20,
+          itemHeight: 10
+        }
+      }
+      
+      chart.setOption(option)
+      chartInstances.push(chart)
+    }
+    
+    // 初始化仪表盘图表（迷你版）
+    const initGaugeChart = () => {
+      const chart = echarts.init(gaugeChart.value)
+
+      const option = {
+        backgroundColor: 'transparent',
+        series: [{
+          type: 'gauge',
+          startAngle: 200,
+          endAngle: -20,
+          center: ['50%', '60%'],
+          radius: '85%',
+          min: 0,
+          max: 200,
+          splitNumber: 2,
+          itemStyle: {
+            color: '#06b6d4'
+          },
+          progress: {
+            show: true,
+            width: 8,
+            roundCap: true,
+            itemStyle: {
+              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+                { offset: 0, color: '#06b6d4' },
+                { offset: 1, color: '#3b82f6' }
+              ])
+            }
+          },
+          pointer: {
+            show: false
+          },
+          axisLine: {
+            lineStyle: {
+              width: 8,
+              color: [[1, 'rgba(59, 130, 246, 0.15)']]
+            }
+          },
+          axisTick: {
+            show: false
+          },
+          splitLine: {
+            show: false
+          },
+          axisLabel: {
+            show: false
+          },
+          detail: {
+            show: false
+          },
+          data: [{
+            value: studentCount.value,
+            name: ''
+          }],
+          animationDuration: 2000
+        }]
+      }
+
+      chart.setOption(option)
+      chartInstances.push(chart)
+    }
+    
+    // 初始化趋势图表
+    const initTrendChart = () => {
+      const chart = echarts.init(trendChart.value)
+      
+      const option = {
+        backgroundColor: 'transparent',
+        grid: {
+          left: '5%',
+          right: '5%',
+          top: '10%',
+          bottom: '15%'
+        },
+        xAxis: {
+          type: 'category',
+          data: ['1月', '2月', '3月', '4月', '5月', '6月'],
+          axisLine: { show: false },
+          axisTick: { show: false },
+          axisLabel: {
+            color: '#94a3b8',
+            fontSize: 10
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: { show: false },
+          axisTick: { show: false },
+          axisLabel: { show: false },
+          splitLine: { show: false }
+        },
+        series: [{
+          data: [120, 132, 145, 134, 156, 165],
+          type: 'line',
+          smooth: true,
+          lineStyle: {
+            color: '#06b6d4',
+            width: 3,
+            shadowBlur: 10,
+            shadowColor: '#06b6d4'
+          },
+          areaStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              { offset: 0, color: 'rgba(6, 182, 212, 0.3)' },
+              { offset: 1, color: 'rgba(6, 182, 212, 0.05)' }
+            ])
+          },
+          symbol: 'circle',
+          symbolSize: 6,
+          itemStyle: {
+            color: '#06b6d4',
+            borderColor: '#fff',
+            borderWidth: 2
+          },
+          animationDuration: 2000
+        }]
+      }
+      
+      chart.setOption(option)
+      chartInstances.push(chart)
+    }
+    
+    // 查看报告
+    const viewReport = (studentId) => {
+      router.push(`/report/${studentId}`)
+    }
+    
+    // 多维度分析
+    const analyzeDimension = (type) => {
+      ElMessage.success(`正在分析${type === 'image' ? '影像' : type === 'audio' ? '音频' : '文本'}数据...`)
+    }
+    
+    // 生成报告 - 跳转到报告中心
+    const generateReport = () => {
+      checkPermissionAndNavigate('/home/reports', 'teacher')
+    }
+    
+    // 查看历史记录 - 跳转到报告中心
+    const viewHistory = () => {
+      checkPermissionAndNavigate('/home/reports', 'teacher')
+    }
+    
+    // 窗口大小调整处理
+    const handleResize = () => {
+      chartInstances.forEach(chart => {
+        chart.resize()
+      })
+    }
+    
+    // 初始化
+    onMounted(() => {
+      initData()
+      updateTime()
+      timer = setInterval(updateTime, 1000)
+      
+      setTimeout(() => {
+        initGradeChart()
+        initAbilityChart()
+        initGaugeChart()
+        initTrendChart()
+      }, 100)
+      
+      window.addEventListener('resize', handleResize)
+    })
+    
+    // 清理
+    onUnmounted(() => {
+      if (timer) clearInterval(timer)
+      window.removeEventListener('resize', handleResize)
+      chartInstances.forEach(chart => {
+        chart.dispose()
+      })
+    })
+    
+    return {
+      currentTime,
+      studentCount,
+      studentList,
+      practiceStats,
+      gradeChart,
+      abilityChart,
+      gaugeChart,
+      trendChart,
+      authStore,
+      viewReport,
+      analyzeDimension,
+      generateReport,
+      viewHistory
+    }
+  }
+}
+</script>
+
+<style scoped>
+.big-screen-container {
+  width: 100vw;
+  height: 100vh;
+  background: linear-gradient(135deg, #0a1027 0%, #1e3a8a 50%, #1e40af 100%);
+  position: relative;
+  overflow: hidden;
+  font-family: 'Arial', sans-serif;
+}
+
+/* 背景动画效果 */
+.background-animation {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+}
+
+.particle-network {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-image: 
+    radial-gradient(circle at 20% 80%, rgba(59, 130, 246, 0.1) 0%, transparent 50%),
+    radial-gradient(circle at 80% 20%, rgba(6, 182, 212, 0.1) 0%, transparent 50%),
+    radial-gradient(circle at 40% 40%, rgba(16, 185, 129, 0.05) 0%, transparent 50%);
+  animation: particleFloat 20s ease-in-out infinite;
+}
+
+@keyframes particleFloat {
+  0%, 100% { transform: translateY(0px) rotate(0deg); }
+  50% { transform: translateY(-20px) rotate(180deg); }
+}
+
+/* 标题区域 */
+.header-section {
+  position: relative;
+  z-index: 10;
+  text-align: center;
+  padding: 12px 0;
+  background: var(--primary-alpha-heavy);
+  backdrop-filter: var(--glass-blur);
+  border-bottom: 1px solid rgba(59, 130, 246, 0.3);
+}
+
+.main-title {
+  font-size: 36px;
+  font-weight: bold;
+  color: #e2e8f0;
+  margin: 0;
+  text-shadow: 0 0 15px rgba(59, 130, 246, 0.6);
+  background: linear-gradient(45deg, var(--secondary), var(--primary-light), var(--purple));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+
+.subtitle {
+  font-size: 14px;
+  color: var(--gray-light);
+  margin: 6px 0;
+  letter-spacing: 0.5px;
+}
+
+.current-time {
+  position: absolute;
+  right: 20px;
+  top: 50%;
+  transform: translateY(-50%);
+  font-size: 12px;
+  color: #e2e8f0;
+  background: var(--primary-alpha-heavy);
+  padding: 4px 10px;
+  border-radius: var(--radius-xl);
+  border: 1px solid rgba(59, 130, 246, 0.25);
+}
+
+/* 主内容区域 - 优化间距和布局 */
+.main-content {
+  display: grid;
+  grid-template-columns: 1fr 1.3fr 0.9fr;
+  gap: 10px;
+  padding: 10px;
+  height: calc(100vh - 100px);
+  position: relative;
+  z-index: 5;
+}
+
+/* 模块容器 - 减少内边距 */
+.module-container {
+  background: rgba(30, 58, 138, 0.15);
+  border: 1px solid rgba(59, 130, 246, 0.3);
+  border-radius: var(--radius-md);
+  padding: 12px;
+  backdrop-filter: blur(10px);
+  box-shadow: var(--shadow-md);
+  position: relative;
+  overflow: hidden;
+}
+
+.module-container::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, transparent 50%);
+  pointer-events: none;
+}
+
+.module-container.compact {
+  padding: 10px;
+  border-radius: var(--radius-sm);
+}
+
+.module-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 12px;
+  color: #e2e8f0;
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.module-header .el-icon {
+  font-size: 18px;
+  color: var(--secondary);
+}
+
+/* 图表容器 */
+.chart-container {
+  width: 100%;
+  height: 250px;
+  position: relative;
+  z-index: 1;
+}
+
+.gauge-container {
+  width: 100%;
+  height: 200px;
+  position: relative;
+  z-index: 1;
+}
+
+.gauge-container.compact {
+  height: 120px;
+}
+
+/* 左侧区域 - 紧凑布局 */
+.left-section {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.grade-distribution {
+  flex: 1;
+}
+
+.ability-matrix {
+  flex: 1;
+}
+
+/* 中间区域 - 紧凑布局 */
+.center-section {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+/* SOTA标准优化样式 */
+
+/* 超紧凑布局 */
+.main-metric-content.ultra-compact {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  height: 100%;
+  justify-content: space-between;
+}
+
+.metric-integrated-display {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  height: 100%;
+}
+
+.number-gauge-combined {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  background: var(--primary-alpha-medium);
+  border-radius: var(--radius-md);
+  padding: 10px 15px;
+  border: 1px solid rgba(59, 130, 246, 0.2);
+  min-height: 70px;
+}
+
+.number-display-section {
+  display: flex;
+  align-items: baseline;
+  gap: 6px;
+  flex: 1;
+}
+
+.gauge-mini {
+  width: 45px;
+  height: 45px;
+  position: relative;
+  flex-shrink: 0;
+}
+
+.stats-grid-compact {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 4px;
+  flex: 1;
+}
+
+.stat-pill {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  background: var(--primary-alpha-heavy);
+  border: 1px solid rgba(59, 130, 246, 0.25);
+  border-radius: var(--radius-lg);
+  padding: 6px 10px;
+  transition: var(--transition);
+}
+
+.stat-pill:hover {
+  background: var(--primary-alpha-heavy);
+  border-color: rgba(59, 130, 246, 0.4);
+  transform: translateX(2px);
+}
+
+.stat-icon {
+  font-size: 12px;
+  opacity: 0.9;
+}
+
+.stat-data {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+
+.stat-data .stat-value {
+  font-size: 12px;
+  font-weight: 600;
+  color: #e2e8f0;
+}
+
+.stat-data .stat-label {
+  font-size: 9px;
+  color: #94a3b8;
+  opacity: 0.8;
+}
+
+/* 核心指标展示区 */
+.core-metrics {
+  flex: 1;
+}
+
+.metrics-layout {
+  display: grid;
+  grid-template-columns: 1.4fr 1fr;
+  gap: 12px;
+  height: 100%;
+}
+
+.metric-main-area {
+  background: rgba(30, 58, 138, 0.2);
+  border: 1px solid rgba(59, 130, 246, 0.3);
+  border-radius: var(--radius-md);
+  padding: 15px;
+  position: relative;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  transition: var(--transition);
+}
+
+.metric-main-area::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, transparent 50%);
+  pointer-events: none;
+}
+
+.metric-main-area:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 12px 40px rgba(59, 130, 246, 0.2);
+}
+
+.main-metric-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 12px;
+  position: relative;
+  z-index: 1;
+}
+
+.main-metric-header .el-icon {
+  font-size: 20px;
+  color: #06b6d4;
+}
+
+.main-metric-header span {
+  font-size: 16px;
+  color: #e2e8f0;
+  font-weight: 500;
+}
+
+.real-time-indicator {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  margin-left: auto;
+  font-size: 10px;
+  color: var(--success);
+  background: var(--success-alpha-medium);
+  padding: 3px 6px;
+  border-radius: var(--radius-lg);
+  border: 1px solid rgba(16, 185, 129, 0.25);
+}
+
+.pulse-dot {
+  width: 5px;
+  height: 5px;
+  background: var(--success);
+  border-radius: 50%;
+  animation: pulse 1.5s infinite;
+}
+
+.main-metric-content {
+  display: flex;
+  gap: 12px;
+  flex: 1;
+  align-items: center;
+  position: relative;
+  z-index: 1;
+}
+
+.main-metric-content.compact {
+  gap: 10px;
+  align-items: center;
+}
+
+.main-metric-content.compact .metric-number-section {
+  flex: 0 0 auto;
+}
+
+.main-metric-content.compact .metric-chart-section {
+  flex: 1;
+  min-width: 0;
+}
+
+.metric-number-section {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  justify-content: center;
+}
+
+.number-display {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+}
+
+.big-number {
+  font-size: clamp(28px, 2.8vw, 36px);
+  font-weight: 700;
+  color: #e2e8f0;
+  text-shadow: 0 0 15px rgba(6, 182, 212, 0.5);
+  line-height: 1;
+  letter-spacing: -0.5px;
+}
+
+.number-unit {
+  font-size: 16px;
+  color: #94a3b8;
+  font-weight: 500;
+  margin-top: 2px;
+}
+
+.number-stats {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.stat-item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-size: 12px;
+}
+
+.stat-label {
+  color: #94a3b8;
+}
+
+.stat-value {
+  color: #e2e8f0;
+  font-weight: 500;
+}
+
+.stat-value.positive {
+  color: #10b981;
+}
+
+.metric-chart-section {
+  width: 200px;
+  height: 150px;
+}
+
+/* 指标墙 */
+.metrics-wall {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  height: 100%;
+}
+
+.wall-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  grid-auto-rows: minmax(50px, 1fr);
+  gap: 6px;
+  height: 100%;
+}
+
+.wall-grid.adaptive {
+  gap: 4px;
+  grid-template-rows: repeat(3, 1fr);
+}
+
+.wall-card {
+  background: rgba(30, 58, 138, 0.12);
+  border: 1px solid rgba(59, 130, 246, 0.18);
+  border-radius: var(--radius-sm);
+  padding: 8px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+  overflow: hidden;
+  transition: var(--transition);
+}
+
+.wall-card:hover {
+  background: rgba(30, 58, 138, 0.25);
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.1);
+}
+
+.wall-card.compact {
+  padding: 6px 8px;
+  border-radius: var(--radius-sm);
+}
+
+.wall-icon {
+  font-size: 14px;
+  color: var(--secondary);
+  margin-bottom: 4px;
+  opacity: 0.9;
+}
+
+.wall-card.compact .wall-icon {
+  font-size: 12px;
+  margin-bottom: 2px;
+}
+
+.wall-content {
+  flex: 1;
+}
+
+.wall-number {
+  font-size: 20px;
+  font-weight: 600;
+  color: #e2e8f0;
+  margin-bottom: 2px;
+  line-height: 1;
+}
+
+.wall-card.compact .wall-number {
+  font-size: 16px;
+  margin-bottom: 1px;
+}
+
+.wall-label {
+  font-size: 10px;
+  color: #94a3b8;
+  margin-bottom: 3px;
+  opacity: 0.9;
+}
+
+.wall-card.compact .wall-label {
+  font-size: 9px;
+  margin-bottom: 2px;
+}
+
+.wall-trend {
+  font-size: 11px;
+  font-weight: 500;
+}
+
+.wall-card.compact .wall-trend {
+  font-size: 9px;
+}
+
+.wall-trend.positive {
+  color: var(--success);
+}
+
+.wall-trend.negative {
+  color: var(--danger);
+}
+
+/* 特殊卡片样式 */
+.wall-progress {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+}
+
+.wall-progress.mini {
+  top: 6px;
+  right: 6px;
+}
+
+.progress-ring {
+  width: 32px;
+  height: 32px;
+  position: relative;
+}
+
+.wall-progress.mini .progress-ring {
+  width: 24px;
+  height: 24px;
+}
+
+.progress-ring::before {
+  content: '';
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  right: 2px;
+  bottom: 2px;
+  border: 2px solid rgba(59, 130, 246, 0.2);
+  border-radius: 50%;
+}
+
+.wall-progress.mini .progress-ring::before {
+  border-width: 1px;
+}
+
+.progress-ring::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  border: 3px solid transparent;
+  border-top: 3px solid #06b6d4;
+  border-right: 3px solid #06b6d4;
+  border-radius: 50%;
+  transform: rotate(-45deg);
+  animation: rotateProgress 2s linear infinite;
+}
+
+.wall-progress.mini .progress-ring::after {
+  border-width: 2px;
+}
+
+@keyframes rotateProgress {
+  from { transform: rotate(-45deg); }
+  to { transform: rotate(315deg); }
+}
+
+.wall-rating {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 6px;
+}
+
+.wall-rating.mini {
+  margin-top: 3px;
+}
+
+.wall-rating.mini .stars {
+  font-size: 10px;
+}
+
+.stars {
+  color: #f59e0b;
+  font-size: 12px;
+}
+
+.rating-text {
+  font-size: 10px;
+  color: #94a3b8;
+}
+
+/* 多维度检测按钮优化 */
+.dimension-buttons {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 4px;
+  margin-bottom: 8px;
+  flex: 1;
+  min-height: 0;
+}
+
+/* 分析网格 */
+.analysis-grid {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 6px;
+  margin-bottom: 12px;
+  flex: 1;
+}
+
+.analysis-card {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 10px;
+  background: var(--primary-alpha-medium);
+  border: 1px solid rgba(59, 130, 246, 0.25);
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  transition: var(--transition);
+  position: relative;
+  overflow: hidden;
+}
+
+.analysis-card::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, transparent 50%);
+  pointer-events: none;
+}
+
+.analysis-card:hover {
+  background: var(--primary-alpha-heavy);
+  border-color: rgba(59, 130, 246, 0.4);
+  transform: translateY(-1px);
+  box-shadow: var(--shadow-md);
+}
+
+.card-icon {
+  width: 28px;
+  height: 28px;
+  border-radius: var(--radius-sm);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 14px;
+  position: relative;
+  z-index: 1;
+}
+
+.card-icon.image {
+  background: linear-gradient(135deg, #f59e0b, #f97316);
+  color: white;
+}
+
+.card-icon.audio {
+  background: linear-gradient(135deg, #8b5cf6, #a855f7);
+  color: white;
+}
+
+.card-icon.text {
+  background: linear-gradient(135deg, #10b981, #059669);
+  color: white;
+}
+
+.card-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  position: relative;
+  z-index: 1;
+}
+
+.card-title {
+  font-size: 12px;
+  font-weight: 600;
+  color: #e2e8f0;
+}
+
+.card-subtitle {
+  font-size: 9px;
+  color: var(--gray-light);
+  opacity: 0.8;
+}
+
+.card-indicator {
+  position: relative;
+  z-index: 1;
+}
+
+.progress-ring.small {
+  width: 20px;
+  height: 20px;
+  position: relative;
+}
+
+.progress-ring.small::before {
+  content: '';
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  right: 2px;
+  bottom: 2px;
+  border: 1px solid rgba(59, 130, 246, 0.3);
+  border-radius: 50%;
+}
+
+.progress-ring.small .progress-fill {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  border: 2px solid transparent;
+  border-top: 2px solid var(--secondary);
+  border-right: 2px solid var(--secondary);
+  border-radius: 50%;
+  transform: rotate(-45deg);
+  opacity: 0.8;
+}
+
+/* 增强型操作按钮 */
+.action-buttons-enhanced {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 6px;
+  margin-top: auto;
+}
+
+.action-btn-large {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  padding: 8px 10px;
+  border: none;
+  border-radius: var(--radius-md);
+  font-size: 11px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: var(--transition);
+  position: relative;
+  overflow: hidden;
+}
+
+.action-btn-large::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
+  transition: left 0.5s;
+}
+
+.action-btn-large:hover::before {
+  left: 100%;
+}
+
+.action-btn-large.primary {
+  background: linear-gradient(135deg, var(--primary), var(--secondary));
+  color: white;
+}
+
+.action-btn-large.primary:hover {
+  transform: translateY(-1px);
+  box-shadow: var(--shadow-md);
+}
+
+.action-btn-large.secondary {
+  background: linear-gradient(135deg, var(--gray), var(--gray-light));
+  color: white;
+}
+
+.action-btn-large.secondary:hover {
+  transform: translateY(-1px);
+  box-shadow: var(--shadow-sm);
+}
+
+.action-btn-large .el-icon {
+  font-size: 12px;
+}
+
+.action-btn-large span {
+  position: relative;
+  z-index: 1;
+}
+
+/* 权限相关样式 - 只在权限不足时显示限制样式 */
+.action-btn-large.requires-auth {
+  position: relative;
+}
+
+.action-btn-large.requires-auth::after {
+  content: '🔒';
+  position: absolute;
+  top: -5px;
+  right: -5px;
+  background: var(--warning);
+  color: white;
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 10px;
+  border: 2px solid var(--bg-primary);
+  z-index: 10;
+}
+
+.dimension-btn {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 8px;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.15) 0%, rgba(6, 182, 212, 0.15) 100%);
+  border: 1px solid rgba(59, 130, 246, 0.25);
+  border-radius: var(--radius-sm);
+  color: #e2e8f0;
+  cursor: pointer;
+  transition: var(--transition);
+  font-size: 11px;
+  min-height: 32px;
+}
+
+.dimension-btn:hover {
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.3) 0%, rgba(6, 182, 212, 0.3) 100%);
+  border-color: rgba(59, 130, 246, 0.5);
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
+}
+
+.dimension-btn .el-icon {
+  font-size: 12px;
+  color: var(--secondary);
+  opacity: 0.9;
+}
+
+.wall-mini-chart {
+  margin-top: 6px;
+}
+
+.mini-bars {
+  display: flex;
+  align-items: end;
+  gap: 2px;
+  height: 20px;
+}
+
+.bar {
+  width: 4px;
+  background: linear-gradient(to top, #06b6d4, #3b82f6);
+  border-radius: 2px;
+  animation: barGrow 1s ease-out;
+}
+
+@keyframes barGrow {
+  from { height: 0; }
+  to { height: var(--height); }
+}
+
+.wall-avatar-list {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  margin-top: 6px;
+}
+
+.avatar-circle {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #06b6d4, #3b82f6);
+  border: 1px solid rgba(255, 255, 255, 0.3);
+}
+
+.avatar-more {
+  font-size: 10px;
+  color: #94a3b8;
+  background: rgba(147, 197, 253, 0.2);
+  padding: 2px 4px;
+  border-radius: 8px;
+}
+
+.wall-enterprise-icons {
+  display: flex;
+  gap: 4px;
+  margin-top: 6px;
+}
+
+.enterprise-icon {
+  font-size: 14px;
+  opacity: 0.8;
+}
+
+.wall-evaluation-status {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  margin-top: 6px;
+}
+
+.status-item {
+  font-size: 10px;
+  padding: 2px 4px;
+  border-radius: 4px;
+}
+
+.status-item.completed {
+  color: #10b981;
+  background: rgba(16, 185, 129, 0.2);
+}
+
+.status-item.pending {
+  color: #f59e0b;
+  background: rgba(245, 158, 11, 0.2);
+}
+
+/* 操作按钮优化 */
+.action-buttons {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 6px;
+  margin-top: 8px;
+  flex: 0 0 auto;
+}
+
+.action-buttons .el-button {
+  background: linear-gradient(135deg, var(--primary-light) 0%, var(--secondary) 100%);
+  border: none;
+  color: white;
+  font-weight: 500;
+  transition: var(--transition);
+  padding: 4px 8px;
+  font-size: 10px;
+  height: 28px;
+  border-radius: var(--radius-sm);
+}
+
+.action-buttons .el-button:hover {
+  transform: translateY(-1px);
+  box-shadow: var(--shadow-md);
+  opacity: 0.95;
+}
+
+.action-buttons .el-button.el-button--info {
+  background: linear-gradient(135deg, var(--gray) 0%, var(--gray-light) 100%);
+}
+
+/* 详细数据统计 */
+.detailed-stats {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+.header-extra {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-left: auto;
+}
+
+.update-time {
+  font-size: 11px;
+  color: var(--gray-light);
+  background: var(--primary-alpha-heavy);
+  padding: 3px 6px;
+  border-radius: var(--radius-lg);
+}
+
+.status-indicator {
+  width: 6px;
+  height: 6px;
+  background: var(--success);
+  border-radius: 50%;
+  animation: pulse 2s infinite;
+}
+
+@keyframes pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.5; }
+}
+
+.stats-overview {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 10px;
+  margin-bottom: 15px;
+}
+
+.overview-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 10px;
+  background: var(--primary-alpha-medium);
+  border-radius: var(--radius-sm);
+  border: 1px solid rgba(59, 130, 246, 0.18);
+  transition: var(--transition);
+}
+
+.overview-item:hover {
+  background: var(--primary-alpha-heavy);
+  transform: translateY(-1px);
+  box-shadow: var(--shadow-sm);
+}
+
+.overview-icon {
+  font-size: 20px;
+  color: var(--secondary);
+  background: var(--secondary-alpha-heavy);
+  padding: 6px;
+  border-radius: var(--radius-sm);
+}
+
+.overview-number {
+  font-size: 20px;
+  font-weight: 600;
+  color: #e2e8f0;
+  margin-bottom: 1px;
+}
+
+.overview-label {
+  font-size: 11px;
+  color: var(--gray-light);
+  margin-bottom: 2px;
+}
+
+.overview-trend {
+  display: flex;
+  align-items: center;
+  gap: 3px;
+  font-size: 11px;
+  color: var(--success);
+}
+
+.trend-value {
+  font-weight: bold;
+}
+
+.stats-chart {
+  height: 100px;
+  background: var(--primary-alpha-medium);
+  border-radius: var(--radius-sm);
+  border: 1px solid rgba(59, 130, 246, 0.15);
+}
+
+.trend-container {
+  width: 100%;
+  height: 100%;
+}
+
+/* 右侧区域 - 优化布局 */
+.right-section {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  height: 100%;
+}
+
+.student-list {
+  flex: 1.3;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  max-height: 65%;
+}
+
+.multi-dimension {
+  flex: 0.7;
+  min-height: 180px;
+  display: flex;
+  flex-direction: column;
+  max-height: 35%;
+}
+
+/* 多维度检测按钮 */
+.dimension-buttons {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.dimension-btn {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 12px 16px;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.2) 0%, rgba(6, 182, 212, 0.2) 100%);
+  border: 1px solid rgba(59, 130, 246, 0.3);
+  border-radius: 8px;
+  color: #e2e8f0;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  font-size: 14px;
+}
+
+.dimension-btn:hover {
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.3) 0%, rgba(6, 182, 212, 0.3) 100%);
+  border-color: rgba(59, 130, 246, 0.5);
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
+}
+
+.dimension-btn .el-icon {
+  font-size: 16px;
+  color: #06b6d4;
+}
+
+/* 操作按钮 */
+.action-buttons {
+  display: flex;
+  gap: 12px;
+  margin-top: 20px;
+}
+
+.action-buttons .el-button {
+  flex: 1;
+  background: linear-gradient(135deg, #3b82f6 0%, #06b6d4 100%);
+  border: none;
+  color: white;
+  font-weight: bold;
+  transition: all 0.3s ease;
+}
+
+.action-buttons .el-button:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 6px 20px rgba(59, 130, 246, 0.3);
+}
+
+.action-buttons .el-button.el-button--info {
+  background: linear-gradient(135deg, var(--gray) 0%, var(--gray-light) 100%);
+}
+
+/* 学生表格 - 紧凑设计 */
+.student-table {
+  background: rgba(30, 58, 138, 0.08);
+  border-radius: var(--radius-sm);
+  overflow: hidden;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  border: 1px solid rgba(59, 130, 246, 0.15);
+}
+
+/* 增强型学生表格 */
+.student-table-enhanced {
+  background: var(--primary-alpha-medium);
+  border-radius: var(--radius-md);
+  overflow: hidden;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  border: 1px solid rgba(59, 130, 246, 0.2);
+}
+
+.table-header-enhanced {
+  display: grid;
+  grid-template-columns: 1.5fr 1fr 1fr 0.8fr;
+  gap: 8px;
+  padding: 8px 12px;
+  background: var(--primary-alpha-heavy);
+  font-weight: 600;
+  color: #e2e8f0;
+  font-size: 11px;
+  flex: 0 0 auto;
+  border-bottom: 1px solid rgba(59, 130, 246, 0.3);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.table-body-enhanced {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding: 4px;
+}
+
+.table-row-enhanced {
+  display: grid;
+  grid-template-columns: 1.5fr 1fr 1fr 0.8fr;
+  gap: 8px;
+  padding: 8px 12px;
+  margin: 2px 0;
+  border-radius: var(--radius-sm);
+  color: #e2e8f0;
+  font-size: 11px;
+  align-items: center;
+  transition: var(--transition);
+  background: var(--primary-alpha-light);
+  border: 1px solid transparent;
+}
+
+.table-row-enhanced:hover {
+  background: var(--primary-alpha-medium);
+  border-color: rgba(59, 130, 246, 0.3);
+  transform: translateX(2px);
+  box-shadow: var(--shadow-sm);
+}
+
+.student-info {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.student-avatar {
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background: var(--secondary);
+  color: white;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 10px;
+  font-weight: 600;
+}
+
+.student-name {
+  font-weight: 500;
+}
+
+.student-id {
+  font-family: monospace;
+  opacity: 0.8;
+}
+
+.student-status {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.status-badge {
+  padding: 2px 6px;
+  border-radius: var(--radius-lg);
+  font-size: 9px;
+  font-weight: 500;
+  text-align: center;
+}
+
+.status-badge.completed {
+  background: var(--success-alpha-medium);
+  color: var(--success);
+  border: 1px solid rgba(16, 185, 129, 0.2);
+}
+
+.grade-indicator {
+  font-size: 8px;
+  color: var(--gray-light);
+  text-align: center;
+}
+
+.action-group {
+  display: flex;
+  gap: 4px;
+  justify-content: center;
+}
+
+.action-btn {
+  width: 20px;
+  height: 20px;
+  border-radius: var(--radius-sm);
+  border: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: var(--transition);
+  font-size: 10px;
+}
+
+.action-btn.primary {
+  background: var(--secondary-alpha-medium);
+  color: var(--secondary);
+  border: 1px solid rgba(6, 182, 212, 0.2);
+}
+
+.action-btn.primary:hover {
+  background: var(--secondary-alpha-heavy);
+  transform: scale(1.1);
+}
+
+.action-btn.secondary {
+  background: var(--gray-alpha-medium);
+  color: var(--gray-light);
+  border: 1px solid rgba(148, 163, 184, 0.2);
+}
+
+.action-btn.secondary:hover {
+  background: var(--gray-alpha-heavy);
+  transform: scale(1.1);
+}
+
+.table-header {
+  display: grid;
+  grid-template-columns: 0.8fr 1fr 0.6fr 0.8fr;
+  gap: 4px;
+  padding: 8px 10px;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.25) 0%, rgba(6, 182, 212, 0.2) 100%);
+  font-weight: 600;
+  color: #e2e8f0;
+  font-size: 11px;
+  flex: 0 0 auto;
+  border-bottom: 1px solid rgba(59, 130, 246, 0.3);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.table-body {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  overflow-x: hidden;
+  max-height: 100%;
+  padding: 4px;
+}
+
+.table-row {
+  display: grid;
+  grid-template-columns: 0.8fr 1fr 0.6fr 0.8fr;
+  gap: 4px;
+  padding: 8px 10px;
+  margin: 2px 4px;
+  border-radius: var(--radius-sm);
+  color: #e2e8f0;
+  font-size: 11px;
+  align-items: center;
+  transition: var(--transition);
+  background: rgba(30, 58, 138, 0.05);
+  border: 1px solid transparent;
+}
+
+.table-row:hover {
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.15) 0%, rgba(6, 182, 212, 0.1) 100%);
+  border-color: rgba(59, 130, 246, 0.2);
+  transform: translateX(2px);
+  box-shadow: var(--shadow-sm);
+}
+
+.table-row:last-child {
+  border-bottom: none;
+  margin-bottom: 4px;
+}
+
+.report-link {
+  color: var(--secondary);
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  gap: 3px;
+  padding: 3px 6px;
+  border-radius: var(--radius-sm);
+  background: rgba(6, 182, 212, 0.1);
+  border: 1px solid rgba(6, 182, 212, 0.2);
+  transition: var(--transition);
+  font-size: 10px;
+  white-space: nowrap;
+}
+
+.report-link:hover {
+  color: var(--secondary-light);
+  background: rgba(6, 182, 212, 0.2);
+  border-color: rgba(6, 182, 212, 0.4);
+  transform: scale(1.05);
+  box-shadow: 0 2px 8px rgba(6, 182, 212, 0.3);
+}
+
+/* 多维度检测按钮 */
+.dimension-buttons {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.dimension-btn {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 12px 16px;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.2) 0%, rgba(6, 182, 212, 0.2) 100%);
+  border: 1px solid rgba(59, 130, 246, 0.3);
+  border-radius: 8px;
+  color: #e2e8f0;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  font-size: 14px;
+}
+
+.dimension-btn:hover {
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.3) 0%, rgba(6, 182, 212, 0.3) 100%);
+  border-color: rgba(59, 130, 246, 0.5);
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
+}
+
+.dimension-btn .el-icon {
+  font-size: 16px;
+  color: #06b6d4;
+}
+
+/* 操作按钮 */
+.action-buttons {
+  display: flex;
+  gap: 12px;
+  margin-top: 20px;
+}
+
+.action-buttons .el-button {
+  flex: 1;
+  background: linear-gradient(135deg, #3b82f6 0%, #06b6d4 100%);
+  border: none;
+  color: white;
+  font-weight: bold;
+  transition: all 0.3s ease;
+}
+
+.action-buttons .el-button:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 6px 20px rgba(59, 130, 246, 0.3);
+}
+
+.action-buttons .el-button.el-button--info {
+  background: linear-gradient(135deg, var(--gray) 0%, var(--gray-light) 100%);
+}
+
+/* 自适应组件优化 */
+@media (max-width: 1600px) {
+  .chart-container {
+    height: 250px;
+  }
+  
+  .gauge-container {
+    height: 180px;
+  }
+  
+  .dimension-btn {
+    font-size: 12px;
+    padding: 8px 10px;
+  }
+  
+  .action-buttons .el-button {
+    font-size: 11px;
+    height: 32px;
+    padding: 6px 10px;
+  }
+}
+
+/* 模块标题紧凑模式 */
+.module-header.compact {
+  margin-bottom: 10px;
+  font-size: 14px;
+  font-weight: 600;
+}
+
+.module-header.compact .el-icon {
+  font-size: 16px;
+}
+
+.module-header.ultra-compact {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+  font-size: 13px;
+  font-weight: 600;
+}
+
+.module-header.ultra-compact .el-icon {
+  font-size: 14px;
+}
+
+.header-counter {
+  background: var(--success-alpha-medium);
+  color: var(--success);
+  padding: 2px 6px;
+  border-radius: var(--radius-lg);
+  font-size: 10px;
+  font-weight: 500;
+  border: 1px solid rgba(16, 185, 129, 0.2);
+}
+
+.analysis-status {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 10px;
+  color: var(--success);
+}
+
+.status-dot {
+  width: 4px;
+  height: 4px;
+  border-radius: 50%;
+  background: var(--success);
+}
+
+.status-dot.active {
+  animation: pulse 1.5s infinite;
+}
+.table-body::-webkit-scrollbar,
+.table-body-enhanced::-webkit-scrollbar {
+  width: 4px;
+}
+
+.table-body::-webkit-scrollbar-track,
+.table-body-enhanced::-webkit-scrollbar-track {
+  background: var(--primary-alpha-light);
+  border-radius: 2px;
+}
+
+.table-body::-webkit-scrollbar-thumb,
+.table-body-enhanced::-webkit-scrollbar-thumb {
+  background: var(--secondary-alpha-medium);
+  border-radius: 2px;
+}
+
+.table-body::-webkit-scrollbar-thumb:hover,
+.table-body-enhanced::-webkit-scrollbar-thumb:hover {
+  background: var(--secondary-alpha-heavy);
+}
+
+/* 响应式设计 */
+@media (max-width: 1920px) {
+  .main-content {
+    padding: 12px;
+    gap: 10px;
+  }
+
+  .module-container {
+    padding: 12px;
+  }
+
+  .main-title {
+    font-size: 32px;
+  }
+
+  .big-number {
+    font-size: 42px;
+  }
+
+  .wall-card.compact {
+    padding: 6px;
+  }
+
+  .wall-card.compact .wall-number {
+    font-size: 15px;
+  }
+}
+
+@media (max-width: 1600px) {
+  .main-content {
+    grid-template-columns: 1fr 1.2fr 0.8fr;
+    gap: 8px;
+  }
+
+  .big-number {
+    font-size: clamp(24px, 2.4vw, 32px);
+  }
+
+  .number-unit {
+    font-size: 14px;
+  }
+
+  .gauge-mini {
+    width: 40px;
+    height: 40px;
+  }
+
+  .number-gauge-combined {
+    padding: 8px 12px;
+    min-height: 60px;
+  }
+
+  .wall-card.compact .wall-number {
+    font-size: 14px;
+  }
+
+  .wall-card.compact .wall-label {
+    font-size: 9px;
+  }
+
+  .metrics-layout {
+    grid-template-columns: 1.3fr 1fr;
+  }
+
+  .main-metric-content.compact {
+    flex-direction: row;
+    gap: 8px;
+  }
+
+  .metric-chart-section {
+    width: 100%;
+    height: 100px;
+  }
+
+  .chart-container {
+    height: 220px;
+  }
+}
+
+@media (max-width: 1366px) {
+  .main-content {
+    grid-template-columns: 1fr;
+    grid-template-rows: auto auto auto;
+  }
+  
+  .main-title {
+    font-size: 28px;
+  }
+  
+  .subtitle {
+    font-size: 14px;
+  }
+  
+  .big-number {
+    font-size: 42px;
+  }
+  
+  .wall-grid.adaptive {
+    grid-template-columns: repeat(3, 1fr);
+    grid-template-rows: repeat(2, 1fr);
+  }
+  
+  .stats-overview {
+    grid-template-columns: repeat(2, 1fr);
+  }
+  
+  .metrics-layout {
+    grid-template-columns: 1fr;
+  }
+  
+  .table-row {
+    font-size: 11px;
+  }
+}
+
+@media (max-width: 1024px) {
+  .main-content {
+    padding: 10px;
+    gap: 10px;
+  }
+
+  .module-container {
+    padding: 12px;
+  }
+
+  .wall-grid.adaptive {
+    grid-template-columns: repeat(2, 1fr);
+    grid-template-rows: repeat(3, 1fr);
+  }
+
+  .stats-overview {
+    grid-template-columns: 1fr;
+  }
+
+  .big-number {
+    font-size: clamp(20px, 2vw, 28px);
+  }
+
+  .number-unit {
+    font-size: 12px;
+  }
+
+  .gauge-mini {
+    width: 35px;
+    height: 35px;
+  }
+
+  .number-gauge-combined {
+    padding: 6px 10px;
+    min-height: 50px;
+    gap: 8px;
+  }
+
+  .main-metric-header {
+    flex-wrap: wrap;
+  }
+
+  .real-time-indicator {
+    margin-left: 0;
+    margin-top: 5px;
+  }
+}
+
+@media (max-width: 768px) {
+  .main-content {
+    grid-template-columns: 1fr;
+  }
+  
+  .header-section {
+    flex-direction: column;
+    gap: 10px;
+    text-align: center;
+  }
+  
+  .current-time {
+    position: static;
+    transform: none;
+  }
+  
+  .wall-grid.adaptive {
+    grid-template-columns: 1fr;
+  }
+  
+  .metrics-layout {
+    grid-template-columns: 1fr;
+  }
+  
+  .main-metric-content.compact {
+    flex-direction: column;
+  }
+  
+  .stats-overview {
+    grid-template-columns: 1fr;
+  }
+  
+  .module-header {
+    font-size: 16px;
+  }
+  
+  .big-number {
+    font-size: 32px;
+  }
+}
+
+/* 加载动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(20px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.module-container {
+  animation: fadeIn 0.8s ease-out;
+}
+
+.module-container:nth-child(1) { animation-delay: 0.1s; }
+.module-container:nth-child(2) { animation-delay: 0.2s; }
+.module-container:nth-child(3) { animation-delay: 0.3s; }
+.module-container:nth-child(4) { animation-delay: 0.4s; }
+.module-container:nth-child(5) { animation-delay: 0.5s; }
+.module-container:nth-child(6) { animation-delay: 0.6s; }
+</style>
\ No newline at end of file
diff --git a/src/views/Login.vue b/src/views/Login.vue
index 132a437..9ffd379 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -116,11 +116,11 @@
             <div class="demo-buttons">
               <button class="demo-btn" @click="quickLogin('student')" style="padding: 10px var(--spacing-md);">
                 <el-icon style="font-size: 14px; margin-right: 6px;"><User /></el-icon>
-                学生演示
+                学生登录
               </button>
               <button class="demo-btn" @click="quickLogin('teacher')" style="padding: 10px var(--spacing-md);">
                 <el-icon style="font-size: 14px; margin-right: 6px;"><Monitor /></el-icon>
-                教师演示
+                教师登录
               </button>
             </div>
             <div class="demo-buttons" style="margin-top: 8px;">
@@ -133,7 +133,7 @@
         </div>
 
         <div class="login-footer">
-          <p>&copy; 2024 实践教学评价平台 - 演示版本</p>
+          <p>&copy; 2024 实践教学评价平台</p>
         </div>
       </div>
     </div>