feat: Phase 4 — responsive analysis pages + perf harness + god-component splits

Final phase of the UX modernization. Four conflict-free lanes.

Responsive (D4 — desktop+mobile 并重):
- 7 analysis pages made usable at 375px: grid-cols-4/5 → grid-cols-2 sm:*
  responsive variants; raw tables wrapped in overflow-x-auto; page overflow guards
- new e2e/responsive.spec.ts loops all 7 analysis routes at 375px asserting no
  horizontal scroll

Perf harness:
- playwright.config.ts gains an isolated `perf` project (testMatch /perf/), default
  chromium project excludes it (testIgnore)
- new e2e/perf.spec.ts: CDP Network.emulateNetworkConditions (Fast 3G) +
  PerformanceObserver LCP on /overview kpi-row + route-transition timing; numbers
  reported as a relative regression signal (dev-server, not a prod SLA), not gated

God-component splits (pure refactors, behavior-preserving):
- MonitoringDashboard 686 → 239 lines: extracted components/monitoring/* (StatsBar,
  OverviewTab, CaseStatsTab, DistrictStatsTab) + useMonitoringData hook; URL-granularity
  source-of-truth + drilldown reconcile kept in the orchestrator (no desync regression)
- AlertsDashboard 816 → 301 lines: extracted components/alerts/* (Toolbar, List,
  RiskPanel, MapPanel, DetailModal, …); role/privacy/grid-hide logic kept in the
  orchestrator — doctor-view privacy invariant (zero patient-point) still holds

Gates: tsc 0 · vitest 75 · functional e2e 37/37 (incl doctor-view privacy +
granularity + responsive) · build ok · perf project runs + reports

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-21 21:00:15 +08:00
parent 8ad7e086bb
commit 33f0f497d3
26 changed files with 2349 additions and 1215 deletions

View File

@@ -14,6 +14,16 @@ export default defineConfig({
projects: [
{
name: 'chromium',
// Functional suite. Exclude the throttled perf spec so emulated Fast-3G
// latency never bleeds into (or slows) the normal acceptance run.
testIgnore: /perf\.spec\.ts/,
use: { ...devices['Desktop Chrome'] },
},
{
// Dedicated perf project — only perf.spec.ts runs here, under CDP network
// throttling. Kept separate so functional and perf measurements don't mix.
name: 'perf',
testMatch: /perf\.spec\.ts/,
use: { ...devices['Desktop Chrome'] },
},
],