feat(display): add compact QUIC and host health views

web/display/src/periods.ts

@@ -98,7 +98,7 @@ export function usePeriod(lineId: string, ready: boolean, sinceMs: number | null
             from: new Date(Math.max(domainStart, sinceMs === null ? domainStart : dayBounds(sinceMs).start)).toISOString(),
             to: new Date(domainEnd).toISOString(),
             step: wide ? '2m' : '1m',
-            preset: 'udp',
+            preset: 'quic',
             metrics: 'rtt.p50,loss.total',
           })
         : Promise.resolve(undefined),
@@ -171,10 +171,10 @@ export function usePeriod(lineId: string, ready: boolean, sinceMs: number | null
 }
 
 /** 这一段的序列；今天的「最近一段」会定时刷新。 */
-export function usePeriodSeries(lineId: string, ready: boolean, period: Period) {
+export function usePeriodSeries(lineId: string, ready: boolean, period: Period, preset = 'quic,tcp,connect,scores', metrics?: string) {
   return useQuery(
-    () => (ready ? api.get<SeriesDto>(`/api/public/lines/${encodeURIComponent(lineId)}/series`, { ...period.query, preset: 'udp,tcp,connect,scores' }) : Promise.resolve(undefined)),
-    [lineId, JSON.stringify(period.query), ready],
+    () => (ready ? api.get<SeriesDto>(`/api/public/lines/${encodeURIComponent(lineId)}/series`, { ...period.query, ...(metrics ? { metrics } : { preset }) }) : Promise.resolve(undefined)),
+    [lineId, JSON.stringify(period.query), ready, preset, metrics],
     period.isToday ? (period.win === 'day' ? 60_000 : 10_000) : undefined,
   )
 }