diff --git a/static/js/dashboard.js b/static/js/dashboard.js index 3e119d6..1493276 100644 --- a/static/js/dashboard.js +++ b/static/js/dashboard.js @@ -1038,11 +1038,11 @@ function drawDNSRequestsChart() { const chartContext = ctx.getContext('2d'); // 混合视图配置 - const datasetsConfig = [ - { label: '24小时', api: (api && api.getHourlyStats) || (() => Promise.resolve({ labels: [], data: [] })), color: '#3b82f6', fillColor: 'rgba(59, 130, 246, 0.1)' }, - { label: '7天', api: (api && api.getDailyStats) || (() => Promise.resolve({ labels: [], data: [] })), color: '#22c55e', fillColor: 'rgba(34, 197, 94, 0.1)' }, - { label: '30天', api: (api && api.getMonthlyStats) || (() => Promise.resolve({ labels: [], data: [] })), color: '#a855f7', fillColor: 'rgba(168, 85, 247, 0.1)' } - ]; + const datasetsConfig = [ + { label: '24小时', api: (api && api.getHourlyStats) || (() => Promise.resolve({ labels: [], data: [] })), color: '#3b82f6', fillColor: 'rgba(59, 130, 246, 0.1)' }, + { label: '7天', api: (api && api.getDailyStats) || (() => Promise.resolve({ labels: [], data: [] })), color: '#22c55e', fillColor: 'rgba(34, 197, 94, 0.1)' }, + { label: '30天', api: (api && api.getMonthlyStats) || (() => Promise.resolve({ labels: [], data: [] })), color: '#a855f7', fillColor: 'rgba(168, 85, 247, 0.1)' } + ]; // 检查是否为混合视图 if (isMixedView || currentTimeRange === 'mixed') { @@ -1054,11 +1054,12 @@ function drawDNSRequestsChart() { // 获取所有时间范围的数据 Promise.all(datasetsConfig.map(config => config.api().catch(error => { - console.error(`获取${config.label}数据失败,使用模拟数据:`, error); - // 返回模拟数据 + console.error(`获取${config.label}数据失败:`, error); + // 返回空数据而不是模拟数据 + const count = config.label === '24小时' ? 24 : (config.label === '7天' ? 7 : 30); return { - labels: generateTimeLabels(config.label === '24小时' ? 24 : (config.label === '7天' ? 7 : 30)), - data: generateMockData(config.label === '24小时' ? 24 : (config.label === '7天' ? 7 : 30), 100, 1000) + labels: Array(count).fill(''), + data: Array(count).fill(0) }; }) )).then(results => { @@ -1075,7 +1076,7 @@ function drawDNSRequestsChart() { // 创建或更新图表 if (dnsRequestsChart) { - dnsRequestsChart.data.labels = results[0].labels; // 使用第一个数据集的标签 + dnsRequestsChart.data.labels = results[0].labels; dnsRequestsChart.data.datasets = datasets; dnsRequestsChart.options.plugins.legend.display = showLegend; // 使用平滑过渡动画更新图表 @@ -1093,7 +1094,6 @@ function drawDNSRequestsChart() { options: { responsive: true, maintainAspectRatio: false, - // 添加动画配置,确保平滑过渡 animation: { duration: 800, easing: 'easeInOutQuart' @@ -1130,6 +1130,7 @@ function drawDNSRequestsChart() { } else { // 普通视图 // 根据当前时间范围选择API函数 + let apiFunction; switch (currentTimeRange) { case '7d': apiFunction = (api && api.getDailyStats) || (() => Promise.resolve({ labels: [], data: [] })); @@ -1177,7 +1178,6 @@ function drawDNSRequestsChart() { options: { responsive: true, maintainAspectRatio: false, - // 添加动画配置,确保平滑过渡 animation: { duration: 800, easing: 'easeInOutQuart' @@ -1209,15 +1209,16 @@ function drawDNSRequestsChart() { } }).catch(error => { console.error('绘制DNS请求图表失败:', error); - // 使用模拟数据 - const mockData = { - labels: generateTimeLabels(currentTimeRange === '24h' ? 24 : (currentTimeRange === '7d' ? 7 : 30)), - data: generateMockData(currentTimeRange === '24h' ? 24 : (currentTimeRange === '7d' ? 7 : 30), 100, 1000) + // 错误处理:使用空数据而不是模拟数据 + const count = currentTimeRange === '24h' ? 24 : (currentTimeRange === '7d' ? 7 : 30); + const emptyData = { + labels: Array(count).fill(''), + data: Array(count).fill(0) }; if (dnsRequestsChart) { - dnsRequestsChart.data.labels = mockData.labels; - dnsRequestsChart.data.datasets[0].data = mockData.data; + dnsRequestsChart.data.labels = emptyData.labels; + dnsRequestsChart.data.datasets[0].data = emptyData.data; dnsRequestsChart.update(); } });