feat(panel, PANEL_ENHANCE_PLAN 批1-B): 前端五页——首页仪表盘/音频电平/电源/进程服务/系统补强/网络健壮性/PIN 卡

- 新增 #/home 默认路由:单请求 /api/overview + 5s 节拍(电平 1s 子节拍独立),
  卡片:设备信息(boot/默认启动)/电量/音频(rms·peak dBFS 双条电平表 -60..0)/WiFi+DNS/
  在跑App与服务健康/存储/性能小条;任一源 available:false 该卡显示「—」。
- 音频页:rms(青绿)+peak(黄) 双条电平表 + deci-dB 数值 + 近30采样 sparkline,轮询提速 1s;无流占位。
- 新增 #/power:电池卡 + 功耗估算卡(est_mw + confidence 徽标 estimated/derived/measured) +
  子系统分解堆叠条(screen/wifi/bt/audio/cpu/baseline mW+占比)。
- 新增 #/proc:svcd 服务表(restart 计數>=3 高亮/来源 board|tf) + ams App 表(crashes/launches/last_kind),
  行点开经 /api/files 列 MeowOS/logs/<pkg>/ 读最新 stdout_*.log 尾部(崩溃尾巴);全只读,无 restart/kill。
- 系统页补强:电池行、当前运行模式(后端已有 boot.mode/current 则显示) vs 默认启动并列(不一致高亮)、
  重启原因/升级状态(后端未暴露时显示「—」)。
- 网络页健壮性(281 缺陷):status 瞬态失败不再整页踢「不可用」占位,改顶部内联错误条 + 5s 自动重试,
  数据区保留上次成功内容。
- 设置页 PIN 卡:显示已设/未设/锁定状态,「修改 PIN」(旧+新双输入)与「清空 PIN」(旧 PIN 确认),
  走 /api/auth/login 校验旧 PIN + PUT /api/settings/panel.pin。
- 首页置顶导航新增「首页」,默认路由 #/ 或 #/home;侧栏新增「电源」「进程·服务」入口。

验证:headless Chromium --dump-dom 静态样例数据(参照 281),9 页 JS 0 错误,
双主题(md3/miuix × dark/light)通过;proc stdout 尾部支持 5s 重渲染后重开。
仅改 patch_v2/meowpanel/web/。
This commit is contained in:
MeowOS committed 2026-09-01 21:52:25 +08:00
1 parent d12164305d
commit 7ba0fde3e6
3 files changed
+768 -34

No files matched your search

+29 -1
View File
@@ -21,6 +21,10 @@
<span class="brand-name">MeowPanel</span>
</div>
<nav class="nav" id="nav">
<button class="nav-item" data-route="home" title="首页仪表盘(系统总览)">
<span class="nav-ico"><svg viewBox="0 0 24 24"><path d="M3 11.5 12 4l9 7.5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M5.5 10.5V20h13v-9.5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.5 20v-5h5v5" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/></svg></span>
<span class="nav-label">首页</span>
</button>
<button class="nav-item" data-route="perf" title="实时性能">
<span class="nav-ico"><svg viewBox="0 0 24 24"><path d="M3 13h4l2-5 3 9 2-4h5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg></span>
<span class="nav-label">性能</span>
@@ -33,6 +37,10 @@
<span class="nav-ico"><svg viewBox="0 0 24 24"><path d="M4 10v4h3l5 4V6l-5 4H4z" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/><path d="M15.5 9.5a3.5 3.5 0 0 1 0 5M18 7a7 7 0 0 1 0 10" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg></span>
<span class="nav-label">音频</span>
</button>
<button class="nav-item" data-route="power" title="电源 / 功耗(meow_powermgr)">
<span class="nav-ico"><svg viewBox="0 0 24 24"><path d="M13 2 4 14h6l-1 8 9-12h-6z" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/></svg></span>
<span class="nav-label">电源</span>
</button>
<button class="nav-item" data-route="net" title="网络管理(meow_netmgrd)">
<span class="nav-ico"><svg viewBox="0 0 24 24"><path d="M2.5 9a15 15 0 0 1 19 0M5.5 12.5a10 10 0 0 1 13 0M8.5 16a5 5 0 0 1 7 0" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><circle cx="12" cy="19" r="1.4" fill="currentColor"/></svg></span>
<span class="nav-label">网络</span>
@@ -61,6 +69,10 @@
<span class="nav-ico"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="12" rx="2" fill="none" stroke="currentColor" stroke-width="2"/><path d="M8 21h8M12 17v4" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><circle cx="8.5" cy="11" r="1.2" fill="currentColor"/><path d="M12 11l3.5 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg></span>
<span class="nav-label">屏幕</span>
</button>
<button class="nav-item" data-route="proc" title="进程 / 服务(meow_svcd + meow_amsd)">
<span class="nav-ico"><svg viewBox="0 0 24 24"><path d="M4 6h16M4 12h16M4 18h16" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><circle cx="9" cy="6" r="2.2" fill="var(--bg)"/><circle cx="15" cy="12" r="2.2" fill="var(--bg)"/><circle cx="7" cy="18" r="2.2" fill="var(--bg)"/></svg></span>
<span class="nav-label">进程·服务</span>
</button>
<button class="nav-item" data-route="system" title="系统信息 / 升级">
<span class="nav-ico"><svg viewBox="0 0 24 24"><rect x="6" y="3" width="12" height="18" rx="2" fill="none" stroke="currentColor" stroke-width="2"/><path d="M9 8h6M9 12h6M9 16h3" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg></span>
<span class="nav-label">系统</span>
@@ -82,7 +94,7 @@
<button class="icon-btn menu-btn" id="menu-btn" title="展开/收起导航" aria-label="菜单">
<svg viewBox="0 0 24 24"><path d="M4 6h16M4 12h16M4 18h16" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
</button>
<h1 class="topbar-title" id="page-title">实时性能</h1>
<h1 class="topbar-title" id="page-title">首页仪表盘</h1>
<div class="topbar-actions">
<span class="conn" id="conn-dot" data-state="unknown" title="后端连接">
<span class="conn-dot"></span><span class="conn-text" id="conn-text">检测中…</span>
@@ -141,6 +153,22 @@
</div>
</div>
<!-- 修改 / 清空面板 PIN 对话框(设置页「面板 PIN」卡) -->
<div id="pindlg" class="modal-scrim" hidden>
<div class="modal">
<h2 class="modal-title" id="pindlg-title">修改 PIN</h2>
<p class="modal-body" id="pindlg-body"></p>
<input type="password" id="pindlg-old" class="login-input" placeholder="当前 PIN" inputmode="numeric" autocomplete="off" maxlength="4" hidden>
<input type="password" id="pindlg-new" class="login-input" placeholder="新 4 位 PIN" inputmode="numeric" autocomplete="off" maxlength="4" hidden>
<input type="password" id="pindlg-new2" class="login-input" placeholder="再次输入新 PIN" inputmode="numeric" autocomplete="off" maxlength="4" hidden>
<p class="login-err" id="pindlg-err" hidden></p>
<div class="modal-actions">
<button class="btn" id="pindlg-cancel">取消</button>
<button class="btn btn-primary" id="pindlg-ok">确定</button>
</div>
</div>
</div>
<div id="toast" class="toast" hidden></div>
<script src="meowpanel.js"></script>