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/addrecord/addrecord.wxml

@@ -25,14 +25,14 @@
       <!-- 数值 -->
       <view wx:if="{{item.kind === 'number'}}" class="ar-row {{index === fields.length - 1 ? 'ar-last' : ''}}">
         <text class="ar-k">{{item.label}}</text>
-        <input class="ar-in" type="digit" placeholder="填写{{item.label}}" placeholder-class="ar-ph"
+        <input class="ar-in" type="digit" placeholder="填写{{item.label}}" placeholder-class="placeholder"
                value="{{values[index]}}" data-index="{{index}}" bindinput="onField"/>
         <text wx:if="{{item.unit}}" class="ar-unit">{{item.unit}}</text>
       </view>
       <!-- 文本 -->
       <view wx:elif="{{item.kind === 'text'}}" class="ar-row {{index === fields.length - 1 ? 'ar-last' : ''}}">
         <text class="ar-k">{{item.label}}</text>
-        <input class="ar-in" placeholder="填写{{item.label}}" placeholder-class="ar-ph"
+        <input class="ar-in" placeholder="填写{{item.label}}" placeholder-class="placeholder"
                value="{{values[index]}}" data-index="{{index}}" bindinput="onField"/>
       </view>
       <!-- 单选 -->
@@ -49,7 +49,7 @@
 
   <view class="card ar-card">
     <view class="ar-h">描述</view>
-    <textarea class="ar-ta" placeholder="请输入你想要记的内容～" placeholder-class="ar-ph"
+    <textarea class="ar-ta" placeholder="请输入你想要记的内容～" placeholder-class="placeholder"
               value="{{note}}" maxlength="500" bindinput="onNote"></textarea>
     <view class="ar-media">
       <view wx:for="{{images}}" wx:key="id" class="ar-thumb">

pets-fe/pages/addrecord/addrecord.wxss

@@ -10,7 +10,6 @@
 .ar-k{flex:none;font-size:var(--fs-md);font-weight:var(--fw-b);color:var(--text)}
 .ar-v{flex:1;text-align:right;font-size:var(--fs-md);color:var(--text-2)}
 .ar-in{flex:1;text-align:right;font-size:var(--fs-md);color:var(--text)}
-.ar-ph{color:var(--muted2)}
 .ar-unit{flex:none;font-size:var(--fs-sm);color:var(--muted)}
 
 /* 单选独占一段：选项多的时候挤在一行右侧会换行成一团 */

pets-fe/pages/expense/expense.js

@@ -0,0 +1,158 @@
+const store = require('../../utils/store.js');
+const api = require('../../utils/api.js');
+const recordTypes = require('../../utils/recordTypes.js');
+const { toastErr } = require('../../utils/ui.js');
+
+function pad2(n) {
+  return n < 10 ? '0' + n : '' + n;
+}
+function today() {
+  const d = new Date();
+  return d.getFullYear() + '-' + pad2(d.getMonth() + 1) + '-' + pad2(d.getDate());
+}
+// 同 addrecord：后端用 time.Parse(time.RFC3339) 解 occurred_at，只给日期解不出来会
+// 静默回退成 now；时区要带真实偏移，转 UTC 的 Z 形式落库会把边界日期挪一天
+function dayToISO(day) {
+  if (!day) return '';
+  const off = -new Date().getTimezoneOffset();
+  const sign = off >= 0 ? '+' : '-';
+  const a = Math.abs(off);
+  return day + 'T12:00:00' + sign + pad2(Math.floor(a / 60)) + ':' + pad2(a % 60);
+}
+function fmtDay(iso) {
+  if (!iso) return '';
+  const d = new Date(iso);
+  return d.getMonth() + 1 + '月' + d.getDate() + '日';
+}
+
+const PAGE = 50;
+
+Page({
+  data: {
+    bill: {},
+    cats: [],
+    cat: '',
+    customOn: false,
+    customCat: '',
+    amount: '',
+    date: '',
+    note: '',
+    list: [],
+    saving: false,
+  },
+  onLoad() {
+    this.setData({ date: today() });
+    store
+      .ready()
+      .then(() => recordTypes.load())
+      .then(() => this.loadCats())
+      .catch((e) => toastErr(e));
+  },
+  onShow() {
+    if (this._inited) this.reload();
+    this._inited = true;
+  },
+  onReady() {
+    this.reload();
+  },
+  // 类别预置读 record_types 里 cost 的字段配置——后台改一处，
+  // 这页和 addrecord 同时生效，不会出现两套类别把账单统计切开
+  loadCats() {
+    const t = recordTypes.get('cost');
+    const opt = ((t && t.fields) || []).find((f) => f.kind === 'options');
+    this.setData({ cats: (opt && opt.options) || [] });
+  },
+  reload() {
+    const id = store.currentPetId();
+    if (!id) return;
+    api
+      .getBill(id, 'month')
+      .then((bill) => this.setData({ bill: bill || {} }))
+      .catch(() => {});
+    api
+      .getRecords(id, { type: 'cost', page: 1, pageSize: PAGE })
+      .then((res) => {
+        const now = new Date();
+        const list = (res.list || [])
+          // 只显示本月：接口按时间倒序返回，这里前端切一刀，
+          // 不为了「本月」再加一个后端参数
+          .filter((r) => {
+            const d = new Date(r.occurred_at);
+            return d.getFullYear() === now.getFullYear() && d.getMonth() === now.getMonth();
+          })
+          .map((r) => ({ ...r, timeText: fmtDay(r.occurred_at) }));
+        this.setData({ list });
+      })
+      .catch(() => {});
+  },
+  onAmount(e) {
+    this.setData({ amount: e.detail.value });
+  },
+  onPickCat(e) {
+    const v = e.currentTarget.dataset.val;
+    this.setData({ cat: this.data.cat === v ? '' : v, customOn: false, customCat: '' });
+  },
+  toggleCustom() {
+    const on = !this.data.customOn;
+    this.setData({ customOn: on, cat: on ? '' : this.data.cat });
+  },
+  onCustomCat(e) {
+    this.setData({ customCat: e.detail.value });
+  },
+  onDate(e) {
+    this.setData({ date: e.detail.value });
+  },
+  onNote(e) {
+    this.setData({ note: e.detail.value });
+  },
+  onSave() {
+    if (this.data.saving) return;
+    const id = store.currentPetId();
+    if (!id) return wx.showToast({ title: '先建一份宠物档案', icon: 'none' });
+    const amt = parseFloat(this.data.amount);
+    if (!(amt > 0)) return wx.showToast({ title: '填一个金额', icon: 'none' });
+    const cat = (this.data.customOn ? this.data.customCat : this.data.cat).trim();
+    if (!cat) return wx.showToast({ title: '选一个类别', icon: 'none' });
+
+    this.setData({ saving: true });
+    // 落的是 type='cost' 的普通记录：金额进 num_value、类别进 category，
+    // 和 addrecord 走同一条路，报告页的账单聚合照样认
+    api
+      .createRecord(id, {
+        type: 'cost',
+        title: '记账：' + amt + '元 ' + cat,
+        num_value: amt,
+        category: cat,
+        description: (this.data.note || '').trim(),
+        occurred_at: dayToISO(this.data.date),
+      })
+      .then(() => {
+        this.setData({ saving: false, amount: '', note: '', customCat: '', customOn: false, cat: '' });
+        wx.showToast({ title: '已记下', icon: 'success' });
+        this.reload();
+      })
+      .catch((e) => {
+        this.setData({ saving: false });
+        toastErr(e, '保存失败');
+      });
+  },
+  // 长按删除。流水里记错一笔很常见，不给删的话账单就一直是错的
+  onDelete(e) {
+    const id = e.currentTarget.dataset.id;
+    wx.showModal({
+      title: '删掉这笔？',
+      content: '删了账单统计会跟着变。',
+      confirmColor: '#EE7D73',
+      success: (r) => {
+        if (!r.confirm) return;
+        api
+          .deleteRecord(id)
+          .then(() => this.reload())
+          .catch((err) => toastErr(err, '删除失败'));
+      },
+    });
+  },
+  onShareAppMessage() {
+    return { title: '养宠一个月花了多少？', path: '/pages/expense/expense' };
+  },
+});

