laoyang/FamilyBook
1
0
Fork 0
Code Issues 29 Pull Requests Actions Packages Projects Releases Wiki Activity

v14: 观影/家谱/日程/旅程/资源/任务六模块统一，首页改 dashboard

Browse Source 
用户 14 条需求一次交付（1-13 功能 + 14 工作方式）。

观影（1-4）
- 返回文案全模块统一为「返回观影」（不再有「返回列表」「返回观影记录」三种叫法）
- 观影人一律用彩色人物标签 person_chip：底色由头像主色算出来（上传时存库），
  瀑布流卡片也按人显示；五处观影模板全部改用它
- 人员显示统一走 person_name()（shown → 我给他起的称呼 → 姓名）
- 影院管理页与年度报告页的上下两块用 .card + .card 统一给间距（原来紧贴成一整块）

家谱（5）
- 树根从「我」换成**辈分最高的祖先**：库画的是"树根的祖先链+后代+树根的兄弟姐妹"，
  根=我 时伯父/堂兄/嫂子/侄子一个都不画（12 人夹具只画出 8 人）
- focusMap 按**代数**圈定三代（不再按步数），normalizeLinks 把子女对称挂到父母双方
  —— 修掉"母亲登录看不到孩子"
- 新增「看全部 / 回到我」两个按钮，放在画布外（画布整块被库接管了手势）

统一事件原语（6-9）
- 旅程：TripLog 全量迁入（3 趟旅程 / 21 段行程 / 72 张照片 / 5 个人）。
  复用 events(kind='trip') + trip_details + trip_nodes（计划/执行双轨保留）
- 日程：每人可建日历本（自定义色）+ 共享只读/可写；观影与旅行是每人默认两本，
  内容是**从各模块实时派生**的（不复制，所以改了观影日期日历立刻跟着变）；
  没有具体时分 = 全天；月视图参照群晖 Calendar
- 资源：挂在某人名下的附属信息（标题+正文+多附件），可共享给多人并设只读/读写，
  默认折叠、可搜标题与正文
- 任务：看板三列 + 两级子任务 + 评论@人 + 共享 + 循环（完成时按原截止日推下一期）
- 统一附件表：四个模块的附件共用一张，下载地址不落库、一律由 media.php 现算

模块化（10-11）
- App\Module 是模块的唯一来源（加一行 = 导航条/主题色/个人设置三处自动出现）
- 个人设置里可勾选要显示哪些模块、拖动排序（关掉的模块**不会**被兜底补回来）
- 每个模块一套主题色（家庭级），只覆盖 --brand 三兄弟，不碰纸墨底色

其他（12-13）
- 新增成员表单可选所属分组（编辑表单没有：分组是"我和他的关系"，只归我自己）
- 首页改 dashboard：接下来的日子 / 未来七天 / 手头在做 / 往年今日。
  家人卡片从首页撤走（看人去名册）

验证（全部通过）
- e2e 542 条（新增 4 模块端到端 60+ 条）
- 桌面几何 368 / 移动端几何 520 / 家谱 12 / 交互 97 / 老库升级 123
- SQL 列名静态校验 0 处可疑（对着真实表结构）
- 反向验证 18 条新注入全部抓住

