青叶的记账本

01.解决的问题

• 记账工具大多依赖云端账号，个人只想快速记录收支、看清消费趋势，不想注册登录
• 微信小程序里做纯本地存储的记账应用，要跨过 Skyline 新渲染引擎的大量兼容坑
• 期望一个「零后端、零云依赖、数据不离开手机」的个人账本

02.核心功能

• 明细首页：深色结余卡片（本月结余 / 总结余）+ 四宫格快捷入口 + 按日期分组的账单列表
• 记一笔 / 修改：金额 + 4×2 分类网格 + 自定义数字键盘；长按记录可修改、删除
• 统计页：趋势面积图（近一年按月聚合）+ 分类环形饼图 + 支出排行，支持 5 种时间范围筛选
• 分类管理：预设 11 个分类 + 自定义分类（30 个 Emoji 图标 × 12 色）
• 导出：账单导出 CSV（UTF-8 BOM，兼容 Excel / WPS），支持微信直接分享

03.技术栈

• 渲染引擎：微信 Skyline（新一代高性能引擎，类 Flutter 线程模型）
• 组件框架：Glass-Easel，全部页面以 Component() 定义
• 语言：TypeScript，编译目标 ES5
• 图表：Skyline 2D Canvas API 手绘面积图与环形饼图
• 存储：wx.Storage 本地持久化，JSON 序列化

04.版本迭代

• v1.0.0：暖橙改版、自定义导航栏、修复白屏问题
• v1.0.1：分类输入修复、账单列表 30 条上限
• v1.0.2：记录类型标签、内联新增分类
• v1.0.3：结余卡片增加总结余、统计按月聚合重写
• v1.0.4：长按修改 / 删除、记账页双模式、确认弹窗

05.难点与成果

• 累计解决 15+ 个 Skyline / Glass-Easel 兼容问题（box-shadow、translateX、gap、Canvas 真机预览等均有替代方案）
• 5 次功能迭代全部保留更新日志；纯本地运行，无需后端服务器