feat(display): 大屏「赛事日程侧边栏」(手填日程 + 竖向进度轴 + 热开关 + 每屏覆盖);版本 dev_0.5.16
主人点名要的功能:大屏控制页加一个**可热开关**的侧边栏,在**指定的屏幕**上(不管它当前在哪一页)叠一个
**手填的赛事日程列表**,带**竖向进度条**;日程**不与登记的小项时间关联**、完全手填;竖向时间轴要好看,
**字多时字号自动缩放与换行**要做到位(不能过小、不能过大)。
设计口径(主人逐条拍板):放不下时**围绕当前项开窗**;进度条是**一条竖向时间轴 + 三态节点**;
**深色半透明 + 毛玻璃**;已完成的项**淡化保留**;备注**默认上屏 + 一个总开关**;
明细覆盖层 / 全屏公告期间**自动收起**、结束后自动回来;编辑权限**录入员及以上**;单屏覆盖按**实例 id**。
服务端(走大屏公告那条路 —— PUT /api/settings 是 admin-only,会与「录入员可改」冲突)
- 新增 `schedule` 动作 + 白名单;`POST /api/display/command` 同一个 handler:**先校验 → 再转发 → 最后落库**
(校验排在转发前,非法配置不会在大屏上闪一帧)
- 落库到赛事库 settings 的 `display.schedule`(**不新建表、不写迁移**,随赛事包走);
与公告共用那份「写设置键 + bumpVersion」的实现
- **读写不对称容错**:写侧严格 400(含中文提示与第几条),读侧坏数据一律静默当空 —— 老数据 / 手改库不会炸大屏
- 上限:40 条;time ≤20 / title ≤40 / note ≤60(按字符,清洗控制字符);宽度夹 15–40;覆盖 ≤50 条
- 口径收口三处:**时间允许为空**(与管理端同口径)、**showNote 缺键 = true**(区分「键不存在」与「显式 false」)、
**`inherit` 不落库**(不再白占覆盖预算)
大屏端
- 新增 `ScheduleSidebar.vue` + `schedulePanel.ts`(纯函数:开窗 / 三态 / 整体进度 / 字号与行数 / 按显示宽度截断 /
单屏覆盖 / 抑制 / 指纹去重)
- 字号是**舞台设计坐标**(1920×1080),靠 `.stage` 的 `transform: scale()` 整体缩放,**不做二次缩放**
(wiring 断言禁止出现 `window.`/`innerWidth`/`vh`);复用既有的 `fitRowFontPx`(**16–56px 硬上下限**)与 `textEm`;
固定点迭代 ≤4 轮;**贴下限时宁可行数少也不缩字**;标题 ≤3 行、备注 ≤2 行,超出截断
- 容器 `position:absolute; inset:0; z-index:50`(**不用 fixed** —— `.stage` 带 transform,是 fixed 后代的包含块);
**独立于 detail 状态机**(goto 会关明细、明细会停轮播,侧边栏必须不受影响)
- 深色半透明 + `backdrop-filter`,并带 `@supports not (backdrop-filter: blur(1px))` 退化为更不透明的深底
- 关着时**不留任何 DOM**(逐字节等同于没有这个功能);`prefers-reduced-motion` 下不做动效
管理端
- 大屏控制页(左列、公告之后)新增「赛事日程」卡片:条目表格(时间/标题/备注/已完成 + 上移/下移/删除)、
总开关、备注上屏、位置与宽度、**每块屏三态覆盖**(跟随 / 强制开 / 强制关;切回「跟随」会真删掉那条键)
- 保存走 `adminApi.displayCommand`(**不走 admin-only 的设置接口**);本地校验不过**一个请求都不发**
- 排序只有上移 / 下移(该页面禁止挂 pointerdown/mousedown 监听,有既有测试钉着)
测试
- 服务端 16 个包全绿;前端 **1174 例**全过(基线 1096,本批 +78:大屏端 44 + 管理端 34)
- 大屏端另有 **40 项 playwright 实机**(用 `page.routeWebSocket` 假造实时通道):开/关后 DOM 无残留、
五个页面下都在、`lock=0` 真等轮播翻页且侧边栏不掉、明细与公告期间自动收起并自动回来、
**1080p 与 4K 字号完全相同**、`reducedMotion` 下无动画;并钉住两条硬指标(真机列表高度 ≥ 纯函数预算、
容量×行高 ≤ 真机高度)
文档:`docs/升级说明` 新增 `dev_0.5.16`;`使用手册` 9.2 + 17.6;`常见问题` Q108–Q111;`上线检查清单`/`部署指南`
各一条;`devdocs/05·07·13` 同步。
⚠️ 一条**既有边界**(本版故意没改,按主人「兼容性最大化」的要求):导出的名次口径是「通道名次优先」、
屏幕是「成绩行名次优先」,只在「先按决赛计分发布、之后又只更新名次发布一次」这种序列下分叉
(导出显示上次计分的名次)。正常赛程遇不到;遇到时对该组再「按决赛成绩发布」一次即恢复一致。
已写进《升级说明》④ 与《常见问题》Q111。
This commit is contained in:
1 parent
56ed90ff8b
commit
9c52dc4b38
33 files changed
+4736
-10
No files matched your search
@@ -628,6 +628,8 @@
|
||||
- **保存**:改完模式或项目后点「保存」,提示「实时赛况设置已保存」后大屏按新配置显示;卡片底部注明「当前项目最多 2 个」;
|
||||
- 该卡片的「保存」需要**管理员**身份(见本节开头的权限说明);示例数据模式下不能保存。
|
||||
|
||||
**赛事日程**:左列「公告」卡片下面那张「赛事日程」卡片,把**手填的日程**做成大屏上的一条**竖向进度轴侧边栏**(**可热开关**,叠在大屏**当前页之上**,不影响轮播)。**录入员及以上**就能改。卡片每一项怎么填、大屏上长什么样、什么时候会自动收起,见本节 **9.2**;大屏侧的观感与行为另见 **17.6**。
|
||||
|
||||
**在线大屏**:右侧「在线大屏」卡片列出的是**真实**的在线实例,直接读服务端 `GET /api/display/instances`,打开页面时每 5 秒自动刷新一次(浏览器切到后台时暂停,切回来立刻补一次)。每个实例一行,显示**设备名**、在线 / 离线徽标、「局域网浏览器」或「屏 N」标记、当前所在页、来源地址与最后心跳;服务端判定某个实例落后时还会多一个「落后」徽标(大屏可能在卡或网络差)。**本机用 Console 打开的大屏窗口、以及局域网设备打开 `/display` 连上的浏览器,都会出现在这里**——局域网浏览器没有屏号,那一栏显示「局域网浏览器」。离线实例会在服务端保留一段时间,方便排查它是什么时候掉的。
|
||||
|
||||
**设备名怎么来的(自动标签 + 手动改名)**:局域网浏览器连上来时会报一个**自动设备标签**,形如 `安卓 13 · Chrome 120 · 1080×2400 @3x · 手机`,写法是 **系统 + 版本 · 浏览器 · 分辨率 · 形态(手机 / 平板 / 桌面)**,某个段取不到就跳过(例:`iPadOS 17 · Safari 17 · 2048×2732 @2x · 平板`、`Windows 10 · Edge 120 · 1920×1080 · 桌面`、`安卓 13 · 微信 8 · 1080×2340 @2.75x · 手机`)。
|
||||
@@ -686,6 +688,49 @@
|
||||
|
||||
多块副屏都被关掉时,在同一张卡片里逐块点「创建全屏窗口」即可;改用「重新排布」也行,但前提是这些屏都在 Console 的选屏配置里。
|
||||
|
||||
### 9.2 赛事日程(手填日程 + 大屏上的侧边栏)
|
||||
|
||||
**这张卡片是干什么的**:把**手填的赛事日程**做成大屏上一块**侧边栏**,里面是一条**竖向进度轴**。它**与大屏当前在哪一页无关**(轮播中、锁在某一页都照常显示),也**不影响**切页与轮播。**录入员及以上**可改(与大屏公告、逐屏切页同档);未登录 / 服务端未连接时整张卡片禁用并写明原因;示例数据模式下会提示改动未真正保存。
|
||||
|
||||
**位置**:本页**左列、公告卡之后、「实时赛况」之前**;卡头徽标写 `N 条 · 默认开启 / 关闭`。
|
||||
|
||||
**表格怎么填**:
|
||||
|
||||
| 列 | 怎么填 |
|
||||
| --- | --- |
|
||||
| 时间 | **自由文本**,最长 **20** 字(`08:30`、`上午`、`待定` 都行)。⚠️ **必须填**(不能留空),否则保存时服务端会退回一句「第 N 条日程的时间不能为空」 |
|
||||
| 标题 | **必填**,最长 **40** 字 |
|
||||
| 备注 | 可留空,最长 **60** 字(例如 `检录 08:00`);**默认上屏**,可用下面的「备注上屏」整体关掉 |
|
||||
| 已完成 | 勾上 = 这条已完成(大屏上会**淡化保留**) |
|
||||
| 操作 | **上移 / 下移 / 删除**——**只有这三个按钮,不能拖拽排序**;第一行的「上移」、最后一行的「下移」是灰的 |
|
||||
|
||||
- 表格下方是「**新增一条**」按钮,右侧写 `共 N / 40 条`(**最多 40 条**,满了按钮不可点);一条都没有时显示「还没有日程条目」;
|
||||
- **上屏顺序就是你排的顺序**:系统**不解析时间、不比较、也不按时间自动排序**(手填文本没法可靠解析);
|
||||
- **校验不过时一个请求都不发**:字段级红字贴在该格下方,条数 / 宽度这类整表错误列在表格下方,同时提示「赛事日程校验未通过 / 请先修正标红的字段」。
|
||||
|
||||
**开关与几何**:
|
||||
|
||||
- **侧边栏默认开启**:总开关。开 = 所有大屏默认显示(除非那块屏被单独设成「强制关」);关 = 所有大屏都不显示;
|
||||
- **备注上屏**:关掉后大屏上只显示时间与标题;
|
||||
- **位置**:左侧 / 右侧(默认**右侧**);**宽度**:占整屏的百分比,**15–40 %**(默认 **22 %**)。
|
||||
|
||||
**每块屏单独设置**(覆盖上面的总开关):卡片下半部分**一行一块屏**,显示名按 **手动别名 → 自动设备标签 → 实例 id**(怎么改名见本节前面「在线大屏」那段),右边一个三态下拉:
|
||||
|
||||
| 选项 | 含义 |
|
||||
| --- | --- |
|
||||
| 跟随总开关(默认) | 由上面的总开关决定 |
|
||||
| 强制开 | 这块屏**无论总开关怎么设都显示** |
|
||||
| 强制关 | 这块屏**不显示** |
|
||||
|
||||
- 切回「**跟随总开关**」会**真的把那条覆盖删掉**(不会留一个没用的空键);
|
||||
- 列表里**列全部在线实例**,另外把「离线、但身上挂着强制开 / 强制关」的也列出来(否则那块平板今天没开,你就再也撤不掉它的强制关了);**还没有任何大屏上报**时这里显示「还没有大屏上报,暂时没有可单独设置的设备;新设备接上后回到这里即可」;列表里已经找不到的覆盖条数会另写一句说明——那些设置**照原样保存**,不会被悄悄删掉。
|
||||
|
||||
**保存**:点「保存」= **整份替换**并**立刻推给所有大屏**(这就是「热开关」:不用刷新、不用重启)。成功提示形如「已把赛事日程改成「共 2 条 · 默认开启 · 右侧 22%」」,并注明「大屏立刻生效;配置随赛事库保存,刷新与重启都不会丢」;失败会把**服务端原文**显示出来(条数超限 / 字段过长 / 权限不足)。
|
||||
|
||||
⚠️ **这是低频动作**:每次保存都会让**全场大屏做一次全量重拉**(局域网内几百毫秒,现场基本无感)——所以它适合「**开赛前配一次 + 现场偶尔勾一下「已完成」**」,**不要**拿它做高频刷新。
|
||||
|
||||
**配置存在哪**:赛事库的设置里(键名 `display.schedule`,与大屏公告同一套机制)——**不新建表、不改数据库结构**,**随赛事包一起导出 / 导入**;刷新、重启服务端、切换赛事项目都不会丢。
|
||||
|
||||
---
|
||||
|
||||
## 10. 基础数据
|
||||
@@ -1274,6 +1319,28 @@
|
||||
- **kiosk 全屏窗口**(多屏时每屏一个)不显示任何调试标识,正式上屏的画面是干净的;多屏 kiosk 也不响应 F11。
|
||||
- 单屏窗口化窗口按 **F11** 全屏后,自绘标题栏与「实例 · 屏」会一起消失、画面铺满整块屏;再按一次 F11 回到窗口化,标题栏与标识一起回来。
|
||||
|
||||
### 17.6 赛事日程侧边栏
|
||||
|
||||
管理端在「大屏控制 → 赛事日程」里配了**手填日程**并打开开关后,**每一块大屏**上都会多出一块**侧边栏**(默认在**右侧**、占屏 **22 %**,左右与宽度可在管理端改)。它**叠在当前页之上**:**不改当前页、不停轮播**——大屏本来在轮播就继续轮,锁着就继续锁着,侧边栏只是多出来一层(见使用手册 9.2)。
|
||||
|
||||
- **一条竖向进度轴 + 三态节点**:**已完成**(实心节点 + 整条淡化保留)、**当前**(节点放大带光晕,最醒目)、**未开始**(低对比);面板顶部一行读数 **`已完成 x / 共 y`**;
|
||||
- **「当前项」= 第一个没勾「已完成」的条目**——**不按时间判断**(时间是完全手填的自由文本,`上午` / `待定` 这种没法可靠解析);
|
||||
- **备注默认上屏**(例如每条的「检录 08:00」),管理端可以整体关掉,关掉后只显示时间与标题;
|
||||
- **日期/时间只是照抄你填的字**:系统**不解析、不比较、不按时间排序**,**上屏顺序 = 管理端里的顺序**。
|
||||
|
||||
> ⚠️ **它不是「完整日程公示」**:条目放不下时,面板会**围绕当前项开窗**——当前项固定在显眼位置、前后各显示若干条,**已完成的与很靠后的条目会滚出视图**(被截住的方向上会写一句「上方 / 下方还有 N 项」)。要把**完整**日程公示出来,请用轮播页或另行打印公示,**别指望这条侧边栏**。
|
||||
|
||||
**排版**:字号按文本长度与可用高度**自适应**,但有**硬上下限**——**宁可少显示几行,也不缩到看不清**;长标题最多 3 行、长备注最多 2 行,超出的部分按显示宽度**省略**;时间与备注比标题小一档(0.8 倍,同样有下限)。**1080p 与 4K 都按屏幕等比缩放**(4K 上字与面板一起放大,不会多放大一次)。
|
||||
|
||||
**外观**:**深色半透明 + 毛玻璃**;**不支持毛玻璃的老浏览器会退化成更不透明的深底**(保证字看得清),功能不缺。系统开了「减少动态效果」(`prefers-reduced-motion`)时不做入场动效。
|
||||
|
||||
**什么时候它会自己收起来**(**开关状态不动**,事情过去自动回来):
|
||||
|
||||
- 管理端推送的**积分明细覆盖层**开着期间(见 17.3);
|
||||
- **全屏公告**正在播期间(公告退场就回来)。
|
||||
|
||||
**关掉之后**:管理端把总开关一关,大屏上**连一个元素都不会留下**,画面与**没有这个功能时逐字节一致**;某一块屏单独设成「强制关」时也一样(只影响那一块屏)。
|
||||
|
||||
---
|
||||
|
||||
## 18. 常见操作问题
|
||||
|
||||
Reference in new issue
Block a user