Improve guard selection by filtering based on availability and overtime

Refactors the guard selection UI to dynamically filter available guards, showing regular hours first and providing an option to display those requiring overtime.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: e5565357-90e1-419f-b9a8-6ee8394636df
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/6d543d2c-20b9-4ea6-93fe-70fe9b1d9f80/e5565357-90e1-419f-b9a8-6ee8394636df/qoWuIE4
This commit is contained in:
marco370 2025-10-21 16:51:34 +00:00
parent b782f16797
commit da547137b7
2 changed files with 106 additions and 88 deletions

View File

@ -39,6 +39,10 @@ externalPort = 5000
localPort = 43267 localPort = 43267
externalPort = 3003 externalPort = 3003
[[ports]]
localPort = 45469
externalPort = 5173
[env] [env]
PORT = "5000" PORT = "5000"

View File

@ -685,10 +685,19 @@ export default function GeneralPlanning() {
</div> </div>
{/* Select guardia disponibile */} {/* Select guardia disponibile */}
{(() => {
// Filtra guardie: mostra solo con ore ordinarie se toggle è off
const filteredGuards = availableGuards?.filter(g =>
g.isAvailable && (showOvertimeGuards || !g.requiresOvertime)
) || [];
const hasOvertimeGuards = availableGuards?.some(g => g.requiresOvertime && g.isAvailable) || false;
return (
<div className="space-y-2"> <div className="space-y-2">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<Label htmlFor="guard-select">Guardia Disponibile</Label> <Label htmlFor="guard-select">Guardia Disponibile</Label>
{!isLoadingGuards && availableGuards && availableGuards.some(g => g.requiresOvertime && g.isAvailable) && ( {!isLoadingGuards && hasOvertimeGuards && (
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
@ -703,14 +712,6 @@ export default function GeneralPlanning() {
{isLoadingGuards ? ( {isLoadingGuards ? (
<Skeleton className="h-10 w-full" /> <Skeleton className="h-10 w-full" />
) : ( ) : (
<>
{(() => {
// Filtra guardie: mostra solo con ore ordinarie se toggle è off
const filteredGuards = availableGuards?.filter(g =>
g.isAvailable && (showOvertimeGuards || !g.requiresOvertime)
) || [];
return (
<> <>
<Select <Select
value={selectedGuardId} value={selectedGuardId}
@ -738,26 +739,35 @@ export default function GeneralPlanning() {
)} )}
</SelectContent> </SelectContent>
</Select> </Select>
{filteredGuards.length === 0 && !showOvertimeGuards && availableGuards && availableGuards.some(g => g.isAvailable && g.requiresOvertime) && ( {filteredGuards.length === 0 && !showOvertimeGuards && hasOvertimeGuards && (
<p className="text-xs text-muted-foreground"> <p className="text-xs text-muted-foreground">
Alcune guardie disponibili richiedono straordinario. Clicca "Mostra Straordinario" per vederle. Alcune guardie disponibili richiedono straordinario. Clicca "Mostra Straordinario" per vederle.
</p> </p>
)} )}
</> {filteredGuards.length > 0 && selectedGuardId && (
);
})()}
</>
)}
{availableGuards && availableGuards.length > 0 && selectedGuardId && (
<div className="text-xs space-y-1"> <div className="text-xs space-y-1">
{(() => { {(() => {
const guard = availableGuards.find(g => g.guardId === selectedGuardId); const guard = availableGuards?.find(g => g.guardId === selectedGuardId);
if (!guard) return null; if (!guard) return null;
return ( return (
<> <>
<p className="text-muted-foreground">
Ore ordinarie: {guard.ordinaryHoursRemaining}h / 40h disponibili
{guard.requiresOvertime && ` • Straordinario: ${guard.overtimeHoursRemaining}h / 8h`}
</p>
<p className="text-muted-foreground"> <p className="text-muted-foreground">
Ore assegnate: {guard.weeklyHoursAssigned}h / {guard.weeklyHoursMax}h (rimangono {guard.weeklyHoursRemaining}h) Ore assegnate: {guard.weeklyHoursAssigned}h / {guard.weeklyHoursMax}h (rimangono {guard.weeklyHoursRemaining}h)
</p> </p>
{guard.nightHoursAssigned > 0 && (
<p className="text-muted-foreground">
Ore notturne: {guard.nightHoursAssigned}h / 48h settimanali
</p>
)}
{guard.hasRestViolation && (
<p className="text-yellow-600 dark:text-yellow-500 font-medium">
Attenzione: riposo insufficiente dall'ultimo turno
</p>
)}
{guard.conflicts && guard.conflicts.length > 0 && ( {guard.conflicts && guard.conflicts.length > 0 && (
<p className="text-destructive font-medium"> <p className="text-destructive font-medium">
Conflitto: {guard.conflicts.map((c: any) => Conflitto: {guard.conflicts.map((c: any) =>
@ -775,7 +785,11 @@ export default function GeneralPlanning() {
})()} })()}
</div> </div>
)} )}
</>
)}
</div> </div>
);
})()}
{/* Bottone assegna */} {/* Bottone assegna */}
<Button <Button