顺带修掉的既有问题
- 老库升级回填 SQL 按实际存在的列动态拼（缺列不再 1054 炸断升级）
- 全新安装时 Schema::ensure 跑在"人还没建"之前 → 补建日历本三处齐备
- 窄屏导航横向溢出（模块从 4 个加到 8 个后顶栏撑破视口）
This commit is contained in:
laoyang
2026-10-02 09:28:07 +08:00
parent 7f00d3e553
commit 71a7ec35a0
42 changed files with 6770 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/calendar/calendars.php
+175
View File
@@ -0,0 +1,175 @@
<?php
/**
* 日历本管理（v12）：建本 / 改名 / 换色 / 删除 / 共享给别人（只读或可写）。
*
* ⚠️ 「观影」「旅行」两本是系统预置的，不能改名也不能删 ——
* 它们的日程是从观影模块与旅程模块实时汇总出来的，删掉就再也回不来了
* （Calendar::delete 里也只删 kind='custom'，这里是同一道栅栏的界面侧）。
*
* @param array $cals 我自己的日历本（kind 任意）
* @param array $shared 别人共享给我的
* @param array $people 名册（共享下拉用）
*/
$isEditing = !empty($editing);
$canWrite = \App\Auth::canWrite();
?>
<div class="page-head">
<h1>日历本</h1>
<span class="sub">共 <?= count($cals) ?> 本<?= $shared ? '，别人共享给我 ' . count($shared) . ' 本' : '' ?></span>
<div class="actions">
<a class="btn btn-ghost" href="<?= e(url('calendar')) ?>">返回日程</a>
</div>
</div>
<?php if (!$canWrite): ?>
<div class="card card-pad empty"><b>只读账号</b>访客只能查看日历本，不能新建或修改。</div>
<?php else: ?>
<div class="card card-pad">
<h2 class="cinema-h2"><?= $isEditing ? '编辑日历本' : '新建日历本' ?></h2>
<form method="post" action="<?= e(url($isEditing ? 'calendar/cal_update' : 'calendar/cal_add')) ?>">
<?= csrf_field() ?>
<?php if ($isEditing): ?>
<input type="hidden" name="id" value="<?= (int)$editing['id'] ?>">
<?php endif; ?>
<div class="form-grid">
<div class="field">
<label for="cb-name">名字 *</label>
<input class="input" id="cb-name" name="name" required
value="<?= e(old('name', $editing['name'] ?? '')) ?>" placeholder="如：体检 / 值日">
</div>
<div class="field">
<label for="cb-color">颜色</label>
<div class="color-row">
<input type="color" id="cb-color" name="color" class="color-picker"
value="<?= e(old('color', $editing['color'] ?? '#4A7C82')) ?>">
<span class="color-hex"><?= e(old('color', $editing['color'] ?? '#4A7C82')) ?></span>
<span class="preset-palette">
<?php foreach (\App\Calendar::PRESET_CAL_COLORS as $pc): ?>
<span class="preset-color" data-color="<?= $pc ?>" style="background: <?= $pc ?>;" title="<?= $pc ?>"></span>
<?php endforeach; ?>
</span>
</div>
</div>
</div>
<div class="btn-row">
<button class="btn" type="submit"><?= $isEditing ? '保存' : '新建' ?></button>
<?php if ($isEditing): ?>
<a class="btn btn-ghost" href="<?= e(url('calendar/calendars')) ?>">取消</a>
<?php endif; ?>
</div>
</form>
</div>
<?php endif; ?>
<div class="card card-pad">
<h2 class="cinema-h2">我自己的</h2>
<?php if (!$cals): ?>
<p class="empty-hint">还没有日历本。</p>
<?php else: ?>
<div class="table-wrap">
<table class="table">
<thead>
<tr><th>名字</th><th>颜色</th><th>共享给</th><?php if ($canWrite): ?><th>操作</th><?php endif; ?></tr>
</thead>
<tbody>
<?php foreach ($cals as $c): ?>
<tr>
<td>
<b><?= e((string)$c['name']) ?></b>
<?php if (($c['kind'] ?? '') !== 'custom'): ?>
<span class="node-badge">系统预置</span>
<?php endif; ?>
</td>
<td>
<span class="color-preview" style="background: <?= e((string)$c['color']) ?>;"></span>
<span class="mono"><?= e((string)$c['color']) ?></span>
</td>
<td>
<?php $sh = $shares[(int)$c['id']] ?? []; ?>
<?php if (!$sh): ?>
<span class="link-quiet">不共享</span>
<?php else: ?>
<div class="trip-people">
<?php foreach ($sh as $s): ?>
<?= person_chip($s) ?>
<span class="node-badge"><?= ($s['perm'] ?? '') === 'write' ? '可写' : '只读' ?></span>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php if ($canWrite && $people): ?>
<details class="node-add">
<summary class="link-quiet">共享设置</summary>
<form class="inline-form" method="post" action="<?= e(url('calendar/cal_share')) ?>">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= (int)$c['id'] ?>">
<select class="select" name="person_id">
<?php foreach ($people as $p): ?>
<?php if ((int)$p['id'] === (int)\App\Auth::personId()) { continue; } ?>
<option value="<?= (int)$p['id'] ?>"><?= e(person_name($p)) ?></option>
<?php endforeach; ?>
</select>
<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('calendar/cal_unshare')) ?>">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= (int)$c['id'] ?>">
<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>
<?php endif; ?>
</td>
<?php if ($canWrite): ?>
<td>
<div class="actions">
<?php if (($c['kind'] ?? '') === 'custom'): ?>
<a class="btn btn-ghost btn-sm"
href="<?= e(url('calendar/calendars', ['edit' => (int)$c['id']])) ?>">编辑</a>
<form method="post" action="<?= e(url('calendar/cal_del')) ?>"
onsubmit="return confirm('删除「<?= e((string)$c['name']) ?>」？本子里的日程会一起删掉。')">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= (int)$c['id'] ?>">
<button class="btn btn-danger btn-sm" type="submit">删除</button>
</form>
<?php else: ?>
<span class="link-quiet">不可改</span>
<?php endif; ?>
</div>
</td>
<?php endif; ?>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<?php endif; ?>
</div>
<?php if ($shared): ?>
<div class="card card-pad">
<h2 class="cinema-h2">别人共享给我的</h2>
<div class="table-wrap">
<table class="table">
<thead><tr><th>名字</th><th>谁的</th><th>我的权限</th></tr></thead>
<tbody>
<?php foreach ($shared as $c): ?>
<tr>
<td><b><?= e((string)$c['name']) ?></b></td>
<?php /* 共享过来的行里"人"的字段带着前缀（owner_name / owner_nick），
不是 person_name() 直接认的 name / my_nickname —— 在这里适配一次。 */ ?>
<td><?= e(person_name(['name' => $c['owner_name'] ?? '', 'my_nickname' => $c['owner_nick'] ?? ''])) ?></td>
<td><span class="node-badge"><?= ($c['perm'] ?? '') === 'write' ? '可写' : '只读' ?></span></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div>
<?php endif; ?>
templates/calendar/event.php
+84
View File
@@ -0,0 +1,84 @@
<?php
/**
* 一条自定义日程：查看 / 改 / 删。
*
* ⚠️ 从月视图点**观影 / 旅程 / 任务**那些条会直接跳到对应模块（它们的"编辑页"在那里），
* 这里只处理 calendar_events 里真正属于某本日历的自定义日程。
*/
$canWrite = \App\Auth::canWrite() && !empty($ev['_can_write']);
?>
<div class="page-head">
<h1><?= e((string)$ev['title']) ?></h1>
<span class="sub"><?= e((string)($ev['starts_at'] ?? '')) ?></span>
<div class="actions">
<a class="btn btn-ghost" href="<?= e(url('calendar', ['ym' => substr((string)$ev['starts_at'], 0, 7)])) ?>">返回日程</a>
</div>
</div>
<div class="card card-pad">
<?php if (!$canWrite): ?>
<dl class="kv">
<div class="kv-row"><dt>日期</dt><dd><?= e((string)$ev['starts_at']) ?></dd></div>
<?php if (!empty($ev['ends_at'])): ?>
<div class="kv-row"><dt>到</dt><dd><?= e((string)$ev['ends_at']) ?></dd></div>
<?php endif; ?>
<div class="kv-row"><dt>时间</dt>
<dd><?= empty($ev['all_day']) ? e(substr((string)$ev['start_time'], 0, 5) . ' – ' . substr((string)$ev['end_time'], 0, 5)) : '全天' ?></dd>
</div>
<?php if (!empty($ev['note'])): ?>
<div class="kv-row"><dt>备注</dt><dd><?= nl2br(e((string)$ev['note'])) ?></dd></div>
<?php endif; ?>
</dl>
<p class="empty-hint">这本日历你只有只读权限，看得到但不能改。</p>
<?php else: ?>
<form method="post" action="<?= e(url('calendar/event_update')) ?>">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= (int)$ev['id'] ?>">
<?php $ym = substr((string)$ev['starts_at'], 0, 7); ?>
<input type="hidden" name="ym" value="<?= e($ym) ?>">
<div class="form-grid">
<div class="field full">
<label for="ev-title">标题 *</label>
<input class="input" id="ev-title" name="title" required value="<?= e((string)$ev['title']) ?>">
</div>
<div class="field">
<label for="ev-date">开始日期 *</label>
<input class="input" type="date" id="ev-date" name="date" required
value="<?= e((string)$ev['starts_at']) ?>">
</div>
<div class="field">
<label for="ev-end">结束日期（跨天时填）</label>
<input class="input" type="date" id="ev-end" name="end_date" value="<?= e((string)($ev['ends_at'] ?? '')) ?>">
</div>
<div class="field full">
<label><input type="checkbox" name="all_day" value="1" <?= empty($ev['all_day']) ? '' : 'checked' ?>> 全天（不填具体时分）</label>
</div>
<div class="field">
<label for="ev-st">开始时刻</label>
<input class="input" type="time" id="ev-st" name="start_time" value="<?= e(substr((string)($ev['start_time'] ?? ''), 0, 5)) ?>">
</div>
<div class="field">
<label for="ev-et">结束时刻</label>
<input class="input" type="time" id="ev-et" name="end_time" value="<?= e(substr((string)($ev['end_time'] ?? ''), 0, 5)) ?>">
</div>
<div class="field full">
<label for="ev-note">备注</label>
<textarea class="input" id="ev-note" name="note" rows="3"><?= e((string)($ev['note'] ?? '')) ?></textarea>
</div>
</div>
<div class="btn-row">
<button class="btn" type="submit">保存</button>
<a class="btn btn-ghost" href="<?= e(url('calendar', ['ym' => $ym])) ?>">取消</a>
</div>
</form>
<?php /* ⚠️ 删除表单必须放在上面那个表单**外面**：<form> 套 <form> 是非法 HTML，
浏览器会把外层表单在嵌套处切开，"保存"按钮就失效了。 */ ?>
<form method="post" action="<?= e(url('calendar/event_del')) ?>" class="ev-del"
onsubmit="return confirm('删除这条日程？')">
<?= csrf_field() ?>
<input type="hidden" name="id" value="<?= (int)$ev['id'] ?>">
<input type="hidden" name="ym" value="<?= e($ym) ?>">
<button class="btn btn-danger btn-sm" type="submit">删除这条日程</button>
</form>
<?php endif; ?>
</div>
templates/calendar/index.php
+197
View File
@@ -0,0 +1,197 @@
<?php
/**
* 日程 · 月视图（v12）。
*
* 参照群晖 Calendar 的外观：左边一列"我的日历本"（可勾选显隐），右边 7×6 的月网格，
* 有日程的日子在格子里露出彩色小条，点小条跳到对应模块（观影/旅程/任务）。
*
* 两条设计：
* ① **日历本显隐是纯前端的**（勾选框 + 给日程条加 data-cal）：
* 不做成"勾一次刷一次页面"，否则翻月、勾选都在等服务端。没有 JS 时全部照常显示。
* ② **观影 / 旅行 / 任务不复制进日历**，是从各自模块实时汇总出来的（Calendar::month），
* 所以改了观影日期，日历里立刻跟着变。反过来在日历里给观影本加日程 = 真的建一条观影记录。
*
* @param string $ym 'Y-m'
* @param array $weeks 月网格（build_month_grid 产出）
* @param array $cals 我可见的日历本（含 perm）
* @param array $people 名册（共享给别人时用）
*/
$canWrite = \App\Auth::canWrite();
$ts = strtotime($ym . '-01') ?: time();
$prevYm = date('Y-m', strtotime('-1 month', $ts));
$nextYm = date('Y-m', strtotime('+1 month', $ts));
$thisYm = date('Y-m');
$writable = array_values(array_filter($cals, static fn($c) => \App\Calendar::canWrite($c, (int)\App\Auth::personId())));
?>
<div class="page-head">
<h1>日程</h1>
<span class="sub"><?= e(date('Y 年 n 月', $ts)) ?></span>
<div class="actions">
<a class="btn btn-ghost" href="<?= e(url('calendar', ['ym' => $prevYm])) ?>">上一月</a>
<a class="btn btn-ghost" href="<?= e(url('calendar', ['ym' => $thisYm])) ?>">今天</a>
<a class="btn btn-ghost" href="<?= e(url('calendar', ['ym' => $nextYm])) ?>">下一月</a>
<a class="btn btn-ghost" href="<?= e(url('calendar/calendars')) ?>">日历本</a>
<?php if ($canWrite && $writable): ?>
<button class="btn" type="button" id="calAddBtn">新建日程</button>
<?php endif; ?>
</div>
</div>
<div class="cal-wrap">
<?php /* ---- 左：日历本 ---- */ ?>
<aside class="cal-side">
<h2 class="cinema-h2">我的日历本</h2>
<?php if (!$cals): ?>
<p class="empty-hint">还没有日历本。</p>
<?php else: ?>
<ul class="cal-list">
<?php foreach ($cals as $c): ?>
<li class="cal-item">
<label class="cal-toggle">
<input type="checkbox" class="cal-cb" data-cal="<?= (int)$c['id'] ?>" checked>
<span class="color-preview" style="background: <?= e((string)$c['color']) ?>;"></span>
<span class="cal-name"><?= e((string)$c['name']) ?></span>
</label>
<?php if ((int)$c['shared'] === 1): ?>
<span class="node-badge"><?= ($c['perm'] ?? '') === 'write' ? '共享·可写' : '共享·只读' ?></span>
<?php endif; ?>
</li>
<?php endforeach; ?>
</ul>
<?php /* 观影/旅行/任务三路是**自动汇总**的，没有本子开关，这里说明一下来源 */ ?>
<p class="cal-note">观影、旅行、有截止时间的任务会自动出现在这里，不需要另建本子。</p>
<?php endif; ?>
</aside>
<?php /* ---- 右：月网格 ---- */ ?>
<div class="cal-main">
<?php if ($canWrite && $writable): ?>
<div class="card card-pad cal-add" id="calAddCard" hidden>
<h2 class="cinema-h2">新建日程</h2>
<form method="post" action="<?= e(url('calendar/event_add')) ?>">
<?= csrf_field() ?>
<input type="hidden" name="ym" value="<?= e($ym) ?>">
<div class="form-grid">
<div class="field">
<label for="ce-cal">放在哪本</label>
<select class="select" id="ce-cal" name="calendar_id">
<?php foreach ($writable as $c): ?>
<option value="<?= (int)$c['id'] ?>"><?= e((string)$c['name']) ?></option>
<?php endforeach; ?>
</select>
</div>
<div class="field">
<label for="ce-title">标题 *</label>
<input class="input" id="ce-title" name="title" required placeholder="如：家长会">
</div>
<div class="field">
<label for="ce-date">日期 *</label>
<input class="input" type="date" id="ce-date" name="date" required
value="<?= e($ym === $thisYm ? date('Y-m-d') : $ym . '-01') ?>">
</div>
<div class="field">
<label for="ce-end">结束日期（跨天时填）</label>
<input class="input" type="date" id="ce-end" name="end_date">
</div>
<div class="field">
<label><input type="checkbox" id="ce-allday" name="all_day" value="1" checked> 全天（不填具体时分）</label>
</div>
<div class="field">
<label for="ce-note">备注</label>
<input class="input" id="ce-note" name="note">
</div>
<div class="field" id="ce-time-s">
<label for="ce-st">开始时刻</label>
<input class="input" type="time" id="ce-st" name="start_time">
</div>
<div class="field" id="ce-time-e">
<label for="ce-et">结束时刻</label>
<input class="input" type="time" id="ce-et" name="end_time">
</div>
</div>
<div class="btn-row">
<button class="btn btn-sm" type="submit">加上</button>
<button class="btn btn-ghost btn-sm" type="button" id="calAddCancel">取消</button>
</div>
</form>
</div>
<?php endif; ?>
<div class="card cal-grid-card">
<div class="cal-head">
<?php foreach (['日', '一', '二', '三', '四', '五', '六'] as $wd): ?>
<div class="cal-wd"><?= e($wd) ?></div>
<?php endforeach; ?>
</div>
<div class="cal-grid">
<?php foreach ($weeks as $wk): ?>
<?php foreach ($wk as $cell): ?>
<div class="cal-cell<?= $cell['in_month'] ? '' : ' is-out' ?><?= $cell['is_today'] ? ' is-today' : '' ?>">
<div class="cal-dnum"><?= (int)$cell['day'] ?></div>
<div class="cal-evs">
<?php $n = 0; foreach ($cell['events'] as $ev): $n++; ?>
<?php if ($n <= 3): ?>
<a class="cal-ev<?= empty($ev['all_day']) ? '' : ' is-allday' ?>"
data-cal="<?= (int)$ev['cal'] ?>"
style="background: <?= e((string)$ev['color']) ?>;"
href="<?= e((string)$ev['href']) ?>"
title="<?= e((string)$ev['title']) ?>">
<?php if (($ev['time'] ?? '') !== ''): ?><b><?= e((string)$ev['time']) ?></b> <?php endif; ?>
<?= e((string)$ev['title']) ?>
</a>
<?php endif; ?>
<?php endforeach; ?>
<?php if (count($cell['events']) > 3): ?>
<span class="cal-more">+<?= count($cell['events']) - 3 ?> 条</span>
<?php endif; ?>
</div>
</div>
<?php endforeach; ?>
<?php endforeach; ?>
</div>
</div>
</div>
</div>
<script>
(function () {
/* 日历本显隐：只切 display，不重新请求 —— 翻月/勾选都是立刻的。
没有 JS 时全部照常显示（勾选框失效而已），不会丢内容。 */
var boxes = document.querySelectorAll('.cal-cb');
function apply() {
var off = {};
Array.prototype.forEach.call(boxes, function (b) {
if (!b.checked) { off[b.getAttribute('data-cal')] = true; }
});
Array.prototype.forEach.call(document.querySelectorAll('.cal-ev'), function (el) {
el.style.display = off[el.getAttribute('data-cal')] ? 'none' : '';
});
}
Array.prototype.forEach.call(boxes, function (b) { b.addEventListener('change', apply); });
apply();
var btn = document.getElementById('calAddBtn');
var card = document.getElementById('calAddCard');
var cancel = document.getElementById('calAddCancel');
if (btn && card) {
btn.addEventListener('click', function () {
card.hidden = !card.hidden;
if (!card.hidden) { card.scrollIntoView({ block: 'nearest' }); }
});
}
if (cancel && card) { cancel.addEventListener('click', function () { card.hidden = true; }); }
/* 「全天」勾上就把两个时刻输入框藏掉 —— 没有具体时分就是全天（用户第 7 条） */
var allday = document.getElementById('ce-allday');
var ts = document.getElementById('ce-time-s');
var te = document.getElementById('ce-time-e');
if (allday && ts && te) {
function syncTime() {
var hide = allday.checked;
ts.hidden = hide; te.hidden = hide;
}
allday.addEventListener('change', syncTime);
syncTime();
}
})();
</script>