root/daywork

Fork 0

Files

T

root 838753a058 feat: 新增记账系统（收支记录、报销跟踪、月度汇总）

2026-10-16 10:40:25 +08:00

22 KiB

Raw Blame History

实习工作日志系统设计方案

版本：v1.11（记账系统）
范围：个人版全量功能；团队版仅作扩展预留

1. 产品定位

面向实习生的轻量工作记录工具，覆盖四个环节：考勤打卡、每日记录、周记沉淀、一键总结。

维度	说明
目标用户	实习生本人（个人版）；扩展支持导师查看（团队版预留）
核心痛点	记录难坚持、总结靠回忆、考勤对不清
核心价值	10 秒记一条；写入即结构化，总结零回忆；数据本地可控、随时导出
产品形态	本地优先 Web 应用，桌面与移动浏览器均可使用

2. 设计原则

写入时结构化，总结时只聚合：记录时多花 2 秒选项目与分类，总结时不再回忆
一切以「天」为聚合键：打卡、日志、周记按日期自然关联，无复杂外键
极致低摩擦：打卡一键完成，记录一句话即可
视觉克制：高级白主题、灰阶文字、唯一强调色、1px 细线分层
无特殊符号、无表情：全部图标自绘 SVG，导出文档用文字标签

3. 功能设计

3.1 打卡

功能	说明
上班打卡	一键记录时间戳；当日重复点击时按钮置灰并显示打卡时间
下班打卡	仅当日已有上班打卡后可用
考勤状态	运行时按规则实时计算，不落库（规则见 4.3）
补卡	近 30 天内任选日期补录上下班时间，kind 记为 makeup，原因写入 note
规则配置	上班时间、下班时间、迟到宽限分钟、午休扣除分钟
上班地点	打卡与补卡时可选可输入（公司、客户现场、出差、居家办公等，支持自由输入城市），存于 attendance.location，记住上次选择

3.2 日历（月视图）

元素	表达方式
出勤状态	6px 圆点：正常(ok) / 缺卡(warn) / 缺勤(danger) / 无记录(dot-empty)
已写日志	12px check-circle 小图标
成果日	小 star 图标，表示当日存在星标条目
今天	日期数字用强调色，其余日期灰阶
周末	文字降为辅助色，不填色块
交互	点击日期打开当日抽屉（桌面右侧 / 移动整页）；月份切换；回到今天

3.3 工作日志

快速记录控件状态：

控件	默认状态
内容输入框	常显，placeholder「做了什么」，回车即提交
项目下拉	常显，记住上次选择
分类下拉	常显，记住上次选择
耗时 / 备注 / 收获	默认折叠，点击展开
星标 / 待跟进	条目上的图标按钮，点击切换

三个文本位分工（防重复）：

字段	回答的问题	总结去向
content	做了什么	总结正文
takeaway	学到了什么	「学习与成长」章节
remark	背景、链接、未决事项	可检索；带旗标的进「待跟进」章节

3.4 周记

每周五（可配置开关）顶部提示补填：本周亮点 / 踩的坑 / 下周计划，三个文本位
周报草稿 = 周记 + 当周日志自动聚合
周定义：周一为一周开始

3.5 总结生成

范围：本周 / 本月 / 自定义区间 / 全部实习期。流程：选范围 → 按模板聚合 → 生成可编辑草稿 → 导出 Markdown。

模板结构：

实习工作总结（起 ~ 止）

一、考勤概况
   出勤 N 天，累计工时 H 小时，补卡 M 次
   地点分布：公司 N 天，客户现场 M 天
二、工作内容分布
   开发 45%，BUG修复 20%，学习 15%，会议 10%，文档 10%
三、项目投入
   项目A 32 条，项目B 11 条
四、主要成果
   1. 星标条目逐条列出
五、待跟进事项
   带旗标且未勾销的备注
六、学习与成长
   takeaway 汇总 + 各周 highlights