pets-fe/pages/expense/expense.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "nav-bar": "/components/nav-bar/nav-bar",
+    "pt-icon": "/components/pt-icon/index"
+  }
+}

pets-fe/pages/expense/expense.wxml

@@ -0,0 +1,71 @@
+<nav-bar title="养宠花销" show-back="{{true}}"></nav-bar>
+
+<scroll-view class="page-scroll" scroll-y="{{true}}" enhanced="{{true}}" show-scrollbar="{{false}}">
+<view class="page-body ex-body">
+  <!-- 本月合计 + 分类占比。走 /bill 接口，和报告页的账单是同一份数据 -->
+  <view class="card ex-sum">
+    <view class="ex-sum-k">{{bill.period || '本月'}}花销</view>
+    <view class="ex-sum-n">¥{{bill.total || 0}}</view>
+    <view wx:if="{{bill.max_single}}" class="ex-sum-s">单笔最高 ¥{{bill.max_single}}</view>
+    <view wx:if="{{bill.categories.length}}" class="ex-cats">
+      <view wx:for="{{bill.categories}}" wx:key="category" class="ex-cat">
+        <view class="ex-cat-top"><text>{{item.category}}</text><text>¥{{item.amount}}</text></view>
+        <view class="bar"><view class="bar-fill" style="width:{{item.percent}}%"></view></view>
+      </view>
+    </view>
+    <view wx:else class="empty">这个月还没记过花销</view>
+  </view>
+
+  <!-- 记一笔 -->
+  <view class="card">
+    <view class="section-head"><view class="sh-title">记一笔</view></view>
+
+    <view class="ex-amt">
+      <text class="ex-cur">¥</text>
+      <input class="ex-in" type="digit" placeholder="0.00" placeholder-class="placeholder"
+             value="{{amount}}" bindinput="onAmount"/>
+    </view>
+
+    <view class="ex-label">类别</view>
+    <view class="ex-chips">
+      <view wx:for="{{cats}}" wx:key="*this"
+            class="ex-chip {{cat === item ? 'on' : ''}}" data-val="{{item}}" bindtap="onPickCat">{{item}}</view>
+      <!-- 自定义类别：预置那几个盖不住所有花法（寄养、驱虫药、玩具…） -->
+      <view class="ex-chip ex-chip-add {{customOn ? 'on' : ''}}" bindtap="toggleCustom">
+        <pt-icon name="plus" size="{{22}}"></pt-icon>自定义
+      </view>
+    </view>
+    <input wx:if="{{customOn}}" class="input ex-custom" placeholder="填一个类别名，比如 寄养"
+           placeholder-class="placeholder" value="{{customCat}}" bindinput="onCustomCat"/>
+
+    <view class="ex-label">日期</view>
+    <picker mode="date" value="{{date}}" bindchange="onDate">
+      <view class="picker-box">{{date}}</view>
+    </picker>
+
+    <view class="ex-label">备注</view>
+    <input class="input" placeholder="买了什么、在哪买的" placeholder-class="placeholder"
+           value="{{note}}" bindinput="onNote"/>
+
+    <view class="btn btn-primary btn-block ex-save {{saving ? 'ex-busy' : ''}}" bindtap="onSave">
+      {{saving ? '保存中…' : '记下这笔'}}
+    </view>
+  </view>
+
+  <!-- 本月流水 -->
+  <view class="card">
+    <view class="section-head">
+      <view class="sh-title">本月流水</view>
+      <view wx:if="{{list.length}}" class="tiny">{{list.length}} 笔</view>
+    </view>
+    <view wx:for="{{list}}" wx:key="id" class="ex-row" data-id="{{item.id}}" bindlongpress="onDelete">
+      <view class="ex-row-main">
+        <view class="tt-b">{{item.category || '未分类'}}</view>
+        <view class="tt-p">{{item.timeText}}{{item.description ? '｜' + item.description : ''}}</view>
+      </view>
+      <view class="ex-row-amt">¥{{item.num_value}}</view>
+    </view>
+    <view wx:if="{{!list.length}}" class="empty">还没有流水。长按某笔可以删除。</view>
+  </view>
+</view>
+</scroll-view>

pets-fe/pages/expense/expense.wxss

