Files
laoyang 8d79857f1a v54:首页任务标题截断(真根因=两列网格被撑破)/ 名册分组→标签且候选读词表 / 旅程地图视图 / 旅程设置按钮 / 显示方式默认列表或地图
用户 2026-10-16 傍晚五条。

① 首页「近期任务」标题太长会挤成两行
   用户原话:「首页**近期任务**那个地方要注意截断:如果任务标题太长,
   会把这个任务**挤成两行**。」
   🔴🔴 **真根因是两层,第一版只修了表面**:
     · 表面:`.dash-what` 只有 `flex:1 1 auto; min-width:0`,**缺** nowrap/hidden/ellipsis
       ⇒ 收缩后文字在框内换行;
     · 真身:`.home-duo` 是**两列 grid**,grid 子项默认 `min-width: auto`
       ("我最小也得装下我的内容")⇒ 一条长标题把那一列顶到 **1763px**
       (父 `home-duo` 才 1032px)⇒ **整个两列布局被撑破**、页面横向溢出到 **2089px**
       (视口 1440)。⇒ 行宽 1721px、`scrollWidth === clientWidth`,
       **`text-overflow: ellipsis` 看起来"没生效"** —— 其实容器自己先爆了。
   修法:`.home-duo > * { min-width: 0; }`,且 **整条 flex 链**都补
     (`.hd-pane` → `.hd-pane-head` → `.hd-pane-body` → `.dash-list/.tk-list` → `.tk-row`)
     —— 链上任何一层漏了,收缩就断在那一层、下面的 nowrap 全白写。
   配套:任务标题加 `title=` 悬停看全。
   ⚠️ 这是本项目**第二次**踩 flex/grid 的 `min-width:auto`(v53 的 `.mv-grid` 是同类)。
      **以后"文字截断不生效"先量容器有没有被撑破**。

② 名册「分组」→「标签」;打标签的候选要**从设置里读**
   用户原话:「现在名册里面给人打标签的时候,**这个标签数据是从哪读出来的**呀?
   在这个名册的设置页面,有很多分组,现在还叫分组。但是打标签的时候,
   **却不是从这些分组里读出来的**。……应该叫「名册标签」,是不是?
   **应该从这里面把所有标签都读出来**吧?……以后就没有分组的概念了,
   **全部都是标签的概念**。」
   🔴 **用户观察得完全正确,这是两套数据源**:
     · 设置页显示的词表来自 `person_groups`(**分组表**);
     · 打标签的候选来自 `PersonTag::cloud()`(**你已经打过的词**,现算的);
     ⇒ 两边根本不是一个数据源 ⇒ "设置里列着一堆、打标签时却只有几个"。
   修法:**`PersonTag::choices()` = 设置页词表 ∪ 我用过的词**(并集,词表在前)。
     · 词表里的词**还没用过**也能一点就打上(这正是词表的意义);
     · 用过的词补在后面(历史不丢);
     · 名册列表 / 新增 / 编辑 / 挑人 / 导入 **五处同一个函数**。
   界面口径全面改"标签"(**表名仍是 `person_groups`**:改名要背着 `PersonGroup` 类、
   `person_roster.group_id`、以及**另一个会话正在写的 `app/ApiHandler.php`**
   (它引用了 `PersonGroup::orderFor`)一起动,风险远大于收益):
     · `_person_groups.php` 标题「名册标签」、按钮「加一个我自己的标签」;
     · 删除文案改成"只是从候选里去掉这个词,已打在别人身上的不受影响"
       (**语义真的变了**:标签是各自身上的字符串,不是引用);
     · `people/_settings_menu.php`、`people/settings.php`、`settings/me.php`、
       `settings.php`(「公共分组」→「公共标签」)全部同步。
   顺带按"全部都是标签"改另两条入口:
     · `people/pick.php`「加进哪一组」下拉 → **打标签**;
     · `people/import.php` 同上;`ContactImporter::run()` 加 `$tags` 参数。
   🔴 新增 `PersonTag::addOne()`(**追加**一个标签)—— 这两处**绝不能用 `setFor()`**
      (它是"先 DELETE 再 INSERT"的整组替换)⇒ 会把人**原有**的标签清光
      (症状是"用一次导入,别人原有的标签全没了",极难联想)。
   ⚠️ `group_id` 在 pick/import 的**服务端仍收着**(老书签/脚本兼容),只是界面不再展示。