Markdown 导出节选示例（成果与待跟进均用文字标签，不用符号）：

## 四、主要成果
- 【成果】独立完成订单列表分页接口并上线（2025-03-04）
- 【成果】排查并修复订单金额精度丢失问题（2025-03-05）

## 五、待跟进事项
- 【待跟进】订单并发场景未覆盖测试（2025-03-06 备注）

AI 润色为可选进阶：将统计、成果、周记交给大模型按四段式输出，结果仍可编辑；前提是原料已结构化。

3.6 统计

卡片	指标
考勤	出勤天数 / 累计工时 / 补卡次数
记录	总条数 / 连续记录天数
分布	分类横向条形、项目投入横向条形（灰阶 + 单一强调色）
趋势	近 12 周记录热力图（绿色单阶，克制）

3.7 备忘录

双栏结构：左侧列表（标题、内容摘要、更新时间），右侧编辑器（标题 + 内容）。带未保存修改守卫（切换、新建前确认）、删除确认弹窗。

3.8 密码库

企业账号密码管理：字段为系统名称、账号、密码、备注。

项	说明
加密	主密码经 PBKDF2-SHA256（150000 次迭代）派生 AES-256-GCM 密钥；密码字段以密文落库（enc:v1:iv:cipher）
解锁	主密钥仅存内存，页面刷新或手动锁定后需重新解锁；首次使用时设置主密码
表格	系统名称 / 账号 / 密码（掩码显示、显示切换、一键复制）/ 备注 / 操作；支持按名称、账号、备注搜索
其他	新增与编辑弹窗（必填校验、一键生成随机密码）、删除确认、修改主密码（全量重新加密）、5 分钟无操作自动锁定

3.9 全局搜索

顶栏搜索框（Ctrl+K 聚焦），覆盖工作记录（内容、收获、备注）与备忘录（标题、内容）。结果分组展示，点击跳转：工作记录定位到日历当月并打开当日抽屉，备忘录定位并选中。

3.10 数据导出与 AI 润色

CSV 导出：工作记录（日期、分类、项目、内容、耗时、成果、待跟进、收获、备注）与考勤（日期、星期、状态、上下班、地点、类型、说明），UTF-8 BOM，Excel 直接打开
报表支持复制到剪贴板
AI 润色：设置页配置 OpenAI 兼容接口（地址、API Key、模型名，仅存本机），总结页一键润色草稿，保留结构与事实数据，可一键还原润色前版本
考勤支持休假标记：标记后该日状态为请假并清空打卡时间，统计与总结含请假天数

3.11 用户系统与数据隔离

项	说明
数据隔离	每位用户独立一个 IndexedDB 数据库（intern_worklog_u_用户ID），工作日志、考勤、备忘录、密码库物理隔离；用户注册表为独立小库，仅存用户名与密码哈希
身份校验	登录密码经 PBKDF2-SHA256（150000 次迭代、随机盐）哈希后存储，系统不保存明文；会话存 sessionStorage，关闭标签页即退出
会话安全	30 分钟无操作自动退出；退出即断开数据库连接并清空内存密钥
账号管理	设置页可修改登录密码、删除用户（连同其全部数据，二次确认）
旧数据迁移	首次创建用户时可勾选迁移升级前单机数据，迁移仅复制、原库保留兜底

3.12 记账系统

项	说明
录入	支出/收入两类型；金额以「分」为整数存储避免浮点误差；日期、分类（支出：餐饮/交通/住房/通讯/学习/娱乐/其他；收入：工资/报销/其他，固定枚举）、备注
报销跟踪	支出可标记「需要报销」并跟踪待报销/已报销状态，面向出差垫付场景；汇总卡片显示待报销金额
汇总	按月展示收入、支出、结余、待报销四卡片；支出分类分布条形图
明细	月度流水表格，类型与报销状态筛选，支持弹窗编辑、删除确认、标记已报销

4. 数据模型（SQLite）

4.1 建表语句

