feat(timestamp): 重构时间戳模块并优化时区处理

- 将时区列表提取到独立常量文件 `timezone.js` 中，便于维护和扩展
- 重构时间戳显示逻辑，将初始化功能从事件处理器中分离
- 引入 timerManager、eventManager 和 scriptManager 进行资源统一管理
- 更新 DOM 操作方式，使用 window.eventManager 替代直接 addEventListener
- 改进时间戳更新函数，支持传入元素引用以提高灵活性
- 在路由加载脚本时增加调试日志，方便追踪组件加载过程
- 移除冗余的 DOM 工具函数（如 getElementById），统一使用原生方法
- 修复计时器清理问题，确保通过 timerManager 正确清除定时任务
- 初始化时间戳和日期输入框默认值，提升用户体验

sidepanel/utils/domUtils.js

@@ -2,69 +2,6 @@
  * DOM工具类函数
  */
 
-/**
- * 切换页面显示（带动画效果）
- * @param {string} pageName - 页面名称
- */
-export function switchPage(pageName) {
-  // 先隐藏当前活跃页面（如果有）
-  const currentPage = document.querySelector('.page.active');
-  if (currentPage) {
-    currentPage.classList.remove('active');
-
-    // 添加离开动画
-    currentPage.style.opacity = '0';
-    currentPage.style.transform = 'translateX(20px)';
-
-    // 等待动画完成后真正隐藏
-    setTimeout(() => {
-      if (!currentPage.classList.contains('active')) {
-        currentPage.style.display = 'none';
-      }
-    }, 300);
-  }
-
-  // 移除所有导航按钮的 active 状态
-  document.querySelectorAll('.nav-button').forEach((button) => {
-    button.classList.remove('active');
-  });
-
-  // 显示目标页面
-  const targetPage = document.getElementById(`page-${pageName}`);
-  if (targetPage) {
-    targetPage.style.display = 'block';
-
-    // 触发重排以确保display变化生效
-    targetPage.offsetHeight;
-
-    // 添加进入动画
-    targetPage.style.opacity = '0';
-    targetPage.style.transform = 'translateX(-20px)';
-
-    setTimeout(() => {
-      targetPage.classList.add('active');
-      targetPage.style.opacity = '1';
-      targetPage.style.transform = 'translateX(0)';
-    }, 10);
-  }
-
-  // 激活对应的导航按钮
-  const navButton =
-    document.getElementById(`nav-${pageName}-btn`) || document.getElementById(`nav-${pageName}`);
-  if (navButton) {
-    navButton.classList.add('active');
-  }
-}
-
-/**
- * 根据ID获取元素的便捷方法
- * @param {string} id - 元素ID
- * @returns {HTMLElement} - DOM元素
- */
-export function getElementById(id) {
-  return document.getElementById(id);
-}
-
 /**
  * 为元素添加事件监听器
  * @param {string} id - 元素ID
@@ -72,9 +9,9 @@ export function getElementById(id) {
  * @param {Function} handler - 事件处理函数
  */
 export function addEventListenerById(id, event, handler) {
-  const element = getElementById(id);
-  if (element) {
-    element.addEventListener(event, handler);
+  const ele = document.getElementById(id);
+  if (ele) {
+    window.eventManager.add(ele, event, handler);
   }
 }
 
@@ -136,4 +73,4 @@ export function removeClass(elem, cls) {
 
   // 过滤多余空格
   elem.className = klass.trim().replace(/\s+/g, ' ');
-}
+}

sidepanel/utils/scriptManager.js

@@ -6,7 +6,8 @@ export class ScriptManager {
   }
 
   async loadScript({ path, name, isModule = false, deps = [] }) {
-    // 卸载现脚本
+    console.log('loadScript');
+    console.log({ path, name, isModule, deps })
     await this.unloadScript();
 
     for (const dep of deps) {
@@ -43,6 +44,7 @@ export class ScriptManager {
   }
 
   async unloadScript() {
+    console.log('unloadScript');
     try {
       if (this.currentName && window[this.currentName]) {
         const mod = window[this.currentName];

sidepanel/utils/timerManager.js

@@ -25,6 +25,7 @@ export class TimerManager {
    * @returns
    */
   setInterval(fn, delay, ...args) {
+    console.log('setInterval in TimerManager');
     const id = window.setInterval(fn, delay, ...args);
     this.timers.push(id);
     return id;

sidepanel/utils/timestampUtils.js

@@ -3,13 +3,13 @@
  */
 
 /**
- * 更新时间戳
- * @param {boolean} showMilliseconds - 是否显示毫秒
+ * 更新时间戳显示
+ * @param {*} ele
+ * @param {*} showMilliseconds
  */
-export function updateTimestamp(showMilliseconds = true) {
-  const currentTimestamp = document.getElementById('current-timestamp-value');
+export function updateTimestamp(ele, showMilliseconds = true) {
   const timestamp = Date.now();
-  currentTimestamp.textContent = showMilliseconds ? timestamp : Math.floor(timestamp / 1000);
+  ele.textContent = showMilliseconds ? timestamp : Math.floor(timestamp / 1000);
 }
 
 /**