diff --git a/src/web/index.css b/src/web/index.css index 18f51ee..3151f7e 100644 --- a/src/web/index.css +++ b/src/web/index.css @@ -877,6 +877,12 @@ body { background: color-mix(in srgb, var(--color-primary) 22%, var(--color-bg-card)); } +.btn-ghost-active { + background: color-mix(in srgb, var(--color-primary) 22%, var(--color-bg-card)); + border-color: var(--color-primary) !important; + color: var(--color-primary); +} + .btn-link { background: transparent; border: none; diff --git a/src/web/pages/ProxyLogs.tsx b/src/web/pages/ProxyLogs.tsx index e2c57d8..8fc6bb4 100644 --- a/src/web/pages/ProxyLogs.tsx +++ b/src/web/pages/ProxyLogs.tsx @@ -219,6 +219,7 @@ export default function ProxyLogs() { const [detailById, setDetailById] = useState>({}); const [showFilters, setShowFilters] = useState(false); const [sites, setSites] = useState>([]); + const [autoRefresh, setAutoRefresh] = useState(false); const isMobile = useIsMobile(768); const toast = useToast(); const loadSeq = useRef(0); @@ -320,7 +321,7 @@ export default function ProxyLogs() { return siteOptions.find((option) => option.value === String(siteFilter))?.label || `站点 #${siteFilter}`; }, [siteFilter, siteOptions]); - const load = useCallback(async () => { + const load = useCallback(async (silent = false) => { const seq = ++loadSeq.current; if (hasInvalidTimeRange) { setLogs([]); @@ -329,7 +330,7 @@ export default function ProxyLogs() { if (seq === loadSeq.current) setLoading(false); return; } - setLoading(true); + if (!silent) setLoading(true); try { const params = { limit: pageSize, @@ -347,7 +348,7 @@ export default function ProxyLogs() { setSummary(data.summary || EMPTY_SUMMARY); } catch (e: any) { if (seq !== loadSeq.current) return; - toast.error(e.message || '加载日志失败'); + if (!silent) toast.error(e.message || '加载日志失败'); } finally { if (seq === loadSeq.current) setLoading(false); } @@ -357,6 +358,12 @@ export default function ProxyLogs() { void load(); }, [load]); + useEffect(() => { + if (!autoRefresh) return; + const timer = setInterval(() => { void load(true); }, 2000); + return () => clearInterval(timer); + }, [autoRefresh, load]); + useEffect(() => { if (page <= totalPages) return; setPage(totalPages); @@ -504,12 +511,25 @@ export default function ProxyLogs() { {summary.totalTokensAll.toLocaleString()} tokens - +
+ + +
{isMobile ? (