Love_Chengke/ClassHelper
1
1 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(island,homework,schedule,web): 16 项反馈修复（联合通知点不开 / 设置不生效 / 红点位置 / 看板当天且铺满 / 单双周与周数可调 / Web 手机端与批量通知等）

Browse Source 
一、灵动岛
- ①「紧急通知后来了新作业，收起再点开不了新作业」根因有二，都已修：
  (a) active 仍是紧急那条，点击只会反复打开它 —— 现在点击胶囊优先打开**最新**那条未处理消息（队列里更晚的）；
  (b) 上课时段 syncWindow 会把普通通知立刻隐藏（表现为点了没反应）—— 新增 explicitShowId，
      "用户主动点开"的那条守卫放行（岛完全隐藏时仍严格不打扰）。
  冒烟新增「紧急通知后来了新作业：收起再点击打开的是新作业（联合通知回归）」。
- ② 设置实时预览/保存：补「设置页真实链路」断言（window.desktop.islandSetAppearance → IPC → 主进程 →
  渲染进程 CSS 变量 + 窗口尺寸），并断言"岛显示中改尺寸立即生效"（实测均通过）。
- ③ 未读红点移到「通知」图标右上角（此前在文字后面），并加 DOM 几何断言（dx>0 且 dy<0，
  没有未读时自动造一条未读通知再断言、断言后删除）。
- 冒烟稳定性：新增 island.setBlurCollapseEnabled()（默认开），测试期间关掉"失焦收起"，
  避免系统抢焦点导致展开态被收回的随机失败；专门验证失焦的用例仍临时打开。

二、作业看板（学生端）
- ⑥ 只看当天：新增「只看今天」开关（默认开），按 createdAt 的本地日期过滤，昨天的过期作业不再混入。
- ⑧ 完整显示：卡片同时渲染标题 + 作业要求全文（列表模式也加「作业要求」列）。
- ⑨ 铺满不滚动：看板外层高度固定 + overflow hidden，按内容/可用高度算缩放系数用 transform: scale 适配
  （工具栏显示当前缩放比例），页面本身不出现滚动条。
- ⑦ 全屏看板标题栏用 #header 插槽：标题左对齐、当天日期时间绝对居中（受「显示时间」开关控制，每分钟刷新）。

三、课表与周数
- ⑤ 学期周数可调：新增 Class.termWeeks（默认 20，迁移 + 维护脚本），班主任在班级管理里改；
  GET /api/dashboard/term?classId= 返回该班 maxWeek，课表周次下拉与新建课表的默认 weekEnd 都按它来
  （不再固定 30 周）。
- ⑩ 课表管理只保留「导入 ClassIsland 课程表」入口（时间表由课程表 JSON 的 TimeLayouts 一并带入），
  「导入时间配置」按钮下线；ui-smoke 第 7.7 段改为断言新弹窗（解析 4 行 + 单双周标签 + 旧入口已下线）。

四、以班级为单位（⑬）与 Web 端
- 个人学生账号登录停用：POST /api/auth/login 对 role=STUDENT 返回 403（改用班级码 + 班级密码）；
  学生行仍作为个人数据记录键由班级会话代全班读写；e2e 全面切换到班级会话并新增该断言。
- ④ 作业科目过少：新增共享 SUBJECT_CATALOG（16 个常见科目）+ 种子课程扩到全科目；
  Web 作业发布弹窗可选「其他科目（新建）」，提交前自动建课（同名复用）。
- ⑪ 通知支持多班批量发布（多选 + 逐班发布 + 汇总结果 + 二次确认覆盖所有选中班）；
  ⑫ 单班只显示已读情况、跨班才显示已读率；⑭ 手机端课表可横向滚动看全 7 天；
  ⑮ 手机端已连接不再显示孤立绿点（仅未连接时显示文字标签）；⑯ 手机端「叫人/发布通知」按钮同宽左对齐；
  ⑬ Web 学生管理去掉「用户名」列（新建自动生成学号式用户名，导入仍支持显式指定）。

