动态月份导航：查上月/查下月基于当前显示月翻页，新增年月选择器

- currentMonthOffset 追踪当前显示月份的偏移量
- navigateMonth(delta) 支持逐月翻看历史，可反复点击跨年
- 查当月重置偏移为 0
- 新增年月选择器（年份 + 月份下拉 + 查询按钮），放在按钮末尾
- queryByYearMonth 根据选中年月计算考勤周期并查询

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

main.template.js

@@ -194,6 +194,9 @@
     const QUERY_DELAY_MS = 500;
     const MYTOOLS_BASE = 'https://mytools.fengbohan.com';
 
+    // 当前显示月份的偏移量（0=当月周期，正数=往前翻，负数=往后翻）
+    let currentMonthOffset = 0;
+
     // 加班配置（默认值，启动时尝试从 MyTools 拉取）
     let overtimeConfig = { overtime_start: '17:20', weekly_target: 18 };
 
@@ -396,6 +399,52 @@
         };
     }
 
+    // 基于当前偏移量动态导航月份（反复点击可逐月翻看历史）
+    function navigateMonth(delta) {
+        currentMonthOffset += delta;
+        const range = getCustomMonthRange(currentMonthOffset);
+        console.log(`navigateMonth offset=${currentMonthOffset}: ${range.firstDay} ~ ${range.lastDay}`);
+        simulateDateInput('beginDate', range.firstDay);
+        simulateDateInput('endDate', range.lastDay);
+        queryButton.click();
+        setTimeout(() => get_work_time(), QUERY_DELAY_MS);
+    }
+
+    // 根据指定年月查询（考勤周期：上月21 ~ 本月20）
+    function queryByYearMonth(year, month) {
+        const formatLocal = (date) => {
+            return date.toLocaleDateString('en-CA', {
+                year: 'numeric', month: '2-digit', day: '2-digit'
+            }).replace(/\//g, '-');
+        };
+        // 考勤周期：当月21日 至 次月20日
+        let startMonth = month - 1; // JS month: 0-indexed
+        let startYear = year;
+        const firstDay = new Date(startYear, startMonth, 21);
+        let endYear = year, endMonth = month;
+        if (endMonth > 11) { endMonth -= 12; endYear++; }
+        const lastDay = new Date(endYear, endMonth, 20);
+
+        // 推算偏移量，让后续 navigateMonth 能正确工作
+        const now = new Date();
+        const currentCycleStart = getCustomMonthRange(0).firstDay;
+        const targetFirst = formatLocal(firstDay);
+        // 近似：计算目标月与当前月的月份差
+        const monthDiff = (now.getFullYear() - year) * 12 + (now.getMonth() + 1) - month;
+        const day = now.getDate();
+        if (day >= 21) {
+            currentMonthOffset = monthDiff;
+        } else {
+            currentMonthOffset = monthDiff - 1;
+        }
+
+        console.log(`queryByYearMonth ${year}-${month}: ${targetFirst} ~ ${formatLocal(lastDay)}`);
+        simulateDateInput('beginDate', targetFirst);
+        simulateDateInput('endDate', formatLocal(lastDay));
+        queryButton.click();
+        setTimeout(() => get_work_time(), QUERY_DELAY_MS);
+    }
+
     // 查询工作时间
     function get_work_time() {
         const totalSum = sumOfSecondColumn('grid');
@@ -425,9 +474,12 @@
         }
     });
     const button4 = createQueryButton('查当周', getCurrentWeekRange);
-    const button0 = createQueryButton('查当月', () => getCustomMonthRange(0));
-    const buttonNext = createQueryButton('查下月', () => getCustomMonthRange(-1));
-    const button1 = createQueryButton('查上月', () => getCustomMonthRange(1));
+    const button0 = createQueryButton('查当月', () => {
+        currentMonthOffset = 0;
+        navigateMonth(0);
+    });
+    const buttonNext = createQueryButton('查下月', () => navigateMonth(-1));
+    const buttonPrev = createQueryButton('查上月', () => navigateMonth(1));
     const button2 = createQueryButton('查上上月', () => getCustomMonthRange(2));
     const button3 = createQueryButton('查上上上月', () => getCustomMonthRange(3));
 
@@ -440,9 +492,53 @@
     container.appendChild(button4);
     container.appendChild(button0);
     container.appendChild(buttonNext);
-    container.appendChild(button1);
+    container.appendChild(buttonPrev);
     container.appendChild(button2);
     container.appendChild(button3);
+
+    // 年月选择器
+    (function createYearMonthSelector() {
+        const wrapper = document.createElement('span');
+        wrapper.style.cssText = 'display:inline-flex;align-items:center;gap:4px;margin:0 8px;';
+
+        const yearSel = document.createElement('select');
+        yearSel.id = 'fmohs-year';
+        const thisYear = new Date().getFullYear();
+        for (let y = 2024; y <= thisYear + 1; y++) {
+            const opt = document.createElement('option');
+            opt.value = y; opt.textContent = y + '年';
+            if (y === thisYear) opt.selected = true;
+            yearSel.appendChild(opt);
+        }
+        yearSel.style.cssText = 'padding:2px 6px;font-size:12px;border:1px solid #666;border-radius:3px;background:#333;color:#e5e5e5;font-family:inherit;cursor:pointer;';
+
+        const monthSel = document.createElement('select');
+        monthSel.id = 'fmohs-month';
+        for (let m = 1; m <= 12; m++) {
+            const opt = document.createElement('option');
+            opt.value = m; opt.textContent = m + '月';
+            if (m === new Date().getMonth() + 1) opt.selected = true;
+            monthSel.appendChild(opt);
+        }
+        monthSel.style.cssText = yearSel.style.cssText;
+
+        const queryBtn = document.createElement('button');
+        queryBtn.textContent = '查询';
+        queryBtn.style.cssText = 'padding:2px 12px;font-size:12px;color:#e5e5e5;background:transparent;border:1px solid #666;border-radius:3px;cursor:pointer;font-family:inherit;transition:color 0.15s,border-color 0.15s;';
+        queryBtn.addEventListener('mouseenter', () => { queryBtn.style.color = '#fff'; queryBtn.style.borderColor = '#999'; });
+        queryBtn.addEventListener('mouseleave', () => { queryBtn.style.color = '#e5e5e5'; queryBtn.style.borderColor = '#666'; });
+        queryBtn.addEventListener('click', () => {
+            const y = parseInt(yearSel.value);
+            const m = parseInt(monthSel.value);
+            queryByYearMonth(y, m);
+        });
+
+        wrapper.appendChild(yearSel);
+        wrapper.appendChild(monthSel);
+        wrapper.appendChild(queryBtn);
+        container.appendChild(wrapper);
+    })();
+
     console.log("复旦微加班时间统计脚本已加载");
     console.log("点击按钮后会统计加班时间");