dns-server/static/js/about.js

// about.js - 关于页面功能实现

// 初始化关于页面
async function initAboutPage() {
    try {
        console.log('初始化关于页面');
        
        // 立即显示内容，确保页面不会空白
        const contentElement = document.getElementById('about-content');
        if (contentElement) {
            contentElement.classList.remove('hidden');
        }
        
        // 检查是否有有效的缓存数据
        const cachedData = window.pageDataCache && window.pageDataCache.getCache('about');
        if (cachedData) {
            console.log('使用缓存的关于页面数据');
            updateAboutPageUI(cachedData);
            return;
        }
        
        // 并行获取服务器信息和版本信息
        const [serverInfo, versionInfo] = await Promise.all([
            fetchServerInfo(),
            fetchVersionInfo()
        ]);
        
        // 组合数据
        const aboutData = {
            serverInfo,
            versionInfo
        };
        
        // 更新UI
        updateAboutPageUI(aboutData);
        
        // 存储数据到缓存
        if (window.pageDataCache) {
            window.pageDataCache.setCache('about', aboutData);
        }
    } catch (error) {
        console.error('初始化关于页面失败:', error);
        showAboutError('加载数据失败，请稍后重试');
        
        // 即使出错也显示默认内容
        const defaultData = {
            serverInfo: {
                version: '1.0.0',
                uptime: 0,
                system: 'Unknown',
                platform: 'Unknown',
                arch: 'Unknown',
                goVersion: 'Unknown',
                cpu: 'Unknown',
                memory: 'Unknown',
                disk: 'Unknown'
            },
            versionInfo: {
                mainFile: {
                    version: '1.0.0',
                    lastUpdate: new Date().toISOString()
                },
                configFile: {
                    version: '1.0.0',
                    lastUpdate: new Date().toISOString()
                },
                ruleFiles: {
                    version: '1.0.0',
                    lastUpdate: new Date().toISOString()
                }
            }
        };
        updateAboutPageUI(defaultData);
    }
}

// 获取服务器信息
async function fetchServerInfo() {
    try {
        const response = await fetch('/api/server-info');
        if (!response.ok) {
            throw new Error(`获取服务器信息失败: ${response.status}`);
        }
        return await response.json();
    } catch (error) {
        console.error('获取服务器信息失败:', error);
        // 返回默认值
        return {
            version: '1.0.0',
            uptime: 0,
            system: 'Unknown',
            platform: 'Unknown',
            arch: 'Unknown',
            goVersion: 'Unknown',
            cpu: 'Unknown',
            memory: 'Unknown',
            disk: 'Unknown'
        };
    }
}

// 获取版本信息
async function fetchVersionInfo() {
    try {
        const response = await fetch('/api/version-info');
        if (!response.ok) {
            throw new Error(`获取版本信息失败: ${response.status}`);
        }
        return await response.json();
    } catch (error) {
        console.error('获取版本信息失败:', error);
        // 返回默认值
        return {
            mainFile: {
                version: '1.0.0',
                lastUpdate: new Date().toISOString()
            },
            configFile: {
                version: '1.0.0',
                lastUpdate: new Date().toISOString()
            },
            ruleFiles: {
                version: '1.0.0',
                lastUpdate: new Date().toISOString()
            }
        };
    }
}

// 更新关于页面UI
function updateAboutPageUI(data) {
    if (!data) return;
    
    const { serverInfo, versionInfo } = data;
    
    // 更新服务器基本信息
    updateServerInfoUI(serverInfo);
    
    // 更新版本信息
    updateVersionInfoUI(versionInfo);
    
    // 隐藏加载状态（已移除加载元素）
    
    // 显示内容
    const contentElement = document.getElementById('about-content');
    if (contentElement) {
        contentElement.classList.remove('hidden');
    }
}

