v24 第 24 批:选人冲掉已有成员 / 首页改版 / 个人导航 / 微信读书 / 财务图

用户 6 条原话(要点):
  ①「选择名册里面人员的那个弹出框有个问题,就是会把页面里面已有的人员给冲掉。
     比方说电影里面的观影人或者是旅程里面的参与人…这是一个 bug 应该通篇检查。」
    并按「输入拼音 → 空格选中第一个 → 输入框清空回焦 → 再输下一个 → 回车=确定」重做交互。
  ② 首页简要信息改成:问候 + 姓名 + 日期 + 星期 + 农历 + 节气/节日/纪念日/生日,
     下面「今天几条日程 / 几件待办」,天气**彩色图标**放**最右侧**,温度风力,最下面地址。
  ③「家里的镜框这里呃全部不要了」→ 删模块卡片墙 + 未来七天;日程与任务**左右各半**、
     高度固定、内部滚动且**不显滚动条**;日程**掐头去尾** + 当前时刻**红线**;
     任务显示标题+状态+**所在看板名**;最下面往年的今天。
  ④「把个人导航项目完整搬过来,放在读书后面」;免登录展示页 `/nav/?<短语>`;
     右上角给**登录**入口;展示页头像用**用户自己的头像**。
  ⑤ 读书加笔记 + 导入微信读书笔记(用户明确「**用微信读书 api key**」)。
  ⑥ 财务页第二张多线图不随类别标签筛选。

用户拍板(AskUserQuestion):① 首页删「模块卡片墙 + 未来七天」两块;
② 微信读书用官方 API Key;③ 导航短语「自己起名 + 可一键换随机码」都做;
④ 6 条一次做完再上线。

════ 一、 🔴 第 1 条:复现出的真 bug(全站性)════
**根因**:选人清单是**打开弹框时才建 DOM**(懒建,为性能),而承载"已选"的
checkbox 就在那份清单里 → **没打开过弹框就提交**时表单里一个值都没有 →
后端把"表单里没有 attendees"理解成"用户要把人全删掉" → **静默清空**。
实测复现:库里同行人 `2,3,4` → 只改标题保存后变成 **NULL**。

修法:模板加**承运字段**(`.pp-carry` 隐藏 input,承载当前已选);
JS 建清单时**撤掉**它(否则同一个 name 会带两份值)。
⚠️ 裸 POST(完全不带 attendees)**本来就该清空** —— 那是显式地"不选任何人",
所以断言也必须照着"浏览器实际提交的样子"(带承运字段)来测。

**键盘流程**(用户第 1 条后半):空格 = 选**当前可见列表里第一个还没选的**
(⚠️ 必须跳过已选中的 —— 否则会把它**取消**,与"我要选人"正好相反,本轮真机跑出来的缺陷);
选中后清空输入框 + 光标回输入框;回车 = 确定。空格必须 `preventDefault`
(否则输入框里多一个空格字符)。

覆盖范围:4 个多选(`attendees[]` / `members[]` / `shares[]` / 修订 `members[]`)
+ 全部单选(归属人 / 负责人 / 纪念日人等)。

════ 二、 首页改版(第 2、3 条)════
自上而下只有三块:
  ① 信息面板:问候(早/中/晚 + 姓名)→ 日期 / 星期 / 农历 → 日子标记
     (法定节假日 / 节气 / 传统节日 / 纪念日 / 生日,各一色)
     → 今日数字(今天几条日程、几件待办)| **最右**:彩色天气图标 + 温度 + 风力 + 地址
  ② 日程 / 任务 **左右各半**(各 360px 固定高、内部滚动、**不显滚动条**三套写法)
     日程是**日视图形式的刻度**、**掐头去尾**(首末日程前后各 1h)、**当前时刻红线**
     任务是标题 + **状态** + **看板名** + 截止
  ③ 往年的今天

新增 `Home::todayMarks()`(把五类来源合成一句话:"今天是国庆节 · 大暑")与
天气的 `tone` 色调档(彩色图标靠 CSS 上色,**不用 emoji** —— 避免旧系统豆腐块)。
删掉:`mod-cards` 模块卡片墙、`未来七天`。

