✨ 优化监控页面加载体验

- 添加monitorTabLoading整体加载遮罩
- 创建openMonitorTab()和initMonitorTab()方法
- 使用Promise.all并行加载健康检测和系统日志
- 数据全部加载完成后才显示监控内容，彻底解决刷新闪烁问题

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

Co-Authored-By: Claude <noreply@anthropic.com>

frontend/app.html

@@ -2012,7 +2012,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'; loadHealthCheck(); loadSystemLogs(1);"
+          <button @click="openMonitorTab"
                   :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>
@@ -2241,6 +2241,11 @@
 
       <!-- ========== 监控标签页 ========== -->
       <div v-show="adminTab === 'monitor'">
+      <div v-if="monitorTabLoading" class="card" style="margin-bottom: 30px; text-align: center; padding: 40px;">
+        <i class="fas fa-spinner fa-spin" style="font-size: 36px; margin-bottom: 10px;"></i>
+        <div style="color: var(--text-secondary); font-size: 14px;">正在加载监控数据...</div>
+      </div>
+      <template v-else>
       <!-- 健康检测 -->
       <div class="card" style="margin-bottom: 30px;">
         <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;">
@@ -2479,6 +2484,7 @@
           </button>
         </div>
       </div>
+      </template>
       </div><!-- 监控标签页结束 -->
 
       <!-- ========== 用户标签页 ========== -->