@@ -0,0 +1,34 @@
+.ex-body{padding-bottom:var(--pad-b-plain)}
+
+/* 合计卡：数字要够大，这页第一眼就该看到花了多少 */
+.ex-sum{text-align:center}
+.ex-sum-k{font-size:var(--fs-sm);color:var(--muted)}
+.ex-sum-n{font-size:72rpx;font-weight:var(--fw-b);color:var(--text);line-height:1.2;margin:var(--sp-1) 0}
+.ex-sum-s{font-size:var(--fs-cap);color:var(--muted2)}
+.ex-cats{margin-top:var(--sp-5);text-align:left}
+.ex-cat{margin-bottom:var(--sp-3)}
+.ex-cat:last-child{margin-bottom:0}
+.ex-cat-top{display:flex;justify-content:space-between;font-size:var(--fs-sm);color:var(--text-2);margin-bottom:6rpx}
+
+/* 金额输入做大，和键盘上的数字对得上 */
+.ex-amt{display:flex;align-items:baseline;gap:var(--sp-2);padding:var(--sp-4) 0 var(--sp-2);border-bottom:2rpx solid var(--primary-line)}
+.ex-cur{font-size:var(--fs-xl);font-weight:var(--fw-b);color:var(--primary-dark)}
+.ex-in{flex:1;font-size:64rpx;font-weight:var(--fw-b);color:var(--text);height:84rpx}
+
+.ex-label{font-size:var(--fs-sm);color:var(--muted);margin:var(--sp-4) 0 var(--sp-2)}
+.ex-chips{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
+.ex-chip{
+  padding:var(--sp-2) var(--sp-4);border-radius:var(--r-full);
+  background:var(--surface-2);border:1rpx solid var(--line);
+  font-size:var(--fs-sm);color:var(--text-2);
+}
+.ex-chip.on{background:var(--primary-soft);border-color:var(--primary);color:var(--primary-ink);font-weight:var(--fw-b)}
+.ex-chip-add{display:inline-flex;align-items:center;gap:4rpx}
+.ex-custom{margin-top:var(--sp-3)}
+.ex-save{margin-top:var(--sp-5)}
+.ex-busy{opacity:.6}
+
+.ex-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1rpx solid var(--line)}
+.ex-row:last-of-type{border-bottom:0}
+.ex-row-main{flex:1;min-width:0}
+.ex-row-amt{flex:none;font-size:var(--fs-lg);font-weight:var(--fw-b);color:var(--text)}

pets-fe/pages/home/home.js

@@ -3,104 +3,47 @@ const api = require('../../utils/api.js');
 const { toastErr } = require('../../utils/ui.js');
 const { syncTabBar } = require('../../utils/tabbar.js');
 const recordTypes = require('../../utils/recordTypes.js');
-
-function todayStr() {
-  const d = new Date();
-  const p = (n) => (n < 10 ? '0' + n : '' + n);
-  return d.getFullYear() + '-' + p(d.getMonth() + 1) + '-' + p(d.getDate());
-}
-
-function pad2(n) {
-  return n < 10 ? '0' + n : '' + n;
-}
-
-// 整月网格。周一为一周起点，前面补空格子对齐星期。
-// 与计划页原来的实现同源——计划页的日历 tab 已并到这里，那边删掉了
-function buildCells(year, month, taskedDays, today) {
-  const first = new Date(year, month - 1, 1);
-  const lead = (first.getDay() + 6) % 7;
-  const daysInMonth = new Date(year, month, 0).getDate();
-  const set = {};
-  (taskedDays || []).forEach((d) => (set[d] = true));
-  const cells = [];
-  for (let i = 0; i < lead; i++) cells.push({ day: 0 });
-  for (let d = 1; d <= daysInMonth; d++) {
-    cells.push({ day: d, date: year + '-' + pad2(month) + '-' + pad2(d), tasked: !!set[d], today: d === today });
-  }
-  return cells;
-}
-
-// 「接下来」用的相对日期，比 7月31日 更好读
-function whenLabel(date, today) {
-  if (!date) return '';
-  const diff = Math.round((new Date(date + 'T00:00:00') - new Date(today + 'T00:00:00')) / 86400000);
-  if (diff <= 0) return '今天';
-  if (diff === 1) return '明天';
-  if (diff === 2) return '后天';
-  if (diff < 7) return diff + ' 天后';
-  const p = date.split('-');
-  return +p[1] + '月' + +p[2] + '日';
-}
+const petmeta = require('../../utils/petmeta.js');
 
 function mapTask(t) {
-  return {
-    id: t.id,
-    title: t.title,
-    sub: t.description,
-    priority: t.priority,
-    done: t.done,
-    sheet: t.sheet_type,
-  };
+  return { id: t.id, title: t.title, sub: t.description, priority: t.priority, done: t.done, sheet: t.sheet_type };
 }
 
