每一单都算数。每一条路都清楚。
Multi-platform income tracking · Smart dashboard · AI worker advice · Offline PWA
中文摘要 — 跑单记是一款专为外卖骑手、快递员、网约车司机、配送员等灵活就业者设计的日结记账工具。支持美团、饿了么、闪送、顺丰同城、货拉拉、滴滴等多平台收入追踪，内置 AI 收入分析和深色模式，离线可用（PWA），数据本地存储（localStorage + IndexedDB 双写），零框架依赖。已在 GitHub Pages 部署，可安装到手机主屏幕使用。
China has over 84 million gig workers — delivery riders, couriers, ride-hail drivers navigating the 零工经济. They log every ride, every delivery, every expense in their head or on scraps of paper. The accounting apps that exist — 随手记, 鲨鱼记账, 挖财 — were all built for consumer spending. "Where did my money go?" is not a gig worker's question.
Their question is: "How much did I make today? Across which platforms? After costs, am I on track for this month's goal?"
No app answered that. So I built one.
跑单记 is a daily-settlement tracker purpose-built for multi-platform gig workers. Not a skin on a consumer app. Not a demo. A real tool — with a time-windowed dashboard, platform cost tracking, AI-powered worker advice, and a design system that treats the user like a professional, not a consumer.
Built solo, end-to-end, without a design team or engineering team. Every pixel placed through AI-assisted development (WorkBuddy + Claude Code). Deployed on GitHub Pages + Tencent Cloud SCF. From idea to production — one person, zero frameworks, 100% original.
| Category | What You Get |
|---|---|
| 📊 智能仪表盘 | 三张时间窗口卡片：今日净收入 / 本周汇总 / 本月目标。每个数字自带时间标注，不再混淆统计口径。收入、支出、工时一目了然。 |
| 💰 多平台收入追踪 | 美团、饿了么、闪送、顺丰同城、货拉拉、滴滴、跑腿 — 7 大主流平台 + 自定义分类。每个平台独立图标和颜色标识，自动生成平台分布图。 |
| 🤖 AI 工友建议 | DeepSeek 驱动的上下文建议。不是聊天机器人——是懂你跑单规律的工友。数据满 5 天后给出个性化运营建议，不输出数字避免幻觉。数据不足时自动切换鼓励模式。 |
| 📈 四维数据统计 | 收入趋势折线图、平台分布环形图、收支对比柱状图、工时×时薪混合图。Chart.js 渲染，渐变色柱体、彩色 tooltip、自适应深色模式。 |
| 🌓 深色模式 | 完整深色模式覆盖 54 个 CSS 变量。卡片、标题、按钮、输入框、图表——全元素适配。JavaScript 强制 header 渐变，彻底解决缓存导致的渲染异常。 |
| ⏱ 出工打卡 | 上班/下班打卡，自动计算工时。HH:MM 字符串解析，无 Date 对象转换 bug。连续出勤天数追踪。 |
| 🎯 月目标追踪 | 月收入目标和成本控制，实时进度条 + 动态日均计算：「剩余 24 天 · 需 ¥189/天 才能达标」。周目标自动拆解（月目标 ÷ 4.3）。 |
| 📱 PWA 离线可用 | 可安装到手机主屏幕，无网络也能使用。Service Worker + localStorage + IndexedDB 三层持久化。无需注册账号、无需服务器。 |
| 📤 数据导入导出 | CSV 导出（兼容 Excel），CSV 恢复备份。你的数据你做主。 |
| 🎨 设计系统 | 暖白色调（Linear/Arc 风格），5 层阴影深度系统，毛玻璃 header，渐变色进度条。所有交互元素使用 cubic-bezier 过渡动画。配色由 CSS 变量驱动（54 个变量），深色模式一键切换。 |
| 🔧 Engineering | Pure vanilla JS, zero framework dependencies. CSS variable design system. Modular source → single bundle.js build. Responsive to 720px max-width for tablet-friendly layout. |
跑单记 was conceived, designed, and built by 袁铭 (Yuan Ming) — with no formal software engineering background. The development stack: WorkBuddy + Claude Code as AI engineering partners, DeepSeek API for the AI worker advice engine, and GitHub Pages + Tencent Cloud SCF for zero-infrastructure deployment.
gigbook/
├── index.html # Production build — 500 lines, CSS variable-driven
├── dist/
│ ├── bundle.js # Bundled application logic (2,500 lines)
│ ├── index.html # Deployment copy
│ ├── styles.css # Deployment copy
│ ├── sw.js / manifest # PWA files
│ ├── chart.umd.min.js # Chart.js library
│ └── screenshots/ # Product screenshots (.jpg)
├── styles.css # Complete design system (1,600 lines)
├── sw.js # Service Worker (offline cache)
├── manifest.json # PWA manifest
├── config.example.js # API config template — copy to config.js
├── screenshots/ # Source screenshots
├── .gitignore # Excludes config.js (API keys)
├── LICENSE # BSL 1.1 License
└── README.md # This file
# Clone and open — no build step needed
git clone https://github.com/onion-create/gigbook.git
cd gigbook
python3 -m http.server 8080 # → http://localhost:8080
# Or serve via any static file server
npx serve -l 8080
# file:// protocol also works (caching quirks apply)
open index.htmlFor AI worker advice (DeepSeek), set up an API proxy:
cp config.example.js config.js
# Edit config.js — add your SCF proxy URL or DeepSeek API keyWithout config.js, the app still runs fully — AI advice falls back to offline encouragement mode.
Add to your phone's home screen for a native app experience — works offline.
┌─ User Data Layer ─────────────────────────────────────────┐
│ Records → localStorage + IndexedDB (dual-write) │
│ Work Shifts → Time calculation → Dashboard stats │
└──────────────────────┬────────────────────────────────────┘
│
┌─ Stats Engine ───────┼────────────────────────────────────┐
│ Platform aggregation · Daily totals · Moving averages │
│ Hourly rates · Streak tracking · Goal progress │
│ → KPI cards · Chart.js visualization · AI prompt context │
└──────────────────────┬────────────────────────────────────┘
│
┌─ External (SCF Proxy) ┴───────────────────────────────────┐
│ /api/ai/chat → DeepSeek (contextual worker advice) │
│ API keys in SCF env vars — invisible to frontend │
└───────────────────────────────────────────────────────────┘
| Layer | Technology |
|---|---|
| UI Framework | Vanilla JS — zero dependencies |
| Design System | CSS custom properties (54 variables) |
| Charts | Chart.js (UMD bundle) |
| Storage | localStorage + IndexedDB dual-write |
| Offline | Service Worker (network-first strategy) |
| AI | DeepSeek Chat API via Tencent Cloud SCF proxy |
| Deployment | GitHub Pages (static) + Tencent SCF (API proxy) |
| Responsive | 720px max-width · iPhone safe-area · PWA manifest |
- Chart.js — Used under MIT license for statistical visualization.
- DeepSeek API — Powers the AI worker advice engine.
- All application logic, visual design, and product thinking — original work by 袁铭 (Yuan Ming).
Business Source License 1.1. See LICENSE for full terms.
- ✅ View, modify, and use for personal / non-production purposes
- ✅ Production use with no commercial intent (e.g., educational, research)
- ❌ Commercial production use without a separate license
- 🔓 Automatically converts to Apache 2.0 on 2030-08-09
For commercial licensing: contact the author.
Designed, engineered, and shipped by 袁铭 (Yuan Ming)
AI-Assisted Development · WorkBuddy + Claude Code
© 2026 All rights reserved