diff --git a/frontend/src/admin/pages/Logs.tsx b/frontend/src/admin/pages/Logs.tsx index 513ac30..28768e6 100644 --- a/frontend/src/admin/pages/Logs.tsx +++ b/frontend/src/admin/pages/Logs.tsx @@ -7,7 +7,7 @@ * - 缓冲上限 2000 条,进程重启后清零 */ -import { useEffect, useState, useCallback, useRef } from 'react' +import { useEffect, useState, useCallback, useRef, useMemo } from 'react' import { fetchLogs } from '../dal' import type { LogEntry } from '../types' import { Card, CardBody, CardHeader, Badge, SectionHeader, Alert, Spinner, SkeletonBlock } from '../components' @@ -63,6 +63,10 @@ export default function LogsPage() { userScrolledUp.current = !atBottom } + // 后端返回最新在前;渲染转为时间正序(旧→新),配合「自动贴底」滚动: + // 打开页面/自动刷新默认定位到最新日志,用户上滚回看时暂停跟随 + const ordered = useMemo(() => [...entries].reverse(), [entries]) + // 加载后自动滚动到底部(仅当用户未向上滚动时) useEffect(() => { if (autoRefresh && !userScrolledUp.current && scrollRef.current) { @@ -142,7 +146,7 @@ export default function LogsPage() {

暂无匹配的日志

) : (
- {entries.map((e, i) => { + {ordered.map((e, i) => { const badge = LEVEL_BADGE[e.level] ?? { status: 'info' as const, text: e.level } return (