-- 项目
CREATE TABLE project (
  id          INTEGER PRIMARY KEY AUTOINCREMENT,
  name        TEXT NOT NULL UNIQUE,
  archived    INTEGER NOT NULL DEFAULT 0,
  created_at  TEXT NOT NULL DEFAULT (datetime('now','localtime'))
);

-- 工作日志（以天为单位）
CREATE TABLE work_log (
  id          INTEGER PRIMARY KEY AUTOINCREMENT,
  date        TEXT NOT NULL UNIQUE,
  created_at  TEXT NOT NULL DEFAULT (datetime('now','localtime'))
);

-- 日志条目（随手记）
CREATE TABLE log_item (
  id             INTEGER PRIMARY KEY AUTOINCREMENT,
  work_log_id    INTEGER NOT NULL REFERENCES work_log(id) ON DELETE CASCADE,
  content        TEXT NOT NULL,
  project_id     INTEGER REFERENCES project(id) ON DELETE SET NULL,
  category       TEXT NOT NULL DEFAULT 'other',
  minutes        INTEGER,
  is_milestone   INTEGER NOT NULL DEFAULT 0,
  needs_followup INTEGER NOT NULL DEFAULT 0,
  takeaway       TEXT,
  remark         TEXT,
  sort_order     INTEGER NOT NULL DEFAULT 0,
  created_at     TEXT NOT NULL DEFAULT (datetime('now','localtime'))
);

-- 打卡
CREATE TABLE attendance (
  id           INTEGER PRIMARY KEY AUTOINCREMENT,
  date         TEXT NOT NULL UNIQUE,
  clock_in_at  TEXT,
  clock_out_at TEXT,
  kind         TEXT NOT NULL DEFAULT 'normal',
  note         TEXT,
  location     TEXT,
  created_at   TEXT NOT NULL DEFAULT (datetime('now','localtime'))
);

-- 周记
CREATE TABLE weekly_note (
  id          INTEGER PRIMARY KEY AUTOINCREMENT,
  week_start  TEXT NOT NULL UNIQUE,
  highlights  TEXT,
  challenges  TEXT,
  plan_next   TEXT,
  created_at  TEXT NOT NULL DEFAULT (datetime('now','localtime'))
);

-- 备忘录
CREATE TABLE memo (
  id          INTEGER PRIMARY KEY AUTOINCREMENT,
  title       TEXT NOT NULL,
  content     TEXT NOT NULL,
  created_at  TEXT NOT NULL,
  updated_at  TEXT NOT NULL
);

-- 账号密码（password 为 AES-256-GCM 密文，主密码派生密钥加密）
CREATE TABLE credential (
  id          INTEGER PRIMARY KEY AUTOINCREMENT,
  system      TEXT NOT NULL,
  account     TEXT NOT NULL,
  password    TEXT NOT NULL,
  remark      TEXT,
  created_at  TEXT NOT NULL,
  updated_at  TEXT NOT NULL
);

-- 记账流水（amount 单位为分）
CREATE TABLE transaction (
  id            INTEGER PRIMARY KEY AUTOINCREMENT,
  type          TEXT NOT NULL,
  category      TEXT NOT NULL,
  amount        INTEGER NOT NULL,
  date          TEXT NOT NULL,
  note          TEXT,
  reimbursable  INTEGER NOT NULL DEFAULT 0,
  reimbursed    INTEGER NOT NULL DEFAULT 0,
  created_at    TEXT NOT NULL
);

-- 设置
CREATE TABLE setting (
  key   TEXT PRIMARY KEY,
  value TEXT NOT NULL
);

CREATE INDEX idx_log_item_log    ON log_item(work_log_id);
CREATE INDEX idx_work_log_date   ON work_log(date);
CREATE INDEX idx_attendance_date ON attendance(date);

setting 预置键：work_start（09:00）、work_end（18:00）、grace_minutes（10）、lunch_minutes（60）、remind_weekly（friday/off）、last_project、last_category。

