DNS/dns-server
1
0
Fork 0
Code Pull Requests Activity

修复本地规则管理不工作的问题

Browse Source
This commit is contained in:
Alex Yang
2025-11-28 18:41:55 +08:00
parent ca4a32422c
commit ee148fe6c3
21 changed files with 273 additions and 819217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

153
static/js/shield.js
View File

@@ -1,20 +1,19 @@
// 屏蔽管理页面功能实现
// 初始化屏蔽管理页面
function initShieldPage() {
// 加载屏蔽规则统计信息
loadShieldStats();
// 加载本地规则
loadLocalRules();
// 加载远程黑名单
loadRemoteBlacklists();
async function initShieldPage() {
// 并行加载所有数据
await Promise.all([
loadShieldStats(),
loadLocalRules(),
loadRemoteBlacklists()
]);
// 设置事件监听器
setupShieldEventListeners();
}
// 加载屏蔽规则统计信息
async function loadShieldStats() {
showLoading('加载屏蔽规则统计信息...');
try {
const response = await fetch('/api/shield');
@@ -40,18 +39,14 @@ async function loadShieldStats() {
element.textContent = item.value || 0;
}
});
hideLoading();
} catch (error) {
console.error('加载屏蔽规则统计信息失败:', error);
showErrorMessage('加载屏蔽规则统计信息失败');
hideLoading();
}
}
// 加载本地规则
async function loadLocalRules() {
showLoading('加载本地规则...');
try {
const response = await fetch('/api/shield/localrules');
@@ -89,17 +84,14 @@ async function loadLocalRules() {
}
updateRulesTable(rules);
hideLoading();
} catch (error) {
console.error('加载本地规则失败:', error);
showErrorMessage('加载本地规则失败');
hideLoading();
}
}
// 加载远程规则
async function loadRemoteRules() {
showLoading('加载远程规则...');
try {
// 设置当前规则类型
currentRulesType = 'remote';
@@ -136,11 +128,9 @@ async function loadRemoteRules() {
}
updateRulesTable(rules);
hideLoading();
} catch (error) {
console.error('加载远程规则失败:', error);
showErrorMessage('加载远程规则失败');
hideLoading();
}
}
@@ -179,8 +169,19 @@ function updateRulesTable(rules) {
const deleteBtn = document.createElement('button');
deleteBtn.className = 'delete-rule-btn px-3 py-1 bg-danger text-white rounded-md hover:bg-danger/90 transition-colors text-sm';
deleteBtn.dataset.rule = rule;
deleteBtn.innerHTML = '<i class="fa fa-trash"></i>';
deleteBtn.addEventListener('click', handleDeleteRule);
// 创建删除图标
const deleteIcon = document.createElement('i');
deleteIcon.className = 'fa fa-trash';
deleteIcon.style.pointerEvents = 'none'; // 防止图标拦截点击事件
deleteBtn.appendChild(deleteIcon);
// 使用普通函数，确保this指向按钮元素
deleteBtn.onclick = function(e) {
e.stopPropagation(); // 阻止事件冒泡
handleDeleteRule(e);
};
tdAction.appendChild(deleteBtn);
tr.appendChild(tdRule);
@@ -201,9 +202,36 @@ function updateRulesTable(rules) {
// 处理删除规则
async function handleDeleteRule(e) {
const rule = e.target.closest('.delete-rule-btn').dataset.rule;
showLoading('删除规则中...');
console.log('Delete button clicked');
let deleteBtn;
// 尝试从事件目标获取按钮元素
deleteBtn = e.target.closest('.delete-rule-btn');
console.log('Delete button from event target:', deleteBtn);
// 尝试从this获取按钮元素（备用方案）
if (!deleteBtn && this && typeof this.classList === 'object' && this.classList) {
if (this.classList.contains('delete-rule-btn')) {
deleteBtn = this;
console.log('Delete button from this:', deleteBtn);
}
}
if (!deleteBtn) {
console.error('Delete button not found');
return;
}
const rule = deleteBtn.dataset.rule;
console.log('Rule to delete:', rule);
if (!rule) {
console.error('Rule not found in data-rule attribute');
return;
}
try {
console.log('Sending DELETE request to /api/shield');
const response = await fetch('/api/shield', {
method: 'DELETE',
headers: {
@@ -212,24 +240,32 @@ async function handleDeleteRule(e) {
body: JSON.stringify({ rule })
});
console.log('Response status:', response.status);
console.log('Response ok:', response.ok);
if (!response.ok) {
throw new Error('Failed to delete rule');
const errorText = await response.text();
throw new Error(`Failed to delete rule: ${response.status} ${errorText}`);
}
const responseData = await response.json();
console.log('Response data:', responseData);
showSuccessMessage('规则删除成功');
console.log('Current rules type:', currentRulesType);
// 根据当前显示的规则类型重新加载对应的规则列表
if (currentRulesType === 'local') {
console.log('Reloading local rules');
loadLocalRules();
} else {
console.log('Reloading remote rules');
loadRemoteRules();
}
// 重新加载统计信息
loadShieldStats();
hideLoading();
} catch (error) {
console.error('Error deleting rule:', error);
showErrorMessage('删除规则失败');
hideLoading();
showErrorMessage('删除规则失败: ' + error.message);
}
}
@@ -241,7 +277,6 @@ async function handleAddRule() {
return;
}
showLoading('添加规则中...');
try {
const response = await fetch('/api/shield', {
method: 'POST',
@@ -262,17 +297,14 @@ async function handleAddRule() {
loadLocalRules();
// 重新加载统计信息
loadShieldStats();
hideLoading();
} catch (error) {
console.error('Error adding rule:', error);
showErrorMessage('添加规则失败');
hideLoading();
}
}
// 加载远程黑名单
async function loadRemoteBlacklists() {
showLoading('加载远程黑名单...');
try {
const response = await fetch('/api/shield/blacklists');
@@ -285,11 +317,9 @@ async function loadRemoteBlacklists() {
// 确保blacklists是数组
const blacklistArray = Array.isArray(blacklists) ? blacklists : [];
updateBlacklistsTable(blacklistArray);
hideLoading();
} catch (error) {
console.error('加载远程黑名单失败:', error);
showErrorMessage('加载远程黑名单失败');
hideLoading();
}
}
@@ -426,7 +456,6 @@ async function handleUpdateBlacklist(e) {
return;
}
showLoading('更新黑名单中...');
try {
const response = await fetch(`/api/shield/blacklists/${encodeURIComponent(url)}/update`, {
method: 'POST',
@@ -448,8 +477,6 @@ async function handleUpdateBlacklist(e) {
} catch (error) {
console.error('更新黑名单失败:', error);
showToast('更新黑名单失败: ' + error.message, 'error');
} finally {
hideLoading();
}
}
@@ -467,7 +494,6 @@ async function handleDeleteBlacklist(e) {
return;
}
showLoading('删除黑名单中...');
try {
const response = await fetch(`/api/shield/blacklists/${encodeURIComponent(url)}`, {
method: 'DELETE',
@@ -489,8 +515,6 @@ async function handleDeleteBlacklist(e) {
} catch (error) {
console.error('删除黑名单失败:', error);
showToast('删除黑名单失败: ' + error.message, 'error');
} finally {
hideLoading();
}
}
@@ -521,7 +545,6 @@ async function handleAddBlacklist(event) {
return;
}
showLoading('添加黑名单中...');
try {
const response = await fetch('/api/shield/blacklists', {
method: 'POST',
@@ -553,11 +576,9 @@ async function handleAddBlacklist(event) {
loadRemoteBlacklists();
// 重新加载统计信息
loadShieldStats();
hideLoading();
} catch (error) {
console.error('Error adding blacklist:', error);
showErrorMessage(error.message || '添加黑名单失败');
hideLoading();
}
}
@@ -569,18 +590,26 @@ let currentRulesType = 'local';
// 设置事件监听器
function setupShieldEventListeners() {
// 本地规则管理事件
document.getElementById('save-rule-btn').addEventListener('click', handleAddRule);
// 远程黑名单管理事件
document.getElementById('save-blacklist-btn').addEventListener('click', handleAddBlacklist);
// 添加切换查看本地规则和远程规则的事件监听
if (document.getElementById('view-local-rules-btn')) {
document.getElementById('view-local-rules-btn').addEventListener('click', loadLocalRules);
const saveRuleBtn = document.getElementById('save-rule-btn');
if (saveRuleBtn) {
saveRuleBtn.addEventListener('click', handleAddRule);
}
if (document.getElementById('view-remote-rules-btn')) {
document.getElementById('view-remote-rules-btn').addEventListener('click', loadRemoteRules);
// 远程黑名单管理事件
const saveBlacklistBtn = document.getElementById('save-blacklist-btn');
if (saveBlacklistBtn) {
saveBlacklistBtn.addEventListener('click', handleAddBlacklist);
}
// 添加切换查看本地规则和远程规则的事件监听
const viewLocalRulesBtn = document.getElementById('view-local-rules-btn');
if (viewLocalRulesBtn) {
viewLocalRulesBtn.addEventListener('click', loadLocalRules);
}
const viewRemoteRulesBtn = document.getElementById('view-remote-rules-btn');
if (viewRemoteRulesBtn) {
viewRemoteRulesBtn.addEventListener('click', loadRemoteRules);
}
}
@@ -594,31 +623,7 @@ function showErrorMessage(message) {
showNotification(message, 'error');
}
// 显示加载状态
function showLoading(message = '加载中...') {
// 移除现有加载状态
hideLoading();
// 创建加载状态元素
const loading = document.createElement('div');
loading.className = 'loading-overlay fixed inset-0 bg-black/50 flex items-center justify-center z-50';
loading.innerHTML = `
<div class="bg-white rounded-lg p-6 shadow-lg flex items-center space-x-4">
<div class="animate-spin rounded-full h-8 w-8 border-b-2 border-primary"></div>
<span class="text-gray-700 font-medium">${message}</span>
</div>
`;
document.body.appendChild(loading);
}
// 隐藏加载状态
function hideLoading() {
const loading = document.querySelector('.loading-overlay');
if (loading) {
loading.remove();
}
}
// 显示通知
function showNotification(message, type = 'info') {