Files
FamilyBook/templates/settings/me.php
T
laoyang c3d00ad66a v24 第 20 批:拖动即时上传 / 观影图片带出 / 行程保存修复 / 日程红线与删除范围与多提醒 / 悬停统一(用户 9 条)
用户 9 条原话要点:
  ①「观影模块,编辑观影,已经保存的海报和票根、合影,都没带进来。」
  ②「个人设置页面,"只影响你自己看到的样子"这个提示删除,不要了。我怎么称呼家人,
     这个卡片,不要了。我的资料这个卡片,不要了。」
  ③「旅程模块,编辑行程,点击保存没有反应。」
  ④「所有上传图片视频和附件的模块,都允许多次拖动添加文件上传,拖动一个进去,
     就开始上传,还可以继续拖动,继续上传,最后统一保存即可。」
  ⑤「添加行程,线路名、承运方,都不要了。车辆,只在出行方式选择自驾时才出现,
     其他情况下默认不出现。出发地和到达地,应该在同一行。」
  ⑥「日程模块,周视图和日视图,应该在视图中间显示一条红线,用来表示当前进行的时间…
     用一个不断从上到下的红线,来表示当前时间在视图上的刻度和位置。」
  ⑦「对于重复的日程,当点击删除的时候,应该提示是删除这一次,还是全部都删除,
     还是删除这一次及以后的。」
  ⑧「日程的提醒,是可以多选的,就是说,一个日程,我可以选择让它 5 分钟提醒,
     10 分钟提醒等等。」
  ⑨「很多按钮的悬停效果非常奇怪,感觉纯粹是换了一个背景色…应该调整所有按钮的悬停效果,
     保持统一,但是不要单纯的换一个不协调的背景色。」

🔴 三个真根因(都是"看着不像 bug"的地方):
  1. **③ 点保存没反应 = `<form>` 嵌套**(HTML 非法):`trips/node_form.php` 的照片缩略图上
     套了 `<form action=photo_del>`,而整块在**外层行程表单内部**。浏览器解析到内层
     `</form>` 时**把外层表单提前关掉** → 「保存」按钮**掉出表单**(真机实测
     `button.form === null`)。源码里完全看不出,**只有真浏览器量 `btn.form` 才现形**;
     且**只有这段行程已经有照片时才触发** —— 所以表现为"有时候好、有时候坏"。
     → 按钮留在原位(布局不动),用 HTML5 `form="id"` 关联到**表单外**的独立表单。
  2. **⑤ 车辆藏不住(第 17 批就写过、一直没生效)**:`.field` 自己声明 `display:flex`,
     作者样式压过浏览器默认的 `[hidden]{display:none}` → `hidden` 形同虚设。
     **本项目第 4 次栽同一个坑**(.att-item / .pv / .pp-item 各一次)→ 补 `.field[hidden]`。
  3. **④ 拖动即时上传的卡片"看不见"**:模板给 `.stage-list` 加了 `hidden`(没人上传时
     不留空边框),JS 建卡片时忘了 `list.hidden = false` → 卡片在 DOM 里但整条清单
     `display:none`、尺寸 0×0。**HTTP 层断言全绿**(HTML 里确实有卡片),
     **只有真机量尺寸才发现** —— 由新写的真机探针抓到。

本批新增能力:
- **拖动即时上传**(第 4 条):新增 `upload_stage.php` + `app/StagedUpload.php` +
  `templates/_stage_drop.php`。拖进来 → **立刻** POST 到暂存目录 → 回 `stoken` →
  放进隐藏字段 `stage[]` → 保存时在 `attach_save_files()` 里**认领**(移文件 + 建附件行)。
  `media.php` 加 `?stage=` 预览(拖完立刻看得见缩略图)。
  ⚠️ 三个必须踩准:**串行队列**(并发会让缩略图顺序乱跳)、**提交守卫**
  (还有没传完就 preventDefault,否则"拖了但没保存上"必然发生)、**卡片清单要 un-hide**。
  ⚠️ 海报/票根走**独立字段名** `stage_poster`/`stage_ticket`(各自单槽位、要按比例重裁)。
  ⚠️ 落点**就近取**(`input.closest('.field')`):一个表单里多个上传区不能串到第一个去。
- **观影编辑带出已存图片**(第 1 条):编辑页显示海报 / 票根 / 合影 + 各自的删除入口;
  新增 `movies/media_del`(只删不换也能删,槽位走白名单);`movies/update` 收编辑页
  新选的照片时**合并**而不是替换(否则一编辑就把已有合影冲掉)。
