用户 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 条全过**。
268 lines
13 KiB
PHP
268 lines
13 KiB
PHP
<?php
|
||
/**
|
||
* 资源(v12):挂在某人名下的附属信息(证件、照片、账号…)。
|
||
*
|
||
* 两条交互上的讲究:
|
||
* ① **默认折叠**:一屏几十条正文会很长,列表只露标题行(原生 <details>,
|
||
* 没 JS 也能开合),点开才看正文与附件。
|
||
* ② **归属于谁**:每条都挂在一个具体的人名下(不是"家庭共享"),
|
||
* 所以列表上一定看得到"这是谁的",新建时必须选归属人。
|
||
*
|
||
* @param array $rows 我能看到的资源(带 perm / owner_nick)
|
||
* @param array $people 名册(新建时选归属人、共享给别人)
|
||
* @param array $attachs resource_id => 附件列表
|
||
* @param array $shares resource_id => 共享列表
|
||
*/
|
||
$isEditing = !empty($editing);
|
||
$canWrite = \App\Auth::canWrite();
|
||
?>
|
||
<div class="page-head">
|
||
<h1>资源</h1>
|
||
<span class="sub">共 <?= count($rows) ?> 条</span>
|
||
<div class="actions">
|
||
<?php if ($canWrite): ?>
|
||
<button class="btn" type="button" id="resAddBtn"><?= $isEditing ? '收起' : '新建资源' ?></button>
|
||
<?php else: ?>
|
||
<span class="link-quiet">只读账号</span>
|
||
<?php endif; ?>
|
||
</div>
|
||
</div>
|
||
|
||
<?php /* v24(用户 2026-10-02 第 18 条):**新建资源页**去掉「搜索资源」——
|
||
资源本来就不多,搜索框反而把「新建」按钮挤下去了。
|
||
⚠️ 但 2026-10-03 第 6 / 10 条把搜索**请回列表页**了,而且是"上来就是搜索":
|
||
资源会越攒越多(第 10 条原话:「可能会非常多」),没有搜索就只能滚动。
|
||
两件事不矛盾:新建那块仍然干净,搜索长在**列表**上。
|
||
区别在于现在是页面顶部的**第一块**,不是夹在新建表单里的一个输入框。 */ ?>
|
||
|
||
<div class="card card-pad res-search-card">
|
||
<form class="search res-search" method="get" action="index.php">
|
||
<input type="hidden" name="r" value="resources">
|
||
<input type="hidden" name="sort" value="<?= e($sort) ?>">
|
||
<label class="sr-only" for="resKw">搜索资源</label>
|
||
<input class="input" id="resKw" name="keyword" value="<?= e($keyword) ?>"
|
||
placeholder="搜标题 / 正文,如「身份证」" autocomplete="off">
|
||
<button class="btn btn-ghost btn-sm" type="submit">搜索</button>
|
||
<?php if ($keyword !== ''): ?>
|
||
<a class="btn btn-ghost btn-sm" href="<?= e(url('resources')) ?>">清除</a>
|
||
<?php endif; ?>
|
||
</form>
|
||
<?php /* 排序:最新新增 / 最近改动。用链接而不是下拉,一眼看出当前按什么排的。 */ ?>
|
||
<div class="res-sortbar">
|
||
<span class="small muted">排序</span>
|
||
<span class="seg">
|
||
<a class="seg-btn<?= $sort === 'used' ? ' is-on' : '' ?>"
|
||
href="<?= e(url('resources', ['sort' => 'used', 'keyword' => $keyword])) ?>">最近改动</a>
|
||
<a class="seg-btn<?= $sort === 'new' ? ' is-on' : '' ?>"
|
||
href="<?= e(url('resources', ['sort' => 'new', 'keyword' => $keyword])) ?>">最新新增</a>
|
||
</span>
|
||
<?php if (!$showAll && $totalAll > count($rows)): ?>
|
||
<a class="link-quiet res-showall" href="<?= e(url('resources', ['sort' => $sort, 'keyword' => $keyword, 'all' => 1])) ?>">
|
||
显示全部 <?= (int)$totalAll ?> 条
|
||
</a>
|
||
<?php endif; ?>
|
||
</div>
|
||
</div>
|
||
|
||
<?php if ($canWrite): ?>
|
||
<div class="card card-pad" id="resAddCard" <?= $isEditing ? '' : 'hidden' ?>>
|
||
<h2 class="cinema-h2"><?= $isEditing ? '编辑资源' : '新建资源' ?></h2>
|
||
<form method="post" enctype="multipart/form-data"
|
||
action="<?= e(url($isEditing ? 'resources/update' : 'resources/create')) ?>">
|
||
<?= csrf_field() ?>
|
||
<?php if ($isEditing): ?>
|
||
<input type="hidden" name="id" value="<?= (int)$editing['id'] ?>">
|
||
<?php endif; ?>
|
||
<div class="form-grid">
|
||
<div class="field">
|
||
<label>归属于谁 *</label>
|
||
<?php /* v24 第 11 条:与全局选人组件统一(原来是下拉,名册一长就难找) */ ?>
|
||
<?php
|
||
$ppName = 'owner_id';
|
||
$ppPeople = $people;
|
||
$ppSelected = [(int)($editing['owner_id'] ?? (int)\App\Auth::personId())];
|
||
$ppMode = 'single';
|
||
$ppOpenBtn = '选择归属人';
|
||
$ppTitle = '资源归属于谁';
|
||
$ppEmptyText = '未选择';
|
||
require __DIR__ . '/../_person_picker.php';
|
||
?>
|
||
</div>
|
||
<div class="field">
|
||
<label for="rs-title">标题 *</label>
|
||
<input class="input" id="rs-title" name="title" required
|
||
value="<?= e($editing['title'] ?? '') ?>" placeholder="如:身份证 / 学位证">
|
||
</div>
|
||
<div class="field full">
|
||
<label for="rs-content">正文</label>
|
||
<textarea class="input" id="rs-content" name="content" rows="3"
|
||
placeholder="编号、有效期、放在哪里…"><?= e($editing['content'] ?? '') ?></textarea>
|
||
</div>
|
||
<div class="field full">
|
||
<label for="rs-file">附件(可多选)</label>
|
||
<input class="input" type="file" id="rs-file" name="attach[]" multiple>
|
||
<?php $sdSlot = 'photo'; $sdHint = '也可以把文件直接拖到这里 —— 拖一个就开始上传,可以接着再拖,最后点「保存」/「新建」一起记下。'; require __DIR__ . '/../_stage_drop.php'; ?>
|
||
</div>
|
||
</div>
|
||
<div class="btn-row">
|
||
<button class="btn" type="submit"><?= $isEditing ? '保存' : '新建' ?></button>
|
||
<?php if ($isEditing): ?>
|
||
<a class="btn btn-ghost" href="<?= e(url('resources')) ?>">取消</a>
|
||
<?php endif; ?>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<div class="card card-pad">
|
||
<h2 class="cinema-h2">
|
||
资源列表
|
||
<?php
|
||
// ⚠️ 提示语要说清"为什么只有这些":
|
||
// · 搜索时只有几条是**因为搜索**(不是被截断)→ 别在这儿提"只显示最新 10 条",
|
||
// 否则用户会以为"搜出来的结果又被砍了";
|
||
// · 没搜索又确实多于 10 条,才提示截断,并给出"显示全部"。
|
||
?>
|
||
<?php if ($keyword !== ''): ?>
|
||
<span class="hint">匹配「<?= e($keyword) ?>」的 <?= count($rows) ?> 条</span>
|
||
<?php elseif (!$showAll && $totalAll > count($rows)): ?>
|
||
<span class="hint">只显示最新的 <?= (int)$limit ?> 条(共 <?= (int)$totalAll ?> 条)</span>
|
||
<?php else: ?>
|
||
<span class="hint">共 <?= count($rows) ?> 条</span>
|
||
<?php endif; ?>
|
||
</h2>
|
||
<?php if (!$rows): ?>
|
||
<p class="empty-hint">
|
||
<?= $keyword !== ''
|
||
? '没有匹配「' . e($keyword) . '」的资源,换个词试试。'
|
||
: '还没有资源。证件、照片、账号这些"挂在某人名下的东西"都可以记在这里。' ?>
|
||
</p>
|
||
<?php else: ?>
|
||
<div class="res-list">
|
||
<?php foreach ($rows as $r): ?>
|
||
<?php $rid = (int)$r['id']; $as = $attachs[$rid] ?? []; $sh = $shares[$rid] ?? []; ?>
|
||
<details class="res-item">
|
||
<summary class="res-head">
|
||
<span class="res-title"><?= e((string)$r['title']) ?></span>
|
||
<?php /* 归属人标签:查询里"人"的字段没加前缀(owner_name / avatar / avatar_color),
|
||
只有昵称带 owner_ 前缀 —— 在这里拼成 person_chip 认的形状。 */ ?>
|
||
<?= person_chip([
|
||
'id' => (int)$r['owner_id'], 'name' => (string)$r['owner_name'],
|
||
'my_nickname' => (string)($r['owner_nick'] ?? ''),
|
||
'avatar' => $r['avatar'] ?? null, 'avatar_color' => $r['avatar_color'] ?? null,
|
||
]) ?>
|
||
<span class="node-badge"><?= e(\App\Resource::permWord((string)$r['perm'])) ?></span>
|
||
<?php if ($as): ?><span class="res-n"><?= count($as) ?> 个附件</span><?php endif; ?>
|
||
</summary>
|
||
<div class="res-body">
|
||
<?php if (!empty($r['content'])): ?>
|
||
<p class="info-text"><?= nl2br(e((string)$r['content'])) ?></p>
|
||
<?php else: ?>
|
||
<p class="empty-hint">(没有正文)</p>
|
||
<?php endif; ?>
|
||
|
||
<?php
|
||
$attRows = $as;
|
||
$attCanEdit = $canWrite && \App\Resource::canWrite($r, (int)\App\Auth::personId());
|
||
$attDelUrl = 'resources/attach_del';
|
||
$attDelField = 'id';
|
||
$attExtra = [];
|
||
require __DIR__ . '/../_attachments.php';
|
||
?>
|
||
|
||
<?php if ($sh): ?>
|
||
<div class="res-shares">
|
||
<span class="res-label">共享给</span>
|
||
<?php foreach ($sh as $s): ?>
|
||
<?= person_chip($s) ?>
|
||
<span class="node-badge"><?= ($s['perm'] ?? '') === 'write' ? '可读写' : '只读' ?></span>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<?php if ($canWrite && \App\Resource::canWrite($r, (int)\App\Auth::personId())): ?>
|
||
<div class="res-ops">
|
||
<?php /* 补传附件 / 共享设置 / 编辑 / 删除 —— 每个都是独立的小表单,
|
||
不套在别的表单里(<form> 嵌套会让浏览器把外层切开)。 */ ?>
|
||
<form class="inline-form" method="post" enctype="multipart/form-data"
|
||
action="<?= e(url('resources/attach_add')) ?>">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="id" value="<?= $rid ?>">
|
||
<input type="file" name="attach[]" multiple required>
|
||
<button class="btn btn-ghost btn-sm" type="submit">补传附件</button>
|
||
</form>
|
||
|
||
<details class="res-share-add">
|
||
<summary class="link-quiet">共享设置</summary>
|
||
<form class="inline-form" method="post" action="<?= e(url('resources/share')) ?>">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="id" value="<?= $rid ?>">
|
||
<?php
|
||
$ppName = 'person_id';
|
||
$ppPeople = array_values(array_filter($people,
|
||
fn($p) => (int)$p['id'] !== (int)$r['owner_id']));
|
||
$ppSelected = [];
|
||
$ppMode = 'single';
|
||
$ppOpenBtn = '选择要共享给谁';
|
||
$ppTitle = '共享给谁';
|
||
$ppEmptyText = '未选择';
|
||
require __DIR__ . '/../_person_picker.php';
|
||
?>
|
||
<select class="select" name="perm">
|
||
<option value="read">只读</option>
|
||
<option value="write">可读写</option>
|
||
</select>
|
||
<button class="btn btn-sm" type="submit">共享</button>
|
||
</form>
|
||
<?php foreach ($sh as $s): ?>
|
||
<form class="inline-form" method="post" action="<?= e(url('resources/unshare')) ?>">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="id" value="<?= $rid ?>">
|
||
<input type="hidden" name="person_id" value="<?= (int)$s['person_id'] ?>">
|
||
<span class="cal-share-name"><?= e(person_name($s)) ?></span>
|
||
<button class="btn btn-ghost btn-sm" type="submit">取消共享</button>
|
||
</form>
|
||
<?php endforeach; ?>
|
||
</details>
|
||
|
||
<a class="btn btn-ghost btn-sm" href="<?= e(url('resources', ['edit' => $rid])) ?>">编辑</a>
|
||
<form method="post" action="<?= e(url('resources/destroy')) ?>"
|
||
onsubmit="return confirm('删除「<?= e((string)$r['title']) ?>」?附件会一起删掉。')">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="id" value="<?= $rid ?>">
|
||
<button class="btn btn-danger btn-sm" type="submit">删除</button>
|
||
</form>
|
||
</div>
|
||
<?php endif; ?>
|
||
</div>
|
||
</details>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php /* 用户第 10 条:截断的地方要留一个明确的出口,别让人以为"就只有这 10 条"。 */ ?>
|
||
<?php if (!$showAll && $totalAll > count($rows)): ?>
|
||
<div class="res-more">
|
||
<a class="btn btn-ghost btn-sm"
|
||
href="<?= e(url('resources', ['sort' => $sort, 'keyword' => $keyword, 'all' => 1])) ?>">
|
||
显示全部 <?= (int)$totalAll ?> 条
|
||
</a>
|
||
<span class="small muted">只按「<?= $sort === 'new' ? '最新新增' : '最近改动' ?>」取了前 <?= (int)$limit ?> 条 —— 找不到就直接搜。</span>
|
||
</div>
|
||
<?php endif; ?>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<?php if ($canWrite): ?>
|
||
<script>
|
||
(function () {
|
||
var btn = document.getElementById('resAddBtn');
|
||
var card = document.getElementById('resAddCard');
|
||
if (!btn || !card) return;
|
||
btn.addEventListener('click', function () {
|
||
card.hidden = !card.hidden;
|
||
btn.textContent = card.hidden ? '新建资源' : '收起';
|
||
if (!card.hidden) { card.scrollIntoView({ block: 'nearest' }); }
|
||
});
|
||
})();
|
||
</script>
|
||
<?php endif; ?>
|