════ 三、 个人导航(第 4 条,SimpleNav 完整搬运)════
`app/Nav.php`(4 张 `nav_*` 表 + 稀疏排序 + 短语)· `app/NavFetch.php`
(抓取与图标生成,27KB,从原项目 functions.php 机械搬运,**原文那批"线上实测"注释全部保留**)
· `nav_show.php`(**全站唯一免登录页**)· `nav_suggest.php`(联想代理,凭短语门禁)
· `templates/nav/index.php`(管理页:板块/站点/引擎/设置 + 拖拽排序)。

搬运只改两处(不改会坏):① 独立 SQLite → 家书的 MySQL;② **所有查询加 `person_id`**
(原项目是单用户系统,不加这一维全家人会共用同一份导航)。

免登录展示页:`/nav/?<短语>`(也认 `/nav/?<短语>` 不带参数名);
短语用户自起名(4~32 位字母数字`_-`,全局唯一、保留词拦截)或一键换随机码;
右上角**登录**入口(进家书登录页);头像用**他自己**的头像;空态给一句话。

路由三处同步(`router.php` / `.htaccess` / 部署脚本 5c **独立标记块**)——
这是本仓库第三次复用这条规律:**每加一个"站根上的独立入口",就必须是自己的标记块**。
⚠️ 线上重写规则**顺序有语义**:`^nav/suggest\.php$` 必须在 `^nav/?$` 之前
(后者会把前者吞掉)。

════ 四、 微信读书(第 5 条)════
用户提示「用微信读书 api key」是对的 —— **我的知识过时了**:2026 年官方已开放
(网关 `POST https://i.weread.qq.com/api/agent/gateway`、`Bearer wrk-` 认证、
接口 `/user/notebooks`(游标 lastSort 分页)、`/book/bookmarklist`、
`/review/list/mine`、`/book/chapterinfo`)。

`app/WeRead.php`:Key 用 `Crypto::encrypt` **加密落库**、界面只回显掩码
(官方原话:这串 Key 等价于账号凭据);导入走「拉预览 → 勾选 → 导入」,
落 `book_notes`(去重 = kind + 内容 + 位置)。
⚠️ 业务参数必须**平铺在顶层**,不能包进 `params`(官方文档专门列了这个反例)。
另一条路「手动粘贴」保留(`books/notes_import`,早已有)。

════ 五、 财务第二张图(第 6 条,**上一批我引入的 bug**)════
`g.hidden = true` 对 **SVG 的 `<g>` 无效**(它没有 `hidden` 属性)→ 线条一条都没被藏;
**而我的探针也读同一个属性** → 两边一起绿(假绿)。
改为 `style.display`(恢复用 `''` 而不是 `'block'`);探针改读
`getComputedStyle(el).display !== 'none'`(落在**渲染结果**上)。
⚠️ "探针与实现读同一个属性"是**互相掩盖**的典型,比单纯写错断言更危险。

════ 六、 验证 ════
e2e **1218/0**(本批新增 102 条)· 真机探针 **19/0**(选人)+ **24/0**(首页/导航)
+ **34/0**(导航模块)· 桌面几何 0 失败 · 移动端几何 674/0 · 老库升级 149/0
· 部署静态断言空跑 **310/0** · **反向验证 13/13**(逐条改回旧行为,点名断言都变红)
· 线上验收:9 个新文件全在、4 张 nav 表建好(schema_version=24)、
  三条重写规则顺序正确、免登录页 / 空短语 / 错短语 / 联想门禁 全部响应正确。

════ 七、 本批的"夹具与断言"教训(都写进注释了)════
· `calendar_events.all_day` **默认值是 1** → 插夹具不写它就成了全天事件 →
  `time` 被抹成 `''` → "刻度掐头去尾"看着像没做(白查三轮)。
· 日历本要挑 `kind='custom'`(我原以为"普通本没有 kind",实际**普通本就是 custom**)。
· 量"同高/同排"要拿**内容区**(去 padding)比,不能拿 border-box(`.topline` 有 14px 上内边距)。
· 判据不能把**边界上的正确行为**当 bug(22 点有日程时末刻度**就是** 23:00)。
· 「HTML 写了、CSS 没写」e2e 永远查不出来 —— 导航展示页的登录按钮就落到了左边
  (实测按钮右 116px / 整行右 1210px),只有真机量几何才抓得到。
· 反向验证里 e2e 会**重铺副本**把注入覆盖掉 → 给 e2e 加了 `FB_PATCH_FILE` 钩子
  (重铺完自动打补丁),13 例里 8 例"没牙齿"其实是这个假象。

