Add weather information display and configuration options

Integrate weather data fetching, display in a widget, and provide a settings page for configuration. Replit-Commit-Author: Agent Replit-Commit-Session-Id: d43bd811-9372-45a7-8ac9-4a954c0538e1 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/d43bd811-9372-45a7-8ac9-4a954c0538e1/BIZe1t3
2026-10-12 01:37:40 +02:00 · 2025-08-15 06:34:37 +00:00
1 parent 48bfc884ed
commit e70e860097
@@ -6,6 +6,7 @@ import { LogOut, Store, Menu } from "lucide-react";
 import { useAuthUnified } from "@/hooks/useAuthUnified";
 import { useIsMobile } from "@/hooks/use-mobile";
 import Sidebar from "./Sidebar";
+import WeatherWidget from "./WeatherWidget";
 import type { Group } from "@shared/schema";

 interface StoreContextType {
@@ -91,6 +92,8 @@ export default function Layout({ children }: LayoutProps) {
                </Button>
              )}

+              {/* Weather widget */}
+              <WeatherWidget />
            </div>

            {/* Store selector for admin - responsive */}
@@ -22,6 +22,7 @@ import Utilities from "@/pages/Utilities";
 import Tasks from "@/pages/Tasks";
 import TasksSimplified from "@/pages/TasksSimplified";
 import SavTickets from "@/pages/SavTickets";
