LoveChengke
f759aac0a2
feat(web-admin): 手机小屏适配（1Panel 风格抽屉导航）并补齐移动端自动化验证
## 布局与交互（沿用 1Panel 风格）
- 新增 `src/composables/useResponsive.ts`：断点 768 / 992px + resize/orientationchange 监听
- `AdminLayout.vue`：
- >992px 桌面保持原样（210px 深色侧栏 + 顶栏连接状态 + "已接收 N 条实时事件"）
- <=768px 手机：侧边栏不再渲染，顶栏出现汉堡按钮（`aria-expanded` 标记状态），
点击唤出 240px 深色抽屉菜单，点菜单项自动收起；顶栏显示当前页标题，
用户菜单收成头像图标（身份信息移入下拉菜单首行）
- 复用同一套 `.ch-sidebar` 样式，抽屉内容与桌面侧栏视觉一致
- `styles/index.css` 增加全局响应式规则：工具栏控件铺满整行、`.table-card` 表格卡片内横向滚动、
弹窗 `calc(100vw - 24px)`、消息框/抽屉自适应、`.stat-grid` 小屏两列、分页居中、标签页可横滑
- 各视图：7 个表格卡片加 `.table-card`；班级详情/作业详情的 `el-descriptions` 小屏降为单列；
登录页卡片自适应宽度并加安全内边距
## 自动化验证（scripts/ui-smoke）
- 新增 `runMobileChecks`：把窗口真实缩到 390×844，用真实点击验证 7 项——
侧边栏收起 + 汉堡出现、抽屉滑出且菜单完整、抽屉内点击"通知发布"跳转并收起、
页面无横向溢出（表格自身滚动不计入）、表格在卡片内可滚动、工具栏控件铺满、弹窗宽度自适应
- 移动端截图留档到 `docs/screenshots/web-mobile/`（`UI_SMOKE_SHOTS_DIR` 可覆盖）
- 踩坑修复：隐藏窗口下 Chromium 会冻结 CSS transition，Vue `<Transition>` 收不到 transitionend，
Element Plus 抽屉会卡在 `enter-from`（表现为"点了没反应"）——移动端检查改为 `showInactive()` 并断言
"抽屉滑到位/收起到位"，而不是只看元素是否存在
## 安装包升级健壮性
- `scripts/nsis/server-installer.nsi`：覆盖安装前先 `RMDir /r web|server|node_modules`，
避免旧 hash 分片、旧 dist 模块、旧依赖残留导致"新旧版本混装"
（此前 web/assets 里累积了 4 份 AdminLayout 分片）
## 验证结果（均在安装后的生产实例上）
- `pnpm verify:web` 15/15 ✅（8 项原有 + 7 项移动端）
- `pnpm verify:e2e` 62/62 ✅
- 覆盖安装：`.env` 与数据库保持不变，`web/assets` 只剩当前版本分片，服务 `healthz` 正常
- `pnpm lint` / `format:check` / `typecheck` 全部通过
2026-09-12 10:09:11 +08:00
..
2026-09-12 08:41:08 +08:00
2026-09-12 10:09:11 +08:00
2026-09-12 08:41:08 +08:00