web异常待修复

static/js/app.js

@@ -2,18 +2,20 @@
 const API_BASE_URL = '/api';
 
 // DOM 加载完成后执行
- document.addEventListener('DOMContentLoaded', function() {
+document.addEventListener('DOMContentLoaded', function() {
     // 初始化面板切换
     initPanelNavigation();
     
-    // 初始化通知组件
-    initNotification();
-    
     // 加载初始数据
     loadInitialData();
     
-    // 定时更新数据
-    setInterval(loadInitialData, 60000); // 每分钟更新一次
+    // 直接调用dashboard面板初始化函数，确保数据正确加载
+    if (typeof initDashboardPanel === 'function') {
+        initDashboardPanel();
+    }
+    
+    // 注意：实时更新现在由index.html中的startRealTimeUpdate函数控制
+    // 并根据面板状态自动启用/禁用
 });
 
 // 初始化面板导航
@@ -40,24 +42,27 @@ function initPanelNavigation() {
     });
 }
 
-// 初始化通知组件
-function initNotification() {
+// 保留原有的通知函数作为兼容层
+// 现在主通知功能由index.html中的showNotification函数实现
+if (typeof window.showNotification === 'undefined') {
     window.showNotification = function(message, type = 'info') {
-        const notification = document.getElementById('notification');
-        const notificationMessage = document.getElementById('notification-message');
+        // 创建临时通知元素
+        const notification = document.createElement('div');
+        notification.className = `notification notification-${type}`;
+        notification.innerHTML = `
+            <div class="notification-content">${message}</div>
+        `;
+        notification.style.cssText = 'position: fixed; top: 20px; right: 20px; background: #333; color: white; padding: 10px 15px; border-radius: 4px; z-index: 10000;';
         
-        // 设置消息和类型
-        notificationMessage.textContent = message;
-        notification.className = 'notification show ' + type;
+        document.body.appendChild(notification);
         
-        // 自动关闭
         setTimeout(() => {
-            notification.classList.remove('show');
+            notification.remove();
         }, 3000);
     };
 }
 
-// 加载初始数据
+// 加载初始数据（主要用于服务器状态）
 function loadInitialData() {
     // 加载服务器状态
     fetch(`${API_BASE_URL}/status`)    
@@ -83,40 +88,31 @@ function loadInitialData() {
             const serverStatus = document.getElementById('server-status');
             statusDot.classList.remove('connected');
             serverStatus.textContent = '离线';
+            
+            // 使用新的通知功能
+            if (typeof window.showNotification === 'function') {
+                window.showNotification('获取服务器状态失败', 'danger');
+            }
         });
     
-    // 加载统计数据
-    fetch(`${API_BASE_URL}/stats`)
-        .then(response => response.json())
-        .then(data => {
-            // 更新统计数据
-            if (data && data.dns) {
-                updateStatCards(data.dns);
-            }
-        })
-        .catch(error => {
-            console.error('获取统计数据失败:', error);
-            window.showNotification('获取统计数据失败', 'error');
-        });
+    // 注意：统计数据更新现在由dashboard.js中的updateStatCards函数处理
 }
 
-// 更新统计卡片数据
+// 注意：统计卡片数据更新现在由dashboard.js中的updateStatCards函数处理
+// 此函数保留作为兼容层，实际功能已迁移
 function updateStatCards(stats) {
-    const statElements = {
-        'blocked-count': stats.Blocked || 0,
-        'allowed-count': stats.Allowed || 0,
-        'error-count': stats.Errors || 0,
-        'total-queries': stats.Queries || 0,
-        'rules-count': 0,
-        'hosts-count': 0
-    };
-    
-    for (const [id, value] of Object.entries(statElements)) {
-        const element = document.getElementById(id);
-        if (element) {
-            element.textContent = formatNumber(value);
-        }
-    }
+    // 空实现，保留函数声明以避免引用错误
+    console.log('更新统计卡片 - 此功能现在由dashboard.js处理');
+}
+
+// 注意：获取规则数量功能现在由dashboard.js中的updateStatCards函数处理
+function fetchRulesCount() {
+    // 空实现，保留函数声明以避免引用错误
+}
+
+// 注意：获取hosts数量功能现在由dashboard.js中的updateStatCards函数处理
+function fetchHostsCount() {
+    // 空实现，保留函数声明以避免引用错误
 }
 
 // 通用API请求函数