feat(desktop+web+server): ClassIsland 风格 UI、灵动岛动画/交互修复、作业上岛与"叫人"功能
## 灵动岛修复与动画优化（用户反馈） - **收回不再出现"方框"闪烁**：卡片改为**固定逻辑尺寸 + 顶部居中锚定**， 窗口只负责露出/裁切透明区域。此前卡片随窗口拉伸，形变过程中会看到被拉扁的圆角方块， 胶囊里的铃铛/文字还会被垂直居中而"从上跳到下"；两条问题同源，现已消除。 冒烟用 15 次采样断言卡片尺寸恒为固定值（`396x308` / `260x38`），一旦出现中间值即失败。 - **点击屏幕任意位置收回**：展开态临时 `setFocusable(true)` 并取焦，点到别处即失焦 → 自动回缩为胶囊； 收起后立即释放可聚焦性。断言覆盖 `focusable=true → 失焦后 mode=pill、focusable=false`。 - 动画继续打磨：危险/叫人形态改为**内部光晕**（卡片四周再留 4px 透明边，彻底避免窗口边界裁切出硬边）、 尖角与圆角统一、形态尺寸各异（胶囊 268×44 / 详情 404×316 / 紧急 424×344 / 叫人 440×360）。 ## 灵动岛"标为已读"真正同步通知中心 - 新增链路：灵动岛 `mark-read` → 主进程 `setMarkReadHandler` → 主窗口渲染进程 → `notificationApi.markRead` + 刷新 store（未读红点即时减少）。 - 真机链路断言：点击"标为已读"后 `read=false → true`、未读数 `1 → 0`（此前只从灵动岛队列移除）。 ## 作业发布也上岛 - `homework:new` → 灵动岛 `kind=homework`：胶囊显示"新作业"（青蓝描边 + 书本图标）， 展开显示作业说明与"截止时间：…"。 ## 新增"叫人"功能 - 服务端：新模块 `modules/calls`（`POST /api/calls`）——校验班级可写 + 学生属于该班， 落库一条 HIGH 级通知（进通知中心、可用已读状态），广播 `notification:new` 到班级房间， 并定向 `call:new` 给被叫学生。 - 共享层：`CALL_QUICK_PHRASES`（8 条快捷短语）、`buildCallTitle()`（"请 XXX 同学找 XXX 老师"，老师名已含"老师"不重复）、 `ServerToClientEvents['call:new']`、`CreateCallRequest`。 - Web 管理端：学生管理列表新增 **叫人** 按钮 → 弹窗显示对象、快捷短语（点选/取消）、自定义消息（优先），发送即通知。 - 客户端：`call:new` → 灵动岛 `kind=call`，**上课时段也立即展开**（老师正在等这名学生）， 琥珀金卡片 +"叫人"徽标 +"收到"按钮，90 秒后自动收起。 ## 客户端界面改为 ClassIsland 同款 Fluent 风格 - 主题令牌：Mica 浅底 `#f3f3f3`、亚克力卡片 `rgba(255,255,255,.7)` + `backdrop-filter`、 强调色 `#0F6CBD`、半透明描边、卡片 8px / 控件 4px 圆角、极轻阴影。 - Element Plus 变量整体对齐（`--el-color-primary`、圆角、表头/行分隔、滚动条等）。 - 侧边导航改为 Fluent NavigationView 观感：白色半透明底、选中项强调色淡底 + 左侧 3px 强调条； 品牌标改为强调色渐变圆角方块。附客户端五个页面实拍（`docs/screenshots/client/`）。 ## 验证 - `pnpm verify:e2e` **68/68**（新增 6 项叫人：201 + 标题模板、自定义消息优先、上课时段允许、学生 403、通知中心可见、清理） - `pnpm verify:desktop` **33/33**（新增：卡片固定尺寸、点击任意处收回、标为已读同步、作业上岛、叫人上课中立即展开、真实通知链路） - `pnpm verify:web` **16/16**（新增叫人入口：弹窗、8 条快捷短语、自定义输入、短语可选中） - `pnpm lint` / `format:check` / `typecheck` 全部通过；服务端安装包已重打并安装验证
This commit is contained in:
LoveChengke committed
1 parent
f759aac0a2
commit
219f6ae83a
28 files changed
+1555
-156
No files matched your search
@@ -1,4 +1,4 @@
|
||||
import type { NotificationPriority, UserRole } from './types.js';
|
||||
import type { NotificationPriority, UserRole } from './types.js';
|
||||
|
||||
/** API 前缀 */
|
||||
export const API_PREFIX = '/api';
|
||||
@@ -16,6 +16,8 @@ export const API_PATHS = {
|
||||
schedules: '/schedules',
|
||||
homeworks: '/homeworks',
|
||||
notifications: '/notifications',
|
||||
/** 叫人：老师点名让学生过来 */
|
||||
calls: '/calls',
|
||||
grades: '/grades',
|
||||
students: '/students',
|
||||
teachers: '/teachers',
|
||||
@@ -74,9 +76,32 @@ export const SOCKET_EVENTS = {
|
||||
gradeUpdated: 'grade:updated',
|
||||
scheduleUpdated: 'schedule:updated',
|
||||
classUpdated: 'class:updated',
|
||||
/** "叫人"：老师点名让某位同学去找他（定向到 user:{studentId} 房间） */
|
||||
callNew: 'call:new',
|
||||
connected: 'connected',
|
||||
} as const;
|
||||
|
||||
/**
|
||||
* "叫人"快捷短语（Web 管理端一键选择，学生端灵动岛同步展示）。
|
||||
* 自定义消息会替换/补全这些短语；`message` 为空时用短语本身。
|
||||
*/
|
||||
export const CALL_QUICK_PHRASES: readonly string[] = [
|
||||
'请到办公室找我',
|
||||
'请到讲台找我',
|
||||
'请带上作业本找我',
|
||||
'请带上试卷找我',
|
||||
'请到实验室找我',
|
||||
'请到门卫处找我',
|
||||
'请到教室门口等我',
|
||||
'请马上来一趟',
|
||||
] as const;
|
||||
|
||||
/** 叫人消息标题模板：请 XXX 同学找 XXX 老师（老师名字已含"老师"时不重复追加） */
|
||||
export function buildCallTitle(studentName: string, teacherName: string): string {
|
||||
const teacher = /老师|教师|主任|校长/.test(teacherName) ? teacherName : `${teacherName} 老师`;
|
||||
return `请 ${studentName} 同学找 ${teacher}`;
|
||||
}
|
||||
|
||||
/** Socket.IO 房间名生成规则：与后端保持一致，客户端订阅时复用 */
|
||||
export const SOCKET_ROOMS = {
|
||||
class: (classId: string): string => `class:${classId}`,
|
||||
|
||||
@@ -254,6 +254,19 @@ export interface CreateNotificationRequest {
|
||||
confirmDuringClass?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* 叫人请求：老师在 Web 管理端选中学生 + 快捷短语/自定义消息，
|
||||
* 学生端灵动岛会立即弹出"请 XXX 同学找 XXX 老师"。
|
||||
*/
|
||||
export interface CreateCallRequest {
|
||||
classId: string;
|
||||
studentId: string;
|
||||
/** 快捷短语（与 message 至少填一个） */
|
||||
quickPhrase?: string;
|
||||
/** 自定义消息（优先于快捷短语） */
|
||||
message?: string;
|
||||
}
|
||||
|
||||
export interface NotificationQueryParams {
|
||||
classId?: string;
|
||||
priority?: NotificationPriority;
|
||||
@@ -341,6 +354,14 @@ export interface ClassStatusDto {
|
||||
/** 灵动岛显示状态 */
|
||||
export type IslandMode = 'hidden' | 'pill' | 'expanded';
|
||||
|
||||
/**
|
||||
* 灵动岛消息类型：
|
||||
* - `notification` 普通/重要/紧急通知
|
||||
* - `homework` 新作业发布（带截止时间，样式区分）
|
||||
* - `call` "叫人"：老师点名让某位同学去找他（无论是否上课都立即展开）
|
||||
*/
|
||||
export type IslandNotificationKind = 'notification' | 'homework' | 'call';
|
||||
|
||||
/** 投递到灵动岛的通知载荷（服务端 NotificationDto 的精简版） */
|
||||
export interface IslandNotification {
|
||||
id: string;
|
||||
@@ -350,6 +371,10 @@ export interface IslandNotification {
|
||||
createdAt: string;
|
||||
courseName?: string | null;
|
||||
teacherName?: string | null;
|
||||
/** 消息类型，默认 notification */
|
||||
kind?: IslandNotificationKind;
|
||||
/** 附加说明，例如作业截止时间、"请到办公室" */
|
||||
subtitle?: string | null;
|
||||
}
|
||||
|
||||
/** 灵动岛当前状态（主进程持有，渲染进程与冒烟测试读取） */
|
||||
@@ -363,8 +388,8 @@ export interface IslandState {
|
||||
inClass: boolean;
|
||||
/** 当前课的结束时间（HH:mm），用于"下课后自动弹出" */
|
||||
currentPeriodEnd: string | null;
|
||||
/** 本轮展示原因：新消息 / 下课后补发 / 紧急插播 */
|
||||
reason: 'new' | 'after-class' | 'urgent' | null;
|
||||
/** 本轮展示原因：新消息 / 下课后补发 / 紧急插播 / 叫人 */
|
||||
reason: 'new' | 'after-class' | 'urgent' | 'call' | null;
|
||||
updatedAt: number;
|
||||
}
|
||||
|
||||
@@ -390,6 +415,8 @@ export interface DashboardSummary {
|
||||
/** 服务端 -> 客户端事件名 */
|
||||
export interface ServerToClientEvents {
|
||||
'notification:new': (payload: NotificationDto) => void;
|
||||
/** 叫人：定向广播给被叫学生 */
|
||||
'call:new': (payload: NotificationDto) => void;
|
||||
'homework:new': (payload: HomeworkDto) => void;
|
||||
/** deleted=true 表示该作业已被删除，客户端应从本地缓存中移除 */
|
||||
'homework:updated': (payload: HomeworkDto & { deleted?: boolean }) => void;
|
||||
|
||||
Reference in new issue
Block a user