feat: Gestion des secteurs et migration v3.0.4+304

- Ajout système complet de gestion des secteurs avec contours géographiques
- Import des contours départementaux depuis GeoJSON
- API REST pour la gestion des secteurs (/api/sectors)
- Service de géolocalisation pour déterminer les secteurs
- Migration base de données avec tables x_departements_contours et sectors_adresses
- Interface Flutter pour visualisation et gestion des secteurs
- Ajout thème sombre dans l'application
- Corrections diverses et optimisations

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

web/.env-deploy-geosector-dev

@@ -2,7 +2,7 @@
 HOST_SSH_HOST=195.154.80.116                  # Adresse IP du serveur hôte
 HOST_SSH_USER=pierre                          # Utilisateur SSH sur le serveur hôte
 HOST_SSH_PORT=22                              # Port SSH du serveur hôte
-HOST_SSH_KEY=/Users/pierre/.ssh/id_rsa_mbpi   # Clé SSH privée pour accéder au serveur hôte
+HOST_SSH_KEY=/home/pierre/.ssh/id_rsa_mbpi   # Clé SSH privée pour accéder au serveur hôte
 
 # Configuration du conteneur Incus hébergeant cette application
 CT_PROJECT_NAME=default                       # Nom du projet Incus où se trouve le conteneur

web/CLAUDE.md

@@ -0,0 +1,34 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Build Commands
+- Development: `npm run dev` - Start Vite development server with hot-reload
+- Build: `npm run build` - Build production-ready static files to `dist/` directory
+- Preview: `npm run preview` - Preview production build locally
+
+## Project Structure
+This is a Svelte + Vite + TailwindCSS project without SvelteKit. Key characteristics:
+- Pure Svelte application with custom client-side routing
+- TailwindCSS for styling with custom Figtree font family
+- No server-side rendering or API routes
+- Static site deployment via `deploy-web.sh`
+
+## Architecture Overview
+- **Routing**: Custom client-side routing implemented in `App.svelte` using browser history API
+- **Pages**: Located in `src/pages/` - each page is a Svelte component
+- **Components**: Reusable components in `src/components/`
+- **Services**: Business logic in `src/lib/` (analytics, cookies)
+- **Styling**: TailwindCSS with configuration in `tailwind.config.js`
+- **Assets**: Static assets in `public/` (fonts, images, icons)
+
+## Development Workflow
+- Pages are added to `src/pages/` and imported in `App.svelte`
+- Route handling is done through the `activePage` state variable
+- Cookie consent and analytics tracking are integrated throughout
+- Static deployment copies `dist/` contents to production server
+
+## Deployment
+- Production deployment script: `deploy-web.sh`
+- Builds and packages the application for deployment to Incus container
+- Environment variables loaded from `.env-deploy-geosector-dev`

web/deploy-web.sh

@@ -2,7 +2,7 @@
 
 # Script de déploiement de Geosector Web
 
-cd /Users/pierre/dev/geosector/web
+cd /home/pierre/dev/geosector/web
 
 # Vérifier si .env.deploy existe
 ENV_FILE=".env-deploy-geosector-dev"
@@ -52,6 +52,12 @@ SERVER_DIR="server"
 LOCAL_DEPLOY_DIR="deploy"
 DEPLOY_PACKAGE="$APP_NAME-deploy.tar.gz"
 
+# 0. Nettoyer et réinstaller les dépendances si nécessaire
+if [ ! -d "node_modules" ] || [ ! -f "package-lock.json" ]; then
+  echo "=== Installation des dépendances ==="
+  npm install
+fi
+
 # 1. Build du frontend principal
 echo "=== Construction du frontend principal ==="
 npm run build

web/deploy/index.html

@@ -11,8 +11,8 @@
     <meta name="keywords" content="geosector, distribution, logistique, optimisation, tournées, livraison" />
     <link rel="preload" href="/fonts/Figtree-VariableFont_wght.ttf" as="font" type="font/ttf" crossorigin />
     <title>Geosector - Gestion efficace de vos distributions</title>
-    <script type="module" crossorigin src="/assets/index-DOjj7eym.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-C15RTrFl.css">
+    <script type="module" crossorigin src="/assets/index-CMFopX_9.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-WF7yUNnB.css">
   </head>
   <body>
     <div id="app"></div>

web/dist/index.html

@@ -11,8 +11,8 @@
     <meta name="keywords" content="geosector, distribution, logistique, optimisation, tournées, livraison" />
     <link rel="preload" href="/fonts/Figtree-VariableFont_wght.ttf" as="font" type="font/ttf" crossorigin />
     <title>Geosector - Gestion efficace de vos distributions</title>
-    <script type="module" crossorigin src="/assets/index-DOjj7eym.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-C15RTrFl.css">
+    <script type="module" crossorigin src="/assets/index-CMFopX_9.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-WF7yUNnB.css">
   </head>
   <body>
     <div id="app"></div>

web/livre-web.sh

@@ -9,7 +9,7 @@ fi
 
 HOST_IP="195.154.80.116"
 HOST_USER=root
-HOST_KEY=/Users/pierre/.ssh/id_rsa_mbpi
+HOST_KEY=/home/pierre/.ssh/id_rsa_mbpi
 HOST_PORT=22
 
 SOURCE_CONTAINER=$1