验证：verify:e2e 149/149、verify:web 20/20、verify:desktop 75/75（复跑 68/68，打包便携版 75/75 packaged=true）、
typecheck / lint / format 全绿；服务端与 Web 已重新打包并部署到本机安装目录。
This commit is contained in:
LoveChengke committed 2026-09-13 08:39:11 +08:00
1 parent b8ef5d8dbb
commit 11008928a1
34 files changed
+1421 -340
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/web-admin/src/api/index.ts
+6 -1
View File
@@ -192,7 +192,12 @@ export const studentApi = {
export const dashboardApi = {
summary: (): Promise<DashboardSummary> => api.get(API_PATHS.dashboard),
term: (): Promise<{ currentWeek: number; maxWeek: number }> => api.get('/dashboard/term'),
/**
* 学期信息：`maxWeek` 是该班的教学周数（`Class.termWeeks`，班主任可调，默认 20），
* 不带 classId 时后端回退全局默认值。
*/
term: (classId?: string): Promise<{ currentWeek: number; maxWeek: number }> =>
api.get('/dashboard/term', classId ? { classId } : undefined),
};
/* ------------------------------------------------------------------ 协作教师 */
packages/web-admin/src/components/ClassPlanImportDialog.vue
+7 -2
View File
@@ -281,8 +281,13 @@ function parityLabel(item: ClassPlanEntryDto): string {
<template #default="{ row }">{{ row.startTime }}-{{ row.endTime }}</template>
</el-table-column>
<el-table-column prop="subject" label="科目" min-width="110" />
<el-table-column label="单双周" width="90">
<template #default="{ row }">{{ parityLabel(row) }}</template>
<el-table-column label="单双周" width="100">
<template #default="{ row }">
<el-tag v-if="row.weekParity !== 'ALL'" size="small" effect="plain">
{{ parityLabel(row) }}
</el-tag>
<span v-else class="text-muted">{{ parityLabel(row) }}</span>
</template>
</el-table-column>
<el-table-column prop="planName" label="来源" min-width="120" />
</el-table>
packages/web-admin/src/layouts/AdminLayout.vue
+17 -4
View File
@@ -87,6 +87,13 @@ const connectionType = computed(() =>
realtime.connected ? 'success' : realtime.connecting ? 'warning' : 'danger',
);
/**
* 小屏顶栏的实时通道提示：
* 连接正常时 **什么都不显示**（旧版只显示一个绿色圆点，看起来像坏掉的元素）；
* 只有"连接中 / 已断开"这种异常态才显示带文字的紧凑标签。
*/
const mobileConnectionText = computed(() => (realtime.connecting ? '重连中…' : '已断开'));
async function handleLogout(): Promise<void> {
await ElMessageBox.confirm('确认退出当前账号？', '退出登录', { type: 'warning' });
await auth.logout();
@@ -167,15 +174,15 @@ async function submitPassword(): Promise<void> {
<el-tag v-if="!isMobile" :type="connectionType" size="small" effect="light">
<span class="header-conn">{{ connectionText }}</span>
</el-tag>
<!-- 小屏：连接正常时不显示任何圆点/标签，只在异常态显示带文字的紧凑标签 -->
<el-tag
v-else
v-else-if="!realtime.connected"
:type="connectionType"
size="small"
effect="light"
class="header-conn-dot"
:title="connectionText"
class="header-conn-mobile"
>
<span class="conn-dot" :class="`conn-${connectionType}`"></span>
{{ mobileConnectionText }}
</el-tag>
<el-tag v-if="realtime.eventCount > 0 && !isMobile" size="small" type="info" effect="plain">
已接收 {{ realtime.eventCount }} 条实时事件
@@ -389,6 +396,12 @@ async function submitPassword(): Promise<void> {
.header-title {
font-size: 15px;
}
/* 异常态才出现的实时通道标签：紧凑、不挤占标题 */
.header-conn-mobile {
flex: 0 0 auto;
font-size: 11px;
}
}
</style>
packages/web-admin/src/styles/index.css
+9
View File
@@ -416,6 +416,15 @@ body {
justify-content: center;
}
/*
* 手机端按钮换行后各自独占整行：必须清掉 Element Plus 的 `.el-button + .el-button`
* 12px 左外边距，否则第二个按钮的"内容盒 + 12px"超出容器被 flex 压缩，
* 出现「宽度不一致、右边不齐」（通知页的「叫人 / 发布通知」就是这样）。
*/
.toolbar > .el-button + .el-button {
margin-left: 0;
}
/* 统计卡片：小屏两列 */
.stat-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
packages/web-admin/src/views/ClassesView.vue
+14 -2
View File
@@ -44,7 +44,7 @@ async function loadClasses(): Promise<void> {
const formVisible = ref(false);
const formRef = ref<FormInstance>();
const editingId = ref<string | null>(null);
const form = reactive({ name: '', grade: '', code: '' });
const form = reactive({ name: '', grade: '', code: '', termWeeks: 20 });
const rules: FormRules = {
name: [{ required: true, message: '请输入班级名称', trigger: 'blur' }],
grade: [{ required: true, message: '请输入年级', trigger: 'blur' }],
@@ -55,6 +55,7 @@ function openCreate(): void {
form.name = '';
form.grade = '';
form.code = '';
form.termWeeks = 20;
formVisible.value = true;
}
@@ -63,6 +64,7 @@ function openEdit(row: ClassDto): void {
form.name = row.name;
form.grade = row.grade;
form.code = '';
form.termWeeks = row.termWeeks ?? 20;
formVisible.value = true;
}
@@ -71,7 +73,11 @@ async function submitForm(): Promise<void> {
if (!valid) return;
if (editingId.value) {
await classApi.update(editingId.value, { name: form.name, grade: form.grade });
await classApi.update(editingId.value, {
name: form.name,
grade: form.grade,
termWeeks: form.termWeeks,
});
ElMessage.success('班级已更新');
} else {
await classApi.create({
@@ -395,6 +401,12 @@ onUnmounted(() => {
<el-form-item v-if="!editingId" label="班级码">
<el-input v-model="form.code" placeholder="留空自动生成（4~16 位字母数字）" />
</el-form-item>
<el-form-item label="学期周数">
<el-input-number v-model="form.termWeeks" :min="1" :max="40" :step="1" />
<span class="text-muted ml-8">
本学期一共多少教学周（默认 20）；课表周次选择与默认结束周都按它来
</span>
</el-form-item>
</el-form>
<template #footer>
<el-button @click="formVisible = false">取消</el-button>
packages/web-admin/src/views/HomeworksView.vue
+122 -4
View File
@@ -3,6 +3,7 @@ import { computed, onMounted, onUnmounted, reactive, ref } from 'vue';
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus';
import {
SOCKET_EVENTS,
SUBJECT_CATALOG,
formatDate,
truncate,
type ClassDto,
@@ -136,6 +137,38 @@ const form = reactive({
attachmentUrl: '',
});
/**
* 发布弹窗里的「其他科目（新建）」选项前缀。
* 下拉只有课程 id 一个 v-model，新建科目用 `subject:语文` 这种带前缀的伪值表达，
* 提交时再解析成「复用同名课程 / 新建课程」。
*/
const NEW_SUBJECT_PREFIX = 'subject:';
/** 弹窗里所选班级的课程（与页面筛选用的 courses 分开，避免互相污染） */
const formCourses = ref<CourseDto[]>([]);
/** 课程列表加载中：加载完成前不展示「其他科目（新建）」，避免把该班已有科目误当成新科目 */
const formCoursesLoading = ref(false);
/** 该班还没有的科目（来自 shared 的 SUBJECT_CATALOG） */
const newSubjectOptions = computed(() => {
const existing = new Set(formCourses.value.map((item) => item.name));
return SUBJECT_CATALOG.filter((name) => !existing.has(name));
});
async function loadFormCourses(): Promise<void> {
if (!form.classId) {
formCourses.value = [];
return;
}
formCoursesLoading.value = true;
try {
formCourses.value = await courseApi.list(form.classId);
} catch {
formCourses.value = [];
} finally {
formCoursesLoading.value = false;
}
}
const rules: FormRules = {
classId: [{ required: true, message: '请选择目标班级', trigger: 'change' }],
title: [{ required: true, message: '请输入作业标题', trigger: 'blur' }],
@@ -150,6 +183,7 @@ function openCreate(): void {
form.content = '';
form.attachmentUrl = '';
formVisible.value = true;
void loadFormCourses();
}
function openEdit(row: HomeworkDto): void {
@@ -160,15 +194,62 @@ function openEdit(row: HomeworkDto): void {
form.content = row.content;
form.attachmentUrl = row.attachmentUrl ?? '';
formVisible.value = true;
void loadFormCourses();
}
/** 弹窗里改班级：课程下拉要跟着换成该班的课程 */
async function onFormClassChange(): Promise<void> {
form.courseId = '';
await loadFormCourses();
}
/**
* 解析课程下拉的取值：
* - 已有课程 id → 直接用；
* - `subject:语文`（其他科目新建）→ 该班已有同名课程则复用，否则先 `courseApi.create` 建课再返回新 id；
* - 空 → 不关联课程。
*/
async function resolveCourseId(): Promise<string | null> {
const value = form.courseId;
if (!value) return null;
if (!value.startsWith(NEW_SUBJECT_PREFIX)) return value;
const name = value.slice(NEW_SUBJECT_PREFIX.length);
const reuse =
formCourses.value.find((item) => item.name === name) ??
(await courseApi.list(form.classId).catch(() => [])).find((item) => item.name === name);
if (reuse) return reuse.id;
try {
const created = await courseApi.create({ classId: form.classId, name });
formCourses.value = [...formCourses.value, created];
return created.id;
} catch (error) {
// 新建课程需要"管理员或本班班主任"权限（与课表管理一致），科任老师会被 403 拦截
ElMessage.error(
`新建科目「${name}」失败：${
error instanceof Error ? error.message : '仅班主任/管理员可以在班级下新建课程'
}，可改用已有课程或直接留空发布`,
);
throw error;
}
}
async function submitForm(): Promise<void> {
const valid = await formRef.value?.validate().catch(() => false);
if (!valid) return;
let courseId: string | null;
try {
courseId = await resolveCourseId();
} catch {
// 建课失败的提示已在 resolveCourseId 里给出，这里保持弹窗打开让老师改选
return;
}
const payload = {
classId: form.classId,
courseId: form.courseId || null,
courseId,
title: form.title.trim(),
content: form.content,
attachmentUrl: form.attachmentUrl.trim() || null,
@@ -281,14 +362,43 @@ onUnmounted(() => {
<el-dialog v-model="formVisible" :title="editingId ? '编辑作业' : '发布作业'" width="560px">
<el-form ref="formRef" :model="form" :rules="rules" label-width="90px">
<el-form-item label="目标班级" prop="classId">
<el-select v-model="form.classId" style="width: 100%" :disabled="Boolean(editingId)">
<el-select
v-model="form.classId"
style="width: 100%"
:disabled="Boolean(editingId)"
@change="onFormClassChange"
>
<el-option v-for="item in classes" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="所属课程">
<el-select v-model="form.courseId" placeholder="可选" clearable style="width: 100%">
<el-option v-for="item in courses" :key="item.id" :label="item.name" :value="item.id" />
<el-select
v-model="form.courseId"
placeholder="可选"
clearable
filterable
:loading="formCoursesLoading"
style="width: 100%"
>
<el-option-group v-if="formCourses.length" label="已有课程">
<el-option v-for="item in formCourses" :key="item.id" :label="item.name" :value="item.id" />
</el-option-group>
<el-option-group v-if="!formCoursesLoading && newSubjectOptions.length" label="其他科目（新建）">
<el-option
v-for="name in newSubjectOptions"
:key="`new-${name}`"
:label="name"
:value="`${NEW_SUBJECT_PREFIX}${name}`"
/>
</el-option-group>
</el-select>
<div class="form-hint">
{{
formCoursesLoading
? '正在加载该班课程…'
: '该班还没有的科目在「其他科目（新建）」里，选中后会自动建课再发布（需班主任/管理员）'
}}
</div>
</el-form-item>
<el-form-item label="标题" prop="title">
<el-input v-model="form.title" maxlength="120" show-word-limit />
@@ -396,6 +506,14 @@ onUnmounted(() => {
color: #f56c6c;
}
.form-hint {
width: 100%;
font-size: 12px;
line-height: 1.5;
color: #909399;
margin-top: 4px;
}
.content-block {
white-space: pre-wrap;
line-height: 1.7;
packages/web-admin/src/views/NotificationsView.vue
+190 -47
View File
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { onMounted, onUnmounted, reactive, ref } from 'vue';
import { computed, onMounted, onUnmounted, reactive, ref } from 'vue';
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus';
import {
CALL_QUICK_PHRASES,
@@ -25,12 +25,39 @@ const realtime = useRealtimeStore();
const loading = ref(false);
const classes = ref<ClassDto[]>([]);
const notifications = ref<NotificationDto[]>([]);
const studentCount = ref(0);
const filter = reactive({ classId: '', priority: '', keyword: '' });
/**
* 是否"单班视图"：选中了具体班级时列表只服务一个班。
* 单班视图只展示"已读情况"（已读 N 人 / 未读），跨班视图才展示已读率百分比。
*/
const isSingleClass = computed(() => Boolean(filter.classId));
/**
* 各班学生数（classId → 人数）。
* NotificationDto 只有 readCount（已读人数），没有 unreadCount / reads，
* 已读率的分母只能自己算，所以进入页面时按班级各取一次学生名单长度。
*/
const classStudentCounts = ref<Record<string, number>>({});
function classSizeOf(classId: string): number {
return classStudentCounts.value[classId] ?? 0;
}
async function loadClasses(): Promise<void> {
classes.value = await classApi.list();
if (!filter.classId && classes.value.length > 0) filter.classId = classes.value[0]?.id ?? '';
await loadClassStudentCounts();
}
async function loadClassStudentCounts(): Promise<void> {
const entries = await Promise.all(
classes.value.map(async (item) => {
const students = await classApi.students(item.id).catch(() => []);
return [item.id, students.length] as const;
}),
);
classStudentCounts.value = Object.fromEntries(entries);
}
async function loadNotifications(): Promise<void> {
@@ -41,11 +68,6 @@ async function loadNotifications(): Promise<void> {
if (filter.priority) params.priority = filter.priority;
if (filter.keyword.trim()) params.keyword = filter.keyword.trim();
notifications.value = await notificationApi.list(params);
if (filter.classId) {
const students = await classApi.students(filter.classId);
studentCount.value = students.length;
}
} finally {
loading.value = false;
}
@@ -121,89 +143,185 @@ async function submitCall(): Promise<void> {
const formVisible = ref(false);
const formRef = ref<FormInstance>();
const form = reactive<{ classId: string; title: string; content: string; priority: NotificationPriority }>({
classId: '',
const form = reactive<{
classIds: string[];
title: string;
content: string;
priority: NotificationPriority;
}>({
classIds: [],
title: '',
content: '',
priority: 'NORMAL',
});
const rules: FormRules = {
classId: [{ required: true, message: '请选择目标班级', trigger: 'change' }],
classIds: [{ required: true, type: 'array', min: 1, message: '请选择目标班级', trigger: 'change' }],
title: [{ required: true, message: '请输入通知标题', trigger: 'blur' }],
content: [{ required: true, message: '请输入通知内容', trigger: 'blur' }],
};
/** 上课时段发布紧急通知的全屏二次确认状态 */
/** 上课时段发布紧急通知的全屏二次确认状态（classIds = 本次要发布的班级） */
const urgentWarning = reactive({
visible: false,
period: null as ClassPeriod | null,
title: '',
classIds: [] as string[],
});
function classNameOf(classId: string): string {
return classes.value.find((item) => item.id === classId)?.name ?? classId;
}
async function openCreate(): Promise<void> {
// 班级列表可能还没加载完（进入页面后立刻点按钮）：先补一次，避免「目标班级」为空导致校验失败
if (classes.value.length === 0) await loadClasses().catch(() => undefined);
form.classId = filter.classId || classes.value[0]?.id || '';
form.classIds = filter.classId ? [filter.classId] : classes.value[0] ? [classes.value[0].id] : [];
form.title = '';
form.content = '';
form.priority = 'NORMAL';
formVisible.value = true;
}
/**
* 上课时段检查：多班发布时逐班查询（GET /api/schedules/current?classId=...），
* 任一班级正在上课就需要二次确认；返回命中的班级与时段。
*/
async function findClassInSession(
classIds: string[],
): Promise<{ classId: string; period: ClassPeriod | null } | null> {
const results = await Promise.all(
classIds.map(async (classId) => {
const status = await scheduleApi.classStatus(classId).catch(() => null);
return status?.inClass ? { classId, period: status.current } : null;
}),
);
return results.find((item) => item !== null) ?? null;
}
async function submitForm(): Promise<void> {
const valid = await formRef.value?.validate().catch(() => false);
if (!valid) return;
// 上课时段发布紧急通知：先查询班级上课状态，命中则弹全屏二次确认（3 秒倒计时）
const classIds = [...form.classIds];
if (classIds.length === 0) {
ElMessage.warning('请至少选择一个目标班级');
return;
}
// 上课时段发布紧急通知：先查询所有目标班级的上课状态，任一命中则弹全屏二次确认（3 秒倒计时）
if (form.priority === 'URGENT') {
const status = await scheduleApi.classStatus(form.classId).catch(() => null);
if (status?.inClass) {
urgentWarning.period = status.current;
const hit = await findClassInSession(classIds);
if (hit) {
urgentWarning.period = hit.period;
urgentWarning.title = form.title.trim();
urgentWarning.classIds = classIds;
urgentWarning.visible = true;
return;
}
}
await doPublish(false);
await doPublish(classIds, false);
}
/** 真正提交；confirmDuringClass 为 true 表示教师已在上课警告中确认 */
async function doPublish(confirmDuringClass: boolean): Promise<void> {
try {
const created = await notificationApi.create({
classId: form.classId,
title: form.title.trim(),
content: form.content,
priority: form.priority,
...(confirmDuringClass ? { confirmDuringClass: true } : {}),
});
ElMessage.success(`通知已发布（${created.title}），已推送给学生客户端`);
formVisible.value = false;
await loadNotifications();
} catch (error) {
// 兜底：并发场景下服务端仍可能拦截（例如刚好上课铃响），此时同样弹出警告
/** 单个班级的发布失败信息（用于汇总提示） */
interface PublishFailure {
classId: string;
reason: string;
/** 服务端因"上课时段紧急通知"拦截（409 URGENT_DURING_CLASS） */
urgentConflict: boolean;
period: ClassPeriod | null;
}
/**
* 真正提交：对每个班级各调一次 `POST /api/notifications`（Promise.allSettled），
* confirmDuringClass 为 true 表示教师已在上课警告中确认。
*/
async function doPublish(classIds: string[], confirmDuringClass: boolean): Promise<void> {
if (classIds.length === 0) return;
const payload = {
title: form.title.trim(),
content: form.content,
priority: form.priority,
...(confirmDuringClass ? { confirmDuringClass: true } : {}),
};
const settled = await Promise.allSettled(
classIds.map((classId) => notificationApi.create({ ...payload, classId })),
);
let successCount = 0;
const failures: PublishFailure[] = [];
settled.forEach((result, index) => {
if (result.status === 'fulfilled') {
successCount += 1;
return;
}
const response = (
error as {
response?: { status?: number; data?: { code?: string; details?: { current?: ClassPeriod | null } } };
result.reason as {
response?: {
status?: number;
data?: { code?: string; message?: string; details?: { current?: ClassPeriod | null } };
};
}
).response;
if (response?.status === 409 && response.data?.code === 'URGENT_DURING_CLASS') {
urgentWarning.period = response.data.details?.current ?? null;
urgentWarning.title = form.title.trim();
urgentWarning.visible = true;
}
failures.push({
classId: classIds[index] ?? '',
reason:
response?.data?.message ?? (result.reason instanceof Error ? result.reason.message : '发布失败'),
urgentConflict: response?.status === 409 && response?.data?.code === 'URGENT_DURING_CLASS',
period: response?.data?.details?.current ?? null,
});
});
// 兜底：并发场景下服务端仍可能拦截（例如刚好上课铃响），对这批班级重新走一次二次确认
const conflicted = failures.filter((item) => item.urgentConflict);
const pendingConfirm = !confirmDuringClass && conflicted.length > 0;
if (pendingConfirm) {
urgentWarning.period = conflicted[0]?.period ?? null;
urgentWarning.title = form.title.trim();
urgentWarning.classIds = conflicted.map((item) => item.classId);
urgentWarning.visible = true;
}
const reported = confirmDuringClass ? failures : failures.filter((item) => !item.urgentConflict);
reportPublishResult(successCount, reported);
if (successCount > 0) {
// 有班级发布成功：关掉弹窗并刷新列表（仍需二次确认时保留弹窗内的数据）
formVisible.value = !pendingConfirm;
await loadNotifications();
}
}
/** 多班发布结果汇总：成功 N 个班、失败 M 个班（失败列出班级名 + 原因） */
function reportPublishResult(successCount: number, failures: PublishFailure[]): void {
if (successCount === 0 && failures.length === 0) return;
if (failures.length === 0) {
ElMessage.success(`通知已发布到 ${successCount} 个班级，已推送给学生客户端`);
return;
}
const detail = failures.map((item) => `${classNameOf(item.classId)}（${item.reason}）`).join('；');
ElMessage({
type: successCount > 0 ? 'warning' : 'error',
message: `成功 ${successCount} 个班，失败 ${failures.length} 个班｜${detail}`,
duration: 6000,
showClose: true,
});
}
function onUrgentConfirmed(): void {
const classIds = [...urgentWarning.classIds];
urgentWarning.visible = false;
void doPublish(true);
urgentWarning.classIds = [];
void doPublish(classIds, true);
}
function onUrgentCancelled(): void {
urgentWarning.visible = false;
urgentWarning.classIds = [];
ElMessage.info('已取消发布，紧急通知未发出');
}
@@ -214,9 +332,11 @@ async function removeNotification(row: NotificationDto): Promise<void> {
await loadNotifications();
}
/** 已读率（跨班视图使用）：分母按该通知所属班级的学生数算 */
function readRate(row: NotificationDto): number {
if (!studentCount.value) return 0;
return Math.round(((row.readCount ?? 0) / studentCount.value) * 100);
const total = classSizeOf(row.classId);
if (!total) return 0;
return Math.round(((row.readCount ?? 0) / total) * 100);
}
function onNotificationEvent(): void {
@@ -245,6 +365,7 @@ onUnmounted(() => {
<el-select
v-model="filter.classId"
placeholder="选择班级"
clearable
style="width: 170px"
@change="loadNotifications"
>
@@ -303,10 +424,24 @@ onUnmounted(() => {
<div class="text-muted">{{ relativeTime(row.createdAt) }}</div>
</template>
</el-table-column>
<el-table-column label="已读率" width="150">
<el-table-column :label="isSingleClass ? '已读情况' : '已读率'" width="150">
<template #default="{ row }">
<el-progress :percentage="readRate(row)" :stroke-width="10" />
<span class="text-muted">{{ row.readCount ?? 0 }}/{{ studentCount }} 人</span>
<!--
单班视图：只显示该通知的已读情况（不显示百分比）。
NotificationDto 只有 readCount（已读人数），没有 unreadCount / reads 明细，
所以这里用「已读 N 人 / 未读」标签 + 班级总人数表达已读情况。
-->
<template v-if="isSingleClass">
<el-tag :type="(row.readCount ?? 0) > 0 ? 'success' : 'info'" size="small" effect="light">
{{ (row.readCount ?? 0) > 0 ? `已读 ${row.readCount} 人` : '未读' }}
</el-tag>
<div class="text-muted">共 {{ classSizeOf(row.classId) }} 人</div>
</template>
<!-- 跨班视图（未选具体班级）：显示已读率百分比，分母按该通知所属班级算 -->
<template v-else>
<el-progress :percentage="readRate(row)" :stroke-width="10" />
<span class="text-muted">{{ row.readCount ?? 0 }}/{{ classSizeOf(row.classId) }} 人</span>
</template>
</template>
</el-table-column>
<el-table-column label="操作" width="90" fixed="right">
@@ -319,8 +454,16 @@ onUnmounted(() => {
<el-dialog v-model="formVisible" title="发布通知" width="560px">
<el-form ref="formRef" :model="form" :rules="rules" label-width="90px">
<el-form-item label="目标班级" prop="classId">
<el-select v-model="form.classId" style="width: 100%">
<el-form-item label="目标班级" prop="classIds">
<el-select
v-model="form.classIds"
multiple
filterable
collapse-tags
collapse-tags-tooltip
placeholder="可多选；发布时逐班提交"
style="width: 100%"
>
<el-option v-for="item in classes" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
packages/web-admin/src/views/SchedulesView.vue
+32 -26
View File
@@ -19,7 +19,6 @@ import {
} from '@classhelper/shared';
import { classApi, courseApi, dashboardApi, scheduleApi } from '@/api';
import ClassPlanImportDialog from '@/components/ClassPlanImportDialog.vue';
import TimeLayoutImportDialog from '@/components/TimeLayoutImportDialog.vue';
import { useAuthStore } from '@/stores/auth';
import { useRealtimeStore } from '@/stores/realtime';
@@ -73,13 +72,27 @@ function cellItems(period: { items: ScheduleDto[] }, dayOfWeek: number): Schedul
return period.items.filter((item) => item.dayOfWeek === dayOfWeek);
}
/**
* 学期信息（班级维度）：`maxWeek` = 该班教学周数（`Class.termWeeks`，默认 20）。
* 切换班级时要重新取一次，并按新上限收敛周次下拉与当前选中周，
* 避免出现"实际 20 周却给到 30 周"或选中一个不存在的周。
*/
async function loadTerm(): Promise<void> {
const term = await dashboardApi.term(query.classId || undefined).catch(() => null);
if (!term) return;
weekOptions.value = buildWeekOptions(term.maxWeek);
const maxWeek = weekOptions.value.at(-1) ?? term.maxWeek;
if (query.week > maxWeek) query.week = maxWeek;
if (query.week < 1) query.week = 1;
}
async function loadBase(): Promise<void> {
const [classList, term] = await Promise.all([classApi.list(), dashboardApi.term()]);
classes.value = classList;
weekOptions.value = buildWeekOptions(term.maxWeek);
query.week = term.currentWeek;
query.week = Math.min(Math.max(term.currentWeek, 1), weekOptions.value.at(-1) ?? term.maxWeek);
if (!query.classId && classList.length > 0) query.classId = classList[0]?.id ?? '';
if (query.classId) await loadCourses();
if (query.classId) await Promise.all([loadCourses(), loadTerm()]);
}
async function loadCourses(): Promise<void> {
@@ -106,6 +119,7 @@ async function loadSchedules(): Promise<void> {
}
async function onClassChange(): Promise<void> {
await loadTerm();
await loadCourses();
await loadSchedules();
}
@@ -211,18 +225,6 @@ function onScheduleEvent(): void {
void loadSchedules();
}
/* ------------------------------------------------------------ ClassIsland 时间配置导入 */
const timeLayoutVisible = ref(false);
function openTimeLayoutImport(): void {
if (!query.classId) {
ElMessage.warning('请先选择班级');
return;
}
timeLayoutVisible.value = true;
}
/* ------------------------------------------------------------ ClassIsland 课程表导入（支持单双周） */
const classPlanVisible = ref(false);
@@ -276,9 +278,6 @@ onUnmounted(() => {
<el-button v-if="canManageSchedule" type="primary" :icon="'Plus'" @click="openCreate">
新增课表
</el-button>
<el-button v-if="canManageSchedule" type="warning" :icon="'Upload'" @click="openTimeLayoutImport">
导入时间配置
</el-button>
<el-button
v-if="canManageSchedule"
type="warning"
@@ -291,7 +290,7 @@ onUnmounted(() => {
</div>
</div>
<el-card v-loading="loading" shadow="never" class="table-card">
<el-card v-loading="loading" shadow="never" class="table-card timetable-card">
<template #header>
<div class="toolbar">
<span>
@@ -386,13 +385,6 @@ onUnmounted(() => {
</template>
</el-dialog>
<!-- ClassIsland 时间配置导入（覆盖 / 合并，失败不改动原配置） -->
<TimeLayoutImportDialog
v-model="timeLayoutVisible"
:class-id="query.classId"
:class-name="classes.find((item) => item.id === query.classId)?.name"
/>
<!-- ClassIsland 课程表导入（支持单双周；导入成功后刷新周视图与列表） -->
<ClassPlanImportDialog
v-model="classPlanVisible"
@@ -402,3 +394,17 @@ onUnmounted(() => {
/>
</div>
</template>
<style scoped>
/*
* 手机端周视图：7 天列各 130px + 节次列 120px ≈ 1030px，
* 直接把表格最小宽度撑到 1040px，让单元格保持可读宽度；
* 外层 el-card__body（全局 .table-card 规则）已是 overflow-x:auto，
* 因此手指左右拖动能在卡片内看全周一~周日，页面本身不横向滚动。
*/
@media (max-width: 768px) {
.timetable-card .el-table {
min-width: 1040px;
}
}
</style>
packages/web-admin/src/views/StudentsView.vue
+54 -20
View File
@@ -47,18 +47,14 @@ function openImport(): void {
const formVisible = ref(false);
const formRef = ref<FormInstance>();
const editingId = ref<string | null>(null);
const form = reactive({ username: '', name: '', password: '', classId: '' });
/** 表单不再暴露「用户名」：新建时由前端自动生成学号式登录名（见 autoCreateStudent） */
const form = reactive({ name: '', password: '', classId: '' });
const rules: FormRules = {
username: [
{ required: true, message: '请输入用户名', trigger: 'blur' },
{ min: 3, message: '用户名至少 3 位', trigger: 'blur' },
],
name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
};
function openCreate(): void {
editingId.value = null;
form.username = '';
form.name = '';
form.password = '';
form.classId = filter.classId;
@@ -67,32 +63,74 @@ function openCreate(): void {
function openEdit(row: StudentDto): void {
editingId.value = row.id;
form.username = row.username;
form.name = row.name;
form.password = '';
form.classId = row.classId ?? '';
formVisible.value = true;
}
/**
* 自动生成学生登录名（学号式：student01、student02 …，与种子数据 student01~student15 同风格）。
*
* 后端 `POST /api/students` 的 username 是必填且全局唯一的（教师/管理员账号同样占位），
* 界面已按需求隐藏「用户名」输入，因此这里用「全量学生账号 + 递增序号」生成，
* 并在服务端返回 409（唯一约束冲突，例如并发创建或撞上教师账号）时换下一个序号重试；
* 其它错误（姓名/密码不合法等）立即抛出，不再重试，避免刷屏。
*/
function studentUsernameAt(index: number): string {
return index < 100 ? `student${String(index).padStart(2, '0')}` : `student${index}`;
}
async function autoCreateStudent(): Promise<void> {
const existing = new Set((await studentApi.list()).map((item) => item.username));
let index = existing.size + 1;
let lastError: unknown = new Error('自动生成学生账号失败');
for (let attempt = 0; attempt < 20; attempt += 1) {
let username = studentUsernameAt(index);
while (existing.has(username)) {
index += 1;
username = studentUsernameAt(index);
}
try {
await studentApi.create({
username,
name: form.name.trim(),
classId: form.classId || null,
...(form.password ? { password: form.password } : {}),
});
return;
} catch (error) {
const status = (error as { response?: { status?: number } }).response?.status;
if (status !== 409) throw error;
lastError = error;
existing.add(username);
index += 1;
}
}
throw lastError;
}
async function submitForm(): Promise<void> {
const valid = await formRef.value?.validate().catch(() => false);
if (!valid) return;
if (editingId.value) {
// 用户名不再由界面维护：编辑只改姓名与班级
await studentApi.update(editingId.value, {
username: form.username.trim(),
name: form.name.trim(),
classId: form.classId || null,
});
ElMessage.success('学生信息已更新');
} else {
await studentApi.create({
username: form.username.trim(),
name: form.name.trim(),
classId: form.classId || null,
...(form.password ? { password: form.password } : {}),
});
ElMessage.success('学生账号创建成功');
try {
await autoCreateStudent();
ElMessage.success('学生账号创建成功（登录名已自动生成）');
} catch {
// 接口层已弹出服务端原因，这里补充可执行的兜底建议
ElMessage.error('创建失败：可稍后重试，或用「导入名单」在表格里显式指定用户名');
return;
}
}
formVisible.value = false;
await loadStudents();
@@ -185,7 +223,7 @@ async function submitCall(): Promise<void> {
</el-select>
<el-input
v-model="filter.keyword"
placeholder="姓名 / 用户名"
placeholder="姓名"
clearable
style="width: 180px"
@keyup.enter="loadStudents"
@@ -199,7 +237,6 @@ async function submitCall(): Promise<void> {
<el-card shadow="never" class="table-card">
<el-table v-loading="loading" :data="students" empty-text="暂无学生数据">
<el-table-column prop="username" label="用户名" width="140" />
<el-table-column prop="name" label="姓名" width="120" />
<el-table-column label="角色" width="90">
<template #default="{ row }">{{ ROLE_LABELS[row.role as 'STUDENT'] ?? row.role }}</template>
@@ -289,9 +326,6 @@ async function submitCall(): Promise<void> {
<el-dialog v-model="formVisible" :title="editingId ? '编辑学生' : '新建学生'" width="460px">
<el-form ref="formRef" :model="form" :rules="rules" label-width="90px">
<el-form-item label="用户名" prop="username">
<el-input v-model="form.username" :disabled="Boolean(editingId)" />
</el-form-item>
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" />
</el-form-item>