feat: implement QR code check-in system for event attendees

- Add UserQRCode component to display unique QR code on user profile
- Add QRCodeScanner component for mobile camera-based scanning
- Create EventCheckInPage for organizers to scan attendee QR codes
- Add backend endpoint POST /api/events/:id/checkin for check-in
- Add check-in button to EventDetailModal for organizers
- Install qrcode.react and html5-qrcode dependencies
- Implement real-time attendee list updates
- Add organizer permission validation
- Prevent duplicate check-ins
- Mobile-optimized with back camera support
This commit is contained in:
2025-11-20 18:52:04 +00:00
parent cbafe85694
commit e793a8e3ea
13 changed files with 870 additions and 235 deletions

View File

@@ -16,9 +16,11 @@
"@tanstack/react-query": "^5.90.9",
"date-fns": "^4.1.0",
"exifr": "^7.1.3",
"html5-qrcode": "^2.3.8",
"leaflet": "^1.9.4",
"leaflet.heat": "^0.2.0",
"leaflet.markercluster": "^1.5.3",
"qrcode.react": "^4.2.0",
"react": "^19.2.0",
"react-dom": "^19.2.0",
"react-leaflet": "^5.0.0",
@@ -32,6 +34,7 @@
"@types/leaflet": "^1.9.21",
"@types/leaflet.heat": "^0.2.5",
"@types/leaflet.markercluster": "^1.5.6",
"@types/qrcode.react": "^1.0.5",
"@types/react": "^19.2.2",
"@types/react-dom": "^19.2.2",
"@vitejs/plugin-react": "^5.1.0",