Update planning page to use URL parameters for location and date

Incorporate `useLocation` hook from `wouter` to read `date` and `location` from URL search parameters, allowing pre-selection of these values and updating component state accordingly via `useEffect`.

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/uZXH8P1
This commit is contained in:
marco370 2025-10-18 07:24:05 +00:00
parent fad541525b
commit cafaa76608

View File

@ -1,4 +1,4 @@
import { useState } from "react"; import { useState, useEffect } from "react";
import { useQuery, useMutation } from "@tanstack/react-query"; import { useQuery, useMutation } from "@tanstack/react-query";
import { queryClient, apiRequest } from "@/lib/queryClient"; import { queryClient, apiRequest } from "@/lib/queryClient";
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card"; import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
@ -14,6 +14,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@
import { format } from "date-fns"; import { format } from "date-fns";
import { it } from "date-fns/locale"; import { it } from "date-fns/locale";
import { useToast } from "@/hooks/use-toast"; import { useToast } from "@/hooks/use-toast";
import { useLocation } from "wouter";
interface Shift { interface Shift {
id: string; id: string;
@ -93,14 +94,33 @@ const locationLabels: Record<string, string> = {
export default function OperationalPlanning() { export default function OperationalPlanning() {
const { toast } = useToast(); const { toast } = useToast();
const [selectedLocation, setSelectedLocation] = useState<string>("roccapiemonte"); // Sede selezionata (primo step) const [location] = useLocation();
// Leggi parametri dalla URL
const searchParams = new URLSearchParams(location.split('?')[1] || '');
const urlDate = searchParams.get('date');
const urlLocation = searchParams.get('location');
const [selectedLocation, setSelectedLocation] = useState<string>(
urlLocation && ['roccapiemonte', 'milano', 'roma'].includes(urlLocation)
? urlLocation
: "roccapiemonte"
);
const [selectedDate, setSelectedDate] = useState<string>( const [selectedDate, setSelectedDate] = useState<string>(
format(new Date(), "yyyy-MM-dd") urlDate || format(new Date(), "yyyy-MM-dd")
); );
const [selectedSite, setSelectedSite] = useState<UncoveredSite | null>(null); const [selectedSite, setSelectedSite] = useState<UncoveredSite | null>(null);
const [selectedGuards, setSelectedGuards] = useState<string[]>([]); const [selectedGuards, setSelectedGuards] = useState<string[]>([]);
const [selectedVehicle, setSelectedVehicle] = useState<string | null>(null); const [selectedVehicle, setSelectedVehicle] = useState<string | null>(null);
const [createShiftDialogOpen, setCreateShiftDialogOpen] = useState(false); const [createShiftDialogOpen, setCreateShiftDialogOpen] = useState(false);
// Aggiorna stato quando cambiano i parametri URL
useEffect(() => {
if (urlDate) setSelectedDate(urlDate);
if (urlLocation && ['roccapiemonte', 'milano', 'roma'].includes(urlLocation)) {
setSelectedLocation(urlLocation);
}
}, [urlDate, urlLocation]);
// Query per siti non coperti (filtrati per sede e data) // Query per siti non coperti (filtrati per sede e data)
const { data: uncoveredData, isLoading } = useQuery<UncoveredSitesData>({ const { data: uncoveredData, isLoading } = useQuery<UncoveredSitesData>({