Implementato controllo conessione dispositivo e servizi. Completata pagination commesse e attività per cliente

salesbook.Shared/wwwroot/css/app.css

@@ -22,6 +22,42 @@ a, .btn-link {
     color: inherit;
 }
 
+/*ServicesIsDown" : "SystemOk" : "NetworkKo*/
+
+.Connection {
+    padding: 0 .75rem;
+    font-weight: 700;
+    display: flex;
+    flex-direction: row;
+    gap: 1rem;
+    font-size: larger;
+    transition: all 0.5s ease;
+    opacity: 0;
+    transform: translateY(-35px);
+    min-height: 35px;
+    align-items: center;
+}
+
+.Connection.ServicesIsDown, .Connection.NetworkKo {
+    background-color: var(--mud-palette-error);
+    color: white;
+}
+
+.Connection.SystemOk {
+    background-color: var(--mud-palette-success);
+    color: white;
+}
+
+.Connection.Show {
+    opacity: 1;
+    transform: translateY(0);
+}
+
+.page > .Connection.Hide ~ main {
+    transition: all 0.5s ease;
+    transform: translateY(-35px);
+}
+
 .btn-primary {
     color: #fff;
     background-color: var(--primary-color);

salesbook.Shared/wwwroot/js/main.js

@@ -38,16 +38,41 @@ function monitorExpandedClass(mutations) {
     });
 }
 
+// Funzione per monitorare bottom-sheet-container e gestire la navbar
+function monitorBottomSheetClass(mutations) {
+    const bottomSheet = document.querySelector(".bottom-sheet-container");
+    const navbar = document.querySelector(".animated-navbar");
+
+    if (!bottomSheet || !navbar) return;
+
+    mutations.forEach(function (mutation) {
+        if (mutation.type === 'attributes' && mutation.attributeName === 'class' && mutation.target === bottomSheet) {
+            if (bottomSheet.classList.contains("show")) {
+                navbar.classList.remove("show-nav");
+                navbar.classList.add("hide-nav");
+                console.log("Navbar nascosta (hide-nav)");
+            } else {
+                navbar.classList.remove("hide-nav");
+                navbar.classList.add("show-nav");
+                console.log("Navbar mostrata (show-nav)");
+            }
+        }
+    });
+}
+
 // Esegui la funzione tabindex inizialmente
 addTabindexToButtons();
 
-// Observer combinato per entrambe le funzionalità
+// Observer combinato per tutte le funzionalità
 const observer = new MutationObserver((mutations) => {
     // Aggiungi tabindex ai nuovi bottoni
     addTabindexToButtons();
 
     // Monitora le classi expanded
     monitorExpandedClass(mutations);
+
+    // Monitora bottom-sheet-container
+    monitorBottomSheetClass(mutations);
 });
 
 // Osserva sia i cambiamenti nel DOM che gli attributi
@@ -56,4 +81,20 @@ observer.observe(document.body, {
     subtree: true,
     attributes: true,
     attributeFilter: ['class']
-});
+});
+
+// Sync iniziale per la navbar (nel caso la pagina parte già con .show)
+document.addEventListener("DOMContentLoaded", () => {
+    const bottomSheet = document.querySelector(".bottom-sheet-container");
+    const navbar = document.querySelector(".animated-navbar");
+
+    if (bottomSheet && navbar) {
+        if (bottomSheet.classList.contains("show")) {
+            navbar.classList.remove("show-nav");
+            navbar.classList.add("hide-nav");
+        } else {
+            navbar.classList.remove("hide-nav");
+            navbar.classList.add("show-nav");
+        }
+    }
+});