ui: major UX polish and bug fixes for dashboard

- Added global loading spinner and page transitions.
- Improved sidebar with tooltips and persistent collapsed state.
- Fixed chart memory leaks by properly destroying instances on page change.
- Unified WebSocket event handling and status indicators.
- Refined stat cards, tables, and modal interactions.
- Added real backend integration for logout and session management.

static/js/dashboard.js

@@ -44,6 +44,7 @@ class Dashboard {
     setupSidebar() {
         const toggleBtn = document.getElementById('sidebar-toggle');
         const sidebar = document.querySelector('.sidebar');
+        const logoutBtn = document.getElementById('logout-btn');
         
         if (toggleBtn && sidebar) {
             toggleBtn.onclick = () => {
@@ -55,6 +56,12 @@ class Dashboard {
                 sidebar.classList.add('collapsed');
             }
         }
+
+        if (logoutBtn) {
+            logoutBtn.onclick = () => {
+                window.authManager.logout();
+            };
+        }
     }
 
     setupRefresh() {
@@ -72,8 +79,13 @@ class Dashboard {
     }
 
     async loadPage(page) {
+        if (window.chartManager) {
+            window.chartManager.destroyAllCharts();
+        }
+        
         this.currentPage = page;
         window.location.hash = page;
+        window.scrollTo(0, 0);
         
         // Update menu active state
         document.querySelectorAll('.menu-item').forEach(item => {