+import WeatherSettings from "@/pages/WeatherSettings";
 import Layout from "@/components/Layout";

 function RouterProduction() {
@@ -101,6 +102,7 @@ function RouterProduction() {
        <Route path="/backup" component={Utilities} />
        <Route path="/nocodb-config" component={Utilities} />
        <Route path="/database-debug" component={Utilities} />
+        <Route path="/weather-settings" component={Utilities} />
        
        <Route path="/" component={Dashboard} />
        <Route component={NotFound} />
@@ -0,0 +1,110 @@
+import { useQuery } from "@tanstack/react-query";
+import { Cloud, CloudRain, Sun, CloudSnow, ThermometerSun } from "lucide-react";
+import { Card, CardContent } from "@/components/ui/card";
+
+interface WeatherData {
+  id: number;
+  date: string;
+  location: string;
+  maxTemperature: number;
+  minTemperature: number;
+  condition: string;
+  icon: string;
+  isCurrentYear: boolean;
+  createdAt: string;
+  updatedAt: string;
+}
+
+interface WeatherResponse {
+  currentYear: WeatherData | null;
+  previousYear: WeatherData | null;
+  location: string;
+}
+
+const WeatherIcon = ({ condition, size = 16 }: { condition: string; size?: number }) => {
+  const iconClass = `h-${Math.floor(size/4)} w-${Math.floor(size/4)}`;
+  
+  if (condition.includes('rain') || condition.includes('pluie')) {
+    return <CloudRain className={iconClass} />;
+  }
+  if (condition.includes('snow') || condition.includes('neige')) {
+    return <CloudSnow className={iconClass} />;
+  }
+  if (condition.includes('cloud') || condition.includes('nuage')) {
+    return <Cloud className={iconClass} />;
+  }
+  if (condition.includes('sun') || condition.includes('soleil') || condition.includes('clear')) {
+    return <Sun className={iconClass} />;
+  }
+  return <ThermometerSun className={iconClass} />;
+};
+
+export default function WeatherWidget() {
+  const { data: weather, isLoading, error } = useQuery<WeatherResponse>({
+    queryKey: ['/api/weather/current'],
+    refetchInterval: 30 * 60 * 1000, // Refetch every 30 minutes
+    retry: 1,
+  });
+
+  if (isLoading) {
+    return (
+      <Card className="bg-blue-50 dark:bg-blue-950 border-blue-200 dark:border-blue-800">
+        <CardContent className="p-3">
+          <div className="flex items-center gap-2 text-sm">
+            <div className="animate-pulse">
+              <Cloud className="h-4 w-4" />
+            </div>
+            <span className="text-blue-700 dark:text-blue-300">Chargement météo...</span>
+          </div>
+        </CardContent>
+      </Card>
+    );
+  }
+
+  if (error || !weather) {
+    return null; // Don't show widget if weather service is not configured
+  }
+
+  const currentTemp = weather.currentYear?.maxTemperature;
+  const previousTemp = weather.previousYear?.maxTemperature;
+  const location = weather.location || "Nancy";
+
+  return (
+    <Card className="bg-blue-50 dark:bg-blue-950 border-blue-200 dark:border-blue-800">
+      <CardContent className="p-3">
+        <div className="flex items-center gap-3 text-sm">
+          <div className="flex items-center gap-1">
+            <WeatherIcon condition={weather.currentYear?.condition || ''} />
+            <span className="text-blue-700 dark:text-blue-300 font-medium">
+              {location.split(',')[0]}
+            </span>
+          </div>
+          
+          <div className="flex items-center gap-2">
+            <div className="text-blue-800 dark:text-blue-200 font-semibold">
+              {currentTemp !== undefined ? `${Math.round(currentTemp)}°` : '--°'}
+            </div>
+            
+            {previousTemp !== undefined && (
+              <div className="text-blue-600 dark:text-blue-400 text-xs">
+                (l'an dernier: {Math.round(previousTemp)}°)
+              </div>
+            )}
+          </div>
+          
+          {currentTemp !== undefined && previousTemp !== undefined && (
+            <div className="text-xs">
+              {currentTemp > previousTemp ? (
+                <span className="text-red-600 dark:text-red-400">↑{Math.round(currentTemp - previousTemp)}°</span>
+              ) : currentTemp < previousTemp ? (
+                <span className="text-blue-600 dark:text-blue-400">↓{Math.round(previousTemp - currentTemp)}°</span>
+              ) : (
+                <span className="text-gray-600 dark:text-gray-400">=</span>
+              )}
+            </div>
+          )}
+        </div>
+      </CardContent>
+    </Card>
+  );
+}
@@ -5,7 +5,8 @@ import {
  Settings,
  Database,
  Server,
-  Bug
+  Bug,
+  Cloud
 } from "lucide-react";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
@@ -15,6 +16,7 @@ import { AlertTriangle } from "lucide-react";
 import BackupManager from "./BackupManager";
 import NocoDBConfig from "./NocoDBConfig";
 import DatabaseDebug from "./DatabaseDebug";
+import WeatherSettings from "./WeatherSettings";

 export default function Utilities() {
  const { user } = useAuthUnified();
@@ -24,6 +26,7 @@ export default function Utilities() {
    if (path === '/backup') return 'backups';
    if (path === '/nocodb-config') return 'nocodb';
    if (path === '/database-debug') return 'debug';
+    if (path === '/weather-settings') return 'weather';
    return 'backups';
  });

@@ -31,9 +34,10 @@ export default function Utilities() {
  const canManageBackups = hasPermission(user?.role || '', 'backups', 'manage');
  const canManageNocoDB = user?.role === 'admin';
  const canDebugDatabase = user?.role === 'admin';
+  const canManageWeather = user?.role === 'admin';

  // Si l'utilisateur n'a aucune permission, afficher le message d'accès refusé
-  if (!canManageBackups && !canManageNocoDB && !canDebugDatabase) {
+  if (!canManageBackups && !canManageNocoDB && !canDebugDatabase && !canManageWeather) {
    return (
      <div className="flex-1 flex items-center justify-center">
        <Card className="w-96">
@@ -69,7 +73,7 @@ export default function Utilities() {
      {/* Content avec onglets */}
      <div className="flex-1 p-6 overflow-hidden">
        <Tabs value={activeTab} onValueChange={setActiveTab} className="h-full flex flex-col">
-          <TabsList className="grid w-full grid-cols-3 mb-6">
+          <TabsList className="grid w-full grid-cols-4 mb-6">
            {canManageBackups && (
              <TabsTrigger value="backups" className="flex items-center gap-2">
                <Database className="w-4 h-4" />
@@ -88,6 +92,12 @@ export default function Utilities() {
                Debug Base de Données
              </TabsTrigger>
            )}
+            {canManageWeather && (
+              <TabsTrigger value="weather" className="flex items-center gap-2">
+                <Cloud className="w-4 h-4" />
+                Météo
+              </TabsTrigger>
+            )}
          </TabsList>

          {/* Contenu des onglets */}
@@ -114,6 +124,14 @@ export default function Utilities() {
              </div>
            </TabsContent>
          )}
+
+          {canManageWeather && (
+            <TabsContent value="weather" className="flex-1 overflow-hidden">
+              <div className="h-full bg-gray-50 -m-6 p-6">
+                <WeatherSettings />
+              </div>
+            </TabsContent>
+          )}
        </Tabs>
      </div>
    </div>
@@ -0,0 +1,265 @@
+import { useState } from "react";
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Switch } from "@/components/ui/switch";
+import { AlertCircle, CheckCircle, Cloud, Settings } from "lucide-react";
+import { Alert, AlertDescription } from "@/components/ui/alert";
+import { useToast } from "@/hooks/use-toast";
+import { apiRequest } from "@/lib/queryClient";
+
+interface WeatherSettings {
+  id: number;
+  apiKey: string;
+  location: string;
+  isActive: boolean;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export default function WeatherSettings() {
+  const { toast } = useToast();
+  const queryClient = useQueryClient();
+  const [testResult, setTestResult] = useState<{ success: boolean; message: string } | null>(null);
+  const [isTesting, setIsTesting] = useState(false);
+
+  // Fetch weather settings
+  const { data: settings, isLoading } = useQuery<WeatherSettings>({
+    queryKey: ['/api/weather/settings'],
+  });
+
+  // Update settings mutation
+  const updateSettingsMutation = useMutation({
+    mutationFn: async (data: Partial<WeatherSettings>) => {
+      const url = settings?.id ? `/api/weather/settings/${settings.id}` : '/api/weather/settings';
+      const method = settings?.id ? 'PUT' : 'POST';
+      
+      const response = await fetch(url, {
+        method,
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(data),
+      });
+      
+      if (!response.ok) {
+        throw new Error('Failed to save settings');
+      }
+      
+      return response.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['/api/weather/settings'] });
+      toast({
+        title: "Configuration sauvegardée",
+        description: "Les paramètres météo ont été mis à jour avec succès.",
+      });
+    },
+    onError: (error: any) => {
+      toast({
+        title: "Erreur",
+        description: error.message || "Impossible de sauvegarder les paramètres.",
+        variant: "destructive",
+      });
+    },
+  });
+
+  // Test API connection
+  const testConnection = async (apiKey: string, location: string) => {
+    setIsTesting(true);
+    setTestResult(null);
+    
+    try {
+      const response = await fetch('/api/weather/test-connection', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ apiKey, location }),
+      });
+      
+      if (!response.ok) {
+        throw new Error('Test connection failed');
+      }
+      
+      const result = await response.json();
+      setTestResult(result);
+    } catch (error: any) {
+      setTestResult({ 
+        success: false, 
+        message: error.message || "Erreur lors du test de connexion" 
+      });
+    } finally {
+      setIsTesting(false);
+    }
+  };
+
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    const formData = new FormData(e.currentTarget);
+    
+    const data = {
+      apiKey: formData.get('apiKey') as string,
+      location: formData.get('location') as string,
+      isActive: formData.get('isActive') === 'on',
+    };
+
+    updateSettingsMutation.mutate(data);
+  };
+
+  if (isLoading) {
+    return (
+      <div className="container mx-auto p-6">
+        <div className="flex items-center gap-2 mb-6">
+          <Cloud className="h-6 w-6" />
+          <h1 className="text-2xl font-bold">Configuration Météo</h1>
+        </div>
+        <Card>
+          <CardContent className="p-6">
+            <div className="animate-pulse space-y-4">
+              <div className="h-4 bg-gray-200 rounded w-1/4"></div>
+              <div className="h-10 bg-gray-200 rounded"></div>
+              <div className="h-4 bg-gray-200 rounded w-1/4"></div>
+              <div className="h-10 bg-gray-200 rounded"></div>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+    );
+  }
+
+  return (
+    <div className="container mx-auto p-6 max-w-2xl">
+      <div className="flex items-center gap-2 mb-6">
+        <Cloud className="h-6 w-6" />
+        <h1 className="text-2xl font-bold">Configuration Météo</h1>
+      </div>
+
+      <Card>
+        <CardHeader>
+          <CardTitle className="flex items-center gap-2">
+            <Settings className="h-5 w-5" />
+            Paramètres API Visual Crossing
+          </CardTitle>
+          <CardDescription>
+            Configurez l'API Visual Crossing pour afficher la météo du jour actuel et de l'année précédente.
+          </CardDescription>
+        </CardHeader>
+        <CardContent>
+          <form onSubmit={handleSubmit} className="space-y-6">
+            <div className="space-y-2">
+              <Label htmlFor="apiKey">Clé API Visual Crossing</Label>
+              <Input
+                id="apiKey"
+                name="apiKey"
+                type="password"
+                placeholder="Votre clé API Visual Crossing"
+                defaultValue={settings?.apiKey || ""}
+                required
+              />
+              <p className="text-sm text-muted-foreground">
+                Obtenez votre clé API gratuite sur{" "}
+                <a
+                  href="https://www.visualcrossing.com/"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-blue-600 hover:underline"
+                >
+                  visualcrossing.com
+                </a>
+              </p>
+            </div>
+
+            <div className="space-y-2">
+              <Label htmlFor="location">Localisation</Label>
+              <Input
+                id="location"
+                name="location"
+                placeholder="Nancy, France"
+                defaultValue={settings?.location || "Nancy, France"}
+                required
+              />
+              <p className="text-sm text-muted-foreground">
+                Ville ou région pour laquelle afficher la météo
+              </p>
+            </div>
+
+            <div className="flex items-center space-x-2">
+              <Switch
+                id="isActive"
+                name="isActive"
+                defaultChecked={settings?.isActive ?? true}
+              />
+              <Label htmlFor="isActive">Activer l'affichage météo</Label>
+            </div>
+
+            {testResult && (
+              <Alert variant={testResult.success ? "default" : "destructive"}>
+                {testResult.success ? (
+                  <CheckCircle className="h-4 w-4" />
+                ) : (
+                  <AlertCircle className="h-4 w-4" />
+                )}
+                <AlertDescription>{testResult.message}</AlertDescription>
+              </Alert>
+            )}
+
+            <div className="flex gap-3">
+              <Button
+                type="button"
+                variant="outline"
+                onClick={() => {
+                  const formData = new FormData(document.querySelector('form') as HTMLFormElement);
+                  const apiKey = formData.get('apiKey') as string;
+                  const location = formData.get('location') as string;
+                  
+                  if (apiKey && location) {
+                    testConnection(apiKey, location);
+                  } else {
+                    toast({
+                      title: "Erreur",
+                      description: "Veuillez remplir la clé API et la localisation avant de tester.",
+                      variant: "destructive",
+                    });
+                  }
+                }}
+                disabled={isTesting}
+              >
+                {isTesting ? "Test en cours..." : "Tester la connexion"}
+              </Button>
+              
+              <Button 
+                type="submit" 
+                disabled={updateSettingsMutation.isPending}
+              >
+                {updateSettingsMutation.isPending ? "Sauvegarde..." : "Sauvegarder"}
+              </Button>
+            </div>
+          </form>
+        </CardContent>
+      </Card>
+
+      <Card className="mt-6">
+        <CardHeader>
+          <CardTitle>À propos</CardTitle>
+        </CardHeader>
+        <CardContent className="text-sm text-muted-foreground space-y-2">
+          <p>
+            Le widget météo affiche la température maximale du jour actuel ainsi que 
+            celle du même jour l'année précédente, permettant une comparaison rapide.
+          </p>
+          <p>
+            Les données sont mises en cache pour éviter les appels API répétés et 
+            optimiser les performances.
+          </p>
+          <p>
+            L'affichage météo apparaît en haut à gauche de l'interface, 
+            à côté du sélecteur de magasin.
+          </p>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
@@ -36,12 +36,15 @@ import {
  insertTaskSchema,
  insertNocodbConfigSchema,
  insertSavTicketSchema,
-  insertSavTicketHistorySchema
+  insertSavTicketHistorySchema,
+  insertWeatherDataSchema,
+  insertWeatherSettingsSchema
 } from "@shared/schema";
 import { hasPermission } from "@shared/permissions";
 import { z } from "zod";
 import { invoiceVerificationService } from "./invoiceVerification";
 import { backupService } from "./backupService";
+import { weatherService } from "./weatherService.js";

 export async function registerRoutes(app: Express): Promise<Server> {
  // Health check endpoint for Docker
@@ -2753,6 +2756,118 @@ RÉSUMÉ DU SCAN
    }
  });

+  // Weather routes
+  app.get('/api/weather/settings', isAuthenticated, requireAdmin, async (req: any, res) => {
+    try {
+      const settings = await storage.getWeatherSettings();
+      res.json(settings);
+    } catch (error) {
+      console.error("Error fetching weather settings:", error);
+      res.status(500).json({ message: "Failed to fetch weather settings" });
+    }
+  });
+
+  app.post('/api/weather/settings', isAuthenticated, requireAdmin, async (req: any, res) => {
+    try {
+      const data = insertWeatherSettingsSchema.parse(req.body);
+      const settings = await storage.createWeatherSettings(data);
+      res.json(settings);
+    } catch (error) {
+      console.error("Error creating weather settings:", error);
+      if (error instanceof z.ZodError) {
+        return res.status(400).json({ message: "Validation error", errors: error.errors });
+      }
+      res.status(500).json({ message: "Failed to create weather settings" });
+    }
+  });
+
+  app.put('/api/weather/settings/:id', isAuthenticated, requireAdmin, async (req: any, res) => {
+    try {
+      const id = parseInt(req.params.id);
+      const data = insertWeatherSettingsSchema.partial().parse(req.body);
+      const settings = await storage.updateWeatherSettings(id, data);
+      res.json(settings);
+    } catch (error) {
+      console.error("Error updating weather settings:", error);
+      if (error instanceof z.ZodError) {
+        return res.status(400).json({ message: "Validation error", errors: error.errors });
+      }
+      res.status(500).json({ message: "Failed to update weather settings" });
+    }
+  });
+
+  app.post('/api/weather/test-connection', isAuthenticated, requireAdmin, async (req: any, res) => {
+    try {
+      const { apiKey, location } = req.body;
+      
+      if (!apiKey || !location) {
+        return res.status(400).json({ message: "API key and location are required" });
+      }
+
+      const result = await weatherService.testApiConnection(apiKey, location);
+      res.json(result);
+    } catch (error) {
+      console.error("Error testing weather API connection:", error);
+      res.status(500).json({ message: "Failed to test API connection" });
+    }
+  });
+
+  app.get('/api/weather/current', isAuthenticated, async (req: any, res) => {
+    try {
+      const settings = await storage.getWeatherSettings();
+      
+      if (!settings || !settings.isActive) {
+        return res.status(404).json({ message: "Weather service not configured or disabled" });
+      }
+
+      const today = new Date().toISOString().split('T')[0];
+      const previousYearDate = weatherService.getPreviousYearDate();
+      
+      // Check if we already have today's data
+      let currentYearData = await storage.getWeatherData(today, true);
+      let previousYearData = await storage.getWeatherData(previousYearDate, false);
+
+      // Fetch current year data if not in cache
+      if (!currentYearData) {
+        console.log("🌤️ Fetching current weather data from API");
+        const apiData = await weatherService.fetchCurrentWeather(settings);
+        if (apiData) {
+          const weatherData = weatherService.convertApiDataToWeatherData(apiData, settings.location, true);
+          if (weatherData) {
+            currentYearData = await storage.createWeatherData(weatherData);
+          }
+        }
+      }
+
+      // Fetch previous year data if not in cache
+      if (!previousYearData) {
+        console.log("🌤️ Fetching previous year weather data from API");
+        const apiData = await weatherService.fetchPreviousYearWeather(settings, previousYearDate);
+        if (apiData) {
+          const weatherData = weatherService.convertApiDataToWeatherData(apiData, settings.location, false);
+          if (weatherData) {
+            previousYearData = await storage.createWeatherData(weatherData);
+          }
+        }
+      }
+
+      res.json({
+        currentYear: currentYearData ? {
+          ...currentYearData,
+          icon: weatherService.getWeatherIcon(currentYearData.icon)
+        } : null,
+        previousYear: previousYearData ? {
+          ...previousYearData,
+          icon: weatherService.getWeatherIcon(previousYearData.icon)
+        } : null,
+        location: settings.location
+      });
+    } catch (error) {
+      console.error("Error fetching weather data:", error);
+      res.status(500).json({ message: "Failed to fetch weather data" });
+    }
+  });
+
  // Create server instance
  const httpServer = createServer(app);

@@ -14,6 +14,8 @@ import {
  invoiceVerificationCache,
  savTickets,
  savTicketHistory,
+  weatherData,
+  weatherSettings,
  type User,
  type UpsertUser,
  type Group,
@@ -55,6 +57,10 @@ import {
  type InsertSavTicketHistory,
  type SavTicketWithRelations,
  type SavTicketHistoryWithCreator,
+  type WeatherData,
+  type InsertWeatherData,
+  type WeatherSettings,
+  type InsertWeatherSettings,
 } from "@shared/schema";
 import { db } from "./db";
 import { eq, and, inArray, desc, sql, gte, lte, lt, or, isNull, isNotNull, asc } from "drizzle-orm";
@@ -187,6 +193,15 @@ export interface IStorage {
    resolvedTickets: number;
    criticalTickets: number;
  }>;
+
+  // Weather operations
+  getWeatherSettings(): Promise<WeatherSettings | undefined>;
+  createWeatherSettings(settings: InsertWeatherSettings): Promise<WeatherSettings>;
+  updateWeatherSettings(id: number, settings: Partial<InsertWeatherSettings>): Promise<WeatherSettings>;
+  getWeatherData(date: string, isCurrentYear: boolean): Promise<WeatherData | undefined>;
+  createWeatherData(data: InsertWeatherData): Promise<WeatherData>;
+  updateWeatherData(id: number, data: Partial<InsertWeatherData>): Promise<WeatherData>;
+  deleteOldWeatherData(daysToKeep: number): Promise<void>;
 }

 export class DatabaseStorage implements IStorage {
@@ -1748,6 +1763,63 @@ export class DatabaseStorage implements IStorage {

    return stats;
  }
+
+  // Weather operations
+  async getWeatherSettings(): Promise<WeatherSettings | undefined> {
+    const [settings] = await db.select().from(weatherSettings).limit(1);
+    return settings;
+  }
+
+  async createWeatherSettings(settingsData: InsertWeatherSettings): Promise<WeatherSettings> {
+    const [settings] = await db.insert(weatherSettings).values(settingsData).returning();
+    return settings;
+  }
+
+  async updateWeatherSettings(id: number, settingsData: Partial<InsertWeatherSettings>): Promise<WeatherSettings> {
+    const [settings] = await db
+      .update(weatherSettings)
+      .set({ ...settingsData, updatedAt: new Date() })
+      .where(eq(weatherSettings.id, id))
+      .returning();
+    return settings;
+  }
+
+  async getWeatherData(date: string, isCurrentYear: boolean): Promise<WeatherData | undefined> {
+    const [data] = await db
+      .select()
+      .from(weatherData)
+      .where(and(
+        eq(weatherData.date, date),
+        eq(weatherData.isCurrentYear, isCurrentYear)
+      ))
+      .limit(1);
+    return data;
+  }
+
+  async createWeatherData(data: InsertWeatherData): Promise<WeatherData> {
+    const [weatherInfo] = await db.insert(weatherData).values(data).returning();
+    return weatherInfo;
+  }
+
+  async updateWeatherData(id: number, data: Partial<InsertWeatherData>): Promise<WeatherData> {
+    const [weatherInfo] = await db
+      .update(weatherData)
+      .set({ ...data, updatedAt: new Date() })
+      .where(eq(weatherData.id, id))
+      .returning();
+    return weatherInfo;
+  }
+
+  async deleteOldWeatherData(daysToKeep: number): Promise<void> {
+    const cutoffDate = new Date();
+    cutoffDate.setDate(cutoffDate.getDate() - daysToKeep);
+    
+    await db
+      .delete(weatherData)
+      .where(lt(weatherData.createdAt, cutoffDate));
+    
+    console.log(`🧹 Deleted weather data older than ${daysToKeep} days`);
+  }
 }

 // MemStorage class for development
@@ -3109,6 +3181,66 @@ export class MemStorage implements IStorage {
    this.idCounters.savTicket = 6;
    console.log('✅ SAV test data initialized with 5 tickets and comprehensive history');
  }
+
+  // Weather operations
+  async getWeatherSettings(): Promise<WeatherSettings | undefined> {
+    // In memory storage, return a default setting for development
+    return {
+      id: 1,
+      apiKey: "6PSHYLBJB9EEYNZ7NDQ5BPGBZ", // Token fourni par l'utilisateur
+      location: "Nancy, France",
+      isActive: true,
+      createdAt: new Date(),
+      updatedAt: new Date()
+    };
+  }
+
+  async createWeatherSettings(settings: InsertWeatherSettings): Promise<WeatherSettings> {
+    // For development, we'll just return the created settings with an ID
+    return {
+      id: 1,
+      ...settings,
+      createdAt: new Date(),
+      updatedAt: new Date()
+    };
+  }
+
+  async updateWeatherSettings(id: number, settings: Partial<InsertWeatherSettings>): Promise<WeatherSettings> {
+    const existing = await this.getWeatherSettings();
+    return {
+      ...existing!,
+      ...settings,
+      updatedAt: new Date()
+    };
+  }
+
+  async getWeatherData(date: string, isCurrentYear: boolean): Promise<WeatherData | undefined> {
+    // In development, return some mock data for testing
+    return undefined; // Will trigger API calls
+  }
+
+  async createWeatherData(data: InsertWeatherData): Promise<WeatherData> {
+    return {
+      id: 1,
+      ...data,
+      createdAt: new Date(),
+      updatedAt: new Date()
+    };
+  }
+
+  async updateWeatherData(id: number, data: Partial<InsertWeatherData>): Promise<WeatherData> {
+    const existing = await this.getWeatherData(data.date || "", data.isCurrentYear || true);
+    return {
+      ...existing!,
+      ...data,
+      updatedAt: new Date()
+    };
+  }
+
+  async deleteOldWeatherData(daysToKeep: number): Promise<void> {
+    // In development, this is a no-op
+    console.log(`🧹 DEV: Would delete weather data older than ${daysToKeep} days`);
+  }
 }

 // Use MemStorage in development, DatabaseStorage in production
@@ -0,0 +1,172 @@
+import { WeatherData, WeatherSettings } from "../shared/schema.js";
+
+export interface WeatherApiResponse {
+  days: Array<{
+    datetime: string;
+    tempmax: number;
+    tempmin: number;
+    icon: string;
+    conditions: string;
+  }>;
+}
+
+export interface WeatherDisplayData {
+  currentYear: WeatherData | null;
+  previousYear: WeatherData | null;
+}
+
+export class WeatherService {
+  private baseUrl = "https://weather.visualcrossing.com/VisualCrossingWebServices/rest/services/timeline";
+
+  /**
+   * Récupère les données météo actuelles depuis l'API Visual Crossing
+   */
+  async fetchCurrentWeather(settings: WeatherSettings): Promise<WeatherApiResponse | null> {
+    try {
+      const url = `${this.baseUrl}/${encodeURIComponent(settings.location)}?unitGroup=metric&include=days&key=${settings.apiKey}&contentType=json`;
+      
+      const response = await fetch(url);
+      if (!response.ok) {
+        console.error(`Weather API error: ${response.status} ${response.statusText}`);
+        return null;
+      }
+
+      const data = await response.json();
+      return data;
+    } catch (error) {
+      console.error("Erreur lors de la récupération de la météo actuelle:", error);
+      return null;
+    }
+  }
+
+  /**
+   * Récupère les données météo de l'année précédente pour la même date
+   */
+  async fetchPreviousYearWeather(settings: WeatherSettings, targetDate: string): Promise<WeatherApiResponse | null> {
+    try {
+      const url = `${this.baseUrl}/${encodeURIComponent(settings.location)}?unitGroup=metric&include=days&key=${settings.apiKey}&contentType=json&forecastBasisDate=${targetDate}`;
+      
+      const response = await fetch(url);
+      if (!response.ok) {
+        console.error(`Weather API error for previous year: ${response.status} ${response.statusText}`);
+        return null;
+      }
+
+      const data = await response.json();
+      return data;
+    } catch (error) {
+      console.error("Erreur lors de la récupération de la météo de l'année précédente:", error);
+      return null;
+    }
+  }
+
+  /**
+   * Convertit les données de l'API en format WeatherData
+   */
+  convertApiDataToWeatherData(apiData: WeatherApiResponse, location: string, isCurrentYear: boolean): WeatherData | null {
+    if (!apiData.days || apiData.days.length === 0) {
+      return null;
+    }
+
+    const todayData = apiData.days[0];
+    
+    return {
+      id: 0, // Sera généré par la base de données
+      date: todayData.datetime,
+      location,
+      tempMax: todayData.tempmax.toString(),
+      tempMin: todayData.tempmin.toString(),
+      icon: todayData.icon,
+      conditions: todayData.conditions,
+      isCurrentYear,
+      createdAt: new Date(),
+      updatedAt: new Date()
+    };
+  }
+
+  /**
+   * Calcule la date de l'année précédente pour la même date
+   */
+  getPreviousYearDate(date: Date = new Date()): string {
+    const previousYear = new Date(date);
+    previousYear.setFullYear(date.getFullYear() - 1);
+    return previousYear.toISOString().split('T')[0]; // Format YYYY-MM-DD
+  }
+
+  /**
+   * Convertit l'icône météo en format d'affichage
+   */
+  getWeatherIcon(iconCode: string): string {
+    const iconMap: { [key: string]: string } = {
+      'clear-day': '☀️',
+      'clear-night': '🌙',
+      'partly-cloudy-day': '⛅',
+      'partly-cloudy-night': '☁️',
+      'cloudy': '☁️',
+      'rain': '🌧️',
+      'snow': '❄️',
+      'wind': '💨',
+      'fog': '🌫️',
+      'thunder': '⛈️',
+      'hail': '🌨️'
+    };
+
+    return iconMap[iconCode] || '🌤️';
+  }
+
+  /**
+   * Valide les paramètres de configuration météo
+   */
+  validateWeatherSettings(settings: Partial<WeatherSettings>): { isValid: boolean; errors: string[] } {
+    const errors: string[] = [];
+
+    if (!settings.apiKey || settings.apiKey.trim().length === 0) {
+      errors.push("La clé API Visual Crossing est requise");
+    }
+
+    if (!settings.location || settings.location.trim().length === 0) {
+      errors.push("La localisation est requise");
+    }
+
+    // Vérification basique du format de la clé API Visual Crossing
+    if (settings.apiKey && settings.apiKey.length < 10) {
+      errors.push("La clé API semble invalide (trop courte)");
+    }
+
+    return {
+      isValid: errors.length === 0,
+      errors
+    };
+  }
+
+  /**
+   * Test de connexion à l'API météo
+   */
+  async testApiConnection(apiKey: string, location: string): Promise<{ success: boolean; message: string }> {
+    try {
+      const testUrl = `${this.baseUrl}/${encodeURIComponent(location)}?unitGroup=metric&include=days&key=${apiKey}&contentType=json`;
+      
+      const response = await fetch(testUrl);
+      
+      if (response.ok) {
+        const data = await response.json();
+        if (data.days && data.days.length > 0) {
+          return { success: true, message: "Connexion réussie à l'API météo" };
+        } else {
+          return { success: false, message: "Aucune donnée météo trouvée pour cette localisation" };
+        }
+      } else if (response.status === 401) {
+        return { success: false, message: "Clé API invalide" };
+      } else if (response.status === 404) {
+        return { success: false, message: "Localisation introuvable" };
+      } else {
+        return { success: false, message: `Erreur API: ${response.status} ${response.statusText}` };
+      }
+    } catch (error) {
+      console.error("Erreur test API météo:", error);
+      return { success: false, message: "Erreur de connexion à l'API météo" };
+    }
+  }
+}
+
+export const weatherService = new WeatherService();
@@ -700,3 +700,45 @@ export type SavTicketWithRelations = SavTicket & {
 export type SavTicketHistoryWithCreator = SavTicketHistory & {
  creator: User;
 };
+
+// Weather Tables
+export const weatherData = pgTable("weather_data", {
+  id: serial("id").primaryKey(),
+  date: date("date").notNull(),
+  location: text("location").notNull(),
+  tempMax: text("temp_max").notNull(),
+  tempMin: text("temp_min").notNull(),
+  icon: text("icon").notNull(),
+  conditions: text("conditions").notNull(),
+  isCurrentYear: boolean("is_current_year").notNull().default(true),
+  createdAt: timestamp("created_at").defaultNow(),
+  updatedAt: timestamp("updated_at").defaultNow(),
+});
+
+export const weatherSettings = pgTable("weather_settings", {
+  id: serial("id").primaryKey(),
+  apiKey: text("api_key").notNull(),
+  location: text("location").notNull().default("Paris, France"),
+  isActive: boolean("is_active").notNull().default(true),
+  createdAt: timestamp("created_at").defaultNow(),
+  updatedAt: timestamp("updated_at").defaultNow(),
+});
+
+// Weather Schemas
+export const insertWeatherDataSchema = createInsertSchema(weatherData).omit({
+  id: true,
+  createdAt: true,
+  updatedAt: true,
+});
+
+export const insertWeatherSettingsSchema = createInsertSchema(weatherSettings).omit({
+  id: true,
+  createdAt: true,
+  updatedAt: true,
+});
+
+// Weather Types
+export type WeatherData = typeof weatherData.$inferSelect;
+export type InsertWeatherData = z.infer<typeof insertWeatherDataSchema>;
+export type WeatherSettings = typeof weatherSettings.$inferSelect;
+export type InsertWeatherSettings = z.infer<typeof insertWeatherSettingsSchema>;