dns-server/.trae/documents/调整DNS趋势图表默认显示和浮窗独立性.md

调整DNS趋势图表默认显示和浮窗独立性

问题分析

1. DNS趋势图表默认显示：当前代码中isMixedView变量默认设置为true，但在initTimeRangeToggle函数中，默认选中第一个按钮后会将isMixedView设置为false，导致实际默认显示的是24小时视图而非混合视图。
2. 浮窗图表独立性：当前代码中详细图表（浮窗）已有独立变量detailedCurrentTimeRange和detailedIsMixedView，但需要确保初始化时正确设置，避免与主图表冲突。

实现计划

1. 修改DNS趋势图表默认显示为混合内容

• 文件：/root/dns/static/js/dashboard.js
• 函数：initTimeRangeToggle
• 修改点：
  • 在函数末尾，默认选中第一个按钮后，将isMixedView设置为true
  • 将currentTimeRange设置为'mixed'
  • 更新按钮样式，添加混合视图标记

2. 确保浮窗图表初始化正确

• 文件：/root/dns/static/js/dashboard.js
• 函数：initDetailedTimeRangeToggle
• 修改点：
  • 确保初始化时detailedIsMixedView默认值与主图表保持一致
  • 确保点击浮窗中的时间范围按钮时，只修改详细图表的变量，不影响主图表

3. 验证功能完整性

• 检查drawDNSRequestsChart函数，确保它使用主图表变量
• 检查drawDetailedDNSRequestsChart函数，确保它使用详细图表变量
• 确保两个函数的实现逻辑一致，但使用不同的变量

预期效果

1. DNS趋势图表默认显示混合内容（24小时、7天、30天数据同时显示）
2. 展开浮窗后，切换浮窗中的时间范围或视图模式，不会影响主页图表的显示
3. 主页图表和浮窗图表可以独立显示不同的时间范围和视图模式

实现步骤

1. 修改initTimeRangeToggle函数，设置默认混合视图
2. 优化initDetailedTimeRangeToggle函数，确保浮窗图表初始化正确
3. 验证两个图表函数的变量使用是否正确
4. 测试功能完整性

代码修改点

1. 第1250-1256行：修改默认按钮选中逻辑，添加混合视图设置
2. 第1475-1507行：优化浮窗图表时间范围切换逻辑
3. 第1716-1912行：确保主图表函数使用正确变量
4. 第1509-1714行：确保浮窗图表函数使用正确变量