// 配置管理页面功能实现 // 初始化配置管理页面 function initConfigPage() { loadConfig(); setupConfigEventListeners(); } // 加载系统配置 async function loadConfig() { try { const config = await api.getConfig(); populateConfigForm(config); } catch (error) { showErrorMessage('加载配置失败: ' + error.message); } } // 填充配置表单 function populateConfigForm(config) { // DNS配置 document.getElementById('dns-port')?.value = config.DNSServer.Port || 53; document.getElementById('dns-upstream-servers')?.value = (config.DNSServer.UpstreamServers || []).join(', '); document.getElementById('dns-timeout')?.value = config.DNSServer.Timeout || 5; document.getElementById('dns-stats-file')?.value = config.DNSServer.StatsFile || './stats.json'; document.getElementById('dns-save-interval')?.value = config.DNSServer.SaveInterval || 300; // HTTP配置 document.getElementById('http-port')?.value = config.HTTPServer.Port || 8080; // 屏蔽配置 document.getElementById('shield-local-rules-file')?.value = config.Shield.LocalRulesFile || './rules.txt'; document.getElementById('shield-update-interval')?.value = config.Shield.UpdateInterval || 3600; document.getElementById('shield-hosts-file')?.value = config.Shield.HostsFile || '/etc/hosts'; document.getElementById('shield-block-method')?.value = config.Shield.BlockMethod || '0.0.0.0'; } // 保存配置 async function handleSaveConfig() { const formData = collectFormData(); try { await api.saveConfig(formData); showSuccessMessage('配置保存成功'); } catch (error) { showErrorMessage('保存配置失败: ' + error.message); } } // 重启服务 async function handleRestartService() { if (confirm('确定要重启DNS服务吗?重启期间服务可能会短暂不可用。')) { try { await api.restartService(); showSuccessMessage('服务重启成功'); } catch (error) { showErrorMessage('重启服务失败: ' + error.message); } } } // 收集表单数据 function collectFormData() { return { DNSServer: { Port: parseInt(document.getElementById('dns-port')?.value) || 53, UpstreamServers: document.getElementById('dns-upstream-servers')?.value.split(',').map(s => s.trim()).filter(Boolean) || [], Timeout: parseInt(document.getElementById('dns-timeout')?.value) || 5, StatsFile: document.getElementById('dns-stats-file')?.value || './data/stats.json', SaveInterval: parseInt(document.getElementById('dns-save-interval')?.value) || 300 }, HTTPServer: { Port: parseInt(document.getElementById('http-port')?.value) || 8080 }, Shield: { LocalRulesFile: document.getElementById('shield-local-rules-file')?.value || './data/rules.txt', UpdateInterval: parseInt(document.getElementById('shield-update-interval')?.value) || 3600, HostsFile: document.getElementById('shield-hosts-file')?.value || './data/hosts.txt', BlockMethod: document.getElementById('shield-block-method')?.value || '0.0.0.0' } }; } // 设置事件监听器 function setupConfigEventListeners() { // 保存配置按钮 document.getElementById('save-config-btn')?.addEventListener('click', handleSaveConfig); // 重启服务按钮 document.getElementById('restart-service-btn')?.addEventListener('click', handleRestartService); } // 显示成功消息 function showSuccessMessage(message) { showNotification(message, 'success'); } // 显示错误消息 function showErrorMessage(message) { showNotification(message, 'error'); } // 显示通知 function showNotification(message, type = 'info') { // 移除现有通知 const existingNotification = document.querySelector('.notification'); if (existingNotification) { existingNotification.remove(); } // 创建新通知 const notification = document.createElement('div'); notification.className = `notification fixed bottom-4 right-4 px-6 py-3 rounded-lg shadow-lg z-50 transform transition-transform duration-300 ease-in-out translate-y-0 opacity-0`; // 设置通知样式 if (type === 'success') { notification.classList.add('bg-green-500', 'text-white'); } else if (type === 'error') { notification.classList.add('bg-red-500', 'text-white'); } else { notification.classList.add('bg-blue-500', 'text-white'); } notification.textContent = message; document.body.appendChild(notification); // 显示通知 setTimeout(() => { notification.classList.remove('opacity-0'); notification.classList.add('opacity-100'); }, 10); // 3秒后隐藏通知 setTimeout(() => { notification.classList.remove('opacity-100'); notification.classList.add('opacity-0'); setTimeout(() => { notification.remove(); }, 300); }, 3000); } // 页面加载完成后初始化 if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', initConfigPage); } else { initConfigPage(); }