web/src/components/Header.svelte

@@ -36,11 +36,14 @@
   function changePage(page) {
     activePage = page;
     window.history.pushState({}, '', `/${page}`);
+    // Déclencher un événement popstate pour que App.svelte mette à jour la page
+    window.dispatchEvent(new PopStateEvent('popstate'));
     closeMobileMenu();
   }
 
   // Fonctions pour le menu mobile
-  function toggleMobileMenu() {
+  function toggleMobileMenu(event) {
+    event.stopPropagation();
     mobileMenuOpen = !mobileMenuOpen;
   }
 
@@ -69,7 +72,10 @@
       }
     };
 
-    document.addEventListener('click', handleClickOutside);
+    // Ajouter un petit délai pour éviter les conflits avec le clic du bouton
+    setTimeout(() => {
+      document.addEventListener('click', handleClickOutside);
+    }, 100);
 
     return () => {
       document.removeEventListener('click', handleClickOutside);
@@ -89,7 +95,7 @@
       </div>
 
       <!-- Burger menu pour mobile -->
-      <button id="burger-button" class="xl:hidden z-50" on:click={toggleMobileMenu}>
+      <button id="burger-button" class="xl:hidden z-50" on:click|stopPropagation={toggleMobileMenu}>
         <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-[#002C66]" fill="none" viewBox="0 0 24 24" stroke="currentColor">
           {#if mobileMenuOpen}
             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
@@ -117,7 +123,7 @@
 
         <div class="flex gap-3 items-center">
           <a
-            href="{baseAppUrl}/login/user"
+            href="{baseAppUrl}/?action=login&type=user"
             class="border-2 border-[#4CAF50] text-[#4CAF50] hover:bg-[#4CAF50] hover:text-white font-medium py-1.5 px-3 rounded-full transition-colors"
             on:click={() => {
               sessionStorage.setItem('loginType', 'user');
@@ -126,7 +132,7 @@
             Connexion Utilisateur
           </a>
           <a
-            href="{baseAppUrl}/login/admin"
+            href="{baseAppUrl}/?action=login&type=admin"
             class="border-2 border-red-600 text-red-600 hover:bg-red-600 hover:text-white font-medium py-1.5 px-3 rounded-full transition-colors"
             on:click={() => {
               sessionStorage.setItem('loginType', 'admin');
@@ -134,23 +140,15 @@
           >
             Connexion Administrateur
           </a>
-          <a href="{baseAppUrl}/register" class="bg-[#E3170A] hover:bg-red-700 text-white font-medium py-2 px-4 rounded-full transition-colors"> S'inscrire </a>
+          <a href="{baseAppUrl}/?action=register" class="bg-[#E3170A] hover:bg-red-700 text-white font-medium py-2 px-4 rounded-full transition-colors"> S'inscrire </a>
         </div>
       </div>
     </div>
   </div>
 
   <!-- Menu mobile -->
-  <div id="mobile-menu" class={`fixed top-0 right-0 h-screen w-4/5 max-w-xs bg-white shadow-lg transform transition-transform duration-300 ease-in-out z-40 ${mobileMenuOpen ? 'translate-x-0' : 'translate-x-full'}`}>
-    <div class="p-6">
-      <div class="flex justify-end mb-8">
-        <button on:click={closeMobileMenu} class="text-gray-600" aria-label="Fermer le menu">
-          <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
-          </svg>
-        </button>
-      </div>
-
+  <div id="mobile-menu" class={`xl:hidden fixed top-0 right-0 h-screen w-4/5 max-w-xs bg-white shadow-lg transform transition-transform duration-300 ease-in-out z-40 ${mobileMenuOpen ? 'translate-x-0' : 'translate-x-full'}`}>
+    <div class="p-6 pt-20">
       <nav class="mb-8">
         <ul class="space-y-4">
           <li>
@@ -167,7 +165,7 @@
 
       <div class="space-y-4">
         <a
-          href="{baseAppUrl}/login/user"
+          href="{baseAppUrl}/?action=login&type=user"
           class="block w-full border-2 border-[#4CAF50] text-[#4CAF50] hover:bg-[#4CAF50] hover:text-white font-medium py-2 px-4 rounded-full transition-colors text-center mb-3"
           on:click={() => {
             sessionStorage.setItem('loginType', 'user');
@@ -176,7 +174,7 @@
           Connexion Utilisateur
         </a>
         <a
-          href="{baseAppUrl}/login/admin"
+          href="{baseAppUrl}/?action=login&type=admin"
           class="block w-full border-2 border-red-600 text-red-600 hover:bg-red-600 hover:text-white font-medium py-2 px-4 rounded-full transition-colors text-center mb-3"
           on:click={() => {
             sessionStorage.setItem('loginType', 'admin');
@@ -184,7 +182,7 @@
         >
           Connexion Administrateur
         </a>
-        <a href="{baseAppUrl}/register" class="block w-full bg-[#E3170A] hover:bg-red-700 text-white font-medium py-2 px-4 rounded-full transition-colors text-center"> S'inscrire </a>
+        <a href="{baseAppUrl}/?action=register" class="block w-full bg-[#E3170A] hover:bg-red-700 text-white font-medium py-2 px-4 rounded-full transition-colors text-center"> S'inscrire </a>
       </div>
     </div>
   </div>