fix(frontend): 为 table 添加 thead/tbody 消除 Vite 构建警告

HTML 规范要求 <tr> 必须是 <thead>/<tbody>/<tfoot> 的直接子元素,
不能直接作为 <table> 的子节点。Vite/Vue 会报告 warning 并可能导致
hydration 错误。

修复以下文件中的表格结构:
- StatusBoard.vue: 2 个表格添加 <thead> + <tbody>
- Index.vue: 1 个表格添加 <tbody>
- Monitor.vue: 2 个表格添加 <tbody>
- TaskCenter.vue: 1 个表格添加 <tbody>
This commit is contained in:
2026-07-14 16:07:09 +08:00
parent 9ddaa0bf6f
commit f3d8a1335c
4 changed files with 132 additions and 116 deletions
+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>