ui: 优化监控页面交互体验

- 点击监控标签时自动加载健康检查和系统日志
- 缩小清理/刷新按钮尺寸,更简洁美观
- 按钮文字精简:"清理旧日志" → "清理"

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-30 10:54:26 +08:00
parent 962b01d05a
commit a28909baca

View File

@@ -1980,7 +1980,7 @@
:style="{ padding: '15px 25px', border: 'none', background: adminTab === 'settings' ? '#667eea' : 'transparent', color: adminTab === 'settings' ? 'white' : '#666', cursor: 'pointer', fontWeight: '600', fontSize: '14px', borderRadius: adminTab === 'settings' ? '8px 8px 0 0' : '0', transition: 'all 0.2s' }">
<i class="fas fa-cog"></i> 设置
</button>
<button @click="adminTab = 'monitor'"
<button @click="adminTab = 'monitor'; loadHealthCheck(); loadSystemLogs(1);"
:style="{ padding: '15px 25px', border: 'none', background: adminTab === 'monitor' ? '#667eea' : 'transparent', color: adminTab === 'monitor' ? 'white' : '#666', cursor: 'pointer', fontWeight: '600', fontSize: '14px', borderRadius: adminTab === 'monitor' ? '8px 8px 0 0' : '0', transition: 'all 0.2s' }">
<i class="fas fa-chart-line"></i> 监控
</button>
@@ -2336,11 +2336,11 @@
<h3 style="margin: 0;">
<i class="fas fa-clipboard-list"></i> 系统日志
</h3>
<div style="display: flex; gap: 10px;">
<button class="btn btn-secondary" @click="cleanupLogs" title="清理90天前的日志">
<i class="fas fa-trash"></i> 清理旧日志
<div style="display: flex; gap: 8px; align-items: center;">
<button class="btn btn-secondary" @click="cleanupLogs" title="清理90天前的日志" style="padding: 6px 12px; font-size: 12px;">
<i class="fas fa-trash"></i> 清理
</button>
<button class="btn btn-primary" @click="loadSystemLogs(1)" :disabled="systemLogs.loading">
<button class="btn btn-primary" @click="loadSystemLogs(1)" :disabled="systemLogs.loading" style="padding: 6px 12px; font-size: 12px;">
<i class="fas" :class="systemLogs.loading ? 'fa-spinner fa-spin' : 'fa-sync'"></i>
刷新
</button>