feat(classes): optimize teacher dashboard ui and implement grade management
This commit is contained in:
@@ -234,3 +234,69 @@ Seed 脚本已覆盖班级相关数据,以便在开发环境快速验证页面
|
||||
### 7.4 技术细节
|
||||
- 引入 `recharts` 替换手写 SVG 图表,统一图表风格。
|
||||
- 优化 Grid 布局响应式表现 (`lg:grid-cols-12`)。
|
||||
- **New Components**:
|
||||
- `TeacherGradeTrends`: 基于 Recharts 的趋势图组件。
|
||||
- `Chart`: 基于 Shadcn/UI 规范的通用图表包装器 (`src/shared/components/ui/chart.tsx`)。
|
||||
|
||||
### 7.5 代码管理
|
||||
- **Branch**: `ui_opt`
|
||||
- **Scope**: `src/modules/dashboard`, `src/shared/components/ui/chart.tsx`
|
||||
- **Commit**: "feat(dashboard): optimize teacher dashboard ui and layout"
|
||||
|
||||
---
|
||||
|
||||
## 8. 班级详情页与学生管理优化 (2026-01-14)
|
||||
|
||||
**目标**: 提升班级管理效率与信息可视化程度,优化大班级场景下的性能与体验。
|
||||
|
||||
### 8.1 学生管理列表优化 (Students Table)
|
||||
- **分页 (Pagination)**: 引入客户端分页(每页 10 条),解决大班级列表渲染性能问题。
|
||||
- **信息增强**:
|
||||
- 增加学生头像 (Avatar)、性别、加入时间展示。
|
||||
- 增加可视化状态徽章 (Status Badge):Active (Emerald) / Inactive (Muted)。
|
||||
- **筛选能力**:
|
||||
- 新增状态筛选器 (Active/Inactive),支持服务端过滤。
|
||||
- **涉及组件**:
|
||||
- `src/modules/classes/components/students-table.tsx`
|
||||
- `src/modules/classes/components/students-filters.tsx`
|
||||
|
||||
### 8.2 班级详情页重构 (Class Detail Dashboard)
|
||||
- **布局重构**: 采用响应式双栏布局 (Main Content + Sidebar),提升空间利用率。
|
||||
- **核心指标 (Key Metrics)**: 顶部增加 4 卡片统计网格:
|
||||
- **Total Students**: 活跃/非活跃人数细分。
|
||||
- **Schedule Items**: 每周课程数。
|
||||
- **Active Assignments**: 活跃作业数与逾期数。
|
||||
- **Class Average**: 基于已评分作业的平均分。
|
||||
- **侧边栏小部件**:
|
||||
- **Class Schedule**: 快速查看近期课程。
|
||||
- **Homework History**: 快速查看历史作业状态。
|
||||
- **涉及页面**:
|
||||
- `src/app/(dashboard)/teacher/classes/my/[id]/page.tsx`
|
||||
|
||||
### 8.3 数据访问层更新
|
||||
- **getClassStudents**: 扩展查询字段(头像、性别、加入时间),支持 `status` 过滤参数。
|
||||
|
||||
### 8.4 权限与流程调整 (Role Separation)
|
||||
- **教师端变更**:
|
||||
- 移除了“创建班级”入口,教师不再直接创建班级。
|
||||
- 新增“加入班级” (Join Class) 功能,通过 6 位邀请码加入已由管理员创建的班级。
|
||||
- 涉及组件:`src/modules/classes/components/my-classes-grid.tsx`
|
||||
|
||||
## 9. 年级管理端班级模块 (2026-01-14)
|
||||
|
||||
**目标**: 实现年级维度的班级集中管理,支持年级组长与管理员统一创建与维护班级。
|
||||
|
||||
### 9.1 路由与入口
|
||||
- **路由**: `src/app/(dashboard)/management/grade/classes/page.tsx`
|
||||
- **权限**: 仅限拥有年级管理权限的角色(Grade Director / Teaching Head / Admin)。
|
||||
|
||||
### 9.2 功能特性
|
||||
- **GradeClassesView**:
|
||||
- 展示用户所管理年级的所有班级列表。
|
||||
- 支持按年级筛选。
|
||||
- **CRUD**: 提供创建、编辑、删除班级的完整能力。
|
||||
- **RBAC**: 操作前校验用户对目标年级的管理权限。
|
||||
|
||||
### 9.3 核心变更
|
||||
- **Data Access**: 新增 `getManagedGrades` 与 `getGradeManagedClasses`。
|
||||
- **Actions**: 新增 `createGradeClassAction` 等带权限校验的 Server Actions。
|
||||
|
||||
Reference in New Issue
Block a user