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>

pets-fe/pages/plan/plan.js

@@ -2,27 +2,69 @@ const store = require('../../utils/store.js');
 const api = require('../../utils/api.js');
 const { toastErr } = require('../../utils/ui.js');
 
+function pad2(n) {
+  return n < 10 ? '0' + n : '' + n;
+}
+function ymd(d) {
+  return d.getFullYear() + '-' + pad2(d.getMonth() + 1) + '-' + pad2(d.getDate());
+}
 // "2026-07-04" → "7月4日"
 function fmtMD(date) {
-  if (!date) return '';
-  const p = date.split('-');
-  if (p.length < 3) return '';
-  return +p[1] + '月' + +p[2] + '日';
+  const p = (date || '').split('-');
+  return p.length < 3 ? '' : +p[1] + '月' + +p[2] + '日';
+}
+function parseYMD(s) {
+  const p = (s || '').split('-');
+  return p.length < 3 ? null : new Date(+p[0], +p[1] - 1, +p[2]);
+}
+
+// 计划覆盖的天数。内置模板会生成 day=30 的节点（第 31 天），所以是 31 格不是 30 格；
+// 按 30 画的话模板自己的最后一个节点在日历上没有格子——看得到、点不到。
+// 和后端 service/plan.go 的 planSpanDays 必须一致。
+const SPAN = 31;
+
+// 只画计划覆盖的这段，不画整月：整月会多出一堆空白格子、跨月还要翻页。
+// 按周对齐排 31 天，首尾补几个空格就够，一屏看完。
+function buildCells(startStr, byDate, todayStr) {
+  const start = parseYMD(startStr);
+  if (!start) return [];
+  const lead = (start.getDay() + 6) % 7; // 周一为一周起点
+  const cells = [];
+  for (let i = 0; i < lead; i++) cells.push({ blank: true });
+  for (let i = 0; i < SPAN; i++) {
+    const d = new Date(start.getFullYear(), start.getMonth(), start.getDate() + i);
+    const s = ymd(d);
+    cells.push({ day: d.getDate(), date: s, count: (byDate[s] || []).length, today: s === todayStr });
+  }
+  // 末尾补齐整周，否则最后一行格子宽度会被 grid 拉歪
+  while (cells.length % 7) cells.push({ blank: true });
+  return cells;
 }
 
 Page({
   data: {
     pet: {},
-    planView: 'timeline',
     plan: null,
+    doneCount: 0,
+    cells: [],
+    calRange: '',
+    planStart: '',
+    planEnd: '',
+    selDate: '',
+    selLabel: '',
+    dayTasks: [],
+    allOpen: false,
+    editShow: false,
+    editId: '',
+    form: { title: '', date: '', description: '' },
+    saving: false,
     sheetShow: false,
     sheetType: '',
   },
   onLoad() {
     this._unsub = store.subscribe((pet) => {
       this.setData({ pet });
-      if (!this._inited) return; // 首次由 onShow 加载
-      this.loadTimeline();
+      if (this._inited) this.load();
     });
   },
   onUnload() {
@@ -34,30 +76,138 @@ Page({
       .then(() => {
         this._inited = true;
         this.setData({ pet: store.getPet() });
-        this.loadTimeline();
+        this.load();
       })
-      .catch((e) => wx.showToast({ title: e.message || '加载失败', icon: 'none' }));
+      .catch((e) => toastErr(e));
   },
-  loadTimeline() {
+  load() {
     const id = store.currentPetId();
     if (!id) return;
     api
       .getPlan(id)
-      .then((plan) => {
-        if (plan && plan.tasks) {
-          plan.tasks = plan.tasks.map((t) => ({ ...t, dateLabel: fmtMD(t.date) }));
-        }
-        this.setData({ plan });
+      .then((plan) => this.apply(plan))
+      .catch(() => this.setData({ plan: null, cells: [], dayTasks: [] }));
+  },
+  apply(plan) {
+    const tasks = (plan.tasks || []).map((t) => ({ ...t, dateLabel: fmtMD(t.date) }));
+    const byDate = {};
+    tasks.forEach((t) => {
+      if (!t.date) return;
+      (byDate[t.date] = byDate[t.date] || []).push(t);
+    });
+    const start = (plan.start_date || '').slice(0, 10);
+    const end = start ? ymd(new Date(parseYMD(start).getTime() + (SPAN - 1) * 86400000)) : '';
+    const todayStr = ymd(new Date());
+    this._byDate = byDate;
+
+    // 默认选今天；今天不在计划范围内（计划早就过期了）就选开始那天
+    const sel = byDate[todayStr] !== undefined || (todayStr >= start && todayStr <= end) ? todayStr : start;
+    this.setData({
+      plan: { ...plan, tasks },
+      doneCount: tasks.filter((t) => t.done).length,
+      cells: buildCells(start, byDate, todayStr),
+      calRange: start ? fmtMD(start) + ' — ' + fmtMD(end) : '',
+      planStart: start,
+      planEnd: end,
+    });
+    this.selectDay(sel, todayStr);
+  },
+  selectDay(date, todayStr) {
+    const t = todayStr || ymd(new Date());
+    this.setData({
+      selDate: date,
+      selLabel: date === t ? '今天的安排' : fmtMD(date) + '的安排',
+      dayTasks: (this._byDate || {})[date] || [],
+    });
+  },
+  onTapDay(e) {
+    const d = e.currentTarget.dataset.date;
+    if (d) this.selectDay(d);
+  },
+  backToToday() {
+    const t = ymd(new Date());
+    // 今天不在这 30 天里就退回开始日，否则选中一个日历上不存在的格子
+    this.selectDay(t >= this.data.planStart && t <= this.data.planEnd ? t : this.data.planStart);
+  },
+  toggleAll() {
+    this.setData({ allOpen: !this.data.allOpen });
+  },
+  toggleTask(e) {
+    api
+      .togglePlanTask(e.currentTarget.dataset.id)
+      .then(() => this.load())
+      .catch((err) => toastErr(err, '操作失败'));
+  },
+
+  // ── 加 / 改 ──
+  openAdd() {
+    this.setData({
+      editShow: true, editId: '',
+      form: { title: '', date: this.data.selDate || this.data.planStart, description: '' },
+    });
+  },
+  openEdit(e) {
+    const t = (this.data.dayTasks || []).find((x) => x.id === e.currentTarget.dataset.id);
+    if (!t) return;
+    this.setData({
+      editShow: true, editId: t.id,
+      form: { title: t.title, date: t.date || this.data.selDate, description: t.description || '' },
+    });
+  },
+  closeEdit() {
+    this.setData({ editShow: false });
+  },
+  noop() {},
+  onFormTitle(e) {
+    this.setData({ 'form.title': e.detail.value });
+  },
+  onFormDate(e) {
+    this.setData({ 'form.date': e.detail.value });
+  },
+  onFormDesc(e) {
+    this.setData({ 'form.description': e.detail.value });
+  },
+  onSubmit() {
+    if (this.data.saving) return;
+    const f = this.data.form;
+    if (!(f.title || '').trim()) return wx.showToast({ title: '写一下做什么', icon: 'none' });
+    const id = store.currentPetId();
+    if (!id) return;
+    this.setData({ saving: true });
+    const req = this.data.editId
+      ? api.updatePlanTask(this.data.editId, f)
+      : api.addPlanTask(id, f);
+    req
+      .then(() => {
+        this.setData({ saving: false, editShow: false });
+        // 加完/改完要跳到那一天，不然用户改了日期却看不到东西去哪了
+        this._pendingSel = f.date;
+        this.load();
       })
-      .catch(() => this.setData({ plan: null }));
+      .catch((e) => {
+        this.setData({ saving: false });
+        toastErr(e, '保存失败');
+      });
   },
-  toggleTimelineTask(e) {
-    const id = e.currentTarget.dataset.id;
-    api.togglePlanTask(id).then(() => this.loadTimeline()).catch((e) => toastErr(e, '操作失败'));
+  onDelete(e) {
+    const { id, title } = e.currentTarget.dataset;
+    wx.showModal({
+      title: '删掉这件事？',
+      content: title || '',
+      confirmColor: '#EE7D73',
+      success: (r) => {
+        if (!r.confirm) return;
+        api
+          .deletePlanTask(id)
+          .then(() => this.load())
+          .catch((err) => toastErr(err, '删除失败'));
+      },
+    });
   },
+
   openSheet(e) {
     const type = e.currentTarget.dataset.type;
-    if (!type) return; // 无关联动作的计划项只可勾选，不弹层
+    if (!type) return;
     this.setData({ sheetType: type, sheetShow: true });
   },
   closeSheet() {

pets-fe/pages/plan/plan.wxml

@@ -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>

pets-fe/pages/plan/plan.wxss

@@ -28,3 +28,18 @@
 .extracted{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin:var(--sp-4) 0}
 .extract{background:var(--surface-2);border-radius:var(--r-sm);padding:var(--sp-3);font-size:var(--fs-sm)}
 .ex-b{display:block;font-size:var(--fs-sm);margin-bottom:6rpx;font-weight:var(--fw-b);color:var(--muted)}
+
+/* 计划节点右侧的删除键。计划是用户自己排的，就得能删 */
+.pk-del{flex:none;padding:0 var(--sp-1);color:var(--muted2);display:flex;align-items:center}
+
+/* 加/改计划的浮层。字段只有三个，再开一页太重 */
+.pe-mask{
+  position:fixed;inset:0;z-index:200;background:rgba(45,41,37,.45);
+  display:flex;align-items:flex-end;
+}
+.pe-sheet{
+  width:100%;background:var(--bg2);border-radius:var(--r-lg) var(--r-lg) 0 0;
+  padding:var(--sp-5) var(--pad-x) calc(var(--sp-5) + env(safe-area-inset-bottom));
+  box-shadow:var(--sd-3);max-height:82vh;overflow-y:auto;
+}
+.pe-h{font-size:var(--fs-lg);font-weight:var(--fw-b);margin-bottom:var(--sp-4);text-align:center}