fix(ui): 修事件表四列文字错位 + 跨域隐藏刷新按钮 + 补 Pages 部署文档

① 事件表「故障」「狼的评论系统」「UptimeRobot:403 Forbidden」不在同一行

根因(实测定位,非推断):四个 td 的 top/height 完全相同(696/72),错位在单元格内部。
.clamp2 为保证行等高固定了 height:2.8em(36px),而「故障」徽标只有 17px;
单元格按 vertical-align:middle 对齐时,两者居中基准不同,徽标比其它三列低约 9px。

修法:事件表单元格改顶部对齐 + clamp2 在事件表内改为 max-height。
实测修复后四列文字顶端错位 0px。

② 跨域模式隐藏刷新按钮
/api/refresh 在跨域下必然被 refreshLocalOnly 挡下(对端是代理地址而非私网),
给一个必然失败的按钮不如隐藏。setSource 里按 source==='remote' 切换,
同源模式保留(并补断言守住这个行为)。

③ 新增 docs/DEPLOY-PAGES.md
GitHub Pages 面板 + 本地探针的完整部署指南:架构图、先决条件(含混合内容硬限制)、
本地探针启动与 2FA 绑定、Pages 配置三处填法、验证清单、安全要点、
Actions 快照备选方案、六条常见问题排查(Mixed Content / CORS / Failed to fetch 等)。

测试:verify-views 47→49 项(事件行文字顶端对齐 0px、同源保留刷新按钮)。
全项目 8 套 336 项通过。
This commit is contained in:
tamakyi
2026-10-14 16:48:07 +08:00
parent 6b0a23c38e
commit a237d7ba86
10 changed files with 671 additions and 432 deletions
+23
View File
@@ -413,6 +413,29 @@ async function main() {
return { down: down ? getComputedStyle(down).backgroundColor : '无', up: up ? getComputedStyle(up).backgroundColor : '无', downCells: down ? down.querySelectorAll('td').length : 0 };
});
check('事件行复用表格状态底色(故障行着色、恢复行不染)', /^(color\(|rgba?\(\d)/.test(evBg.down) && evBg.down !== 'rgba(0, 0, 0, 0)' && evBg.up === 'rgba(0, 0, 0, 0)' && evBg.downCells === 4, `故障=${evBg.down.slice(0, 30)} 恢复=${evBg.up} 列数=${evBg.downCells}`);
// 事件行的四列文字必须落在同一水平线上。此前 clamp2 固定 height:2.8em(36px)、
// 而徽标只有 17px,单元格按 middle 对齐时两者居中基准不同,
// 「类型」会比「时间/目标/详情」低约 9px(实测截图确认)。
const evAlign = await dp.evaluate(() => {
const rows = [...document.querySelectorAll('.events-table tbody tr')];
const spreads = [];
for (const tr of rows) {
const tops = [];
for (const td of tr.querySelectorAll('td')) {
// Range 要用独立实例:selectNodeContents 返回的是布尔值,不是 Range
const range = document.createRange();
range.selectNodeContents(td);
const rects = [...range.getClientRects()];
if (rects.length) tops.push(Math.round(rects[0].top));
}
if (tops.length) spreads.push(Math.max(...tops) - Math.min(...tops));
}
return { worst: spreads.length ? Math.max(...spreads) : -1, rows: spreads.length };
});
check('事件行各列文字顶端对齐(徽标与文本同一水平线)', evAlign.worst === 0, `最大错位 ${evAlign.worst}px(${evAlign.rows} 行)`);
// 跨域模式下隐藏刷新按钮(该模式下 /api/refresh 必然被 refreshLocalOnly 挡下)
const refreshBtnShown = await dp.evaluate(() => !document.getElementById('refresh-btn').hidden);
check('同源模式下保留刷新按钮', refreshBtnShown === true, `可见=${refreshBtnShown}`);
check('事件默认折叠为 8 条并可展开', evr.shown === 8 && evr.moreHidden === false && /展开全部 12 条/.test(evr.moreText), `显示 ${evr.shown} 条,按钮「${evr.moreText}」,计数「${evr.count}」`);
await dp.click('#events-more');
await dp.waitForTimeout(300);