feat: 客户端灵动岛 + 上课时段紧急通知二次确认，并修复打包/校验脚本在 Electron 宿主下的多个缺陷

## 客户端灵动岛（动态岛） - 新增独立透明置顶窗口：桌面中上方常驻、不占任务栏、不抢焦点（268x44 胶囊 / 404x316 详情 / 424x344 紧急） - 三种形态与动画：隐藏 ↔ 胶囊 ↔ 详情，尺寸用 easeOutCubic 260ms 逐帧缓动、透明度单独淡入淡出（尺寸与淡入使用各自动画令牌，避免互相打断导致窗口卡在胶囊尺寸） - 行为：普通通知变「新消息 · 共 N 条」胶囊，点击展开详情；上课时段自动隐藏并进入待发队列，下课后自动弹出；紧急通知无论是否上课立即展开（红色呼吸光晕 + 紧急角标，无需点击） - 上课状态来自 GET /api/schedules/current（10s 心跳 + 下课时长定时器），新增 src/main/island.ts（控制器/IPC）、src/preload/island.ts、src/island/IslandApp.vue、 src/renderer/island/bridge.ts、island.html 与多页 Vite 构建 ## 上课时段发布紧急通知的二次确认 - 服务端：priority=URGENT 且当前处于上课时间段且未带 confirmDuringClass 时返回 409 URGENT_DURING_CLASS（携带 current/next/week/serverTime），绕过界面调接口同样被拦截 - 新增 GET /api/schedules/current（inClass/current/next，at 参数用于诊断与测试） - Web 管理端：全屏警告遮罩（UrgentClassWarning.vue），显示正在上的课时段与待发布标题，确认按钮带 3 秒倒计时（圆环进度，倒计时结束前禁用），取消即不发；并发命中 409 同样兜底弹窗 ## 打包与验证脚本修复（Electron 宿主环境） - scripts/lib/node-runtime.mjs：定位真正的 node.exe。此前经 pnpm 运行时 process.execPath 指向 Electron，dist:server 会把 Electron 复制成安装包内的 node.exe，dist:win 会让 electron-builder 报 Unknown argument: .../cli.js（改为显式使用真实 Node） - scripts/lib/electron-env.mjs：启动 Electron 前清理继承的 ELECTRON_RUN_AS_NODE（否则 Electron 退化为纯 Node，require('electron') 直接 MODULE_NOT_FOUND），并从 path.txt 定位 electron.exe （process.versions.electron 存在时 import 'electron' 返回的是 API 对象而非路径） - scripts/dist-server.mjs：新增构建产物新鲜度校验（曾出现 server 已重建但打进安装包的 shared/dist 是旧的，安装后服务启动即报 does not provide an export named MAX_TERM_WEEK） - scripts/ui-smoke：新增 live-probe.mjs 真实制造/清理上课时段，Electron 驱动真实点击断言全屏警告文案、按钮禁用与 3 秒倒计时时长（实测 2966ms），测试后自动删除探针课表与测试通知 ## 验证结果 - pnpm verify:e2e 62/62（新增上课时段拦截、二次确认后发布、普通通知不受限等 8 项） - pnpm verify:web 8/8（新增上课时段紧急通知全屏警告 + 倒计时） - pnpm verify:desktop 18/18（新增灵动岛窗口/上课隐藏/下课弹出/紧急立即展开/胶囊点击展开 + 截图） - 打包后 EXE 冒烟 15/15（packaged: true，退出码 0） - 服务端安装程序升级安装：.env 与数据库保持不变，/api/schedules/current 正常 - pnpm lint / format:check / typecheck 全部通过
2026-09-12 08:41:08 +08:00
1 parent 5545ef6f55
commit 3a9f8812fc
@@ -2,6 +2,7 @@ import {
  API_PATHS,
  type ClassDetailDto,
  type ClassDto,
+  type ClassStatusDto,
  type CourseDto,
  type CreateClassRequest,
  type CreateCourseRequest,
@@ -76,6 +77,9 @@ export const scheduleApi = {
    api.get(API_PATHS.schedules, params),
  grid: (params: { classId?: string; week?: number }): Promise<ScheduleWeekView> =>
    api.get(`${API_PATHS.schedules}/grid`, params),
+  /** 班级当前上课状态：上课时段发布紧急通知时必须先二次确认 */
+  classStatus: (classId: string): Promise<ClassStatusDto> =>
+    api.get(`${API_PATHS.schedules}/current`, { classId }),
  create: (payload: CreateScheduleRequest): Promise<ScheduleDto> => api.post(API_PATHS.schedules, payload),
  update: (id: string, payload: Partial<CreateScheduleRequest>): Promise<ScheduleDto> =>
    api.patch(`${API_PATHS.schedules}/${id}`, payload),
@@ -0,0 +1,291 @@
+<script setup lang="ts">
+import { computed, onUnmounted, ref, watch } from 'vue';
+import { formatClassPeriod, type ClassPeriod } from '@classhelper/shared';
+
+/**
+ * 上课时段发布紧急通知的全屏二次确认。
+ *
+ * 设计要点：
+ * - 全屏遮罩 + 强警示配色，明确告知"会干扰上课"
+ * - 确认按钮有 3 秒倒计时保护，倒计时结束前不可点击（避免误触连点）
+ * - 倒计时以圆环进度可视化，并给出每秒反馈
+ */
+const props = defineProps<{
+  visible: boolean;
+  period: ClassPeriod | null;
+  pendingTitle: string;
+}>();
+
+const emit = defineEmits<{
+  (event: 'cancel'): void;
+  (event: 'confirm'): void;
+}>();
+
+const COUNTDOWN_SECONDS = 3;
+
+const remaining = ref(COUNTDOWN_SECONDS);
+let timer: ReturnType<typeof setInterval> | null = null;
+
+const periodText = computed(() => formatClassPeriod(props.period));
+const canConfirm = computed(() => remaining.value <= 0);
+const progress = computed(() => ((COUNTDOWN_SECONDS - remaining.value) / COUNTDOWN_SECONDS) * 100);
+
+function stopTimer(): void {
+  if (timer) {
+    clearInterval(timer);
+    timer = null;
+  }
+}
+
+function startCountdown(): void {
+  stopTimer();
+  remaining.value = COUNTDOWN_SECONDS;
+  timer = setInterval(() => {
+    remaining.value -= 1;
+    if (remaining.value <= 0) {
+      remaining.value = 0;
+      stopTimer();
+    }
+  }, 1000);
+}
+
+watch(
+  () => props.visible,
+  (visible) => {
+    if (visible) startCountdown();
+    else stopTimer();
+  },
+);
+
+onUnmounted(stopTimer);
+
+function handleCancel(): void {
+  stopTimer();
+  emit('cancel');
+}
+
+function handleConfirm(): void {
+  if (!canConfirm.value) return;
+  stopTimer();
+  emit('confirm');
+}
+</script>
+
+<template>
+  <Teleport to="body">
+    <Transition name="urgent-fade">
+      <div v-if="visible" class="urgent-mask" role="alertdialog" aria-modal="true">
+        <div class="urgent-card">
+          <div class="urgent-icon">
+            <el-icon :size="34"><WarningFilled /></el-icon>
+          </div>
+
+          <h2 class="urgent-title">现在为上课时间段</h2>
+          <p class="urgent-subtitle">
+            如果发布
+            <strong>紧急</strong>
+            通知，会干扰正在进行的课堂，请再次确认。
+          </p>
+
+          <div v-if="period" class="urgent-period">
+            <span class="period-label">正在上课</span>
+            <span class="period-value">{{ periodText }}</span>
+          </div>
+
+          <div class="urgent-preview">
+            <span class="preview-label">即将发布</span>
+            <span class="preview-title">{{ pendingTitle || '（无标题）' }}</span>
+          </div>
+
+          <div class="urgent-actions">
+            <el-button size="large" @click="handleCancel">取消发布</el-button>
+
+            <el-button size="large" type="danger" :disabled="!canConfirm" @click="handleConfirm">
+              <template v-if="canConfirm">确认发布紧急通知</template>
+              <template v-else>请等待 {{ remaining }} 秒…</template>
+            </el-button>
+          </div>
+
+          <div class="urgent-progress">
+            <div v-if="!canConfirm" class="progress-ring">
+              <el-progress
+                type="circle"
+                :percentage="progress"
+                :width="46"
+                :stroke-width="4"
+                :show-text="false"
+                color="#f56c6c"
+              />
+              <span class="ring-text">{{ remaining }}</span>
+            </div>
+            <span class="progress-hint">
+              {{
+                canConfirm
+                  ? '倒计时结束，请谨慎确认是否真的需要立即打扰课堂'
+                  : '正在为你预留 3 秒冷静时间，避免误触打扰课堂'
+              }}
+            </span>
+          </div>
+        </div>
+      </div>
+    </Transition>
+  </Teleport>
+</template>
+
+<style scoped>
+.urgent-mask {
+  position: fixed;
+  inset: 0;
+  z-index: 3000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(20, 12, 12, 0.62);
+  backdrop-filter: blur(6px);
+}
+
+.urgent-card {
+  width: 520px;
+  max-width: calc(100vw - 48px);
+  padding: 28px 30px 22px;
+  border-radius: 16px;
+  background: #fff;
+  border-top: 4px solid #f56c6c;
+  box-shadow: 0 24px 60px rgba(120, 20, 20, 0.35);
+  text-align: center;
+}
+
+.urgent-icon {
+  width: 64px;
+  height: 64px;
+  margin: 0 auto 12px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #f56c6c;
+  background: #fef0f0;
+  animation: urgent-pulse 1.4s ease-in-out infinite;
+}
+
+@keyframes urgent-pulse {
+  0%,
+  100% {
+    box-shadow: 0 0 0 0 rgba(245, 108, 108, 0.45);
+    transform: scale(1);
+  }
+  50% {
+    box-shadow: 0 0 0 14px rgba(245, 108, 108, 0);
+    transform: scale(1.04);
+  }
+}
+
+.urgent-title {
+  margin: 0 0 8px;
+  font-size: 22px;
+  color: #303133;
+}
+
+.urgent-subtitle {
+  margin: 0 0 18px;
+  font-size: 14px;
+  line-height: 1.7;
+  color: #606266;
+}
+
+.urgent-subtitle strong {
+  color: #f56c6c;
+}
+
+.urgent-period,
+.urgent-preview {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 10px 14px;
+  border-radius: 10px;
+  margin-bottom: 10px;
+  text-align: left;
+  font-size: 13px;
+}
+
+.urgent-period {
+  background: #fef0f0;
+}
+
+.urgent-preview {
+  background: #f5f7fa;
+}
+
+.period-label,
+.preview-label {
+  flex: 0 0 64px;
+  color: #909399;
+}
+
+.period-value {
+  color: #f56c6c;
+  font-weight: 600;
+}
+
+.preview-title {
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.urgent-actions {
+  display: flex;
+  gap: 12px;
+  justify-content: center;
+  margin: 18px 0 12px;
+}
+
+.urgent-progress {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  min-height: 52px;
+}
+
+.progress-ring {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.ring-text {
+  position: absolute;
+  font-size: 15px;
+  font-weight: 700;
+  color: #f56c6c;
+}
+
+.progress-hint {
+  font-size: 12px;
+  color: #909399;
+}
+
+.urgent-fade-enter-active,
+.urgent-fade-leave-active {
+  transition: opacity 0.22s ease;
+}
+
+.urgent-fade-enter-active .urgent-card,
+.urgent-fade-leave-active .urgent-card {
+  transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
+}
+
+.urgent-fade-enter-from,
+.urgent-fade-leave-to {
+  opacity: 0;
+}
+
+.urgent-fade-enter-from .urgent-card,
+.urgent-fade-leave-to .urgent-card {
+  transform: scale(0.92) translateY(10px);
+}
+</style>
@@ -10,11 +10,13 @@ import {
  relativeTime,
  truncate,
  type ClassDto,
+  type ClassPeriod,
  type NotificationDto,
  type NotificationPriority,
 } from '@classhelper/shared';
-import { classApi, notificationApi } from '@/api';
+import { classApi, notificationApi, scheduleApi } from '@/api';
 import { useRealtimeStore } from '@/stores/realtime';
+import UrgentClassWarning from '@/components/UrgentClassWarning.vue';

 const realtime = useRealtimeStore();

@@ -64,6 +66,13 @@ const rules: FormRules = {
  content: [{ required: true, message: '请输入通知内容', trigger: 'blur' }],
 };

+/** 上课时段发布紧急通知的全屏二次确认状态 */
+const urgentWarning = reactive({
+  visible: false,
+  period: null as ClassPeriod | null,
+  title: '',
+});
+
 function openCreate(): void {
  form.classId = filter.classId || classes.value[0]?.id || '';
  form.title = '';
@@ -76,15 +85,56 @@ async function submitForm(): Promise<void> {
  const valid = await formRef.value?.validate().catch(() => false);
  if (!valid) return;

-  const created = await notificationApi.create({
-    classId: form.classId,
-    title: form.title.trim(),
-    content: form.content,
-    priority: form.priority,
-  });
-  ElMessage.success(`通知已发布（${created.title}），已推送给学生客户端`);
-  formVisible.value = false;
-  await loadNotifications();
+  // 上课时段发布紧急通知：先查询班级上课状态，命中则弹全屏二次确认（3 秒倒计时）
+  if (form.priority === 'URGENT') {
+    const status = await scheduleApi.classStatus(form.classId).catch(() => null);
+    if (status?.inClass) {
+      urgentWarning.period = status.current;
+      urgentWarning.title = form.title.trim();
+      urgentWarning.visible = true;
+      return;
+    }
+  }
+
+  await doPublish(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) {
+    // 兜底：并发场景下服务端仍可能拦截（例如刚好上课铃响），此时同样弹出警告
+    const response = (
+      error as {
+        response?: { status?: number; data?: { code?: 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;
+    }
+  }
+}
+
+function onUrgentConfirmed(): void {
+  urgentWarning.visible = false;
+  void doPublish(true);
+}
+
+function onUrgentCancelled(): void {
+  urgentWarning.visible = false;
+  ElMessage.info('已取消发布，紧急通知未发出');
 }

 async function removeNotification(row: NotificationDto): Promise<void> {
@@ -222,5 +272,14 @@ onUnmounted(() => {
        <el-button type="primary" @click="submitForm">立即发布</el-button>
      </template>
    </el-dialog>
+
+    <!-- 上课时段发布紧急通知的全屏二次确认（3 秒倒计时） -->
+    <UrgentClassWarning
+      :visible="urgentWarning.visible"
+      :period="urgentWarning.period"
+      :pending-title="urgentWarning.title"
+      @cancel="onUrgentCancelled"
+      @confirm="onUrgentConfirmed"
+    />
  </div>
 </template>