Keep monitor alive across nav and speed up status collect.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-30 13:44:27 +08:00
parent 3c2589f653
commit be5803332f
4 changed files with 93 additions and 42 deletions
+32 -19
View File
@@ -56,26 +56,39 @@ async def _collect_one_status(
*, *,
timeout: float | None = None, timeout: float | None = None,
) -> dict[str, Any]: ) -> dict[str, Any]:
"""有 Token 时只打 fleet/status(含在线+持仓),避免 /health 再多一跳。"""
base = _public_node(node)
if not node.get("token_sealed"):
probe = await probe_health(node, timeout=timeout)
return {
**base,
**probe,
"fleet_ok": False,
"fleet_error": "未生成 Token",
}
code, data = await call_node(
node, "GET", "/api/fleet/status", timeout=timeout
)
if code == 200 and isinstance(data, dict):
return {
**base,
"online": True,
"health": None,
"error": None,
"from_fleet": True,
"fleet": data,
"fleet_ok": True,
}
# fleet 失败时再探 /health,区分离线 vs Token 错误
probe = await probe_health(node, timeout=timeout) probe = await probe_health(node, timeout=timeout)
item: dict[str, Any] = {**_public_node(node), **probe} item: dict[str, Any] = {
if probe.get("online") and node.get("token_sealed"): **base,
# /health 也有 mode+strategy,但不能当 fleet(无持仓详情)。 **probe,
# 仅当 probe 已用 fleet 回退时复用,否则必须再拉 /api/fleet/status。 "fleet_ok": False,
if probe.get("from_fleet") and isinstance(probe.get("health"), dict): "fleet_error": _http_detail(data) if data else f"HTTP {code}",
code, data = 200, probe["health"] }
else:
code, data = await call_node(
node, "GET", "/api/fleet/status", timeout=timeout
)
if code == 200 and isinstance(data, dict):
item["fleet"] = data
item["fleet_ok"] = True
else:
item["fleet_ok"] = False
item["fleet_error"] = _http_detail(data) if data else f"HTTP {code}"
elif not node.get("token_sealed"):
item["fleet_ok"] = False
item["fleet_error"] = "未生成 Token"
return item return item
+32 -14
View File
@@ -1,5 +1,11 @@
import { type ReactNode } from "react"; import { type ReactNode } from "react";
import { NavLink, Navigate, Route, Routes } from "react-router-dom"; import {
NavLink,
Navigate,
Route,
Routes,
useLocation,
} from "react-router-dom";
import { clearSession, getToken, getUsername } from "./api"; import { clearSession, getToken, getUsername } from "./api";
import LoginPage from "./pages/Login"; import LoginPage from "./pages/Login";
import MonitorPage from "./pages/Monitor"; import MonitorPage from "./pages/Monitor";
@@ -38,9 +44,31 @@ function Shell({ children }: { children: ReactNode }) {
); );
} }
/** 监控页保活:切设置不断 SSE、不丢卡片状态 */
function AuthedPages() {
const loc = useLocation();
const onMonitor =
loc.pathname === "/" ||
loc.pathname === "/monitor" ||
loc.pathname.startsWith("/monitor/");
const onSettings =
loc.pathname === "/settings" || loc.pathname.startsWith("/settings/");
return (
<Shell>
<div className={onMonitor ? "page-pane" : "page-pane hidden"} aria-hidden={!onMonitor}>
<MonitorPage />
</div>
<div className={onSettings ? "page-pane" : "page-pane hidden"} aria-hidden={!onSettings}>
<SettingsPage />
</div>
{!onMonitor && !onSettings ? <Navigate to="/monitor" replace /> : null}
</Shell>
);
}
function RequireAuth({ children }: { children: ReactNode }) { function RequireAuth({ children }: { children: ReactNode }) {
if (!getToken()) return <Navigate to="/login" replace />; if (!getToken()) return <Navigate to="/login" replace />;
return <Shell>{children}</Shell>; return <>{children}</>;
} }
export default function App() { export default function App() {
@@ -48,23 +76,13 @@ export default function App() {
<Routes> <Routes>
<Route path="/login" element={<LoginPage />} /> <Route path="/login" element={<LoginPage />} />
<Route <Route
path="/monitor" path="/*"
element={ element={
<RequireAuth> <RequireAuth>
<MonitorPage /> <AuthedPages />
</RequireAuth> </RequireAuth>
} }
/> />
<Route
path="/settings"
element={
<RequireAuth>
<SettingsPage />
</RequireAuth>
}
/>
<Route path="/" element={<Navigate to="/monitor" replace />} />
<Route path="*" element={<Navigate to="/monitor" replace />} />
</Routes> </Routes>
); );
} }
+25 -9
View File
@@ -50,30 +50,43 @@ function hasOpenPosition(position: Record<string, unknown>): boolean {
return OPEN_STATUSES.has(st); return OPEN_STATUSES.has(st);
} }
/** 页面级快照:整页刷新前保留上次卡片,避免空白等待 */
let cachedNodes: NodeCard[] = [];
let cachedSseSec = 1;
export default function MonitorPage() { export default function MonitorPage() {
const [nodes, setNodes] = useState<NodeCard[]>([]); const [nodes, setNodes] = useState<NodeCard[]>(() => cachedNodes);
const [err, setErr] = useState(""); const [err, setErr] = useState("");
const [busy, setBusy] = useState<Record<number, string>>({}); const [busy, setBusy] = useState<Record<number, string>>({});
const [selected, setSelected] = useState<Set<number>>(new Set()); const [selected, setSelected] = useState<Set<number>>(new Set());
const [sseSec, setSseSec] = useState(1); const [sseSec, setSseSec] = useState(cachedSseSec);
const [liveState, setLiveState] = useState<"connecting" | "live" | "retry">("connecting"); const [liveState, setLiveState] = useState<"connecting" | "live" | "retry">(
cachedNodes.length ? "live" : "connecting",
);
const [detailId, setDetailId] = useState<number | null>(null); const [detailId, setDetailId] = useState<number | null>(null);
const applyNodes = useCallback((list: NodeCard[]) => {
cachedNodes = list;
setNodes(list);
}, []);
const refresh = useCallback(async () => { const refresh = useCallback(async () => {
try { try {
const r = await apiFetch<{ nodes: NodeCard[] }>("/api/nodes/status/all"); const r = await apiFetch<{ nodes: NodeCard[] }>("/api/nodes/status/all");
setNodes(r.nodes || []); applyNodes(r.nodes || []);
setErr(""); setErr("");
} catch (ex) { } catch (ex) {
setErr(ex instanceof Error ? ex.message : String(ex)); setErr(ex instanceof Error ? ex.message : String(ex));
} }
}, []); }, [applyNodes]);
useEffect(() => { useEffect(() => {
apiFetch<{ sse_interval_sec?: number }>("/api/auth/me") apiFetch<{ sse_interval_sec?: number }>("/api/auth/me")
.then((m) => { .then((m) => {
if (m.sse_interval_sec && Number(m.sse_interval_sec) > 0) { if (m.sse_interval_sec && Number(m.sse_interval_sec) > 0) {
setSseSec(Number(m.sse_interval_sec)); const sec = Number(m.sse_interval_sec);
cachedSseSec = sec;
setSseSec(sec);
} }
}) })
.catch(() => undefined); .catch(() => undefined);
@@ -85,7 +98,10 @@ export default function MonitorPage() {
let timer: number | undefined; let timer: number | undefined;
const ac = new AbortController(); const ac = new AbortController();
void refresh(); // 无缓存时先拉一次;有缓存则等 SSE,避免切页/重挂载双倍打满策略机
if (!cachedNodes.length) {
void refresh();
}
async function runStream() { async function runStream() {
while (!cancelled) { while (!cancelled) {
@@ -137,7 +153,7 @@ export default function MonitorPage() {
if (eventName === "error") { if (eventName === "error") {
setErr(parsed.detail || "SSE 错误"); setErr(parsed.detail || "SSE 错误");
} else if (parsed.nodes) { } else if (parsed.nodes) {
setNodes(parsed.nodes); applyNodes(parsed.nodes);
setErr(""); setErr("");
} }
} catch { } catch {
@@ -172,7 +188,7 @@ export default function MonitorPage() {
ac.abort(); ac.abort();
if (timer != null) window.clearTimeout(timer); if (timer != null) window.clearTimeout(timer);
}; };
}, [refresh]); }, [refresh, applyNodes]);
async function act(id: number, action: "start" | "pause" | "update" | "login") { async function act(id: number, action: "start" | "pause" | "update" | "login") {
if (action === "update") { if (action === "update") {
+4
View File
@@ -74,6 +74,10 @@ body {
font-size: 1.25rem; font-size: 1.25rem;
} }
.page-pane.hidden {
display: none;
}
.meta { .meta {
color: var(--muted); color: var(--muted);
font-size: 0.9rem; font-size: 0.9rem;