4.2 分类枚举（固定，不开放自定义标签）

dev 开发 / bugfix BUG修复 / test 测试 / learning 学习成长 / meeting 会议沟通 / doc 文档输出 / other 其他

4.3 考勤状态计算规则（运行时，不落库）

输入：attendance 记录 + setting 规则
1. 工作日无任何打卡              缺勤
2. 有上班、无下班                未完成
3. 上班时间晚于 上班时刻+宽限     迟到
4. 下班时间早于 下班时刻          早退
5. kind 为 makeup               按正常计，附加「补卡」标记
其余                             正常

4.4 约束要点

work_log.date、attendance.date、weekly_note.week_start 均 UNIQUE，保证一天一条
时间一律存 ISO 本地时间文本，展示层不做时区换算
log_item 通过外键级联删除，删天即清条目

5. 页面结构

整体布局：左侧 56px 图标导航，顶部 56px 工具栏（视图标题 + 打卡主按钮 + 周记提醒点），主内容区最大宽 1200px 居中。

+------+-------------------------------+
| 导航 | 工具栏：标题 · 打卡按钮 · 提醒  |
| 日历 +-------------------------------+
| 今日 |                               |
| 统计 |          主内容区              |
| 总结 |                               |
| 设置 |                               |
+------+-------------------------------+

视图	内容
日历（默认首页）	月历网格；点击日期开右侧当日抽屉：打卡时间线 + 条目列表 + 快速记录
今日	打卡状态卡 / 快速记录区 / 今日条目列表 / 自动小结（x 条 · y 小时）
统计	概览卡片行 / 记录热力图 / 分类与项目条形图
总结	范围选择 + 左侧草稿编辑 + 右侧数据摘要 + 导出 Markdown
设置	打卡规则 / 项目管理 / 周记提醒 / JSON 备份导入导出

6. 交互细节

打卡点击后按钮原地变为文字状态「已打卡 09:02」，无弹窗
快速记录回车提交，新条目插入列表顶部，150ms 透明度过渡
删除、备份覆盖导入等不可逆操作：统一确认弹窗，明确说明操作对象与不可恢复性
操作结果（打卡、保存、删除、导入等）以右上角轻提示统一反馈，2 秒自动消失
空状态：居中灰字「暂无记录」
备注中的 URL 自动识别为链接
历史列表按月分页加载

7. 视觉设计规范（高级白）

色彩：

--bg-page        #FFFFFF    页面底色
--bg-subtle      #F7F8FA    卡片内分区
--bg-hover       #F2F3F5    悬停态
--border         #EBEDF0    1px 分隔线
--border-strong  #DCDEE3    输入框描边
--text-1         #1D2129    主文本
--text-2         #4E5969    次要文本
--text-3         #86909C    辅助与占位
--accent         #3370FF    唯一强调色：主按钮、当前日期、链接
--accent-bg      #F0F5FF    选中态浅底
--ok             #23A757    出勤正常（状态点）
--warn           #E8842C    缺卡、待跟进（状态点）
--danger         #E5484D    缺勤（状态点）
--dot-empty      #C9CDD4    无记录（状态点）

排版：

font-family  -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif
字号  12 辅助 / 13 正文 / 14 小标题 / 20 页面标题
字重  400 正文 / 500 次强调 / 600 仅页面标题
数字  font-variant-numeric: tabular-nums，打卡时间与统计数字严格对齐

形状与层级：

圆角  6px 输入框与按钮 / 8px 卡片 / 12px 弹层
阴影  常态无阴影，靠 1px 边框分层；仅浮层 0 4px 16px rgba(29,33,41,0.08)
间距  4 的倍数（4/8/12/16/24）；内容区最大宽 1200px 居中
强调色面积小于 5%；不使用渐变与大面积色块
日历：白底 + 1px 细线网格，状态用 6px 圆点，不填色块

交互态：