- **行程表单**(第 5 条):去掉线路名 / 承运方(**库里的值保留**:UPDATE 时不参与,
  与 seat_info/gate 同一套);出发地/到达地包进 `.loc-row` 真同一行;车辆按自驾显隐。
- **当前时间红线**(第 6 条):位置在服务端算(与 `.tg-block` 同一套"24h = 100%"坐标),
  前端每分钟自己挪(对齐到下一分钟整再起定时器),跨午夜 reload;只画在**今天那一列**。
- **重复日程删除三档**(第 7 条):与「编辑」那三档同名同序(全部 / 这一次及以后 /
  只这一次)。「只删这一次」→ `skipOnce`(**绝不删整条系列**);「这一次及以后」→
  老系列截 UNTIL,**必须清掉 COUNT**(两者并存时 COUNT 优先,不清就截不断)。
- **提醒多选**(第 8 条):同列存逗号串(`5,15,60`);Schema 把它从 **INT 改 VARCHAR**
  (INT 存逗号串会被隐式转换,多档会静默只剩第一档);ICS 导出吐**多个 VALARM**。
- **悬停统一**(第 9 条):原来 14 种互不相干的 hover 底色 → 统一成**两套手法**:
  有底色 `filter: brightness(.92)` 同色系加深 + 轻抬升;描边白底 `--hov-veil` 中性薄雾
  + 边框微显。放在 CSS **最末**用一条兜底收口(新按钮自动继承),并把十几条旧规则
  清成"交给统一段"。`person_picker.js` 同时改为按需加载。

验证(本地全套):
- e2e **1004/0**(+21 条本批断言)· 升级 149/0 · 桌面几何 428/0 ·
  **真机探针 25/0**(连续拖两次 / 红线位置与颜色与几何 / 车辆显隐 / 出发到达同行)。
- **反向验证 5/5**:①删除按钮改回嵌套 form ②卡片清单不 un-hide ③观影编辑不渲染海报
  ④车辆隐藏失效 ⑤「只删这一次」做成删全部 —— 五种坏法全部被抓住,还原后复绿 1004/0。
  过程中还**抓到两条弱断言**(只查 DOM 有无、不查可见性/是否真渲染),已一并加强。
- 部署脚本静态断言段本地空跑 **305 条全过**。
2026-10-06 03:14:18 +08:00