// 更新服务器基本信息UI
function updateServerInfoUI(info) {
    if (!info) return;
    
    const elements = {
        'server-version': info.version || '1.0.0',
        'server-uptime': formatUptime(info.uptime || 0),
        'server-system': info.system || 'Unknown',
        'server-platform': info.platform || 'Unknown',
        'server-arch': info.arch || 'Unknown',
        'server-go-version': info.goVersion || 'Unknown',
        'server-cpu': info.cpu || 'Unknown',
        'server-memory': info.memory || 'Unknown',
        'server-disk': info.disk || 'Unknown'
    };
    
    Object.entries(elements).forEach(([id, value]) => {
        const element = document.getElementById(id);
        if (element) {
            element.textContent = value;
        }
    });
}

// 更新版本信息UI
function updateVersionInfoUI(info) {
    if (!info) return;
    
    const elements = {
        'main-file-version': info.mainFile?.version || '1.0.0',
        'main-file-update': formatDate(info.mainFile?.lastUpdate || new Date()),
        'config-file-version': info.configFile?.version || '1.0.0',
        'config-file-update': formatDate(info.configFile?.lastUpdate || new Date()),
        'rule-files-version': info.ruleFiles?.version || '1.0.0',
        'rule-files-update': formatDate(info.ruleFiles?.lastUpdate || new Date())
    };
    
    Object.entries(elements).forEach(([id, value]) => {
        const element = document.getElementById(id);
        if (element) {
            element.textContent = value;
        }
    });
}

// 显示错误信息
function showAboutError(message) {
    const errorElement = document.getElementById('about-error');
    if (errorElement) {
        errorElement.textContent = message;
        errorElement.classList.remove('hidden');
    }
    
    // 隐藏加载状态（已移除加载元素）
}

// 格式化运行时间
function formatUptime(seconds) {
    if (!seconds || seconds < 0) return '0秒';
    
    const days = Math.floor(seconds / (24 * 60 * 60));
    const hours = Math.floor((seconds % (24 * 60 * 60)) / (60 * 60));
    const minutes = Math.floor((seconds % (60 * 60)) / 60);
    const secs = Math.floor(seconds % 60);
    
    let result = '';
    if (days > 0) result += `${days}天 `;
    if (hours > 0) result += `${hours}小时 `;
    if (minutes > 0) result += `${minutes}分钟 `;
    if (secs > 0 || result === '') result += `${secs}秒`;
    
    return result.trim();
}

// 格式化日期
function formatDate(date) {
    if (!date) return 'Unknown';
    
    const dateObj = typeof date === 'string' ? new Date(date) : date;
    if (isNaN(dateObj.getTime())) return 'Unknown';
    
    return dateObj.toLocaleString('zh-CN', {
        year: 'numeric',
        month: '2-digit',
        day: '2-digit',
        hour: '2-digit',
        minute: '2-digit',
        second: '2-digit'
    });
}

// 刷新关于页面数据
function refreshAboutPage() {
    // 清除缓存
    if (window.pageDataCache) {
        window.pageDataCache.clearCache('about');
        window.pageDataCache.initializedPages['about'] = false;
    }
    
    // 显示加载状态（已移除加载元素）
    
    // 隐藏错误信息
    const errorElement = document.getElementById('about-error');
    if (errorElement) {
        errorElement.classList.add('hidden');
    }
    
    // 重新初始化页面
    initAboutPage();
}

// 设置关于页面事件监听器
function setupAboutEventListeners() {
    // 刷新按钮事件
    const refreshBtn = document.getElementById('refresh-about-btn');
    if (refreshBtn) {
        refreshBtn.addEventListener('click', refreshAboutPage);
    }
}

// 页面加载完成后初始化
if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', function() {
        // 检查当前是否是about页面
        if (window.location.hash === '#about') {
            initAboutPage();
        }
        setupAboutEventListeners();
    });
} else {
    // 检查当前是否是about页面
    if (window.location.hash === '#about') {
        initAboutPage();
    }
    setupAboutEventListeners();
}

// 当切换到about页面时重新加载数据
window.addEventListener('hashchange', function() {
    if (window.location.hash === '#about') {
        initAboutPage();
    }
});