Update shift creation to ensure correct date objects are used
Adjust the `Shifts` component to correctly format `startTime` and `endTime` as Date objects before submitting to the `createMutation`, preventing potential issues with date parsing on the backend. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 99f0fce6-9386-489a-9632-1d81223cab44 Replit-Commit-Checkpoint-Type: intermediate_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/6d543d2c-20b9-4ea6-93fe-70fe9b1d9f80/99f0fce6-9386-489a-9632-1d81223cab44/nGJAldO
This commit is contained in:
parent
abe4041cd1
commit
133be08785
@ -65,7 +65,13 @@ export default function Shifts() {
|
||||
});
|
||||
|
||||
const onSubmit = (data: InsertShift) => {
|
||||
createMutation.mutate(data);
|
||||
// Ensure dates are Date objects, not strings
|
||||
const shiftData = {
|
||||
...data,
|
||||
startTime: data.startTime instanceof Date ? data.startTime : new Date(data.startTime),
|
||||
endTime: data.endTime instanceof Date ? data.endTime : new Date(data.endTime),
|
||||
};
|
||||
createMutation.mutate(shiftData);
|
||||
};
|
||||
|
||||
const getStatusLabel = (status: string) => {
|
||||
|
||||
342
replit.md
342
replit.md
@ -1,140 +1,216 @@
|
||||
# VigilanzaTurni - Security Shift Management System
|
||||
# VigilanzaTurni - Sistema Gestione Turni per Istituti di Vigilanza
|
||||
|
||||
## Overview
|
||||
Sistema professionale di gestione turni 24/7 per istituti di vigilanza con:
|
||||
- Autenticazione multi-ruolo (Admin, Coordinatore, Guardia, Cliente)
|
||||
- Gestione anagrafica guardie con skill matrix e certificazioni
|
||||
- Pianificazione turni con calendario 24/7
|
||||
- Gestione siti/commesse con tipologie servizio
|
||||
- Dashboard operativa con KPI live
|
||||
- Reportistica ore lavorate
|
||||
- Sistema notifiche
|
||||
|
||||
VigilanzaTurni is a professional 24/7 shift management system designed specifically for security and surveillance institutes. The application manages guards, sites, shifts, certifications, and provides comprehensive operational control for security operations.
|
||||
## Project Architecture
|
||||
|
||||
**Core Purpose:** Streamline security personnel scheduling, credential management, site assignments, and real-time operational oversight with compliance-focused audit trails and reporting.
|
||||
### Stack Tecnologico
|
||||
- **Frontend**: React + TypeScript + Tailwind CSS + Shadcn UI
|
||||
- **Backend**: Express.js + TypeScript
|
||||
- **Database**: PostgreSQL (Neon) con Drizzle ORM
|
||||
- **Autenticazione**: Replit Auth (OIDC)
|
||||
- **State Management**: TanStack Query v5
|
||||
- **Routing**: Wouter
|
||||
|
||||
**Technology Stack:**
|
||||
- Frontend: React with TypeScript, Vite bundler
|
||||
- UI Framework: Radix UI components with shadcn/ui (New York style)
|
||||
- Styling: Tailwind CSS with custom design system
|
||||
- Backend: Express.js with TypeScript
|
||||
- Database: PostgreSQL via Neon serverless
|
||||
- ORM: Drizzle ORM
|
||||
- Authentication: Replit Auth with OpenID Connect
|
||||
- State Management: TanStack Query (React Query)
|
||||
- Form Handling: React Hook Form with Zod validation
|
||||
### Design System
|
||||
- **Font Principale**: Inter (sans-serif)
|
||||
- **Font Monospace**: JetBrains Mono (per matricole, ID)
|
||||
- **Colori**:
|
||||
- Primary: Blue (210, 100%, 45-50%) - operativo, affidabile
|
||||
- Status Active: Green (140, 60%, 45%)
|
||||
- Status Late/Warning: Orange (25, 90%, 55%)
|
||||
- Status Emergency: Red (0, 70%, 55%)
|
||||
- Status Inactive: Gray (220, 15%, 50%)
|
||||
- **Tema**: Dark mode di default con supporto light mode
|
||||
- **Componenti**: Shadcn UI con design operativo
|
||||
|
||||
## Database Schema
|
||||
|
||||
### Core Tables
|
||||
|
||||
**users** (Replit Auth):
|
||||
- id, email, firstName, lastName, profileImageUrl
|
||||
- role: admin | coordinator | guard | client
|
||||
- createdAt, updatedAt
|
||||
|
||||
**guards**:
|
||||
- id, userId (FK), badgeNumber (unique), phoneNumber
|
||||
- Skills: isArmed, hasFireSafety, hasFirstAid, hasDriverLicense
|
||||
- languages: array
|
||||
|
||||
**certifications**:
|
||||
- id, guardId (FK), type, name
|
||||
- issueDate, expiryDate
|
||||
- status: valid | expiring_soon | expired
|
||||
|
||||
**sites**:
|
||||
- id, name, address, clientId (FK)
|
||||
- shiftType: fixed_post | patrol | night_inspection | quick_response
|
||||
- minGuards, requiresArmed, requiresDriverLicense
|
||||
- isActive
|
||||
|
||||
**shifts**:
|
||||
- id, siteId (FK)
|
||||
- startTime, endTime
|
||||
- status: planned | active | completed | cancelled
|
||||
|
||||
**shift_assignments**:
|
||||
- id, shiftId (FK), guardId (FK)
|
||||
- checkInTime, checkOutTime
|
||||
|
||||
**notifications**:
|
||||
- id, userId (FK), title, message, type
|
||||
- isRead, relatedEntityId
|
||||
|
||||
## API Endpoints
|
||||
|
||||
### Authentication
|
||||
- `GET /api/login` - Inizia flow OIDC
|
||||
- `GET /api/callback` - Callback OIDC
|
||||
- `GET /api/logout` - Logout
|
||||
- `GET /api/auth/user` - Current user (protected)
|
||||
|
||||
### Guards
|
||||
- `GET /api/guards` - Lista guardie con certificazioni
|
||||
- `POST /api/guards` - Crea guardia
|
||||
|
||||
### Sites
|
||||
- `GET /api/sites` - Lista siti
|
||||
- `POST /api/sites` - Crea sito
|
||||
|
||||
### Shifts
|
||||
- `GET /api/shifts` - Lista tutti i turni
|
||||
- `GET /api/shifts/active` - Solo turni attivi
|
||||
- `POST /api/shifts` - Crea turno
|
||||
|
||||
### Notifications
|
||||
- `GET /api/notifications` - Lista notifiche utente
|
||||
- `PATCH /api/notifications/:id/read` - Segna come letto
|
||||
|
||||
## Frontend Routes
|
||||
|
||||
| Route | Accesso | Descrizione |
|
||||
|-------|---------|-------------|
|
||||
| `/` | Public/Protected | Landing page o Dashboard |
|
||||
| `/guards` | Admin, Coordinator | Gestione guardie |
|
||||
| `/sites` | Admin, Coordinator, Client | Gestione siti |
|
||||
| `/shifts` | Admin, Coordinator, Guard | Pianificazione turni |
|
||||
| `/reports` | Admin, Coordinator, Client | Reportistica |
|
||||
| `/notifications` | Admin, Coordinator, Guard | Notifiche |
|
||||
|
||||
## User Roles
|
||||
|
||||
### Admin
|
||||
- Accesso completo a tutte le funzionalità
|
||||
- Gestione guardie, siti, turni
|
||||
- Visualizzazione reportistica completa
|
||||
|
||||
### Coordinator
|
||||
- Pianificazione turni
|
||||
- Assegnazione guardie
|
||||
- Gestione siti operativi
|
||||
- Reportistica
|
||||
|
||||
### Guard
|
||||
- Visualizzazione turni assegnati
|
||||
- Timbratura (future)
|
||||
- Notifiche
|
||||
- Profilo personale
|
||||
|
||||
### Client
|
||||
- Visualizzazione siti di competenza
|
||||
- Reportistica servizi
|
||||
- KPI e SLA
|
||||
|
||||
## Key Features
|
||||
|
||||
### Dashboard Operativa
|
||||
- KPI Cards: Turni attivi, Guardie totali, Siti attivi, Certificazioni in scadenza
|
||||
- Live status turni in corso
|
||||
- Alert certificazioni in scadenza (< 30 giorni)
|
||||
|
||||
### Gestione Guardie
|
||||
- Anagrafica completa con foto profilo
|
||||
- Skill matrix (armato, antincendio, primo soccorso, patente)
|
||||
- Gestione certificazioni con scadenze automatiche
|
||||
- Badge number univoco
|
||||
|
||||
### Gestione Siti/Commesse
|
||||
- Tipologie servizio: Presidio fisso, Pattugliamento, Ispettorato notturno, Pronto intervento
|
||||
- Requisiti minimi (n° guardie, armato, patente)
|
||||
- Geolocalizzazione (future)
|
||||
|
||||
### Pianificazione Turni
|
||||
- Calendario 24/7
|
||||
- Assegnazione manuale guardie
|
||||
- Vincoli base (future: riposi, orari massimi)
|
||||
- Stati turno: pianificato, attivo, completato, annullato
|
||||
|
||||
### Reportistica
|
||||
- Ore totali lavorate
|
||||
- Ore mensili per guardia
|
||||
- Statistiche turni completati
|
||||
- Export dati (future)
|
||||
|
||||
## Development
|
||||
|
||||
### Setup
|
||||
```bash
|
||||
npm install
|
||||
npm run db:push # Setup database
|
||||
npm run dev # Start application
|
||||
```
|
||||
|
||||
### Environment Variables
|
||||
- `DATABASE_URL` - PostgreSQL connection string
|
||||
- `SESSION_SECRET` - Session encryption key
|
||||
- `REPLIT_DOMAINS` - Authorized domains for OIDC
|
||||
- `ISSUER_URL` - OIDC provider URL (default: https://replit.com/oidc)
|
||||
- `REPL_ID` - Replit application ID
|
||||
|
||||
### Testing
|
||||
All interactive elements have `data-testid` attributes for automated testing.
|
||||
|
||||
## Recent Changes
|
||||
|
||||
### 2025-10-11
|
||||
- Implementato schema database completo
|
||||
- Creato frontend con tutte le pagine operative
|
||||
- Configurato Replit Auth per autenticazione multi-ruolo
|
||||
- Implementati endpoint API per CRUD completo
|
||||
- Aggiunto sistema notifiche
|
||||
- Fix bug conversione date nei turni
|
||||
- Aggiunto SEO completo (title, meta description, Open Graph)
|
||||
|
||||
## Future Enhancements
|
||||
|
||||
### Priorità Alta
|
||||
- App mobile guardie con geofencing e timbratura GPS
|
||||
- Motore ottimizzazione turni con vincoli avanzati
|
||||
- Sistema ronde con checkpoint NFC/QR
|
||||
- Panic button e incident reporting
|
||||
|
||||
### Priorità Media
|
||||
- Portale clienti dedicato
|
||||
- Gestione dotazioni (armi, bodycam, radio)
|
||||
- Integrazione payroll (Zucchetti/Teamsystem)
|
||||
- Export reportistica avanzata
|
||||
|
||||
### Priorità Bassa
|
||||
- Dashboard analytics avanzata
|
||||
- Audit trail completo
|
||||
- API pubblica per integrazioni terze
|
||||
|
||||
## User Preferences
|
||||
|
||||
Preferred communication style: Simple, everyday language.
|
||||
|
||||
## System Architecture
|
||||
|
||||
### Frontend Architecture
|
||||
|
||||
**Component Structure:**
|
||||
- Page-based routing using Wouter for client-side navigation
|
||||
- Component library built on Radix UI primitives with shadcn/ui styling
|
||||
- Custom operational components (KPICard, StatusBadge) for security-specific UI
|
||||
- Responsive sidebar layout (SidebarProvider) with collapsible navigation
|
||||
- Theme system supporting dark/light modes with operational color palette
|
||||
|
||||
**State Management:**
|
||||
- TanStack Query for server state and API caching
|
||||
- Custom hooks pattern (useAuth, useIsMobile, useToast) for reusable logic
|
||||
- Form state managed via React Hook Form with Zod schema validation
|
||||
- Client-side authentication state derived from user query
|
||||
|
||||
**Design System:**
|
||||
- Material Design principles adapted for operational clarity
|
||||
- Dark mode as primary interface (operational background: HSL 220 15% 12%)
|
||||
- Status-based color coding: Green (active), Red (emergency), Orange (alerts), Amber (pending)
|
||||
- Typography: Inter for UI, JetBrains Mono for technical data (IDs, timestamps)
|
||||
- Border radius: 9px (lg), 6px (md), 3px (sm) for consistent visual hierarchy
|
||||
|
||||
### Backend Architecture
|
||||
|
||||
**API Layer:**
|
||||
- RESTful Express.js server with TypeScript
|
||||
- Session-based authentication using connect-pg-simple
|
||||
- Route handlers in `/server/routes.ts` with middleware authentication
|
||||
- Request/response logging middleware for audit trails
|
||||
- Error handling middleware with standardized error responses
|
||||
|
||||
**Database Design:**
|
||||
- PostgreSQL schema defined in `/shared/schema.ts` using Drizzle ORM
|
||||
- Key entities: Users, Guards, Sites, Shifts, ShiftAssignments, Certifications, Notifications
|
||||
- Enums for role management, shift types, certification status
|
||||
- Foreign key relationships: Guards → Users, ShiftAssignments → Guards/Shifts, Certifications → Guards
|
||||
- Automatic timestamp tracking (createdAt, updatedAt)
|
||||
|
||||
**Data Access Pattern:**
|
||||
- Storage abstraction layer in `/server/storage.ts` implementing IStorage interface
|
||||
- Centralized database operations preventing direct DB access in routes
|
||||
- Drizzle ORM for type-safe queries with PostgreSQL dialect
|
||||
- Relationship loading via Drizzle relations for nested data (guards with certifications)
|
||||
|
||||
### Authentication & Authorization
|
||||
|
||||
**Replit Auth Integration:**
|
||||
- OpenID Connect flow via `openid-client` library
|
||||
- Session management with PostgreSQL-backed session store
|
||||
- User profile synchronization on login (upsertUser pattern)
|
||||
- Role-based access control via userRoleEnum (admin, coordinator, guard, client)
|
||||
- Middleware authentication check (`isAuthenticated`) protecting all `/api/*` routes
|
||||
|
||||
**Session Security:**
|
||||
- HTTPOnly cookies with secure flag
|
||||
- 7-day session TTL with automatic cleanup
|
||||
- Session data stored in dedicated `sessions` table
|
||||
- CSRF protection via same-origin policy
|
||||
|
||||
### External Dependencies
|
||||
|
||||
**Third-party Services:**
|
||||
- Neon Database: Serverless PostgreSQL with WebSocket connections
|
||||
- Replit Auth: OAuth/OIDC authentication provider
|
||||
- Google Fonts: Inter and JetBrains Mono font families
|
||||
|
||||
**Key Libraries:**
|
||||
- `@neondatabase/serverless`: PostgreSQL driver with WebSocket support
|
||||
- `drizzle-orm`: Type-safe ORM with schema validation
|
||||
- `drizzle-zod`: Schema-to-Zod validator generation
|
||||
- `express-session`: Session middleware
|
||||
- `connect-pg-simple`: PostgreSQL session store
|
||||
- `passport` + `openid-client`: Authentication strategy
|
||||
- `@tanstack/react-query`: Async state management
|
||||
- `react-hook-form` + `@hookform/resolvers`: Form validation
|
||||
- `date-fns`: Date manipulation and formatting (Italian locale support)
|
||||
- `wouter`: Lightweight client-side routing
|
||||
- `class-variance-authority` + `clsx` + `tailwind-merge`: Dynamic styling utilities
|
||||
|
||||
**Build & Development:**
|
||||
- Vite for frontend bundling with React plugin
|
||||
- esbuild for server-side bundling
|
||||
- TypeScript with strict mode and path aliases (@/, @shared/, @assets/)
|
||||
- PostCSS with Tailwind CSS and Autoprefixer
|
||||
|
||||
### Data Models
|
||||
|
||||
**Core Entities:**
|
||||
1. **Guards**: Badge number, contact info, skills (armed, fire safety, first aid, driver license, languages), user relationship
|
||||
2. **Certifications**: Type, issue/expiry dates, status (valid/expiring_soon/expired), attached to guards
|
||||
3. **Sites**: Name, address, shift type requirements, minimum guards, armed/driver requirements, active status
|
||||
4. **Shifts**: Time range, site assignment, status (planned/active/completed/cancelled), guard assignments
|
||||
5. **ShiftAssignments**: Many-to-many relationship between shifts and guards
|
||||
6. **Notifications**: Type-based alerts (shift_assigned, certification_expiring, shift_reminder), read status
|
||||
|
||||
**Business Logic:**
|
||||
- Certification status auto-update based on expiry date (< 30 days = expiring_soon, past = expired)
|
||||
- Real-time shift status tracking (active shifts query endpoint)
|
||||
- Guard-site compatibility checking (armed requirement, skills matching)
|
||||
- Operational KPIs: active shifts, total guards, active sites, expiring certifications
|
||||
|
||||
### Deployment Configuration
|
||||
|
||||
**Environment Variables Required:**
|
||||
- `DATABASE_URL`: PostgreSQL connection string (Neon)
|
||||
- `SESSION_SECRET`: Session encryption key
|
||||
- `REPL_ID`: Replit deployment identifier
|
||||
- `ISSUER_URL`: OIDC provider URL (default: https://replit.com/oidc)
|
||||
- `REPLIT_DOMAINS`: Allowed authentication domains
|
||||
|
||||
**Build Process:**
|
||||
- Client: `vite build` → `dist/public`
|
||||
- Server: `esbuild` bundling → `dist/index.js`
|
||||
- Database migrations: `drizzle-kit push` for schema sync
|
||||
- Production: Node.js serves static files + API routes
|
||||
- Interfaccia in italiano
|
||||
- Dark mode di default
|
||||
- Design operativo e funzionale (non decorativo)
|
||||
- Focus su efficienza e densità informativa
|
||||
|
||||
Loading…
Reference in New Issue
Block a user