hover：--bg-hover
选中：--accent-bg 浅底 + 文字 --accent
过渡：仅透明度与背景色，不超过 150ms

禁用清单：

界面文案纯文字，不出现表情与装饰符号
勾、叉、箭头、展开折叠等视觉指示一律 SVG
导出文档用文字标签「成果」「待跟进」，不用符号
数据层为纯文本，不依赖符号字符做逻辑判断

8. SVG 图标体系

绘制规则：

画布    viewBox 0 0 24 24
风格    线性描边，fill none
线宽    stroke-width 1.5
端点    linecap 与 linejoin 均 round
颜色    stroke currentColor，激活态由 CSS 切色

图标清单（14 个，覆盖全部界面）：

图标	用途	图标	用途
calendar	日历	flag	待跟进
clock	打卡	chart	统计
check-circle	完成	export	导出
edit	日志	chevron-left / chevron-right	月份切换
tag	项目分类	chevron-down	展开
star	成果	plus	新增
close	关闭	search	搜索（预留）

示例（定风格基调）：

<!-- calendar -->
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
  <rect x="4" y="5.5" width="16" height="14" rx="2"/>
  <path d="M8.5 3.5v3.5M15.5 3.5v3.5M4 10.5h16"/>
</svg>

<!-- clock -->
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
  <circle cx="12" cy="12" r="8.25"/>
  <path d="M12 7.75V12l2.75 1.75"/>
</svg>

<!-- check-circle -->
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
  <circle cx="12" cy="12" r="8.25"/>
  <path d="M8.5 12.4l2.4 2.4 4.6-5.2"/>
</svg>

<!-- star 成果 -->
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
  <path d="M12 4l2.5 5.1 5.6.8-4 3.9.9 5.6-5-2.7-5 2.7.9-5.6-4-3.9 5.6-.8L12 4z"/>
</svg>

<!-- flag 待跟进 -->
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
  <path d="M6.5 21V4"/>
  <path d="M6.5 4.5h10.8l-2.6 3.7 2.6 3.7H6.5"/>
</svg>

工程化：全部图标集中在 components/icons.ts，以常量字符串导出、内联渲染，不引入任何第三方图标库。

9. 技术方案

层	选型	理由
框架	Vue 3 + TypeScript + Vite	轻量、构建快、单页够用
存储 M1	Dexie.js（IndexedDB）	零部署、本地优先、打开即用
存储 M2	Tauri 2 + SQLite	日用稳定后桌面化，schema 不变仅换持久层
图标	自绘 SVG 内联	视觉完全自控
导出	前端生成 Markdown / JSON 下载	无后端依赖
应用化	PWA（清单 + Service Worker + 自绘图标）	Edge/Chrome 一键安装为独立窗口应用，离线可用，数据仍在浏览器本地
桌面安装包	Electron 33 + electron-builder（NSIS 安装包与免安装目录）	数据存储于用户目录（userData），不受浏览器影响，双击即用

路线：M1 纯前端交付；稳定后 Tauri 桌面化；团队版再加服务端与账号。

工程结构：

src/
  main.ts                 入口
  App.vue                 布局：导航 + 工具栏 + 路由视图
  router.ts               五个视图路由
  db/schema.ts            建表与迁移
  db/repo.ts              数据访问：attendance / log / weekly / project / setting
  domain/attendance.ts    考勤状态计算
  domain/report.ts        总结聚合与模板渲染
  components/calendar/    月历、格子、当日抽屉
  components/log/         快速记录、条目列表、行内编辑
  components/icons.ts     自绘 SVG 图标
  styles/tokens.css       设计令牌（第 7 节）

10. 备份与导出

JSON 全量备份：五表整包，含 schema 版本号，导入时校验版本
Markdown：总结草稿、单日记录
Excel 导出列入后续需求，M1 不做

11. 边界情况

