mcpField
E
executive-course-dashboard

executive-course-dashboard

github.com/lensetek其他013 次安装1 天前更新
代码仓库

关于 executive-course-dashboard

用于生成单屏网页仪表板的技能，帮助教师和学术管理者监测班级表现。它集中展示关键学业指标，并从本地 JSON 文件读取汇总数据。

主要功能

  1. 01单屏学业概览
  2. 02适配手机至显示器的响应式布局
  3. 03班级状态与课程进度指标
  4. 04读取本地 JSON 数据
  5. 05纯客户端运行

适用场景

  1. 01快速查看班级进展
  2. 02监测提交率与达标率
  3. 03通过投影仪展示课程指标

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/lensetek/course-agent-skills --skill executive-course-dashboard

安装后在 Claude Code 中输入/executive-course-dashboard确认已加载。

详细介绍

执行课程仪表板 📊

executive-course-dashboard 创建了一个现代、优雅且信息密集的 Web 仪表板视图，让教师（或院系／学校负责人）无需打开几十个独立的电子表格，就能在一屏之内监控班级的学业情况。

📱 移动端优先设计标准与视觉层级

按照既定规范，此界面遵循移动端优先原则进行设计：

  1. 完美响应式：从 360px 智能手机屏幕、平板电脑、笔记本电脑，到 4K 教室投影仪显示器，布局都整齐有序。
  2. 高对比度浅色主题：
    • 白色卡片背景（#ffffff）和清晰的边框（#e2e8f0）上采用醒目的文字颜色（标题使用 Slate #0f172a，正文使用 #334155）。
    • 不使用褪色的灰色文字，也不在浅色背景上使用白色文字。
  3. 一屏概览设计：
    • 指标面板采用模块化 CSS Grid / Flexbox 设计，无需长距离滚动，即可一眼看到所有核心摘要。

🎛️ 执行仪表板组件

┌─────────────────────────────────────────────────────────────┐
│ 🎓 REKAYASA PERANGKAT LUNAK (CS302) - SEMESTER GANJIL      │
│ [Status Kelas: Aktif]  [Sesi Berjalan: 04/14]   [👥 38 Mhs] │
├──────────────┬──────────────┬──────────────┬────────────────┤
│ 📈 Rata-Rata │ 📥 Pengumpulan│ 🏆 Ketuntasan│ ⚠️ Butuh       │
│    84.6/100  │     94.7%    │   CPMK: 89%  │   Perhatian: 3 │
├──────────────┴──────────────┴──────────────┴────────────────┤
│ 🎯 Radar Capaian CPMK         │ 📊 Distribusi Nilai Kelas   │
│ CPMK-1 [██████████░] 91%      │ [A: 14]  [AB: 12]  [B: 8]   │
│ CPMK-2 [████████░░░] 82%      │ [C: 3]   [Remedial: 1]      │
├───────────────────────────────┴─────────────────────────────┤
│ 🚨 Early Warning Alert: Mahasiswa Perlu Pendampingan        │
│ • Budi Santoso (Tugas 3 belum kumpul - Rekomendasi: Kontak) │
│ • Sinta Dewi (Nilai Sesi 2 < 65 - Rekomendasi: Remedial L1) │
└─────────────────────────────────────────────────────────────┘

🔒 安全协议与凭据零泄露

  • 此 index.html 文件完全在客户端运行。
  • 从 Agent 生成的本地 data_ringkasan.json 文件中读取成绩摘要数据。
  • 前端中不嵌入 API Key、密码、数据库令牌或任何凭据。

评论

支持 Markdown