feat: Initial CBPOA commit — 武汉儿童呼吸疾病风险评估系统
Context: Build a spatial risk assessment system correlating air quality data with children's respiratory disease incidence across Wuhan. Approach: FastAPI backend serving PostGIS spatial queries, React frontend with Deck.gl maps, and a PyTorch SpatialTemporalGCN pipeline for multi-day (1d/3d/7d) risk prediction. Changes: - backend/ — FastAPI API with auth (JWT), alerts, risk analysis, geocoded case data, grid statistics, and report endpoints - frontend/ — React dashboard with interactive risk maps, alert monitoring, district comparison charts, and timeline player - models/ — SpatialTemporalGCN model with trained weights and ONNX export for inference - scripts/ — ETL pipeline for weather + medical data, grid generation, feature engineering, training, and daily inference - deploy/ — Docker Compose configs for backend, frontend, and MLflow - docs/ — API docs, deployment guide, user guide, and code review Impact: Enables spatial risk visualization, alert monitoring, and ML-driven health risk forecasting for environmental health teams.
This commit is contained in:
49
frontend/CLAUDE.md
Normal file
49
frontend/CLAUDE.md
Normal file
@@ -0,0 +1,49 @@
|
||||
# Frontend — React + TypeScript + Leaflet
|
||||
|
||||
## Stack
|
||||
|
||||
- React 18, TypeScript 5, Vite 5
|
||||
- Tailwind CSS, Recharts, Zustand (state), Axios
|
||||
- Leaflet / react-leaflet (maps)
|
||||
- Playwright (e2e tests)
|
||||
|
||||
## Structure
|
||||
|
||||
```
|
||||
frontend/src/
|
||||
main.tsx # Entry point
|
||||
App.tsx # Router setup
|
||||
components/ # Reusable UI (maps, charts, nav)
|
||||
pages/ # Route-level views
|
||||
services/api.ts # Axios client with TTL cache + request dedup
|
||||
stores/ # Zustand stores
|
||||
types/index.ts # Shared TypeScript interfaces
|
||||
utils/ # Helpers (responsive.ts)
|
||||
```
|
||||
|
||||
## Path Alias
|
||||
|
||||
`@/` maps to `src/` — use `import { X } from '@/components/X'`.
|
||||
|
||||
## Patterns
|
||||
|
||||
- Components: PascalCase, one per file, default export
|
||||
- API calls: use `services/api.ts` wrappers (`riskApi`, `alertApi`, `caseApi`, `gridApi`) — they handle caching and request dedup
|
||||
- State: Zustand stores in `stores/`, typed with TypeScript interfaces from `types/`
|
||||
- Styling: Tailwind utility classes, no CSS modules
|
||||
|
||||
## Running
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
pnpm dev # localhost:5173, proxies /api → localhost:8000
|
||||
pnpm build # tsc + vite build → dist/
|
||||
```
|
||||
|
||||
## Anti-Patterns
|
||||
|
||||
- Don't call axios directly — use the cached API wrappers in `services/api.ts`
|
||||
- Don't use `any` in TypeScript types — use `unknown` and narrow
|
||||
- Don't mix data fetching with presentation — fetch in pages, render in components
|
||||
- Don't inline styles when Tailwind classes work
|
||||
- Don't create god components (>200 lines) — extract sub-components
|
||||
Reference in New Issue
Block a user