════ 八、 新增/改动文件 ════
新增:`app/Nav.php` · `app/NavFetch.php` · `app/WeRead.php` · `nav_show.php` ·
`nav_suggest.php` · `templates/nav/index.php` · `templates/books/weread.php` ·
`assets/css/nav-show.css` · `assets/js/nav-show.js`
改动:`app/Schema.php`(v24 + 4 张 nav 表)· `app/Module.php`(+nav)· `app/Home.php` ·
`index.php` · `templates/_person_picker.php` · `assets/js/person_picker.js` ·
`templates/home.php` · `templates/ledger/index.php` · `templates/books/_settings_menu.php` ·
`assets/css/app.css` · `router.php` · `.htaccess`
This commit is contained in:
2026-10-07 05:52:40 +08:00
parent ae3060f552
commit 09e30d27d4
21 changed files with 5034 additions and 180 deletions
+167
View File
@@ -0,0 +1,167 @@
<?php
/**
* 微信读书导入(v24 第 24 批 用户第 5 条)。
*
* 两种导入方式,**这里管的是"官方 API Key"那一种**:
* ① 手动粘贴 —— 见 `books/notes_import`(早已有,App 里「导出笔记」复制出来即可);
* ② 官方授权 —— 本页:填一次微信读书开放平台的 API Key(`wrk-` 开头),
* 之后系统就能直接读你的书架笔记,选中要导的书一键导入。
*
* 用户原话:「你看一下能不能导入微信的读书笔记,就是每一个人设置一下,比如说扫一下
* 微信的这个码呀,或者什么之类的授权一下」→ 后续明确「用微信读书 api key」。
* ⚠️ 官方在 2026 年开了开放平台,走**扫码登录后一键生成 API Key**(`wrk-` 前缀),
* 不再需要早期那种"复制 cookie"的野路子。Key 的获取页就在本页给出。
*
* ⚠️ Key 是**账号凭据**(官方原话:等价于账号凭证,泄露等于账号泄露):
* 所以界面上**只回显掩码**(`wrk-********abcd`),完整值只在提交那一刻存在。
*
* @param array|null $preview 「拉取预览」的结果(每本书 + 前几条笔记)
* @param int $nbCount 预览时一共发现多少本有笔记的书
*/
$preview = $preview ?? null;
$nbCount = (int)($nbCount ?? 0);
$me = (int)\App\Auth::personId();
$hasKey = \App\WeRead::hasKey($me);
$masked = \App\WeRead::maskedKey($me);
$canWrite = \App\Auth::canWrite();
?>
<div class="page-head">
<h1>微信读书导入</h1>
<span class="sub">填一次 API Key,之后就能直接把你微信读书里的划线与想法导进来</span>
<div class="actions">
<?php $bkSetCurrent = 'import'; require __DIR__ . '/_settings_menu.php'; ?>
</div>
</div>
<?php /* ==================== ① 授权(填 API Key)==================== */ ?>
<div class="card card-pad">
<h2 class="cinema-h2">
授权
<?php if ($hasKey): ?>
<span class="node-badge">已授权</span>
<?php else: ?>
<span class="node-badge">还没授权</span>
<?php endif; ?>
</h2>
<p class="small muted" style="margin:0 0 12px">
去 <a href="https://weread.qq.com/r/weread-skills" target="_blank" rel="noopener">微信读书开放平台</a>
扫码登录,页面上点「获取 API Key」,会得到一串 <code class="mono">wrk-</code> 开头的字符串,
复制到下面就行。
</p>
<p class="tip" style="background:#FFF6E5;border-color:#E8C98A;padding:8px 12px;border-radius:8px">
<b>这串 Key 等于你的账号凭据</b> —— 我们会<b>加密存放</b>,页面上也只显示掩码;
不想再用时,把它清空保存即可(或去开放平台重置那串 Key)。
</p>
<?php if ($canWrite): ?>
<form method="post" action="<?= e(url('books/weread')) ?>">
<?= csrf_field() ?>
<input type="hidden" name="act" value="key_save">
<div class="field">
<label>微信读书 API Key</label>
<input class="input mono" name="api_key" autocomplete="off"
placeholder="<?= $hasKey ? e($masked) . '(已保存,留空并保存 = 清除)' : 'wrk-xxxxxxxxxxxx' ?>">
<span class="tip">
<?php if ($hasKey): ?>
当前已保存:<b class="mono"><?= e($masked) ?></b>。要换就把新的整串贴进来(会覆盖)。
<?php else: ?>
形如 <code class="mono">wrk-NVbX…dgAA</code>,只在你自己的账号里可见。
<?php endif; ?>
</span>
</div>
<div class="btn-row" style="margin-top:0">
<button class="btn" type="submit">保存</button>
</div>
</form>
<?php else: ?>
<p class="empty-hint">只读账号不能配置导入。</p>
<?php endif; ?>
</div>
<?php /* ==================== ② 拉取预览(先看再导)====================
⚠️ 必须有这一步:直接"一键全导"会把别人(或自己多年前)的书一次性灌进书架,
想撤回只能一本本删。先给个清单、让用户自己勾,是最省事也最不容易后悔的做法。 */ ?>
<?php if ($canWrite && $hasKey): ?>
<div class="card card-pad">
<h2 class="cinema-h2">从微信读书取数据</h2>
<form method="post" action="<?= e(url('books/weread')) ?>" class="inline-form">
<?= csrf_field() ?>
<input type="hidden" name="act" value="fetch">
<div class="btn-row" style="margin-top:0">
<button class="btn btn-sm" type="submit">拉取我的笔记清单</button>
</div>
<p class="tip" style="margin-top:6px">
会去微信读书取一次数据(你有笔记的书 + 每本书的划线/想法),可能要十几秒。
</p>
</form>
</div>
<?php endif; ?>
<?php if ($preview !== null): ?>
<div class="card card-pad">
<h2 class="cinema-h2">
发现 <?= (int)$nbCount ?> 本有笔记的书
<span class="hint">勾选要导入的,然后点下面的「导入选中」</span>
</h2>
<?php if (!$preview): ?>
<p class="empty-hint">微信读书里还没有带笔记的书。</p>
<?php else: ?>
<form method="post" action="<?= e(url('books/weread')) ?>">
<?= csrf_field() ?>
<input type="hidden" name="act" value="import">
<div class="wr-list">
<?php foreach ($preview as $p): ?>
<label class="wr-book">
<input type="checkbox" name="pick[]" value="<?= e((string)$p['bookId']) ?>"
<?= (int)$p['count'] > 0 ? 'checked' : '' ?>>
<span class="wr-main">
<span class="wr-title"><?= e((string)$p['title']) ?></span>
<?php if ((string)$p['author'] !== ''): ?>
<span class="small muted"><?= e((string)$p['author']) ?></span>
<?php endif; ?>
<span class="node-badge"><?= (int)$p['count'] ?> 条</span>
<?php if ((int)$p['local'] > 0): ?>
<span class="node-badge">书架里已有</span>
<?php else: ?>
<span class="node-badge">会新建</span>
<?php endif; ?>
</span>
<?php if (!empty($p['items'])): ?>
<span class="wr-sample">
<?php foreach ($p['items'] as $it): ?>
<span class="wr-q">
<?php if ((string)($it['quote'] ?? '') !== ''): ?>
<i><?= e(mb_substr((string)$it['quote'], 0, 60, 'UTF-8')) ?></i>
<?php endif; ?>
<?php if ((string)($it['content'] ?? '') !== ''): ?>
<em><?= e(mb_substr((string)$it['content'], 0, 60, 'UTF-8')) ?></em>
<?php endif; ?>
</span>
<?php endforeach; ?>
</span>
<?php endif; ?>
</label>
<?php endforeach; ?>
</div>
<div class="btn-row">
<button class="btn" type="submit">导入选中</button>
</div>
</form>
<?php endif; ?>
</div>
<?php endif; ?>
<?php /* ==================== ③ 另一条路:手动粘贴 ====================
⚠️ 两种方式都留着,不是重复:
· API Key 走"全自动",但要求用户愿意把 Key 交出来;
· 粘贴走"零授权",App 里「导出笔记」复制一段文字即可。
用户可能两个都用(比如只想导某一本书的几段)。 */ ?>
<div class="card card-pad">
<h2 class="cinema-h2">或者:手动粘贴笔记</h2>
<p class="small muted" style="margin:0 0 10px">
不想配 Key 也行 —— 在微信读书 App 里打开一本书 → 右上角「…」→ 导出笔记,
把复制到的文字粘到那里,效果一样。
</p>
<div class="btn-row" style="margin-top:0">
<a class="btn btn-ghost btn-sm" href="<?= e(url('books/notes_import')) ?>">去粘贴导入</a>
</div>
</div>