feat: 实现Redis集成协议并重构项目控制台

refactor(backend): 重构后端服务以支持Redis协议
feat(backend): 添加Redis客户端和服务模块
feat(backend): 实现命令和日志路由处理Redis交互
refactor(frontend): 重构前端状态管理和组件结构
feat(frontend): 实现基于Redis的日志和命令功能
docs: 添加Redis集成协议文档
chore: 更新ESLint配置和依赖

src/frontend/App.vue

@@ -1,20 +1,43 @@
 <template>
   <div class="app-container">
     <header class="app-header">
-      <button class="menu-toggle" @click="toggleSidebar" v-if="isMobile">
-        <span class="menu-icon"></span>
+      <button
+        v-if="isMobile"
+        class="menu-toggle"
+        @click="toggleSidebar"
+      >
+        <span class="menu-icon" />
       </button>
       <h1>BLS Project Console</h1>
+      <div
+        class="service-status"
+        :class="{ 'status-ok': serviceStatus === 'ok', 'status-error': serviceStatus === 'error' }"
+      >
+        {{ serviceStatusText }}
+      </div>
     </header>
     <div class="app-content">
       <!-- 左侧选择区域 -->
-      <aside class="sidebar" :class="{ 'sidebar-closed': !sidebarOpen && isMobile }">
+      <aside
+        class="sidebar"
+        :class="{ 'sidebar-closed': !sidebarOpen && isMobile }"
+      >
         <router-view name="sidebar" />
       </aside>
 
       <!-- 右侧调试区域 -->
       <main class="main-content">
-        <router-view name="main" />
+        <div
+          v-if="serviceStatus === 'error'"
+          class="service-error-message"
+        >
+          <h3>服务不可用</h3>
+          <p>无法连接到后端服务，请检查服务是否正常运行。</p>
+        </div>
+        <router-view
+          v-else
+          name="main"
+        />
       </main>
     </div>
   </div>
@@ -25,6 +48,9 @@ import { ref, onMounted, onUnmounted } from 'vue';
 
 const sidebarOpen = ref(true);
 const isMobile = ref(false);
+const serviceStatus = ref('checking');
+const serviceStatusText = ref('检查服务状态...');
+let checkInterval = null;
 
 // 检测窗口大小变化
 const checkMobile = () => {
@@ -41,14 +67,63 @@ const toggleSidebar = () => {
   sidebarOpen.value = !sidebarOpen.value;
 };
 
+// 检查服务健康状态
+const checkServiceHealth = async () => {
+  try {
+    console.log('=== 开始检查服务健康状态 ===');
+
+    // 测试不同的请求方式
+    const response = await fetch('http://localhost:3000/api/health', {
+      method: 'GET',
+      credentials: 'omit',
+      referrerPolicy: 'no-referrer',
+    });
+
+    console.log('响应状态码:', response.status);
+    console.log('响应头:', Object.fromEntries(response.headers));
+
+    const responseText = await response.text();
+    console.log('响应文本:', responseText);
+
+    if (response.ok) {
+      serviceStatus.value = 'ok';
+      serviceStatusText.value = '服务正常';
+      console.log('=== 服务健康状态检查通过 ===');
+    } else {
+      serviceStatus.value = 'error';
+      serviceStatusText.value = `服务异常 (${response.status})`;
+      console.log('=== 服务健康状态检查失败: 状态码异常 ===');
+    }
+  } catch (error) {
+    console.error('=== 服务健康状态检查异常 ===');
+    console.error('错误类型:', error.name);
+    console.error('错误消息:', error.message);
+    console.error('错误堆栈:', error.stack);
+
+    serviceStatus.value = 'error';
+    serviceStatusText.value = '服务不可用: ' + error.message;
+  }
+};
+
 // 监听窗口大小变化
 onMounted(() => {
   checkMobile();
   window.addEventListener('resize', checkMobile);
+
+  // 初始检查服务状态
+  checkServiceHealth();
+
+  // 定时检查服务状态（每5秒）
+  checkInterval = setInterval(checkServiceHealth, 5000);
 });
 
 onUnmounted(() => {
   window.removeEventListener('resize', checkMobile);
+
+  // 清除定时检查
+  if (checkInterval) {
+    clearInterval(checkInterval);
+  }
 });
 </script>
 
@@ -134,6 +209,48 @@ body {
   font-size: 1.5rem;
   font-weight: 600;
   margin: 0;
+  flex: 1;
+}
+
+/* 服务状态指示器 */
+.service-status {
+  font-size: 0.9rem;
+  padding: 0.3rem 0.8rem;
+  border-radius: 12px;
+  font-weight: 500;
+  margin-right: 1rem;
+  display: inline-block;
+}
+
+.service-status.status-ok {
+  background-color: #e8f5e8;
+  color: #2e7d32;
+}
+
+.service-status.status-error {
+  background-color: #ffebee;
+  color: #c62828;
+}
+
+/* 服务错误消息 */
+.service-error-message {
+  background-color: #ffebee;
+  border: 1px solid #ffcdd2;
+  border-radius: 8px;
+  padding: 2rem;
+  text-align: center;
+  margin: 2rem;
+  color: #c62828;
+}
+
+.service-error-message h3 {
+  font-size: 1.5rem;
+  margin-bottom: 1rem;
+}
+
+.service-error-message p {
+  font-size: 1rem;
+  opacity: 0.8;
 }
 
 .app-content {