wonder/xinfra
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #49 from 1024XEngineer/fix/table-thead-tbody-warnings

Browse Source 
fix(frontend): 为 table 添加 thead/tbody 消除 Vite 构建警告
This commit is contained in:
Gmaker689
2026-07-14 16:12:55 +08:00
committed by GitHub
parent 9ddaa0bf6f f3d8a1335c
commit 5a020e1fb7
4 changed files with 132 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/dashboard/Index.vue
+27 -25
View File
@@ -86,31 +86,33 @@
</div>
<div class="panel-body">
<table>
<tr class="tr-hover">
<td class="status-text ok">● 成功</td>
<td class="strong">MySQL 主从部署</td>
<td class="mono">2m14s</td>
</tr>
<tr class="tr-hover">
<td class="status-text warn">● 执行中</td>
<td class="strong">RKE2 节点加入</td>
<td class="mono">38s</td>
</tr>
<tr class="tr-hover">
<td class="status-text ok">● 成功</td>
<td class="strong">Redis Cluster 部署</td>
<td class="mono">3m02s</td>
</tr>
<tr class="tr-hover">
<td class="status-text err">● 失败</td>
<td class="strong">openresty 网关部署</td>
<td class="mono">41s</td>
</tr>
<tr class="tr-hover">
<td class="status-text ok">● 成功</td>
<td class="strong">业务线标签同步</td>
<td class="mono">5s</td>
</tr>
<tbody>
<tr class="tr-hover">
<td class="status-text ok">● 成功</td>
<td class="strong">MySQL 主从部署</td>
<td class="mono">2m14s</td>
</tr>
<tr class="tr-hover">
<td class="status-text warn">● 执行中</td>
<td class="strong">RKE2 节点加入</td>
<td class="mono">38s</td>
</tr>
<tr class="tr-hover">
<td class="status-text ok">● 成功</td>
<td class="strong">Redis Cluster 部署</td>
<td class="mono">3m02s</td>
</tr>
<tr class="tr-hover">
<td class="status-text err">● 失败</td>
<td class="strong">openresty 网关部署</td>
<td class="mono">41s</td>
</tr>
<tr class="tr-hover">
<td class="status-text ok">● 成功</td>
<td class="strong">业务线标签同步</td>
<td class="mono">5s</td>
</tr>
</tbody>
</table>
</div>
</div>
frontend/src/views/monitor/Monitor.vue
+36 -32
View File
@@ -15,22 +15,24 @@
</div>
<div class="panel-body">
<table>
<tr class="tr-hover">
<td>七机房采集节点数</td>
<td class="mono strong">128</td>
</tr>
<tr class="tr-hover">
<td>活跃时序数量</td>
<td class="mono strong">42.6M</td>
</tr>
<tr class="tr-hover">
<td>Prometheus 接口接入</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td>Grafana 仪表盘数</td>
<td class="mono strong">37</td>
</tr>
<tbody>
<tr class="tr-hover">
<td>七机房采集节点数</td>
<td class="mono strong">128</td>
</tr>
<tr class="tr-hover">
<td>活跃时序数量</td>
<td class="mono strong">42.6M</td>
</tr>
<tr class="tr-hover">
<td>Prometheus 接口接入</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td>Grafana 仪表盘数</td>
<td class="mono strong">37</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -42,22 +44,24 @@
</div>
<div class="panel-body">
<table>
<tr class="tr-hover">
<td>物理机监控覆盖</td>
<td class="mono strong">186 / 186</td>
</tr>
<tr class="tr-hover">
<td>当前告警</td>
<td class="status-text warn">● 2 条（风扇转速异常）</td>
</tr>
<tr class="tr-hover">
<td>网络设备健康</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td>存储健康度</td>
<td class="status-text ok">● 正常</td>
</tr>
<tbody>
<tr class="tr-hover">
<td>物理机监控覆盖</td>
<td class="mono strong">186 / 186</td>
</tr>
<tr class="tr-hover">
<td>当前告警</td>
<td class="status-text warn">● 2 条（风扇转速异常）</td>
</tr>
<tr class="tr-hover">
<td>网络设备健康</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td>存储健康度</td>
<td class="status-text ok">● 正常</td>
</tr>
</tbody>
</table>
</div>
</div>
frontend/src/views/resource/StatusBoard.vue
+62 -54
View File
@@ -44,35 +44,39 @@
</div>
<div class="panel-body">
<table>
<tr><th>机房</th><th>总数</th><th>在线</th><th>健康率</th><th>状态</th></tr>
<tr class="tr-hover">
<td class="strong mono">YZH 机房</td>
<td class="mono">78</td>
<td class="mono">78</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 98%"></span></span>98%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">XS 机房</td>
<td class="mono">64</td>
<td class="mono">63</td>
<td><span class="bar-wrap"><span class="bar-fill warn" style="width: 91%"></span></span>91%</td>
<td class="status-text warn">● 1 条告警</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">JF 机房</td>
<td class="mono">22</td>
<td class="mono">22</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 100%"></span></span>100%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">海外 IDC（4）</td>
<td class="mono">22</td>
<td class="mono">21</td>
<td><span class="bar-wrap"><span class="bar-fill err" style="width: 86%"></span></span>86%</td>
<td class="status-text err">● 1 条严重</td>
</tr>
<thead>
<tr><th>机房</th><th>总数</th><th>在线</th><th>健康率</th><th>状态</th></tr>
</thead>
<tbody>
<tr class="tr-hover">
<td class="strong mono">YZH 机房</td>
<td class="mono">78</td>
<td class="mono">78</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 98%"></span></span>98%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">XS 机房</td>
<td class="mono">64</td>
<td class="mono">63</td>
<td><span class="bar-wrap"><span class="bar-fill warn" style="width: 91%"></span></span>91%</td>
<td class="status-text warn">● 1 条告警</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">JF 机房</td>
<td class="mono">22</td>
<td class="mono">22</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 100%"></span></span>100%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">海外 IDC（4）</td>
<td class="mono">22</td>
<td class="mono">21</td>
<td><span class="bar-wrap"><span class="bar-fill err" style="width: 86%"></span></span>86%</td>
<td class="status-text err">● 1 条严重</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -84,31 +88,35 @@
</div>
<div class="panel-body">
<table>
<tr><th>业务线</th><th>虚机数</th><th>CPU 均值</th><th>状态</th></tr>
<tr class="tr-hover">
<td class="strong mono">Kodo</td>
<td class="mono">218</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 64%"></span></span>64%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">LAS</td>
<td class="mono">164</td>
<td><span class="bar-wrap"><span class="bar-fill warn" style="width: 82%"></span></span>82%</td>
<td class="status-text warn">● 1 条告警</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">灵矽</td>
<td class="mono">96</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 57%"></span></span>57%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">共享池 / 未分配</td>
<td class="mono">34</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 31%"></span></span>31%</td>
<td class="status-text ok">● 正常</td>
</tr>
<thead>
<tr><th>业务线</th><th>虚机数</th><th>CPU 均值</th><th>状态</th></tr>
</thead>
<tbody>
<tr class="tr-hover">
<td class="strong mono">Kodo</td>
<td class="mono">218</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 64%"></span></span>64%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">LAS</td>
<td class="mono">164</td>
<td><span class="bar-wrap"><span class="bar-fill warn" style="width: 82%"></span></span>82%</td>
<td class="status-text warn">● 1 条告警</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">灵矽</td>
<td class="mono">96</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 57%"></span></span>57%</td>
<td class="status-text ok">● 正常</td>
</tr>
<tr class="tr-hover">
<td class="strong mono">共享池 / 未分配</td>
<td class="mono">34</td>
<td><span class="bar-wrap"><span class="bar-fill" style="width: 31%"></span></span>31%</td>
<td class="status-text ok">● 正常</td>
</tr>
</tbody>
</table>
</div>
</div>
frontend/src/views/task/TaskCenter.vue
+7 -5
View File
@@ -14,11 +14,13 @@
</div>
<div class="panel-body">
<table>
<tr v-for="task in tasks" :key="task.id" class="tr-hover" :class="{ active: task.id === selectedTask }" @click="selectedTask = task.id">
<td :class="['status-text', task.statusClass]">● {{ task.status }}</td>
<td class="strong">{{ task.name }}</td>
<td class="mono" style="font-size: 11px; color: var(--text-dim)">{{ task.playbook }}</td>
</tr>
<tbody>
<tr v-for="task in tasks" :key="task.id" class="tr-hover" :class="{ active: task.id === selectedTask }" @click="selectedTask = task.id">
<td :class="['status-text', task.statusClass]">● {{ task.status }}</td>
<td class="strong">{{ task.name }}</td>
<td class="mono" style="font-size: 11px; color: var(--text-dim)">{{ task.playbook }}</td>
</tr>
</tbody>
</table>
<div class="pagination">
<span>共 86 条 · 每页 6 条</span>