From 133be08785efdbcabb5b335d3e67833dbd4e5a92 Mon Sep 17 00:00:00 2001 From: marco370 <48531002-marco370@users.noreply.replit.com> Date: Sat, 11 Oct 2025 09:51:15 +0000 Subject: [PATCH] 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 --- client/src/pages/shifts.tsx | 8 +- replit.md | 342 ++++++++++++++++++++++-------------- 2 files changed, 216 insertions(+), 134 deletions(-) diff --git a/client/src/pages/shifts.tsx b/client/src/pages/shifts.tsx index 17f4545..3ceb15f 100644 --- a/client/src/pages/shifts.tsx +++ b/client/src/pages/shifts.tsx @@ -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) => { diff --git a/replit.md b/replit.md index 3d2185c..6d09eaa 100644 --- a/replit.md +++ b/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 \ No newline at end of file +- Interfaccia in italiano +- Dark mode di default +- Design operativo e funzionale (non decorativo) +- Focus su efficienza e densità informativa