feat: 首页改成记录时间轴,计划可自己管,花销独立成页

## 首页
原来是任务卡 + 日期带/日历 + 接下来 + AI建议 + 快速记录 + 新手内容的堆叠,
六张聚合卡,唯独看不到「我记了什么」。改成:

  宠物名片(品种·年龄·星座 + 性别徽章叠头像 + 一起生活的第 N 天)
  两个入口(管理计划 / 记花销)
  今日任务(有才显示)
  记录时间轴 —— 竖线 + 圆点 + 卡片,往下翻,长按删

日历挪回计划页了:它本来就属于那儿。Phase B 当时把它并进首页是因为计划还是
个 tab;现在计划是二级页,日历跟着回去更合理。

情绪点那几样字段后端早就返回了,只是没人用。抽了 utils/petmeta.js:
星座七个边界(含 12/22 跨年那个)+ 天数(到家日优先于建档日,
「一起生活」说的是它到你家之后的日子)+ 性别徽章,都在 node 里跑过。

顺带 stat-ring 组件和 homeSummary 接口现在没人用了,先留着没删。

## 两个入口取代竞品那一排
竞品是买商品/上豪车/记花销/领猫砂盆——除了记花销全是电商和广告位。
副标题给了真信息:「还有 5 件没做」「本月 ¥128」,不然就是两个没信息量的图标。

## 计划页:用户自己能管了
后端原来只有 toggle,节点全靠内置模板生成,用户加不了自己的事。补了

  POST   /api/pets/:id/plan-tasks
  PUT    /api/plan-tasks/:id
  DELETE /api/plan-tasks/:id

三件事值得说:

**30 天边界硬拦在服务端**(dayOffset)。只在前端拦的话,改个请求就能塞一条
第 200 天的节点,日历上没有那格、它就永远不显示也删不掉。

**归属校验单独抽了 ownedPlanTask**。PUT/DELETE /plan-tasks/:id 这种按资源 id
的路由最容易漏——不校验的话拿到别人的 task id 就能改删别人的计划。验过:
别人的 token 改和删都返回「无权操作」。

**边界差一天,是验证时撞出来的**:内置模板生成到 day=30(第 31 天),
我一开始按 0-29 卡,结果模板自己的最后一个节点(生成月度报告)落在窗口外——
日历上没有那一格,用户看得到却改不动也删不掉。前后端都改成 [0,30],
两边各留了一句注释指向对方,别再单方面改。

日历只画计划覆盖的 31 天,不画整月:整月会多出一堆空白格子、跨月还要翻页。

## 花销独立成页
写的是同一张表(type='cost',金额进 num_value、类别进 category),
报告页的账单聚合照样认——独立页的价值在专门的录入体验和当页就有月度汇总,
不是另存一份数据。

类别预置读 record_types 里 cost 的字段配置,后台改一处这页和 addrecord
同时生效,不会出现两套类别把账单切开。另外允许自定义类别,验过「寄养」
(不在预置里)能落库、账单也认。

## 检查器又抓到一次跨页借用
我在计划页复用了花销页的 ex-ph(placeholder 类),检查器直接报了位置。
顺手把三个页面的私有 placeholder 类统一到 app.wxss 已有的 .placeholder。
cal-* 现在首页没有了、计划页在用,也提到了 app.wxss。