场景	处理
凌晨下班	04:00 前的下班打卡归属前一日；之后仍无下班记「未完成」，次日补卡
重复打卡	已有上班打卡时按钮置灰并显示时间
补卡超期	仅允许近 30 天
历史修改	个人版信任模式，任意条目可编辑；补卡记录保留 makeup 标记
缺周记	总结对应周显示「无周记」占位文字，不影响其余聚合

12. 开发路线图

阶段	内容	预估
M1 MVP	打卡 + 月历 + 快速记录（项目/分类）+ 今日列表	1-2 天
M2	星标、旗标、备注、收获 + 周记 + 统计页	1-2 天
M3	总结生成 + Markdown 导出 + JSON 备份 + 设置页	1-2 天
M4 可选	AI 润色 / 提醒 / Tauri 桌面化 / 团队版	按需

13. 扩展预留（本期不做）

团队版（账号、导师只读、周报提交）、截图附件、系统级提醒、多端同步。

变更记录

v1.1：新增上班地点（attendance.location）：打卡、补卡可选填并记住上次选择；设置页支持常用地点预设；统计页与总结报告增加地点分布
v1.2：打卡时间支持行内直接修改（点击当日详情中的上班/下班时间即可编辑，可补录下班时间），修改后考勤状态运行时自动重算
v1.3：上班地点支持自定义输入并自动记忆：输入新地点保存后自动加入常用地点列表（可在设置中删减）
v1.4：企业级表单与确认规范——当日详情重构为分区结构（出勤信息、补卡登记、新增工作记录、记录列表），字段全部带标签、必填校验与错误提示；时间编辑采用显式确认/取消；删除与备份覆盖导入使用统一确认弹窗；操作结果统一轻提示反馈
v1.5：已有工作记录支持完整信息编辑——点击条目或编辑图标，屏幕中央弹窗编辑全部字段（内容、项目、分类、耗时、收获、备注、成果标记、待跟进），带必填校验与归档项目回显
v1.6：新增备忘录（双栏列表与编辑、未保存守卫）与加密密码库（主密码 PBKDF2 派生 AES-256-GCM，密码密文落库，解锁、锁定、搜索、一键复制、随机密码生成、修改主密码全量重加密）；备份兼容 v1 与 v2 格式
v1.7：全局搜索（Ctrl+K，跨工作记录与备忘录并跳转定位）；考勤支持休假标记并纳入统计与总结；工作记录与考勤 CSV 导出；总结草稿一键复制；AI 润色（OpenAI 兼容接口，本机保存配置，可还原）；密码库 5 分钟无操作自动锁定；日历格子悬停显示状态与地点
v1.7.1：考勤数据全视图实时同步——打卡、修改时间、补卡、休假、地点变更后，顶栏按钮、今日面板、日历抽屉、月历格子与统计页通过全局变更信号即时刷新，无需切换视图
v1.8：新增用户系统——每位用户独立 IndexedDB 数据库物理隔离数据；登录密码仅存 PBKDF2 哈希；会话存 sessionStorage 并支持 30 分钟无操作自动退出；设置页支持修改登录密码与删除用户；首次创建用户可一键迁移升级前单机数据（原库保留兜底）
v1.9：PWA 应用化——新增 Web 应用清单、Service Worker 离线缓存与自绘应用图标；在 Edge/Chrome 中可一键安装为独立窗口应用（桌面图标、开始菜单入口），离线可用，数据随浏览器配置文件存储
v1.10：Electron 桌面应用——pnpm dist 一键产出 NSIS 安装包与免安装目录；主进程加载本地构建产物，数据存于系统用户目录；窗口禁用菜单栏、外部链接交由系统浏览器打开
v1.11：新增记账系统——支出/收入录入（金额以分存储）、固定分类枚举、报销跟踪（待报销/已报销与待报销金额汇总）、月度汇总卡片与支出分类分布、月度流水筛选与弹窗编辑；备份格式升级至 v3 并向下兼容

22 KiB Raw Blame History Unescape Escape

实习工作日志系统 设计方案