③ 旅程模块加**地图视图**(读 TripLog 移植)
   用户原话:「你去读一下 TripLog 的代码,在旅程这个模块,**可以在地图上显示旅程数据**。
   1. 先读一下它之前那个代码是怎么实现的,**在我们的旅程模块也实现一下**。」
   读 TripLog(`templates/activities/index.php`)得到的要点:
     · 用**高德 AMap**(合规白名单内,绝不是境外瓦片);
     · `position` 必须是 **[lng,lat] 数组**(传 `{lng,lat}` 裸对象会让 AMap 抛错、
       整个绘制循环当场中断 —— 它注释里写着"批 11 的光秃秃地图就是它");
     · `setFitView()` 后**上限 11 级**(只有一趟时会被放大到街道级,那是导航视角);
     · `.amap-marker` 整层 `pointer-events:none`(否则包装层挡住别家卡片的点击);
     · **容器必须有固定高度**(0 高度 → 空白地图)。
     它那套"同城环形扇开"是**几百行几何**,本仓数据量没压出这个问题 ⇒ **有意不做**。
   本仓数据更规整:`trip_nodes` 早有 `from_lng/from_lat/to_lng/to_lat`(v17 批)
   + `from_city/to_city` ⇒ 新增 `Trip::attachSpots()`:
     ① 有坐标取**重心**(不是端点 —— 端点会让"青岛→伊春"偏到某一头);
     ② 没坐标退到**城市重心**(`Geo::lookup` 离线城市表,**不发网络请求**:
        列表页几十趟若逐条打高德逆地理,一次开页就是几十个外部请求);
     ③ 都没有就不上图(列表里照常有,模板会说清"有几趟没上图")。
     🔴 城市那里**必须也取重心**:`cities()` 的顺序是**按时间**(出发地在最前),
        取"第一个城市"会让**所有旅程都叠在家上**、地图毫无信息量。
   布局:两个视图用**标签页**(`?view=map` 是**链接**不是纯 JS 按钮 ——
     书签/前进后退/无 JS 都正确;也**有意不**把地图藏在 `display:none` 里,
     高德在 0 尺寸容器里会渲染空白)。
   高德 SDK 加载器重构:原来 `fbLoadAddr()` 顺带拉 `addr_suggest.js`,
   而地图只用 SDK 自带的 `AMap.Map/Marker` ⇒ 抽出 `window.fbAmapSdk()`(只拉 SDK)、
   新增 `fb-amap` meta(不带 plugin),`fb-addr` 那份共用同一加载器。

④ 旅程列表页「新建旅程」**后面**加「设置」按钮
   用户原话:「2. 在旅程的「新建旅程」后面也加一个「设置」按钮。」
   ⇒ 补 `_settings_menu.php`(设置恒排最右),菜单**第一条**加「显示方式」。

⑤ 显示方式:默认列表还是地图(用户自配)
   用户原话:「3. 里面的设置让用户自己配置:**到底默认显示旅程列表,还是用地图显示**。」
   ⇒ 新增 `trips/display`(设置页 + `?set=` 快速设置)与 `trips/display_save`,
     存 **`user_settings.trip_default_view`**(每人一份,**不是**全家设置)。
   ⚠️ 访客也能改(只影响自己看到的默认,不是数据变更)。

验证(新增 2 套件 + 更新 e2e/deploy 断言):
 · _fb_v54_ui.py(**33 条**真机断言)
 · _b54_falsify.py(**11 注入 / 11 全抓**,基线 33/0)
 · e2e **1518/0**;familybook_deploy.sh 加「第54批形态」段(**24 条**)
 · 部署 **0 FAIL**;线上 **20 个文件 md5 逐字节一致**;
   线上实测:词表 24 条、`choices()` 24 条、**`cloud` 15 条全部 ⊆ `choices`**、
   4 趟旅程全部可上图(样例落在济南·青岛重心);诊断页已删复验 404

⚠️ 本轮踩坑(已写进 pitfalls.md):
 · 🔴🔴 **"文字截断不生效"要先量容器有没有被撑破**(第一嫌疑是 flex/grid 子项
   `min-width:auto`,不是 `text-overflow` 写错);
 · **反向断言("不该再出现 X")必须用 `_code_has`(剥注释)** ——
   需求原话正当留在注释里,裸 `grep -F` 会命中自己的说明(本轮部署假红一次);
 · **冗余防线会让反向验证打不红**(两处 `min-width:0` 只去掉一条 ⇒ 探针照旧全绿,
   注入必须一起去掉);
 · **界面多加一个字符就可能打歪既有断言**(我在词表管理页给标签名加了 `#`,
   把 e2e 的 `my_group_order()` 读成 `#家人`)。