## 验证(预生产库实跑)
  计划 CRUD    加/改/删 全过;空标题拒;越权改删拒
  30 天边界     day=30 通过、day=31 拒、day=-1 拒
  模板 day=30   现在能原地改了(修边界前会被自己的规则拒掉)
  首页时间轴    8 条记录按 occurred_at 倒序,type/tone/图标都取到
  两个入口副标题 「还有 5 件没做」「本月 ¥128」
  花销自定义类别 「寄养」落库,账单分类变成 [(医疗,128),(寄养,60)]
  petmeta      星座 7 个边界 + 天数 3 种情况,node 单测全过

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Blizzard
2026-07-30 10:43:08 +08:00
parent 3ea50efb7d
commit 15b52eebd0
20 changed files with 998 additions and 428 deletions
+76 -13
View File
@@ -3,7 +3,7 @@
<view class="top-bar"><pet-switch bind:add="onAddPet"></pet-switch></view>
<scroll-view class="page-scroll" scroll-y="{{true}}" enhanced="{{true}}" show-scrollbar="{{false}}">
<view class="page-body no-fab">
<view class="page-body">
<view wx:if="{{!pet.id}}" class="no-pet">
<view class="no-pet-ic"><pt-icon name="community" size="{{52}}"></pt-icon></view>
<view class="no-pet-b">还没有毛孩子的档案</view>
@@ -11,8 +11,7 @@
<view class="btn btn-dark" bindtap="onAddPet"><pt-icon name="plus" size="{{30}}"></pt-icon>建一份档案</view>
</view>
<!-- 路线图 -->
<view wx:if="{{planView === 'timeline'}}">
<block wx:else>
<view class="card">
<view class="section-head">
<view class="sh-title">{{pet.name}}的 30 天计划</view>
@@ -21,21 +20,85 @@
<view class="progress-row"><text>完成度</text><text>{{plan.completion_pct || 0}}%</text></view>
<view class="bar"><view class="bar-fill" style="width:{{plan.completion_pct || 0}}%"></view></view>
</view>
<view class="timeline">
<view wx:for="{{plan.tasks}}" wx:key="id" class="time-block">
<view class="time-label">{{item.day_label}}<text wx:if="{{item.dateLabel}}" class="time-date">{{item.dateLabel}}</text></view>
<view class="plan-task {{item.done ? 'done' : ''}}">
<view class="pk-check" catchtap="toggleTimelineTask" data-id="{{item.id}}"><pt-icon wx:if="{{item.done}}" name="check" size="{{22}}"></pt-icon></view>
<view class="pk-body" data-type="{{item.sheet_type}}" bindtap="openSheet">
<text class="pk-b">{{item.title}}</text><view class="pk-p">{{item.description}}</view>
</view>
<!-- 日历:只画计划覆盖的这 30 天。有安排的日子带点,点一天下面就列那天的事。
整月网格会画出一半空白格子——计划本来就只有 30 天,按周排比按月排更贴合 -->
<view class="card">
<view class="section-head">
<view class="sh-title">{{calRange}}</view>
<view class="link" bindtap="backToToday">回今天</view>
</view>
<view class="cal-grid">
<text class="cal-w">一</text><text class="cal-w">二</text><text class="cal-w">三</text><text class="cal-w">四</text><text class="cal-w">五</text><text class="cal-w">六</text><text class="cal-w">日</text>
<view wx:for="{{cells}}" wx:key="index"
class="cal-cell {{item.blank ? 'blank' : ''}} {{item.today ? 'today' : ''}} {{item.count ? 'tasked' : ''}} {{item.date === selDate ? 'sel' : ''}}"
data-date="{{item.date}}" bindtap="onTapDay">{{item.day || ''}}</view>
</view>
</view>
<!-- 选中那天的安排 -->
<view class="card">
<view class="section-head">
<view class="sh-title">{{selLabel}}</view>
<view class="link" bindtap="openAdd"> 加一件</view>
</view>
<view wx:for="{{dayTasks}}" wx:key="id" class="plan-task {{item.done ? 'done' : ''}}">
<view class="pk-check" catchtap="toggleTask" data-id="{{item.id}}">
<pt-icon wx:if="{{item.done}}" name="check" size="{{22}}"></pt-icon>
</view>
<view class="pk-body" data-id="{{item.id}}" bindtap="openEdit">
<text class="pk-b">{{item.title}}</text>
<view wx:if="{{item.description}}" class="pk-p">{{item.description}}</view>
</view>
<view class="pk-del" catchtap="onDelete" data-id="{{item.id}}" data-title="{{item.title}}">
<pt-icon name="trash" size="{{28}}"></pt-icon>
</view>
</view>
<view wx:if="{{!plan}}" class="empty">暂无计划</view>
<view wx:if="{{!dayTasks.length}}" class="empty">这天还没有安排,点右上角加一件</view>
</view>
</view>
<!-- 全部 30 天的路线图,折叠着 -->
<view class="card">
<view class="section-head">
<view class="sh-title">完整路线图</view>
<view class="link" bindtap="toggleAll">{{allOpen ? '收起' : '展开全部'}}</view>
</view>
<block wx:if="{{allOpen}}">
<view wx:for="{{plan.tasks}}" wx:key="id" class="time-block">
<view class="time-label">{{item.day_label}}<text wx:if="{{item.dateLabel}}" class="time-date">{{item.dateLabel}}</text></view>
<view class="plan-task {{item.done ? 'done' : ''}}">
<view class="pk-check" catchtap="toggleTask" data-id="{{item.id}}">
<pt-icon wx:if="{{item.done}}" name="check" size="{{22}}"></pt-icon>
</view>
<view class="pk-body"><text class="pk-b">{{item.title}}</text><view class="pk-p">{{item.description}}</view></view>
</view>
</view>
<view wx:if="{{!plan.tasks.length}}" class="empty">暂无计划</view>
</block>
<view wx:else class="tiny">共 {{plan.tasks.length || 0}} 件事,已完成 {{doneCount}} 件</view>
</view>
</block>
</view>
</scroll-view>
<!-- 加/改一条计划。字段少,用弹层比再开一页合适 -->
<view wx:if="{{editShow}}" class="pe-mask" bindtap="closeEdit">
<view class="pe-sheet" catchtap="noop">
<view class="pe-h">{{editId ? '改这件事' : '加一件事'}}</view>
<view class="field"><label>做什么</label>
<input class="input" placeholder="比如 带去打第二针" placeholder-class="placeholder"
value="{{form.title}}" bindinput="onFormTitle"/></view>
<view class="field"><label>哪天</label>
<picker mode="date" value="{{form.date}}" start="{{planStart}}" end="{{planEnd}}" bindchange="onFormDate">
<view class="picker-box">{{form.date}}</view>
</picker>
<view class="tiny">只能安排 {{planStart}} 到 {{planEnd}} 之间</view>
</view>
<view class="field"><label>备注</label>
<textarea class="textarea" placeholder="可不填" placeholder-class="placeholder"
value="{{form.description}}" bindinput="onFormDesc"></textarea></view>
<view class="btn btn-primary btn-block" bindtap="onSubmit">{{saving ? '保存中…' : '保存'}}</view>
</view>
</view>
<bottom-sheet show="{{sheetShow}}" type="{{sheetType}}" bind:close="closeSheet"></bottom-sheet>