wukong-gitlog-cli 0.0.11 → 0.0.13

package/CHANGELOG.md

@@ -2,6 +2,28 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.0.13](https://github.com/tomatobybike/wukong-gitlog-cli/compare/v0.0.12...v0.0.13) (2025-11-28)
+
+
+### Features
+
+* 🎸 web dir ([aaadd05](https://github.com/tomatobybike/wukong-gitlog-cli/commit/aaadd051a8216d75ad6d8517b292caac90c7fb9b))
+
+### [0.0.12](https://github.com/tomatobybike/wukong-gitlog-cli/compare/v0.0.11...v0.0.12) (2025-11-28)
+
+
+### Features
+
+* 🎸 add web server ([b2e3d80](https://github.com/tomatobybike/wukong-gitlog-cli/commit/b2e3d80d1a998a07b289a2300d2ec53cd0d586ad))
+* 🎸 create web ([3e2da00](https://github.com/tomatobybike/wukong-gitlog-cli/commit/3e2da00222e74199eea6e324e15008e2bb2be127))
+* 🎸 fix eslint ([2666eed](https://github.com/tomatobybike/wukong-gitlog-cli/commit/2666eedd2b41dc1aa88cb9bb3e12a45ec0390f0b))
+* 🎸 web ([6feac90](https://github.com/tomatobybike/wukong-gitlog-cli/commit/6feac90f85a9142bb0e68b98250f7755603086d9))
+
+
+### Bug Fixes
+
+* 🐛 eslint error ([cb65012](https://github.com/tomatobybike/wukong-gitlog-cli/commit/cb65012589f543720d355505f3d8693fd573ee64))
+
 ### [0.0.11](https://github.com/tomatobybike/wukong-gitlog-cli/compare/v0.0.10...v0.0.11) (2025-11-28)
 
 

package/README.md

@@ -108,6 +108,23 @@ If you'd like only per-period outputs and not the combined monthly/weekly summar
 wukong-gitlog-cli ./src/cli.mjs --overtime --limit 200 --format text --out commits.txt --per-period-formats csv,tab,xlsx --per-period-only
 ```
 
+### Serve a local dashboard
+You can start a small static web dashboard to visualize commit statistics and charts. It will export raw commits and analyzed stats into `output/data/` as `commits.mjs` and `overtime-stats.mjs`, and start a local web server serving `web/` and `output/data/`:
+
+```bash
+# Start the server on the default port (3000)
+wukong-gitlog-cli --serve --overtime --limit 200 --out commits.txt
+
+# Start server only (use existing output/data)
+wukong-gitlog-cli --serve-only
+
+# Custom port
+wukong-gitlog-cli --serve --port 8080 --overtime --limit 200 --out commits.txt
+```
+
+Open `http://localhost:3000` to view the dashboard.
+
+
 
 ---
 

package/doc/help.md

@@ -192,3 +192,22 @@ Example JSON output including `changeId`/`gerrit` when `--gerrit` uses `{{change
 ```
 
 ---
+
+如何使用（示例）：
+
+生成数据并启动本地仪表盘（默认端口 3000）：
+
+```bash
+node ./src/cli.mjs --serve --overtime --limit 200 --out commits.txt
+# 或
+npm run cli:serve
+```
+
+指定端口：
+
+```bash
+node ./src/cli.mjs --serve --port 8080 --overtime --limit 200 --out commits.txt
+
+```
+
+仪表盘地址：打开 http://localhost:3000 （或自定义端口）

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wukong-gitlog-cli",
-  "version": "0.0.11",
+  "version": "0.0.13",
   "description": "Advanced Git commit log exporter with Excel/JSON/TXT output, grouping, stats and CLI.",
   "keywords": [
     "git",
@@ -58,6 +58,8 @@
     "cli:overtime-per-period-xlsx-sheets": "node ./src/cli.mjs --overtime --limit 200 --format text --out commits.txt --per-period-formats csv,tab,xlsx --per-period-excel-mode sheets",
     "cli:overtime-per-period-xlsx-files": "node ./src/cli.mjs --overtime --limit 200 --format text --out commits.txt --per-period-formats xlsx --per-period-excel-mode files",
     "cli:overtime-per-period-only": "node ./src/cli.mjs --overtime --limit 200 --format text --out commits.txt --per-period-formats csv,tab,xlsx --per-period-only",
+    "cli:serve": "node ./src/cli.mjs --serve --overtime --format text --out commits.txt",
+    "cli:serve-only": "node ./src/cli.mjs --serve-only",
     "format": "prettier --write \"src/**/*.{js,mjs}\"",
     "lint": "eslint src --ext .js,.mjs src",
     "lint:fix": "eslint src --ext .js,.mjs --fix",

package/src/cli.mjs

@@ -4,6 +4,7 @@ import path from 'path';
 import { getGitLogs } from './git.mjs';
 import { renderText } from './text.mjs';
 import { analyzeOvertime, renderOvertimeText, renderOvertimeTab, renderOvertimeCsv } from './overtime.mjs';
+import { startServer } from './server.mjs';
 import { exportExcel, exportExcelPerPeriodSheets } from './excel.mjs';
 import { groupRecords, writeJSON, writeTextFile, outputFilePath } from './utils/index.mjs';
 
@@ -37,17 +38,32 @@ program
   .option('--per-period-formats <formats>', '每个周期单独输出的格式，逗号分隔：text,csv,tab,xlsx。默认为空（不输出 CSV/Tab/XLSX）', '')
   .option('--per-period-excel-mode <mode>', 'per-period Excel 模式：sheets|files（默认：sheets）', 'sheets')
   .option('--per-period-only', '仅输出 per-period（month/week）文件，不输出合并的 monthly/weekly 汇总文件')
+  .option('--serve', '启动本地 web 服务，查看提交统计（将在 output/data 下生成数据文件）')
+  .option('--port <n>', '本地 web 服务端口（默认 3000）', (v) => parseInt(v, 10), 3000)
+  .option('--serve-only', '仅启动 web 服务，不导出或分析数据（使用 output/data 中已有的数据）')
   .parse();
 
 const opts = program.opts();
+// compute output directory root early (so serve-only can use it)
+const outDir = opts.outParent
+  ? path.resolve(process.cwd(), '..', 'output')
+  : opts.outDir || undefined;
 
 (async () => {
+  // if serve-only is requested, start server and exit
+  if (opts.serveOnly) {
+    try {
+      await startServer(opts.port || 3000, outDir);
+    } catch (err) {
+      console.warn('Start server failed:', err && err.message ? err.message : err);
+      process.exit(1);
+    }
+    return;
+  }
+
   let records = await getGitLogs(opts);
 
   // compute output directory root if user provided one or wants parent
-  const outDir = opts.outParent
-    ? path.resolve(process.cwd(), '..', 'output')
-    : opts.outDir || undefined;
 
   // --- Gerrit 地址处理（若提供） ---
   if (opts.gerrit) {
@@ -66,7 +82,6 @@ const opts = program.opts();
           headers.Authorization = `Bearer ${gerritAuth}`;
         }
       }
-
       const fetchGerritJson = async (url) => {
         try {
           const res = await fetch(url, { headers });
@@ -78,7 +93,6 @@ const opts = program.opts();
           return null;
         }
       };
-
       const resolveChangeNumber = async (r) => {
         // try changeId first
         if (r.changeId) {
@@ -110,7 +124,6 @@ const opts = program.opts();
         }
         return null;
       };
-
       records = await Promise.all(
         records.map(async (r) => {
           const changeNumber = await resolveChangeNumber(r);
@@ -120,24 +133,22 @@ const opts = program.opts();
         })
       );
     } else if (prefix.includes('{{changeNumber}}') && !gerritApi) {
-        console.warn('prefix contains {{changeNumber}} but no --gerrit-api provided — falling back to changeId/hash');
-        records = records.map((r) => ({ ...r, gerrit: prefix.replace('{{changeNumber}}', r.changeId || r.hash) }));
-      } else {
+      console.warn('prefix contains {{changeNumber}} but no --gerrit-api provided — falling back to changeId/hash');
+      records = records.map((r) => ({ ...r, gerrit: prefix.replace('{{changeNumber}}', r.changeId || r.hash) }));
+    } else {
       records = records.map((r) => {
-      let gerritUrl;
-      if (prefix.includes('{{changeId}}')) {
-        const changeId = r.changeId || r.hash;
-        gerritUrl = prefix.replace('{{changeId}}', changeId);
-      } else if (prefix.includes('{{hash}}')) {
-        gerritUrl = prefix.replace('{{hash}}', r.hash);
-      } else {
-        // append hash to prefix, ensure slash handling
-        gerritUrl = prefix.endsWith('/') ? `${prefix}${r.hash}` : `${prefix}/${r.hash}`;
-      }
-
-      return { ...r, gerrit: gerritUrl };
+        let gerritUrl;
+        if (prefix.includes('{{changeId}}')) {
+          const changeId = r.changeId || r.hash;
+          gerritUrl = prefix.replace('{{changeId}}', changeId);
+        } else if (prefix.includes('{{hash}}')) {
+          gerritUrl = prefix.replace('{{hash}}', r.hash);
+        } else {
+          gerritUrl = prefix.endsWith('/') ? `${prefix}${r.hash}` : `${prefix}/${r.hash}`;
+        }
+        return { ...r, gerrit: gerritUrl };
       });
-      }
+    }
   }
 
   // --- 分组 ---
@@ -178,7 +189,49 @@ const opts = program.opts();
     console.log(chalk.green(`Overtime text 已导出: ${overtimeFile}`));
     console.log(chalk.green(`Overtime table (tabs) 已导出: ${overtimeTabFile}`));
     console.log(chalk.green(`Overtime CSV 已导出: ${overtimeCsvFile}`));
-    // 按月输出每个月的加班统计（合并文件 + individual files in month/）
+
+    // If serve mode is enabled, write data modules and launch the web server
+    if (opts.serve) {
+      try {
+        const dataCommitsFile = outputFilePath('data/commits.mjs', outDir);
+        const commitsModule = `export default ${JSON.stringify(records, null, 2)};\n`;
+        writeTextFile(dataCommitsFile, commitsModule);
+        const dataStatsFile = outputFilePath('data/overtime-stats.mjs', outDir);
+        const statsModule = `export default ${JSON.stringify(stats, null, 2)};\n`;
+        writeTextFile(dataStatsFile, statsModule);
+
+        // 新增：每周趋势数据（用于前端图表）
+        const weekGroups = groupRecords(records, 'week');
+        const weekKeys = Object.keys(weekGroups).sort();
+        const weeklySeries = weekKeys.map((k) => {
+          const s = analyzeOvertime(weekGroups[k], {
+            startHour: opts.workStart || opts.workStart === 0 ? opts.workStart : 9,
+            endHour: opts.workEnd || opts.workEnd === 0 ? opts.workEnd : 18,
+            lunchStart: opts.lunchStart || opts.lunchStart === 0 ? opts.lunchStart : 12,
+            lunchEnd: opts.lunchEnd || opts.lunchEnd === 0 ? opts.lunchEnd : 14,
+            country: opts.country || 'CN',
+          });
+          return {
+            period: k,
+            total: s.total,
+            outsideWorkCount: s.outsideWorkCount,
+            outsideWorkRate: s.outsideWorkRate,
+            nonWorkdayCount: s.nonWorkdayCount,
+            nonWorkdayRate: s.nonWorkdayRate,
+          };
+        });
+        const dataWeeklyFile = outputFilePath('data/overtime-weekly.mjs', outDir);
+        const weeklyModule = `export default ${JSON.stringify(weeklySeries, null, 2)};\n`;
+        writeTextFile(dataWeeklyFile, weeklyModule);
+        console.log(chalk.green(`Weekly series 已导出: ${dataWeeklyFile}`));
+
+        startServer(opts.port || 3000, outDir).catch(() => {});
+      } catch (err) {
+        console.warn('Export data modules failed:', err && err.message ? err.message : err);
+      }
+    }
+
+    // 按月输出 ... 保持原逻辑
     const perPeriodFormats = String(opts.perPeriodFormats || '').split(',').map(s => String(s || '').trim().toLowerCase()).filter(Boolean);
     try {
       const monthGroups = groupRecords(records, 'month');
@@ -203,25 +256,25 @@ const opts = program.opts();
           const perMonthFile = outputFilePath(perMonthFileName, outDir);
           writeTextFile(perMonthFile, renderOvertimeText(s));
           console.log(chalk.green(`Overtime 月度(${k}) 已导出: ${perMonthFile}`));
-        // per-period CSV / Tab format (按需生成)
-        if (perPeriodFormats.includes('csv')) {
-          try {
-            const perMonthCsvName = `month/overtime_${outBase}_${k}.csv`;
-            writeTextFile(outputFilePath(perMonthCsvName, outDir), renderOvertimeCsv(s));
-            console.log(chalk.green(`Overtime 月度(CSV)(${k}) 已导出: ${outputFilePath(perMonthCsvName, outDir)}`));
-          } catch (err) {
-            console.warn(`Write monthly CSV for ${k} failed:`, err && err.message ? err.message : err);
+          // per-period CSV / Tab format (按需生成)
+          if (perPeriodFormats.includes('csv')) {
+            try {
+              const perMonthCsvName = `month/overtime_${outBase}_${k}.csv`;
+              writeTextFile(outputFilePath(perMonthCsvName, outDir), renderOvertimeCsv(s));
+              console.log(chalk.green(`Overtime 月度(CSV)(${k}) 已导出: ${outputFilePath(perMonthCsvName, outDir)}`));
+            } catch (err) {
+              console.warn(`Write monthly CSV for ${k} failed:`, err && err.message ? err.message : err);
+            }
           }
-        }
-        if (perPeriodFormats.includes('tab')) {
-          try {
-            const perMonthTabName = `month/overtime_${outBase}_${k}.tab.txt`;
-            writeTextFile(outputFilePath(perMonthTabName, outDir), renderOvertimeTab(s));
-            console.log(chalk.green(`Overtime 月度(Tab)(${k}) 已导出: ${outputFilePath(perMonthTabName, outDir)}`));
-          } catch (err) {
-            console.warn(`Write monthly Tab for ${k} failed:`, err && err.message ? err.message : err);
+          if (perPeriodFormats.includes('tab')) {
+            try {
+              const perMonthTabName = `month/overtime_${outBase}_${k}.tab.txt`;
+              writeTextFile(outputFilePath(perMonthTabName, outDir), renderOvertimeTab(s));
+              console.log(chalk.green(`Overtime 月度(Tab)(${k}) 已导出: ${outputFilePath(perMonthTabName, outDir)}`));
+            } catch (err) {
+              console.warn(`Write monthly Tab for ${k} failed:`, err && err.message ? err.message : err);
+            }
           }
-        }
         } catch (err) {
           console.warn(`Write monthly file for ${k} failed:`, err && err.message ? err.message : err);
         }
@@ -260,7 +313,8 @@ const opts = program.opts();
     } catch (err) {
       console.warn('Generate monthly overtime failed:', err && err.message ? err.message : err);
     }
-    // 按周输出每周的加班统计（合并文件 + individual files in week/）
+
+    // 周度输出保持原逻辑（略）
     try {
       const weekGroups = groupRecords(records, 'week');
       const weeklyFileName = `overtime_${outBase}_weekly.txt`;
@@ -278,119 +332,74 @@ const opts = program.opts();
         });
         weeklyContent += `===== ${k} =====\n`;
         weeklyContent += `${renderOvertimeText(s)}\n\n`;
-        // Also write a single file per week under 'week/' folder
         try {
           const perWeekFileName = `week/overtime_${outBase}_${k}.txt`;
           const perWeekFile = outputFilePath(perWeekFileName, outDir);
           writeTextFile(perWeekFile, renderOvertimeText(s));
           console.log(chalk.green(`Overtime 周度(${k}) 已导出: ${perWeekFile}`));
-        // per-period CSV / Tab format (按需生成)
-        if (perPeriodFormats.includes('csv')) {
-          try {
-            const perWeekCsvName = `week/overtime_${outBase}_${k}.csv`;
-            writeTextFile(outputFilePath(perWeekCsvName, outDir), renderOvertimeCsv(s));
-            console.log(chalk.green(`Overtime 周度(CSV)(${k}) 已导出: ${outputFilePath(perWeekCsvName, outDir)}`));
-          } catch (err) {
-            console.warn(`Write weekly CSV for ${k} failed:`, err && err.message ? err.message : err);
+          // eslint-disable-next-line no-shadow
+          const perPeriodFormats = String(opts.perPeriodFormats || '').split(',').map(s => String(s || '').trim().toLowerCase()).filter(Boolean);
+          if (perPeriodFormats.includes('csv')) {
+            try {
+              const perWeekCsvName = `week/overtime_${outBase}_${k}.csv`;
+              writeTextFile(outputFilePath(perWeekCsvName, outDir), renderOvertimeCsv(s));
+              console.log(chalk.green(`Overtime 周度(CSV)(${k}) 已导出: ${outputFilePath(perWeekCsvName, outDir)}`));
+            } catch (err) {
+              console.warn(`Write weekly CSV for ${k} failed:`, err && err.message ? err.message : err);
+            }
           }
-        }
-        if (perPeriodFormats.includes('tab')) {
-          try {
-            const perWeekTabName = `week/overtime_${outBase}_${k}.tab.txt`;
-            writeTextFile(outputFilePath(perWeekTabName, outDir), renderOvertimeTab(s));
-            console.log(chalk.green(`Overtime 周度(Tab)(${k}) 已导出: ${outputFilePath(perWeekTabName, outDir)}`));
-          } catch (err) {
-            console.warn(`Write weekly Tab for ${k} failed:`, err && err.message ? err.message : err);
+          if (perPeriodFormats.includes('tab')) {
+            try {
+              const perWeekTabName = `week/overtime_${outBase}_${k}.tab.txt`;
+              writeTextFile(outputFilePath(perWeekTabName, outDir), renderOvertimeTab(s));
+              console.log(chalk.green(`Overtime 周度(Tab)(${k}) 已导出: ${outputFilePath(perWeekTabName, outDir)}`));
+            } catch (err) {
+              console.warn(`Write weekly Tab for ${k} failed:`, err && err.message ? err.message : err);
+            }
           }
-        }
         } catch (err) {
           console.warn(`Write weekly file for ${k} failed:`, err && err.message ? err.message : err);
         }
       });
-      if (!opts.perPeriodOnly) {
-        writeTextFile(weeklyFile, weeklyContent);
-        console.log(chalk.green(`Overtime 周度汇总 已导出: ${weeklyFile}`));
-      }
-      // per-period Excel (sheets or files)
-      if (perPeriodFormats.includes('xlsx')) {
-        const perPeriodExcelMode = String(opts.perPeriodExcelMode || 'sheets');
-        if (perPeriodExcelMode === 'sheets') {
-          try {
-            const weekXlsxName = `week/overtime_${outBase}_weekly.xlsx`;
-            const weekXlsxFile = outputFilePath(weekXlsxName, outDir);
-            await exportExcelPerPeriodSheets(weekGroups, weekXlsxFile, { stats: opts.stats, gerrit: opts.gerrit });
-            console.log(chalk.green(`Overtime 周度(XLSX) 已导出: ${weekXlsxFile}`));
-          } catch (err) {
-            console.warn('Export week XLSX (sheets) failed:', err && err.message ? err.message : err);
-          }
-        } else {
-          try {
-            const weekKeys2 = Object.keys(weekGroups).sort();
-            const tasks2 = weekKeys2.map(k2 => {
-              const perWeekXlsxName = `week/overtime_${outBase}_${k2}.xlsx`;
-              const perWeekXlsxFile = outputFilePath(perWeekXlsxName, outDir);
-              return exportExcel(weekGroups[k2], null, { file: perWeekXlsxFile, stats: opts.stats, gerrit: opts.gerrit })
-                .then(() => console.log(chalk.green(`Overtime 周度(XLSX)(${k2}) 已导出: ${perWeekXlsxFile}`)));
-            });
-            await Promise.all(tasks2);
-          } catch (err) {
-            console.warn('Export weekly XLSX files failed:', err && err.message ? err.message : err);
-          }
-        }
-      }
+      writeTextFile(weeklyFile, weeklyContent);
+      console.log(chalk.green(`Overtime 周度汇总 已导出: ${weeklyFile}`));
     } catch (err) {
       console.warn('Generate weekly overtime failed:', err && err.message ? err.message : err);
     }
-    // don't return — allow other outputs to proceed
   }
 
-  // --- JSON ---
+  // --- JSON/TEXT/EXCEL（保持原逻辑） ---
   if (opts.json || opts.format === 'json') {
     const file = opts.out || 'commits.json';
     const filepath = outputFilePath(file, outDir);
-
     writeJSON(filepath, groups || records);
     console.log(chalk.green(`JSON 已导出: ${filepath}`));
     return;
   }
 
-  // --- TEXT ---
   if (opts.format === 'text') {
     const file = opts.out || 'commits.txt';
     const filepath = outputFilePath(file, outDir);
-
     const text = renderText(records, groups, { showGerrit: !!opts.gerrit });
     writeTextFile(filepath, text);
-
     console.log(text);
     console.log(chalk.green(`文本已导出: ${filepath}`));
     return;
   }
 
-  // --- EXCEL（强制同时输出 TXT） ---
   if (opts.format === 'excel') {
-    // Excel
     const excelFile = opts.out || 'commits.xlsx';
     const excelPath = outputFilePath(excelFile, outDir);
-
-    // TXT（自动附带）
     const txtFile = excelFile.replace(/\.xlsx$/, '.txt');
     const txtPath = outputFilePath(txtFile, outDir);
-
-    // 导出 Excel 文件
     await exportExcel(records, groups, {
       file: excelPath,
       stats: opts.stats,
       gerrit: opts.gerrit
     });
-
-    // 导出文本
     const text = renderText(records, groups);
     writeTextFile(txtPath, text);
-
     console.log(chalk.green(`Excel 已导出: ${excelPath}`));
     console.log(chalk.green(`文本已自动导出: ${txtPath}`));
-
-
   }
 })();

package/src/server.mjs

@@ -0,0 +1,87 @@
+import http from 'http';
+import fs from 'fs';
+import path from 'path';
+import chalk from 'chalk';
+import { fileURLToPath } from 'url';
+
+const mime = new Map([
+  ['.html', 'text/html; charset=utf-8'],
+  ['.js', 'application/javascript; charset=utf-8'],
+  ['.mjs', 'application/javascript; charset=utf-8'],
+  ['.css', 'text/css; charset=utf-8'],
+  ['.json', 'application/json; charset=utf-8'],
+  ['.svg', 'image/svg+xml'],
+  ['.png', 'image/png'],
+  ['.jpg', 'image/jpeg'],
+  ['.jpeg', 'image/jpeg'],
+  ['.map', 'application/json; charset=utf-8'],
+]);
+
+// eslint-disable-next-line default-param-last
+export function startServer(port = 3000, outputDir) {
+  // 解析包根目录，确保 web 资源在全局安装后也能找到
+  const __dirname = path.dirname(fileURLToPath(import.meta.url));
+  const pkgRoot = path.resolve(__dirname, '..');
+  const webRoot = path.resolve(pkgRoot, 'web');
+  const dataRoot = outputDir ? path.resolve(outputDir) : path.resolve(process.cwd(), 'output');
+
+  // warn if web directory or data directory doesn't exist
+  if (!fs.existsSync(webRoot)) {
+    console.warn(chalk.yellow(`Warning: web/ directory not found at ${webRoot}. Server will still run but no UI will be available.`));
+  }
+  if (!fs.existsSync(dataRoot)) {
+    console.warn(chalk.yellow(`Warning: output data directory not found at ${dataRoot}. Server will still run but data endpoints (/data/) may 404.`));
+  }
+
+  const server = http.createServer((req, res) => {
+    try {
+      // Normalize URL path
+      const u = new URL(req.url, `http://localhost`);
+      let pathname = decodeURIComponent(u.pathname);
+
+      // Serve data files under /data/* mapped to dataRoot/data/*
+      if (pathname.startsWith('/data/')) {
+        const relative = pathname.replace(/^\/data\//, '');
+        const fileLocal = path.join(dataRoot, 'data', relative);
+        if (fs.existsSync(fileLocal) && fs.statSync(fileLocal).isFile()) {
+          const ext = path.extname(fileLocal).toLowerCase();
+          res.setHeader('Content-Type', mime.get(ext) || 'application/octet-stream');
+          res.setHeader('Access-Control-Allow-Origin', '*');
+          const stream = fs.createReadStream(fileLocal);
+          stream.pipe(res);
+          return;
+        }
+      }
+
+      // Resolve web assets
+      if (pathname === '/') pathname = '/index.html';
+      const fileLocal = path.join(webRoot, pathname);
+      if (fs.existsSync(fileLocal) && fs.statSync(fileLocal).isFile()) {
+        const ext = path.extname(fileLocal).toLowerCase();
+        res.setHeader('Content-Type', mime.get(ext) || 'application/octet-stream');
+        const stream = fs.createReadStream(fileLocal);
+        stream.pipe(res);
+        return;
+      }
+
+      // file not found
+      res.statusCode = 404;
+      res.setHeader('Content-Type', 'text/plain; charset=utf-8');
+      res.end('Not Found');
+    } catch (err) {
+      res.statusCode = 500;
+      res.end('Server error');
+    }
+  });
+
+  return new Promise((resolve, reject) => {
+    server.on('error', (err) => reject(err));
+    server.listen(port, () => {
+      console.log(chalk.green(`Server started at http://localhost:${port}`));
+      console.log(chalk.green(`Serving web/ and output/data/`));
+      resolve(server);
+    });
+  });
+}
+
+export default startServer;

package/web/app.js

@@ -0,0 +1,104 @@
+/* global Chart */
+/* eslint-disable import/no-absolute-path */
+const formatDate = (d) => new Date(d).toLocaleString();
+
+async function loadData() {
+  try {
+    const [commitsModule, statsModule, weeklyModule] = await Promise.all([
+      import("/data/commits.mjs"),
+      import("/data/overtime-stats.mjs"),
+      import("/data/overtime-weekly.mjs"),
+    ]);
+    const commits = commitsModule.default || [];
+    const stats = statsModule.default || {};
+    const weekly = weeklyModule.default || [];
+    return { commits, stats, weekly };
+  } catch (err) {
+    console.error('Load data failed', err);
+    return { commits: [], stats: {}, weekly: [] };
+  }
+}
+
+function renderCommitsTable(commits) {
+  const tbody = document.querySelector('#commitsTable tbody');
+  tbody.innerHTML = '';
+  commits.forEach((c) => {
+    const tr = document.createElement('tr');
+    tr.innerHTML = `<td>${c.hash.slice(0, 8)}</td><td>${c.author}</td><td>${formatDate(c.date)}</td><td>${c.message}</td>`;
+    tbody.appendChild(tr);
+  });
+}
+
+function drawHourlyOvertime(stats) {
+  const ctx = document.getElementById('hourlyOvertimeChart').getContext('2d');
+  const data = stats.hourlyOvertimeCommits || [];
+  const labels = Array.from({ length: 24 }, (_, i) => String(i).padStart(2, '0'));
+  const chartHourly = new Chart(ctx, {
+    type: 'bar',
+    data: { labels, datasets: [{ label: 'Overtime commits', data }] },
+    options: { responsive: true }
+  });
+  return chartHourly;
+}
+
+function drawOutsideVsInside(stats) {
+  const ctx = document.getElementById('outsideVsInsideChart').getContext('2d');
+  const outside = stats.outsideWorkCount || 0;
+  const total = stats.total || 0;
+  const inside = Math.max(0, total - outside);
+  const chartPie = new Chart(ctx, {
+    type: 'pie',
+    data: { labels: ['Inside work', 'Outside work'], datasets: [{ data: [inside, outside], backgroundColor: ['#36a2eb', '#ff6384'] }] },
+  });
+  return chartPie;
+}
+
+function drawDailyTrend(commits) {
+  const map = new Map();
+  commits.forEach((c) => {
+    const d = new Date(c.date).toISOString().slice(0, 10);
+    map.set(d, (map.get(d) || 0) + 1);
+  });
+  const labels = Array.from(map.keys()).sort();
+  const data = labels.map(l => map.get(l));
+  const ctx = document.getElementById('dailyTrendChart').getContext('2d');
+  const chartDaily = new Chart(ctx, {
+    type: 'line',
+    data: { labels, datasets: [{ label: 'Commits per day', data, fill: true, tension: 0.3 }] },
+  });
+  return chartDaily;
+}
+
+function drawWeeklyTrend(weekly) {
+  const labels = weekly.map(w => w.period);
+  const dataRate = weekly.map(w => +(w.outsideWorkRate * 100).toFixed(1));
+  const dataCount = weekly.map(w => w.outsideWorkCount);
+  const ctx = document.getElementById('weeklyTrendChart').getContext('2d');
+  const chartWeekly = new Chart(ctx, {
+    type: 'line',
+    data: {
+      labels,
+      datasets: [
+        { label: '加班占比(%)', data: dataRate, borderColor: '#ff6384', yAxisID: 'y1' },
+        { label: '加班次数', data: dataCount, borderColor: '#36a2eb', yAxisID: 'y2' },
+      ]
+    },
+    options: {
+      responsive: true,
+      scales: {
+        y1: { type: 'linear', position: 'left', min: 0, max: 100 },
+        y2: { type: 'linear', position: 'right' }
+      }
+    }
+  });
+  return chartWeekly;
+}
+
+(async function main() {
+  const { commits, stats, weekly } = await loadData();
+  renderCommitsTable(commits);
+  drawHourlyOvertime(stats);
+  drawOutsideVsInside(stats);
+  drawDailyTrend(commits);
+  drawWeeklyTrend(weekly);
+})();

package/web/index.html

@@ -0,0 +1,49 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width,initial-scale=1" />
+  <title>wukong-gitlog-cli — Overtime Dashboard</title>
+  <link rel="stylesheet" href="/style.css" />
+  <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+</head>
+<body>
+  <header>
+    <h1>Wukong Gitlog Overtime Dashboard</h1>
+  </header>
+  <main>
+    <section id="charts">
+      <div class="chart-card">
+        <h2>每小时加班分布 (小时 -> 提交数)</h2>
+        <canvas id="hourlyOvertimeChart"></canvas>
+      </div>
+      <div class="chart-card">
+        <h2>下班时间 vs 工作时间提交占比</h2>
+        <canvas id="outsideVsInsideChart"></canvas>
+      </div>
+      <div class="chart-card">
+        <h2>按日提交趋势</h2>
+        <canvas id="dailyTrendChart"></canvas>
+      </div>
+      <div class="chart-card">
+        <h2>每周趋势（加班占比）</h2>
+        <canvas id="weeklyTrendChart"></canvas>
+      </div>
+    </section>
+
+    <section class="table-card">
+      <h2>提交清单</h2>
+      <table id="commitsTable">
+        <thead>
+          <tr><th>Hash</th><th>Author</th><th>Date</th><th>Message</th></tr>
+        </thead>
+        <tbody></tbody>
+      </table>
+    </section>
+  </main>
+  <footer>
+    <small>Local dashboard generated by wukong-gitlog-cli. Data served from <code>/data/</code>.</small>
+  </footer>
+  <script type="module" src="/app.js"></script>
+</body>
+</html>

package/web/style.css

@@ -0,0 +1,9 @@
+body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; margin: 0; padding: 0; background: #fafafa; color: #222; }
+header { background: #0f172a; color: white; padding: 12px 20px; }
+main { display: flex; flex-direction: column; gap: 12px; padding: 20px; max-width: 1200px; margin: 20px auto; }
+#charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
+.chart-card { background: white; border-radius: 8px; padding: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
+.table-card { background: white; padding: 12px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
+table { width: 100%; border-collapse: collapse; }
+th, td { text-align: left; padding: 8px; border-bottom: 1px solid #eee; }
+footer { text-align: center; margin: 8px 0 24px 0; color: #666; }