feat(ui): 最近事件随分组页签联动过滤 + favicon 提供 WebP
① 最近事件随筛选过滤 此前事件只受后端 dataFilter 约束,与面板上方的分组页签无关 —— 切页签后 监控列表变了,事件列表却纹丝不动。 两个真实缺陷(都是实测发现,不是推断): 1. setFilter() 只调 renderTabs() + renderView(),**没调 renderEvents()** 2. 过滤依据用 allMonitors(),它只受 dataFilter 约束、不受分组影响 → 改为 visibleGroups().flatMap(...) 3. 无匹配事件时提前 return,没清空 list.innerHTML → 旧行仍留在 DOM 里, 换个分组再切回来会看到过期内容 实测:「全部」8 条 → 「UptimeRobot」1 条(正是「狼的评论系统 / UptimeRobot:403 Forbidden」)→「基础设施」0 条且区块自动隐藏。 过滤用「当前可见目标 id 集合」反查,而不是事件自身的 group 字段 —— 外部数据源(UptimeRobot)的事件在快照里没有 group 字段,按名字反查才准。 ② favicon 提供 WebP(保留原图与 PNG) 先核实了实际情况:assets-src 下三个原图(bike 1.8MB / figure 366KB / icon 277KB)此前已转成 WebP,public/assets 里唯一的 PNG 是 favicon-shiroko.png。 因此本次只处理 favicon:新增 64×64 WebP(2.7KB,比 PNG 的 5.6KB 省一半)。 **PNG 不删** —— favicon 是浏览器最早的请求,WebP 覆盖虽广但旧浏览器会直接 不显示图标,留 PNG 作回退代价只有几 KB,换来「任何浏览器都有图标」更稳妥。 原图 assets-src/ 完全未动,prepare-artwork.py 可随时重新生成。 页面用两个 <link rel="icon" type=...> 让浏览器按格式自动挑选 (认识 WebP 就取 WebP,否则回落 PNG / SVG)。 ③ 顺带修一个既存缺陷 探针的 MIME 表**缺 .webp**,导致三张 webp 素材一直被当作 application/octet-stream 伺服(能显示但类型不对)。已补。 测试:verify-views 49→52 项(事件随页签过滤、切回全部恢复、无事件时清空 DOM)。 verify.cjs 实为 24 项(此前 README 记的 17 是旧数据)。全项目 8 套 346 项通过。
This commit is contained in:
+1
-1
@@ -5,7 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="轻量级服务监控面板:HTTP 可用性与 TCP 端口探测">
|
||||
<title>Shiroko Monitor</title>
|
||||
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
|
||||
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg" data-favicon="1">
|
||||
<link rel="stylesheet" href="assets/style.css">
|
||||
<link rel="stylesheet" href="assets/theme-shiroko.css">
|
||||
</head>
|
||||
|
||||
Reference in New Issue
Block a user