✦ Angular Field Checklist PWA

Offline-ready Angular inspection tablet for field audits, safety walks, venue readiness, and turnover checks.

---

✨ Highlights

• Field-tablet UI with a dark route rail, paper inspection sheet, and radio-style issue queue
• Inspection templates for apartment turnover, cafe opening, warehouse safety, and event readiness
• Mock data shaped as a future inspection API contract
• Pass, review, fail, clear, and evidence-count actions per checklist item
• Computed progress, issue queue, evidence totals, and section completion
• localStorage run persistence plus Angular Service Worker and PWA manifest metadata

🛠️ Tech Stack

• Angular 21 with standalone components
• Angular Signals and computed state
• TypeScript 5.9
• Tailwind CSS 4 via @tailwindcss/postcss
• Lucide Angular SVG icons
• Angular Service Worker
• Vitest via the Angular CLI unit-test builder

🔌 Mock API Contract

The mock data lives in src/app/data/mock-inspections.ts and follows the shape a future API can return:

• InspectionTemplate
• ChecklistSection
• InspectionItem
• InspectionState
• IssueLogEntry

The UI reads and mutates state through InspectionStateService, so the data source can later move to HttpClient without rewriting the template.

🗂️ Project Structure

angular-field-checklist-pwa/
|-- .postcssrc.json
|-- public/
|   |-- favicon.svg
|   `-- manifest.webmanifest
|-- src/
|   |-- app/
|   |   |-- data/
|   |   |   `-- mock-inspections.ts
|   |   |-- services/
|   |   |   `-- inspection-state.ts
|   |   |-- app.config.ts
|   |   |-- app.html
|   |   |-- app.spec.ts
|   |   |-- app.ts
|   |   `-- models.ts
|   |-- index.html
|   |-- main.ts
|   `-- styles.css
|-- LICENSE
|-- ngsw-config.json
|-- package.json
|-- vercel.json
`-- README.md

🚀 Local Development

npm install
npm start

Open http://localhost:4200.

🧪 Checks

npm test -- --watch=false
npm run build

🌐 Vercel Deployment

The repository includes vercel.json for Angular static deployment:

{
  "framework": "angular",
  "buildCommand": "npm run build",
  "outputDirectory": "dist/angular-field-checklist-pwa/browser"
}

📄 License

MIT License. See LICENSE.