更新
This commit is contained in:
Alex Yang
@@ -0,0 +1,293 @@
|
||||
// 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();
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user