2026-10-17 00:15:06 +08:00

149 lines
8.8 KiB
PHP
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<?php
/**
* 「名册标签」词表管理卡片 —— 从个人设置**搬出来**的(v52 用户 2026-10-15 第 6 条),
* v54(用户 2026-10-16 第 2 条)**从"分组"改口径为"标签词表"**。
*
* 用户原话(v52):「名册右侧,只保留一个添加成员按钮,右侧再加一个设置按钮,
* 点击后下拉设置,第一个就是导入联系人,第二个就是原来个人设置那里的
* **名册分组**,这样**个人设置中就不显示名册分组的内容**了。」
*
* 用户原话(v54,本次):「现在名册里面给人打标签的时候,这个标签数据是从哪读出来的呀?
* 在这个名册的设置页面,有很多分组,现在还叫分组。但是打标签的时候,
* 却不是从这些分组里读出来的。所以现在应该在这个设置页面,不应该再叫
* 「名册分组」了吧?应该叫「名册标签」,是不是?**应该从这里面把所有标签都读出来**吧?」
*
* 🔴 澄清一个容易混的点(也是用户困惑的根源):
* 这张卡背后的表仍然是 `person_groups`(**表名没改**,因为改名要背着
* `PersonGroup` 类、`person_roster.group_id`、其它会话正在写的 App-API 一起动,
* 风险远大于收益)—— 但它的**语义**从 v28 起就已经是"**标签词表**":
* 这里配的每个词,现在会出现在名册里打标签时的**候选列表**里
* (见 `App\PersonTag::choices()`:**这张表 ∪ 我用过的词**)。
*
* 所以:
* · 界面上**一律叫"标签"**,不再出现"分组"二字;
* · 这里加的词 = "预定义标签",还没用过也能一点就打上;
* · 某个人身上真有哪几个标签,仍然在名册卡片上那颗标签按钮里改。
*
* ⚠️ 表单 action 仍指向 `settings/groups/*`(**一个字段都没改**)——
* 它是"我自己的词表",与它挂在哪一页、叫什么名字无关;
* 换路由只会白白多一处要维护的东西(而且老书签/脚本会失效)。
*
* 变量(require 前设好;**入参仍用宿主那边的名字**,片段内部一律 pg* 前缀,见下):
* $groups PersonGroup::orderFor(...) 的结果(公共同我的)
* $groupCounts gid => 人数
* $rosterCount 我的名册人数
*/
/* ⚠️ 变量名**必须带片段前缀**(pg*):模板片段与宿主 `require` 是**共享作用域**,
用 `$groups` 这种通名会把宿主模板的同名变量覆盖掉(本项目有静态断言专门查这个)。 */
$pgGroups = (array)($groups ?? []);
$pgCounts = (array)($groupCounts ?? []);
$pgRosterN = (int)($rosterCount ?? 0);
$pgTotal = count($pgGroups);
?>
<div class="card card-pad">
<h2 class="section-title">
名册标签
<span class="hint">公共的 + 我自己加的</span>
</h2>
<p class="small muted" style="margin:0 0 16px">
这里配的是**给名册成员打标签时可以一点就选的词**。
<b>公共标签</b>由管理员在「系统设置」里维护(全家都能用);
你要是觉得不够,就在下面<b>加只给自己看的标签</b>,别人看不到、也不受影响。
<br>
一个人可以有多个标签(他既是「亲戚」又是「球友」),所以标签不分组、不分栏。
谁身上真有哪个标签,在名册里点他那张卡片上的标签按钮就能改。
<br>
列表里 <b>公共</b> 标的是大家共用的那几个。
哪个排前面也是你自己的习惯,用 ▲ ▼ 调 —— 别人看到的顺序不变。
<br>
你的名册现在有 <b><?= $pgRosterN ?></b> 人。
</p>
<?php if (!$pgGroups): ?>
<p class="small muted" style="margin:0 0 14px">还没有标签。加一个吧。</p>
<?php else: ?>
<ol class="order-list">
<?php foreach ($pgGroups as $i => $g): $pgGid = (int)$g['id']; $pgOwn = (int)$g['owner_id']; ?>
<li class="order-row">
<span class="order-no"><?= $i + 1 ?></span>
<span class="order-name">
<?php /* ⚠️ 这里**不加 `#`** —— 词表里存的是**词本身**(`家人`),
`#` 只是名册里打标签时的显示习惯(`#家人`)。
在词表管理页加上 `#`,会让人以为"输入时要带 #",
而实际 `PersonTag::clean()` 会把 `#` 剥掉 —— 两处显示不一致。
🔴 v54:e2e 的顺序断言 `my_group_order()` 抓的是 `<ol class="order-list">`
里 `order-name` 的**第一个子串**,多出来的 `#` 会让它读成 `#家人`
⇒ 断言红(这也是"界面多加一个字符就可能打歪既有断言"的又一例)。 */ ?>
<?= e((string)$g['name']) ?>
<?php if ($pgOwn === 0): ?><span class="badge">公共</span><?php else: ?><span class="badge badge-open">我的</span><?php endif; ?>
</span>
<span class="order-count"><?= (int)($pgCounts[$pgGid] ?? 0) ?> 人</span>
<form method="post" action="<?= e(url('settings/groups/move')) ?>" class="order-move">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= $pgGid ?>">
<input type="hidden" name="scope" value="me">
<button class="btn btn-ghost btn-sm" type="submit" name="dir" value="up"
title="上移一个" <?= $i === 0 ? 'disabled' : '' ?>>▲</button>
<button class="btn btn-ghost btn-sm" type="submit" name="dir" value="down"
title="下移一个" <?= $i === $pgTotal - 1 ? 'disabled' : '' ?>>▼</button>
</form>
</li>
<?php endforeach; ?>
</ol>
<?php endif; ?>
<form method="post" action="<?= e(url('settings/groups/add')) ?>" class="inline-form" style="margin-top:16px">
<?= csrf_field() ?>
<input type="hidden" name="scope" value="me">
<label class="sr-only" for="newMyGroup">新标签名</label>
<input class="input" id="newMyGroup" name="name" maxlength="20" placeholder="例如:球友、老同学">
<button class="btn btn-sm" type="submit">加一个我自己的标签</button>
</form>
<?php
// 只有我自己建的标签才给改名 / 删除 —— 公共标签要在系统设置里改(那是管理员的事),
// 免得有人在自己设置里把"家人"改成别的、影响全家。
$pgMine = array_values(array_filter($pgGroups, fn($g) => (int)$g['owner_id'] > 0));
?>
<?php if ($pgMine): ?>
<ul class="group-manage" style="margin-top:14px">
<?php foreach ($pgMine as $g): $pgGid = (int)$g['id']; ?>
<li class="group-manage-row">
<form method="post" action="<?= e(url('settings/groups/rename')) ?>" class="group-rename">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= $pgGid ?>">
<input type="hidden" name="scope" value="me">
<label class="sr-only" for="gname<?= $pgGid ?>">标签名</label>
<input class="input" id="gname<?= $pgGid ?>" name="name" maxlength="20"
value="<?= e((string)$g['name']) ?>">
<button class="btn btn-ghost btn-sm" type="submit">改名</button>
</form>
<span class="group-count muted small"><?= (int)($pgCounts[$pgGid] ?? 0) ?> 人</span>
<?php /* 删除做成两步(<details>),不用 JS 也能防手滑 —— 一点就没了太容易出事 */ ?>
<details class="del-wrap">
<summary class="btn btn-ghost btn-sm">删除</summary>
<form method="post" action="<?= e(url('settings/groups/delete')) ?>" class="del-confirm">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= $pgGid ?>">
<input type="hidden" name="scope" value="me">
<?php /* 🔴 v54:删词表的**成员语义变了** ——
原来它删的是"分组",挂在这一组的人会变成「未分类」;
现在它只是**从可选词里去掉这个词**,已经打在别人身上的标签**不受影响**
(标签是各自身上的字符串,不是引用)。文案必须说清,
否则用户以为"删了=把人身上的标签也摘了"。 */ ?>
<span class="small muted">只是从候选里去掉这个词,已经打在别人身上的不受影响,确定?</span>
<button class="btn btn-ghost btn-sm danger" type="submit">确认删除</button>
</form>
</details>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<?php if (\App\Auth::isAdmin()): ?>
<p class="small muted" style="margin:16px 0 0">
公共标签在「<a href="<?= e(url('settings')) ?>#public-groups">系统设置</a>」里维护。
</p>
<?php endif; ?>
</div>
<?php unset($pgGroups, $pgCounts, $pgRosterN, $pgTotal, $pgMine, $pgGid, $pgOwn, $g); ?>