-// 快速记录入口取后端类型表的前 8 个（按分组顺序再按 sort）。
-// 原来这里是 8 项写死的，后台加一种类型首页看不到；现在调 sort 就能换首屏露出哪几个。
-// 首页只放 8 个是版式限制（4 列 2 行），全部 24 种在记录页
-function quickFrom(groups) {
-  const flat = [];
-  (groups || []).forEach((g) => g.items.forEach((t) => flat.push(t)));
-  return flat.slice(0, 8);
+// 时间轴上的相对时间。首页关心的是「什么时候记的」，精确到分只在今天有意义
+function fmtWhen(iso) {
+  if (!iso) return '';
+  const d = new Date(iso);
+  if (isNaN(d.getTime())) return '';
+  const p = (n) => (n < 10 ? '0' + n : '' + n);
+  const now = new Date();
+  const sameDay = d.toDateString() === now.toDateString();
+  if (sameDay) return '今天 ' + p(d.getHours()) + ':' + p(d.getMinutes());
+  const y = new Date(now.getTime() - 86400000);
+  if (d.toDateString() === y.toDateString()) return '昨天 ' + p(d.getHours()) + ':' + p(d.getMinutes());
+  return d.getMonth() + 1 + '月' + d.getDate() + '日';
 }
 
-// 门面上的状态 chip：健康状态 + 最多两条洞察
-function heroChips(summary) {
-  const chips = [];
-  if (summary.health_status) {
-    chips.push({ text: summary.health_status, icon: 'check', tone: 'green' });
-  }
-  (summary.insights || []).slice(0, 2).forEach((it) => {
-    if (it && it.bold) chips.push({ text: it.bold, icon: 'trend', tone: '' });
-  });
-  return chips;
-}
+const TL_PAGE = 10;
 
 Page({
   data: {
     pet: {},
-    summary: { greeting: '', insights: [], week: [], advice: '', health_pct: 0, health_status: '正常' },
+    zodiac: '',
+    daysTogether: 0,
+    sexIcon: '',
+    sexTone: '',
     tasks: [],
-    quickItems: [],
-    heroChips: [],
-    undoneText: '',
-    firstArticle: null,
-    selectedDate: '',
-    taskLabel: '今日任务',
-    todayDate: '',
-    calOpen: false,
-    calCells: [],
-    calLabel: '',
-    dayNodes: [],
-    dayReminders: [],
-    upcoming: [],
-    planPct: -1,
+    planUndone: 0,
+    monthCost: 0,
+    timeline: [],
+    tlPage: 1,
+    hasMore: false,
     sheetShow: false,
     sheetType: '',
   },
   onLoad() {
-    this.setData({ todayDate: todayStr() });
     this._unsub = store.subscribe((pet) => {
-      this.setData({ pet });
-      // 首次由 onShow 统一加载，这里只处理之后的「切换宠物 / 数据变更」，避免重复请求
+      this.applyPet(pet);
       if (!this._inited) return;
       this.loadAll();
     });
@@ -110,143 +53,103 @@ Page({
   },
   onShow() {
     syncTabBar(this);
-    this.loadTypes();
+    recordTypes.load().catch(() => {});
     store
       .ready()
       .then(() => {
         this._inited = true;
-        this.setData({ pet: store.getPet() });
+        this.applyPet(store.getPet());
         this.loadAll();
       })
       .catch((e) => wx.showToast({ title: e.message || '加载失败', icon: 'none' }));
   },
-  loadTypes() {
-    if (this.data.quickItems.length) return;
-    recordTypes
-      .load()
-      .then((groups) => this.setData({ quickItems: quickFrom(groups) }))
-      .catch(() => {});
+  // 门面上那几样都是本地算的，不用等接口
+  applyPet(pet) {
+    const p = pet || {};
+    const badge = petmeta.genderBadge(p.gender);
+    this.setData({
+      pet: p,
+      zodiac: petmeta.zodiac(p.birthday),
+      daysTogether: petmeta.daysTogether(p),
+      sexIcon: badge.icon,
+      sexTone: badge.tone,
+    });
   },
   loadAll() {
-    this.loadSummary();
     this.loadTasks();
-    this.loadDayExtra();
-    this.loadUpcoming();
-    // 日历只在展开过之后才跟着刷新，没展开就别白拉一次
-    if (this.data.calOpen) this.loadCalendar();
-    if (!this.data.firstArticle) {
-      api
-        .listArticles()
-        .then((list) => {
-          if (list && list[0]) {
-            this.setData({ firstArticle: { id: list[0].id, icon: list[0].icon, title: list[0].title, desc: list[0].description } });
-          }
-        })
-        .catch(() => {});
-    }
-  },
-  loadSummary() {
-    const id = store.currentPetId();
-    if (!id) return;
-    api
-      .homeSummary(id)
-      .then((summary) => this.setData({ summary, heroChips: heroChips(summary) }))
-      .catch((e) => toastErr(e));
+    this.loadTimeline(1);
+    this.loadEntries();
   },
   loadTasks() {
     const id = store.currentPetId();
     if (!id) return;
-    const date = this.data.selectedDate || this.data.todayDate;
     api
-      .getTasks(id, date)
-      .then((tasks) => this.setTasks((tasks || []).map(mapTask)))
+      .getTasks(id)
+      .then((tasks) => this.setData({ tasks: (tasks || []).map(mapTask) }))
       .catch((e) => toastErr(e));
   },
-  // 任务列表落地时顺手算「还有几件事没做完」，门面上要用
-  setTasks(tasks) {
-    const undone = tasks.filter((t) => !t.done).length;
-    this.setData({
-      tasks,
-      undoneText: tasks.length === 0
-        ? '这天还没有安排'
-        : undone > 0 ? '还有 ' + undone + ' 件事没做完' : '今天的事都做完啦',
-    });
-  },
-  // 这天挂着的计划节点和到期提醒。任务列表仍走 /tasks（那边会补生成当天任务），
-  // day-plan 只取 tasks 之外的两类，不拿它的 tasks 覆盖列表
-  loadDayExtra() {
+  // 两个入口上的副标题：计划还剩几件、本月花了多少。
+  // 空着的话入口就是两个没有信息量的图标
+  loadEntries() {
     const id = store.currentPetId();
     if (!id) return;
-    const date = this.data.selectedDate || this.data.todayDate;
-    api
-      .dayPlan(id, date)
-      .then((res) => {
-        this.setData({
-          dayNodes: (res.plan_nodes || []).map((n) => ({ title: n.title, done: n.done })),
-          dayReminders: (res.reminders || []).map((r) => ({ title: r.title })),
-        });
-      })
-      .catch(() => this.setData({ dayNodes: [], dayReminders: [] }));
-  },
-  // 30 天计划里最近 3 个还没做的节点
-  loadUpcoming() {
-    const id = store.currentPetId();
-    if (!id) return;
-    const today = this.data.todayDate;
     api
       .getPlan(id)
-      .then((plan) => {
-        const list = ((plan && plan.tasks) || [])
-          .filter((t) => !t.done && t.date && t.date >= today)
-          .sort((a, b) => (a.date < b.date ? -1 : 1))
-          .slice(0, 3)
-          .map((t) => ({ id: t.id, title: t.title, description: t.description, whenLabel: whenLabel(t.date, today) }));
-        this.setData({ upcoming: list, planPct: plan ? plan.completion_pct || 0 : -1 });
-      })
-      .catch(() => this.setData({ upcoming: [], planPct: -1 }));
+      .then((plan) => this.setData({ planUndone: ((plan && plan.tasks) || []).filter((t) => !t.done).length }))
+      .catch(() => this.setData({ planUndone: 0 }));
+    api
+      .getBill(id, 'month')
+      .then((b) => this.setData({ monthCost: (b && b.total) || 0 }))
+      .catch(() => this.setData({ monthCost: 0 }));
   },
-  loadCalendar() {
+  loadTimeline(page) {
     const id = store.currentPetId();
     if (!id) return;
     api
-      .planCalendar(id)
+      .getRecords(id, { page, pageSize: TL_PAGE })
       .then((res) => {
-        this.setData({
-          calCells: buildCells(res.year, res.month, res.tasked_days, res.today),
-          calLabel: `${res.year} 年 ${res.month} 月`,
-        });
+        const list = (res.list || []).map((r) => ({
+          id: r.id,
+          type: r.type,
+          tone: (recordTypes.get(r.type) || {}).tone || 'tone-1',
+          title: r.title,
+          description: r.description,
+          image: r.image_url || '',
+          timeText: fmtWhen(r.occurred_at),
+        }));
+        const merged = page === 1 ? list : this.data.timeline.concat(list);
+        this.setData({ timeline: merged, tlPage: page, hasMore: merged.length < (res.total || 0) });
       })
       .catch(() => {});
   },
-  toggleCal() {
-    const open = !this.data.calOpen;
-    this.setData({ calOpen: open });
-    if (open && !this.data.calCells.length) this.loadCalendar();
+  loadMore() {
+    if (this.data.hasMore) this.loadTimeline(this.data.tlPage + 1);
   },
-  onTapDay(e) {
-    const { date, active } = e.currentTarget.dataset;
-    if (!date) return;
-    const parts = date.split('-');
-    this.setData({
-      selectedDate: date,
-      taskLabel: active ? '今日任务' : +parts[1] + '月' + +parts[2] + '日',
+  previewImage(e) {
+    const url = e.currentTarget.dataset.url;
+    if (url) wx.previewImage({ urls: [url], current: url });
+  },
+  onDeleteRecord(e) {
+    const id = e.currentTarget.dataset.id;
+    wx.showModal({
+      title: '删掉这条记录？',
+      content: '趋势和统计会跟着变。',
+      confirmColor: '#EE7D73',
+      success: (r) => {
+        if (!r.confirm) return;
+        api
+          .deleteRecord(id)
+          .then(() => this.loadTimeline(1))
+          .catch((err) => toastErr(err, '删除失败'));
+      },
     });
-    this.loadTasks();
-    this.loadDayExtra();
-  },
-  backToToday() {
-    this.setData({ selectedDate: this.data.todayDate, taskLabel: '今日任务' });
-    this.loadTasks();
-    this.loadDayExtra();
-  },
-  goPlan() {
-    wx.navigateTo({ url: '/pages/plan/plan' });
   },
   onTapTask(e) {
     const i = e.currentTarget.dataset.index;
     const t = this.data.tasks[i];
+    // 任务关联了记录类型就直接去记那一笔
     if (t.sheet) {
-      this.openSheetType(t.sheet);
+      wx.navigateTo({ url: '/pages/addrecord/addrecord?type=' + t.sheet });
       return;
     }
     api
@@ -254,74 +157,45 @@ Page({
       .then((res) => {
         const tasks = this.data.tasks.slice();
         tasks[i] = Object.assign({}, tasks[i], { done: res.done });
-        this.setTasks(tasks);
-        this.loadSummary();
+        this.setData({ tasks });
       })
-      .catch((e) => toastErr(e, '操作失败'));
+      .catch((err) => toastErr(err, '操作失败'));
   },
   completeTasks() {
     const id = store.currentPetId();
     if (!id) return;
     api
       .completeAllTasks(id)
-      .then((tasks) => {
-        this.setTasks((tasks || []).map(mapTask));
-        this.loadSummary();
-      })
+      .then((tasks) => this.setData({ tasks: (tasks || []).map(mapTask) }))
       .catch((e) => toastErr(e, '操作失败'));
   },
-  // 记一笔的每一项都进独立页面。原来是开弹层——24 项的表单塞弹层里太挤，
-  // 而且弹层高度受 sheet-scroll 的 78vh 限制，字段一多就变成内滚
-  goAdd(e) {
-    wx.navigateTo({ url: '/pages/addrecord/addrecord?type=' + e.currentTarget.dataset.type });
+  goPlan() {
+    wx.navigateTo({ url: '/pages/plan/plan' });
+  },
+  goExpense() {
+    wx.navigateTo({ url: '/pages/expense/expense' });
+  },
+  goRecord() {
+    wx.navigateTo({ url: '/pages/record/record' });
+  },
+  onQuickRecord() {
+    wx.navigateTo({ url: '/pages/record/record' });
   },
   openSheet(e) {
-    this.openSheetType(e.currentTarget.dataset.type);
-  },
-  openSheetType(type) {
-    this.setData({ sheetType: type, sheetShow: true });
+    this.setData({ sheetType: e.currentTarget.dataset.type, sheetShow: true });
   },
   closeSheet() {
-    // 只关闭。数据变更由 bind:saved 或 store 的宠物变更通知触发刷新，
-    // 不必每次关弹层（哪怕只是看了眼 AI）都全量重拉一遍
     this.setData({ sheetShow: false });
   },
   onSheetSave() {
     this.loadTasks();
-    this.loadSummary();
-    this.loadDayExtra();
-    if (this.data.calOpen) this.loadCalendar(); // 加了任务，格子上的圆点要跟着变
+    this.loadTimeline(1);
   },
   onAddPet() {
-    this.openSheetType('addPet');
+    this.setData({ sheetType: 'addPet', sheetShow: true });
   },
-  // 没建档时点门面卡应该去「添加」，而不是打开一个空的编辑表单
   onHeroTap() {
-    if (this.data.pet && this.data.pet.id) this.openSheetType('editPet');
-    else this.openSheetType('addPet');
-  },
-  onEditPet() {
-    this.openSheetType('editPet');
-  },
-  // 右下角悬浮键：进记录页。原来做成弹层里的选择器，弹层装 24 项太挤了；
-  // 记录页顶部本来就是那个宫格，再单独建一个只放宫格的页面等于维护两份
-  onQuickRecord() {
-    wx.navigateTo({ url: '/pages/record/record' });
-  },
-  goSettings() {
-    wx.navigateTo({ url: '/pages/settings/settings' });
-  },
-  goLearn() {
-    wx.navigateTo({ url: '/pages/learn/learn' });
-  },
-  // 首页那张卡片直接打开这篇文章正文
-  openFirstArticle() {
-    const a = this.data.firstArticle;
-    if (a && a.id) wx.navigateTo({ url: `/pages/article/article?id=${a.id}` });
-    else this.goLearn();
-  },
-  goRecord() {
-    wx.navigateTo({ url: '/pages/record/record' });
+    this.setData({ sheetType: this.data.pet && this.data.pet.id ? 'editPet' : 'addPet', sheetShow: true });
   },
   onShareAppMessage() {
     return { title: '肉垫计划 · 每天照顾好毛孩子', path: '/pages/home/home' };

pets-fe/pages/home/home.json

@@ -4,7 +4,6 @@
     "pet-switch": "/components/pet-switch/pet-switch",
     "bottom-sheet": "/components/bottom-sheet/bottom-sheet",
     "fab": "/components/fab/fab",
-    "pt-icon": "/components/pt-icon/index",
-    "stat-ring": "/components/stat-ring/index"
+    "pt-icon": "/components/pt-icon/index"
   }
 }

pets-fe/pages/home/home.wxml

@@ -2,131 +2,91 @@
 
 <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}}">
+<scroll-view class="page-scroll" scroll-y="{{true}}" enhanced="{{true}}" show-scrollbar="{{false}}"
+             bindscrolltolower="loadMore">
 <view class="page-body">
-  <view class="top-row">
-    <view class="greeting">
-      <view class="greet-h2">{{summary.greeting || '你好'}}</view>
-      <view class="greet-p">今天也要照顾好 {{pet.name}}</view>
-    </view>
-    <view class="icon-stack">
-      <view class="icon-btn" data-type="reminders" bindtap="openSheet"><pt-icon name="bell" size="{{36}}"></pt-icon></view>
-      <view class="icon-btn" bindtap="goSettings"><pt-icon name="settings" size="{{36}}"></pt-icon></view>
-    </view>
-  </view>
-
-  <!-- 门面：完成度环 + 当下状态。点进去编辑档案 -->
+  <!-- 门面：宠物名片。点进去编辑档案 -->
   <view class="card hero-card" bindtap="onHeroTap">
     <view class="hero-row">
-      <stat-ring percent="{{summary.health_pct}}" size="{{168}}">
-        <view class="ring-num">{{summary.health_pct}}<text class="ring-unit">%</text></view>
-        <view class="ring-cap">完成度</view>
-      </stat-ring>
+      <view class="hero-av">
+        <image wx:if="{{pet.avatar_url}}" class="hero-av-img" src="{{pet.avatar_url}}" mode="aspectFill"></image>
+        <block wx:else>{{pet.emoji || '🐾'}}</block>
+        <view wx:if="{{sexIcon}}" class="hero-sex {{sexTone}}">{{sexIcon}}</view>
+      </view>
       <view class="hero-main">
         <view class="hero-title">{{pet.name || '还没有毛孩子'}}</view>
-        <view class="hero-sub">{{pet.id ? undoneText : '点这里建一份档案，任务和提醒会自动排好'}}</view>
-        <view class="chip-row">
-          <view wx:for="{{heroChips}}" wx:key="text" class="chip {{item.tone}}">
-            <pt-icon name="{{item.icon}}" size="{{22}}"></pt-icon>{{item.text}}
-          </view>
+        <view class="hero-meta">
+          <text wx:if="{{pet.breed}}">{{pet.breed}}</text>
+          <text wx:if="{{pet.age}}">{{pet.age}}</text>
+          <text wx:if="{{zodiac}}">{{zodiac}}</text>
         </view>
       </view>
+      <view class="hero-arrow"><pt-icon name="next" size="{{28}}"></pt-icon></view>
     </view>
-    <view class="hero-meta">{{pet.age}}｜{{pet.weight}}｜{{pet.stage}}</view>
+    <view wx:if="{{daysTogether}}" class="hero-days">我们一起生活的第 <text class="hd-n">{{daysTogether}}</text> 天</view>
   </view>
 
-  <!-- 日期带：默认一周，展开成整月。原来这是计划页的「日历」tab，
-       但「哪天要做什么」和「今天要做什么」本来就是一件事，分两个 tab 只是让人多点两下 -->
-  <view class="date-band">
-    <view wx:if="{{!calOpen}}" class="date-strip">
-      <view wx:for="{{summary.week}}" wx:key="date"
-            class="day {{item.active ? 'active' : ''}} {{item.date === selectedDate ? 'sel' : ''}} {{item.has_dot ? 'has-dot' : ''}}"
-            data-date="{{item.date}}" data-active="{{item.active}}" bindtap="onTapDay">
-        <text>{{item.weekday}}</text><text class="day-b">{{item.day}}</text>
-      </view>
+  <!-- 两个入口。竞品那一排是买商品/上豪车/领猫砂盆，是电商和广告位，去掉 -->
+  <view class="card entry-card">
+    <view class="entry" bindtap="goPlan">
+      <view class="entry-ic tone-1"><pt-icon name="plan" size="{{48}}"></pt-icon></view>
+      <view class="entry-b">管理计划</view>
+      <view class="entry-p">{{planUndone > 0 ? '还有 ' + planUndone + ' 件没做' : '30 天安排'}}</view>
     </view>
-    <view wx:else class="card cal-card">
-      <view class="cal-head"><text>{{calLabel}}</text></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="{{calCells}}" wx:key="index"
-              class="cal-cell {{item.today ? 'today' : ''}} {{item.tasked ? 'tasked' : ''}} {{item.day === 0 ? 'blank' : ''}} {{item.date && item.date === selectedDate ? 'sel' : ''}}"
-              data-date="{{item.date}}" data-active="{{item.date === todayDate}}" bindtap="onTapDay">{{item.day || ''}}</view>
-      </view>
-    </view>
-    <view class="cal-toggle" bindtap="toggleCal">
-      {{calOpen ? '收起' : '展开整月'}}<pt-icon name="{{calOpen ? 'up' : 'down'}}" size="{{24}}"></pt-icon>
+    <view class="entry" bindtap="goExpense">
+      <view class="entry-ic tone-2"><pt-icon name="cost" size="{{48}}"></pt-icon></view>
+      <view class="entry-b">记花销</view>
+      <view class="entry-p">{{monthCost > 0 ? '本月 ¥' + monthCost : '还没记过'}}</view>
     </view>
   </view>
 
-  <view class="card">
+  <!-- 今日任务 -->
+  <view wx:if="{{tasks.length}}" class="card">
     <view class="section-head">
-      <view class="sh-title">{{taskLabel}}</view>
+      <view class="sh-title">今日任务</view>
       <view class="head-links">
         <view class="link" data-type="manageTasks" bindtap="openSheet">管理</view>
-        <view wx:if="{{selectedDate && selectedDate !== todayDate}}" class="link" bindtap="backToToday">回今天</view>
-        <view wx:else class="link" bindtap="completeTasks">全部完成</view>
+        <view class="link" bindtap="completeTasks">全部完成</view>
       </view>
     </view>
     <view class="task-list">
-      <view wx:for="{{tasks}}" wx:key="title" class="task {{item.done ? 'done' : ''}}" data-index="{{index}}" bindtap="onTapTask">
+      <view wx:for="{{tasks}}" wx:key="id" class="task {{item.done ? 'done' : ''}}" data-index="{{index}}" bindtap="onTapTask">
         <view class="circle"><pt-icon wx:if="{{item.done}}" name="check" size="{{22}}"></pt-icon></view>
         <view class="task-text"><text class="tt-b">{{item.title}}</text><view wx:if="{{item.sub}}" class="tt-p">{{item.sub}}</view></view>
         <view wx:if="{{item.priority}}" class="priority">{{item.priority}}</view>
       </view>
-      <view wx:if="{{tasks.length === 0}}" class="empty">这天没有任务记录</view>
     </view>
+  </view>
 
-    <!-- 这天还挂着的计划节点和提醒。只读，勾选走计划页/提醒弹层 -->
-    <view wx:if="{{dayNodes.length || dayReminders.length}}" class="day-detail">
-      <view wx:for="{{dayNodes}}" wx:key="title" class="dd-item">
-        <text class="dd-tag plan">计划</text><text class="dd-b {{item.done ? 'done' : ''}}">{{item.title}}</text>
-      </view>
-      <view wx:for="{{dayReminders}}" wx:key="title" class="dd-item" data-type="reminders" bindtap="openSheet">
-        <text class="dd-tag rem">提醒</text><text class="dd-b">{{item.title}}</text>
+  <!-- 记录时间轴。首页原来是任务/日历/接下来的堆叠，看不到「我记了什么」；
+       日历挪回计划页了（它本来就属于那儿），这里换成时间轴 —— 首页应该是
+       一条能往下翻的流水，而不是一屏聚合卡 -->
+  <view class="tl-head">
+    <view class="sh-title">最近记录</view>
+    <view class="link" bindtap="goRecord">＋ 记一笔</view>
+  </view>
+
+  <view wx:for="{{timeline}}" wx:key="id" class="tl-item">
+    <view class="tl-rail">
+      <view class="tl-dot {{item.tone}}"><pt-icon name="{{item.type}}" size="{{28}}" fallback="note"></pt-icon></view>
+      <view class="tl-line"></view>
+    </view>
+    <view class="tl-body">
+      <view class="tl-when">{{item.timeText}}</view>
+      <view class="tl-card" data-id="{{item.id}}" bindlongpress="onDeleteRecord">
+        <view class="tl-title">{{item.title}}</view>
+        <view wx:if="{{item.description}}" class="tl-desc">{{item.description}}</view>
+        <image wx:if="{{item.image}}" class="tl-img" src="{{item.image}}" mode="aspectFill"
+               data-url="{{item.image}}" catchtap="previewImage"></image>
       </view>
     </view>
   </view>
 
-  <!-- 接下来：30 天计划里最近几个还没做的节点。计划页降级成二级页后，
-       这张卡是它在首页的唯一露出，没有它计划就等于消失了 -->
-  <view wx:if="{{upcoming.length}}" class="card">
-    <view class="section-head">
-      <view class="sh-title">接下来</view>
-      <view class="link" bindtap="goPlan">完整计划</view>
-    </view>
-    <view wx:if="{{planPct >= 0}}" class="progress-row"><text>30 天计划完成度</text><text>{{planPct}}%</text></view>
-    <view wx:if="{{planPct >= 0}}" class="bar"><view class="bar-fill" style="width:{{planPct}}%"></view></view>
-    <view class="up-list">
-      <view wx:for="{{upcoming}}" wx:key="id" class="up-item" data-id="{{item.id}}" bindtap="goPlan">
-        <view class="up-when">{{item.whenLabel}}</view>
-        <view class="up-body"><text class="tt-b">{{item.title}}</text><view wx:if="{{item.description}}" class="tt-p">{{item.description}}</view></view>
-      </view>
-    </view>
-  </view>
-
-  <view class="card">
-    <view class="section-head">
-      <view class="sh-title">快速记录</view>
-      <view class="link" bindtap="goRecord">更多</view>
-    </view>
-    <view class="quick-grid">
-      <view wx:for="{{quickItems}}" wx:key="code" class="quick {{item.tone}}" data-type="{{item.code}}" bindtap="goAdd">
-        <pt-icon name="{{item.icon}}" size="{{44}}" fallback="note"></pt-icon>{{item.label}}
-      </view>
-    </view>
-  </view>
-
-  <view class="card">
-    <view class="section-head">
-      <view class="sh-title">新手内容</view>
-      <view class="link" bindtap="goLearn">查看</view>
-    </view>
-    <view wx:if="{{firstArticle}}" class="article-card no-shadow" style="margin-bottom:0" bindtap="openFirstArticle">
-      <view class="article-icon"><pt-icon name="{{firstArticle.icon}}" size="{{48}}" fallback="book"></pt-icon></view>
-      <view><text class="ac-b">{{firstArticle.title}}</text><view class="ac-p">{{firstArticle.desc}}</view></view>
-    </view>
+  <view wx:if="{{!timeline.length}}" class="card">
+    <view class="empty lg">还没有记录。点上面的「记一笔」开始，
+      体重趋势和健康洞察都会从这些记录里长出来。</view>
   </view>
+  <view wx:if="{{hasMore}}" class="tl-more" bindtap="loadMore">加载更多</view>
 </view>
 </scroll-view>
 

pets-fe/pages/home/home.wxss

@@ -1,11 +1,3 @@
-.top-row{display:flex;align-items:center;justify-content:space-between;margin:4rpx 0 var(--sp-4)}
-.greet-h2{font-size:var(--fs-xl);line-height:1.15;letter-spacing:-.8rpx;font-weight:var(--fw-b)}
-.greet-p{font-size:var(--fs-sm);color:var(--muted);margin-top:var(--sp-1)}
-.icon-stack{display:flex;gap:var(--sp-2)}
-.icon-btn{
-  width:76rpx;height:76rpx;border-radius:50%;background:#fff;box-shadow:var(--sd-1);
-  color:var(--text-2);display:flex;align-items:center;justify-content:center;
-}
 
 /* 门面卡 */
 .hero-card{
@@ -13,71 +5,69 @@
     radial-gradient(circle at 95% 16%, rgba(245,169,71,.22), transparent 32%),
     linear-gradient(135deg,#FFFFFF,#FFF6E9);
 }
-.hero-row{display:flex;align-items:center;gap:var(--sp-4)}
-.ring-num{font-size:var(--fs-xl);font-weight:var(--fw-b);line-height:1}
-.ring-unit{font-size:var(--fs-cap)}
-.ring-cap{font-size:var(--fs-cap);color:var(--muted);margin-top:4rpx}
-.hero-main{flex:1;min-width:0}
-.hero-title{font-size:var(--fs-lg);font-weight:var(--fw-b);letter-spacing:-.4rpx}
-.hero-sub{color:var(--muted);font-size:var(--fs-sm);margin-top:4rpx}
-.chip-row{display:flex;flex-wrap:wrap;gap:var(--sp-1);margin-top:var(--sp-2)}
-.hero-meta{
-  color:var(--muted);font-size:var(--fs-sm);margin-top:var(--sp-3);
-  padding-top:var(--sp-3);border-top:1rpx solid rgba(238,230,220,.8);
-}
 
 /* 一周日期条 */
-.date-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--sp-2);margin-bottom:var(--sp-4)}
-.day{
-  background:#fff;border-radius:var(--r-md);min-height:112rpx;text-align:center;padding:var(--sp-3) 4rpx;
-  border:1rpx solid var(--line);color:var(--muted);font-size:var(--fs-cap);
-}
-.day-b{display:block;color:var(--text);font-size:var(--fs-md);margin-top:6rpx;font-weight:var(--fw-b)}
-.day.active{border-color:var(--primary-line);background:var(--primary-soft);color:var(--primary-dark)}
-.day.sel{border-color:var(--primary);background:var(--primary-soft);color:var(--primary-dark);box-shadow:0 0 0 2rpx rgba(245,169,71,.35)}
-.day.has-dot::after{content:"";display:block;width:8rpx;height:8rpx;border-radius:50%;background:var(--green);margin:6rpx auto 0}
 
-.ai-text{color:var(--text-2);font-size:var(--fs-md);line-height:1.6}
-.ai-cta{margin-top:var(--sp-4)}
 
 /* ===== 日期带（原计划页「日历」tab 并过来） ===== */
-.date-band{margin-bottom:var(--sp-4)}
-.date-band .date-strip{margin-bottom:0}
-.cal-card{margin-bottom:0}
-.cal-toggle{
-  display:flex;align-items:center;justify-content:center;gap:4rpx;
-  padding:var(--sp-2) 0;font-size:var(--fs-cap);color:var(--muted);
-}
-.cal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-3);font-weight:var(--fw-b);font-size:var(--fs-lg)}
-.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--sp-2);text-align:center}
-.cal-w{font-size:var(--fs-cap);color:var(--muted);padding:var(--sp-1) 0}
-.cal-cell{
-  height:76rpx;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;
-  font-weight:var(--fw-b);font-size:var(--fs-sm);background:var(--surface-2);position:relative;
-}
-.cal-cell.blank{background:transparent}
-.cal-cell.today{background:var(--primary-soft);color:var(--primary-dark)}
-.cal-cell.tasked::after{content:"";position:absolute;bottom:8rpx;width:8rpx;height:8rpx;border-radius:50%;background:var(--green)}
-.cal-cell.sel{background:var(--primary);color:#fff}
-.cal-cell.sel.tasked::after{background:#fff}
-
 /* 某天的安排 */
-.day-detail{margin-top:var(--sp-3);border-top:1rpx solid var(--line);padding-top:var(--sp-4)}
 .dd-title{font-weight:var(--fw-b);font-size:var(--fs-md);margin-bottom:var(--sp-3)}
-.dd-item{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0}
-.dd-tag{flex:none;font-size:var(--fs-cap);font-weight:var(--fw-b);padding:2rpx var(--sp-2);border-radius:var(--r-full)}
-.dd-tag.plan{background:var(--primary-soft);color:var(--primary-ink)}
-.dd-tag.task{background:var(--green-soft);color:var(--green-ink)}
-.dd-tag.rem{background:var(--blue-soft);color:var(--blue-ink)}
-.dd-b{font-size:var(--fs-md);color:var(--text)}
-.dd-b.done{text-decoration:line-through;color:var(--muted)}
 
 /* ===== 接下来 ===== */
-.up-list{margin-top:var(--sp-3)}
-.up-item{display:flex;gap:var(--sp-3);padding:var(--sp-3) 0;border-top:1rpx solid var(--line)}
-.up-item:first-child{border-top:none;padding-top:0}
-.up-when{
-  flex:none;width:112rpx;font-size:var(--fs-cap);font-weight:var(--fw-b);
-  color:var(--primary-dark);padding-top:4rpx;
+
+/* ===== 门面：宠物名片 ===== */
+.hero-card{padding:var(--sp-5)}
+.hero-row{display:flex;align-items:center;gap:var(--sp-4)}
+.hero-av{
+  position:relative;flex:none;width:128rpx;height:128rpx;border-radius:50%;
+  background:var(--primary-soft);display:flex;align-items:center;justify-content:center;
+  font-size:60rpx;overflow:visible;
 }
-.up-body{flex:1;min-width:0}
+.hero-av-img{width:100%;height:100%;border-radius:50%}
+/* 性别徽章叠在头像右下：一个很省事但很出效果的细节 */
+.hero-sex{
+  position:absolute;right:-4rpx;bottom:-4rpx;width:42rpx;height:42rpx;border-radius:50%;
+  border:4rpx solid #fff;color:#fff;font-size:22rpx;line-height:1;
+  display:flex;align-items:center;justify-content:center;
+}
+.hero-sex.male{background:#5B9BE8}
+.hero-sex.female{background:#EE85A8}
+.hero-main{flex:1;min-width:0}
+.hero-title{font-size:var(--fs-xl);font-weight:var(--fw-b);color:var(--text)}
+.hero-meta{display:flex;flex-wrap:wrap;gap:var(--sp-3);font-size:var(--fs-sm);color:var(--muted);margin-top:6rpx}
+.hero-arrow{flex:none;color:var(--muted2);display:flex;align-items:center}
+.hero-days{
+  margin-top:var(--sp-4);background:var(--primary-soft);color:var(--primary-ink);
+  border-radius:var(--r-md);text-align:center;padding:var(--sp-3);
+  font-size:var(--fs-md);font-weight:var(--fw-b);
+}
+.hd-n{font-size:var(--fs-lg);margin:0 4rpx}
+
+/* ===== 两个入口 ===== */
+.entry-card{display:flex;padding:var(--sp-5) var(--sp-3)}
+.entry{flex:1;display:flex;flex-direction:column;align-items:center;gap:6rpx}
+.entry-ic{
+  width:96rpx;height:96rpx;border-radius:var(--r-md);
+  display:flex;align-items:center;justify-content:center;margin-bottom:4rpx;
+}
+.entry-b{font-size:var(--fs-md);font-weight:var(--fw-b);color:var(--text)}
+.entry-p{font-size:var(--fs-cap);color:var(--muted)}
+
+/* ===== 记录时间轴 ===== */
+.tl-head{display:flex;align-items:center;justify-content:space-between;margin:var(--sp-5) 0 var(--sp-3)}
+.tl-item{display:flex;gap:var(--sp-3)}
+.tl-rail{flex:none;width:56rpx;display:flex;flex-direction:column;align-items:center}
+.tl-dot{
+  width:56rpx;height:56rpx;border-radius:50%;flex:none;
+  display:flex;align-items:center;justify-content:center;
+}
+/* 竖线连起来才像一条时间轴；最后一条的线会被 body 的高度自然截断 */
+.tl-line{flex:1;width:2rpx;background:var(--line);margin:6rpx 0}
+.tl-item:last-of-type .tl-line{display:none}
+.tl-body{flex:1;min-width:0;padding-bottom:var(--sp-4)}
+.tl-when{font-size:var(--fs-cap);color:var(--muted);margin-bottom:6rpx}
+.tl-card{background:#fff;border-radius:var(--r-md);box-shadow:var(--sd-1);padding:var(--sp-4)}
+.tl-title{font-size:var(--fs-md);font-weight:var(--fw-b);color:var(--text)}
+.tl-desc{font-size:var(--fs-sm);color:var(--text-2);margin-top:6rpx;line-height:1.5}
+.tl-img{width:100%;height:320rpx;border-radius:var(--r-sm);margin-top:var(--sp-3);display:block}
+.tl-more{text-align:center;padding:var(--sp-4);font-size:var(--fs-sm);color:var(--muted)}

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}