259 lines
14 KiB
PHP
Raw 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
/**
* 个人设置 —— 「我自己的」设置。
*
* 与「系统设置」(?r=settings,仅管理员)的分工:
* · 系统设置改一次**全家都变**:slogan 兜底、附件存储、运行环境、**公共分组**;
* · 个人设置只影响**我自己看到的样子**:我自己的分组、天气地点、首页与导航的模块。
*
* ⚠️ 「我的资料」表单**不在这页**(用户明确要求合并):
* 「编辑成员」和「改自己的资料」本来就是一件事,所以只剩
* `templates/people/form.php` 那一张表单,两个入口都指过去。
*
* ────────────────────────────────────────────────────────────────
* v24 第 20 批 第 2 条(用户明确"不要了"的三处,都已删除):
* ① 页头那句副标题「只影响你自己看到的样子」—— **删掉**(用户点名);
* ② 「我怎么称呼家人」整张卡片(templates/settings/_nicknames.php)
* —— **不再加载**。⚠️ 「我叫他什么」这个能力本身还在(名册/详情页里照常出现、
* `person_name()` 照常按昵称显示);只是不再在这页单独占一张卡。
* 所以是"撤掉入口"而不是"删功能",数据一个字没动。
* ③ 「我的资料」卡片(姓名/头像/生日那句 + 两个按钮)—— **删掉**。
* ⚠️ 改资料的入口在别处都还有:右上角头像下拉 →「个人设置」进来后有页头那个
* 「编辑我的资料」按钮,名册与详情页也各有「编辑资料」;所以不会"进不去"。
* 页头那个按钮**保留**(它就是"我的资料"现在唯一的入口,删了就真没地方点了)。
*/
$groupCounts = $groupCounts ?? [];
$groupTotal = count($groups);
$rosterCount = $rosterCount ?? 0;
?>
<div class="page-head">
<h1>个人设置</h1>
<?php /* v24 第 20 批 第 2 条:副标题「只影响你自己看到的样子」按用户要求删除 */ ?>
<div class="actions">
<a class="btn btn-sm" href="<?= e(url('people/edit', ['id' => (int)$person['id']])) ?>">编辑我的资料</a>
<a class="btn btn-ghost btn-sm" href="<?= e(url('people/show', ['id' => (int)$person['id']])) ?>">看我的详情页</a>
<?php if (\App\Auth::isAdmin()): ?>
<a class="btn btn-ghost btn-sm" href="<?= e(url('settings')) ?>">系统设置</a>
<?php endif; ?>
</div>
</div>
<?php /* v24 第 20 批 第 2 条:原来这里有两块,用户要求都删掉 ——
① 「我的资料」卡片(姓名 + slogan + 「编辑我的资料 / 改登录密码」两个按钮)
② 「我怎么称呼家人」卡片(require _nicknames.php)
下面直接接天气地点。改登录密码在右上角头像下拉里也有入口。 */ ?>
<!-- ==================== 天气地点(用户 2026-10-03 第 1 条)==================== -->
<?php /* 原话:「天气这个这样吧,让用户在个人设置中填写自己的城市。」
所以地点从系统设置搬到了这里 —— 而且改成**城市名**,不是经纬度:
填坐标是我们要解决的实现细节(App\Geo 内置 197 个地级市离线查),
不该甩给用户。内置表里没有的(镇 / 村 / 海外)才需要填坐标。 */ ?>
<div class="card card-pad" id="weather" style="margin-top:20px">
<h2 class="section-title">
天气 · 我所在的城市
<?php /* v24 第 20 批 第 2 条:这里的 "只影响你自己首页上的那一格" 保留 ——
用户点名要删的是页头那句副标题,不是这一处。 */ ?>
<span class="hint">只影响你自己首页上的那一格</span>
</h2>
<p class="small muted" style="margin:0 0 16px">
填个城市名就行(如「青岛」)。首页那句问候旁边会显示这儿的天气 ——
<b>每人一份</b>,孩子在外地读书,他填他的、你看你的。
<br>留空就是不显示天气(不影响别的东西)。
</p>
<form method="post" action="<?= e(url('settings/weather')) ?>">
<?= csrf_field() ?>
<div class="form-grid">
<div class="field">
<label for="w-city">城市</label>
<input class="input" id="w-city" name="city" maxlength="30"
value="<?= e((string)($weatherCity ?? '')) ?>"
placeholder="如:青岛 / 山东青岛 / 内蒙古包头" autocomplete="off">
</div>
<div class="field">
<label for="w-lat">纬度(可选)</label>
<input class="input" id="w-lat" name="lat" value="<?= e((string)($weatherLat ?? '')) ?>"
placeholder="内置表里没有的地方才需要">
</div>
<div class="field">
<label for="w-lon">经度(可选)</label>
<input class="input" id="w-lon" name="lon" value="<?= e((string)($weatherLon ?? '')) ?>"
placeholder="如 120.38">
</div>
</div>
<div class="btn-row">
<button class="btn" type="submit">保存天气地点</button>
</div>
</form>
<?php if (!empty($weatherAt)): ?>
<p class="small muted" style="margin:12px 0 0">
现在按 <b><?= e((string)$weatherAt['place']) ?></b>
(<?= e((string)$weatherAt['lat']) ?> , <?= e((string)$weatherAt['lon']) ?>)取天气。
<?php if (($weatherCity ?? '') !== ''): ?>
不是这里?换个写法试试,比如加上省份:「山东青岛」。
<?php endif; ?>
</p>
<?php elseif (($weatherCity ?? '') !== ''): ?>
<p class="small muted" style="margin:12px 0 0">
<b class="warn-label">这个城市名没认出坐标</b>(首页就看不到天气了)。
换个写法试试(如「山东青岛」),或者直接填经纬度。
</p>
<?php endif; ?>
</div>
<?php
// 内置表里有几个城市,直接说清楚 —— 用户不用猜"到底支持哪些"
$fbCityN = count(\App\Geo::CITIES);
?>
<p class="small muted" style="margin:10px 2px 0">
内置了 <b><?= (int)$fbCityN ?></b> 个城市(全国地级市 + 直辖市),一般常用的都在里面。
</p>
<!-- ==================== 我的分组 ==================== -->
<div class="card card-pad" style="margin-top:20px">
<h2 class="section-title">
我的分组
<span class="hint">公共的 + 我自己加的</span>
</h2>
<p class="small muted" style="margin:0 0 16px">
名册是按「关系分组」分栏显示的。这里有两层:
<b>公共分组</b>由管理员在「系统设置」里维护(全家都能用);
你要是觉得不够,就在下面<b>加只给自己看的分组</b>,别人看不到、也不受影响。
<br>
列表里 <b>{{ 公共 }}</b> 标的是大家共用的那几个。
哪一组排前面也是你自己的习惯,用 ▲ ▼ 调 —— 别人看到的顺序不变。
<br>
你的名册现在有 <b><?= (int)$rosterCount ?></b> 人。
</p>
<?php if (!$groups): ?>
<p class="small muted" style="margin:0 0 14px">还没有分组。加一个吧。</p>
<?php else: ?>
<ol class="order-list">
<?php foreach ($groups as $i => $g): $gid = (int)$g['id']; $own = (int)$g['owner_id']; ?>
<li class="order-row">
<span class="order-no"><?= $i + 1 ?></span>
<span class="order-name">
<?= e((string)$g['name']) ?>
<?php if ($own === 0): ?><span class="badge">公共</span><?php else: ?><span class="badge badge-open">我的</span><?php endif; ?>
</span>
<span class="order-count"><?= (int)($groupCounts[$gid] ?? 0) ?> 人</span>
<form method="post" action="<?= e(url('settings/groups/move')) ?>" class="order-move">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= $gid ?>">
<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 === $groupTotal - 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
// 只有我自己建的分组才给改名 / 删除 —— 公共分组要在系统设置里改(那是管理员的事),
// 免得有人在自己设置里把"家人"改成别的、影响全家。
$mineGroups = array_values(array_filter($groups, fn($g) => (int)$g['owner_id'] > 0));
?>
<?php if ($mineGroups): ?>
<ul class="group-manage" style="margin-top:14px">
<?php foreach ($mineGroups as $g): $gid = (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="<?= $gid ?>">
<input type="hidden" name="scope" value="me">
<label class="sr-only" for="gname<?= $gid ?>">分组名</label>
<input class="input" id="gname<?= $gid ?>" 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)($groupCounts[$gid] ?? 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="<?= $gid ?>">
<input type="hidden" name="scope" value="me">
<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>
<!-- ==================== 首页上的模块(用户 2026-10-03 第 3 条)==================== -->
<?php /* 与下面「导航条上的模块」是同一套交互(勾选 + 拖动/▲▼ 排序),
只是作用对象换成首页 dashboard 上那几张模块卡。
两块都要有:导航条管"能不能进",这里管"首页上先看到什么"。 */ ?>
<div class="card card-pad" id="home-mods" style="margin-top:20px">
<h2 class="section-title">
首页上的模块
<span class="hint">勾上才会出现在首页,拖动可改顺序</span>
</h2>
<p class="small muted" style="margin:0 0 16px">
首页是"一眼看家里近况"的地方,模块太多会变成一面墙 —— 这里只挑你想每天看到的几个。
关掉的模块<b>照样能从顶部导航条进去</b>,只是不在首页上占位置。
</p>
<form method="post" action="<?= e(url('settings/home_save')) ?>" id="homeForm">
<?= csrf_field() ?>
<ol class="order-list mod-order" id="homeOrderList">
<?php
$hOn = array_map('strval', (array)($homeOn ?? []));
$hOrder = (array)($homeOrder ?? []);
?>
<?php foreach ($hOrder as $i => $k): ?>
<li class="order-row mod-row" draggable="true" data-key="<?= e($k) ?>">
<span class="drag-handle" title="拖我排序" aria-hidden="true">⋮⋮</span>
<input type="hidden" name="order[]" value="<?= e($k) ?>">
<label class="mod-pick">
<input type="checkbox" name="on[]" value="<?= e($k) ?>"
<?= in_array($k, $hOn, true) ? 'checked' : '' ?>>
<span class="color-preview"
style="background: <?= e(\App\Module::color($k, (int)\App\Auth::familyId())) ?>;"></span>
<span class="order-name"><?= e(\App\Module::name($k)) ?></span>
</label>
<span class="order-move">
<button class="btn btn-ghost btn-sm" type="submit" name="move" value="up:<?= e($k) ?>"
title="上移" <?= $i === 0 ? 'disabled' : '' ?>>▲</button>
<button class="btn btn-ghost btn-sm" type="submit" name="move" value="down:<?= e($k) ?>"
title="下移" <?= $i === count($hOrder) - 1 ? 'disabled' : '' ?>>▼</button>
</span>
</li>
<?php endforeach; ?>
</ol>
<div class="btn-row">
<button class="btn" type="submit" name="save" value="1">保存首页显示</button>
</div>
</form>
</div>
<!-- ==================== 模块:导航条上显示哪些、各自什么主题色 ==================== -->
<?php
$navKeys = \App\Module::navFor((int)\App\Auth::personId());
$colors = \App\Module::colors((int)\App\Auth::familyId());
require __DIR__ . '/_modules.php';
?>