feat: Implement core backend API server, S2A integration, auto-add service, and a new monitoring page.

frontend/src/hooks/useS2AApi.ts

@@ -45,20 +45,34 @@ export function useS2AApi() {
 
         // 兼容不同的响应格式
         // 格式1: { data: [...], total: N }
-        // 格式2: { list: [...], total: N }
-        // 格式3: 直接是数组 [...]
+        // 格式2: { items: [...], total: N }  ← S2A 实际使用这个
+        // 格式3: { list: [...], total: N }
+        // 格式4: 直接是数组 [...]
         let accounts: S2AAccount[] = []
         let total = 0
 
+        const res = response as unknown as {
+          data?: S2AAccount[]
+          items?: S2AAccount[]
+          list?: S2AAccount[]
+          total?: number
+          page?: number
+          page_size?: number
+        }
+
         if (Array.isArray(response)) {
           accounts = response as unknown as S2AAccount[]
           total = accounts.length
-        } else if (response.data && Array.isArray(response.data)) {
-          accounts = response.data
-          total = response.total || accounts.length
-        } else if ((response as unknown as { list: S2AAccount[] }).list) {
-          accounts = (response as unknown as { list: S2AAccount[] }).list
-          total = response.total || accounts.length
+        } else if (res.items && Array.isArray(res.items)) {
+          // S2A API 使用 items 字段
+          accounts = res.items
+          total = res.total || accounts.length
+        } else if (res.data && Array.isArray(res.data)) {
+          accounts = res.data
+          total = res.total || accounts.length
+        } else if (res.list && Array.isArray(res.list)) {
+          accounts = res.list
+          total = res.total || accounts.length
         }
 
         console.log('Parsed accounts:', accounts.length, 'total:', total)
@@ -66,9 +80,9 @@ export function useS2AApi() {
         return {
           data: accounts,
           total: total,
-          page: response.page || 1,
-          page_size: response.page_size || 20,
-          total_pages: Math.ceil(total / (response.page_size || 20)),
+          page: res.page || 1,
+          page_size: res.page_size || 20,
+          total_pages: Math.ceil(total / (res.page_size || 20)),
         }
       } catch (err) {
         const message = err instanceof Error ? err.message : '获取账号列表失败'

frontend/src/pages/Monitor.tsx

@@ -419,10 +419,12 @@ export default function Monitor() {
                             </div>
                         </div>
                         {deficit > 0 && (
-                            <p className="mt-2 text-xs text-orange-500 flex items-center gap-1">
-                                <AlertTriangle className="h-3 w-3" />
-                                低于目标
-                            </p>
+                            <div className="mt-2 space-y-1">
+                                <p className="text-xs text-orange-500 flex items-center gap-1">
+                                    <AlertTriangle className="h-3 w-3" />
+                                    低于目标，需要约 {Math.ceil(deficit / 4)} 个 Team
+                                </p>
+                            </div>
                         )}
                     </CardContent>
                 </Card>