01d5bc262f9e0de349376ba79d8db02311b53ad4
用户 2026-10-30:「网页端,跨天日程显示还是有问题…如果一个日程跨了三天,
应该在日历本上怎么显示呢?在周视图和日视图,应该怎么显示?现在显示的有问题。」
## 修复前是什么样(实测,不是推断)
一个「11/10 20:00 → 11/12 02:00」的跨三天日程,服务端 month() 展开成三条
(首日带 time、中间天两者皆空、末日带 end_time),喂给 build_time_grid 后:
全天行:11/11、11/12 各一条 ← 中间两天变成"全天日程"
时间网格:11/10 一个小块,高度仅 2.08%(≈30 分钟)
三个问题叠加:
· 开始日的结束时刻不在同一天 ⇒ 判成"没有结束" ⇒ 退化成 30 分钟
· 中间/末日既无 time 又不是全天 ⇒ 被"按全天处理"的兜底塞进全天行
· 三条互不相干,用户看不出"这是同一个日程"
## 方案(用户已确认)
1. 周视图:跨列连续长条 —— 毎列各画一段,视觉连成一条
2. 日视图:铺满当天并标延续
3. 中间天归时间网格,不进全天行
## 改了什么
**app/Calendar.php** —— 服务端补两个字段
· `span_days`:整条日程跨了几天(0 = 当天来回)
· `seg`:start / mid / end / only
同时修掉一个真 bug:原来 `$first` 是"窗口内遍历的第一个",
日视图只查一天时,中间天会变成 `$first` 被当开始日处理。
⇒ 一律用**真实日期**跟 `$base`/`$base+span` 比较,不看遍历顺序。
**index.php::build_time_grid** —— 核心重构
· 先按 `kind:ref_id:occ` 归堆,把同一日程的逐天条目合成一条
(带 occ 是因为重复日程不同次发生的 ref_id 相同;带 kind 是因为
观影/旅程的 ref_id 是各自表里的 id,`custom:5` 和 `movie:5` 是两回事)
· 跨度以服务端 `span_days` 为准,不再用"窗口内铺了几列"推断
(日视图下那个推断必然不成立)
· 跨天条目拆成每列一段,按 `seg` 决定纵坐标:
start = 开始时刻→24:00,mid = 整列,end = 0→结束时刻
· 跨天条目**不参与 conflictLanes** —— 它必然占满整列,
拿去分列会把同一天所有日程都挤窄
**templates/calendar/index.php** —— 分段渲染
· `is-seg-start/mid/end` 类;延续段前面加 `↳` 标记,不重复显示时间
· 跨天段用 `left:0; width:100%`,单天块保持原来的 `calc(2px + N%)`
**assets/css/app.css** —— 让三段看着连成一条
· start 下圆角归零、下边框透明;mid 上下都平;end 上圆角归零、上边框透明
· 段与段之间原本有 1px 白边 + 左右内缩,实测缝隙 10.9px,看着像断成三段
⇒ 跨天段贴满整列后降到 1.0px(只剩列边框)
## 为什么在列内画段,不做跨列绝对定位层
`.tg-body` 左边有 56px 固定 gutter,窄屏还会横向滚动
(`.cal-tg-card{overflow:auto}` + 每列 min-width 92px),`.tg-col` 又是
`overflow:hidden`。跨列层要自己算 gutter 偏移、跟着横向滚动跑、还不能被裁 ——
每个都是新坑。在列内画段天然对齐,代价只是段间有 1px 列边框缝,用 CSS 糊掉。
## 验证
**逻辑层(PHP,用真实 build_time_grid)**
· 周视图跨三天:3 段(start/mid/end),全天行为空 ✓
· 日视图三个位置(起始/中间/结束天)各自正确 ✓
· 回归:单天 + 真全天仍正常;冲突分列仍生效;跨天与普通日程共存正常 ✓
· 反向验证:用修复前的代码跑同一判据**正确转红**
(旧版 timed=1 all_day=2,高度只有 2.08%),证明判据非恒真 ✓
**视觉层(Playwright + 真实 CSS + include 真实模板)32 项全过**
· 横向连续:start→mid 缝隙 1.0px,mid→end 1.0px(判据 ≤2.5px)✓
· 纵向:start 底边贴列底 0px;mid 占满整列(顶 0 / 底 0);
end 顶边贴列顶 0px 且只占开头一小段 ✓
· 样式:start 下圆角 0px + 下边框透明;mid 上下圆角 0;end 上圆角 0 +
上边框透明 ✓
· 无裁切:三段都落在列内 ✓
· 回归:真全天仍在全天行;跨天不再出现在全天行;单天日程正常 ✓
· 窄屏 375px:三段仍可见(w=91)✓
**反向验证 4/4 全部抓到**
故意做坏四个变体(段留单天内缩 / 保留圆角 / 中间段只画 30% /
下边框不透明),判据全部转红 —— 说明"32 项全过"不是因为判据恒真。
## 已知取舍
跨天段占满整列,同一天的普通日程与它在视觉上会重叠。
这是日历的固有取舍(Google 日历同样如此),用户确认的方案里也接受。
FamilyBook
家书,记录家庭的全部生活,一本用岁月写成的家谱。
把一个家的「人」「日子」「去过的地方、看过的电影」收进同一本书里。
它是什么
一个自托管的家庭生活系统。它不是又一个待办清单,而是这个家的长期档案 —— 十年之后还能翻出孩子第一次观影的票根、那年暑假走过的路线。
围绕三个圈展开:
- 人:家庭成员、亲友通讯录,以及他们之间的共享关系
- 时间:日历、日程、提醒,以及任务的期限
- 事件:观影、旅行、其他活动 —— 一切都落在同一条时间轴上
它在做什么
| 阶段 | 主题 | 内容 |
|---|---|---|
| 0 | 地基 | 名册、账号、登录、权限模型、安装向导 |
| 1 | 通信 | 通讯录、共享给某个成员、CardDAV 服务端 |
| 2 | 时间 | 日历本、重复日程、提醒、CalDAV 服务端 |
| 3 | 归一 | 观影与旅行迁入统一事件模型 |
| 4 | 任务 | 任务管理,期限自动映射成日历事件 |
| 5 | 回看 | 统计、年度家书、时间轴 |
当前进度:阶段 0 起步,仓库里只有图标与脚手架。
技术选型
- PHP 7.4+(无框架、无 Composer,上传到站点目录即可运行)
- MySQL 5.7+ / 8.0(
utf8mb4) - 前端为原生 HTML / CSS / JavaScript,无构建步骤
⚠️ 注意 CalDAV / CardDAV 是双向协议,和单纯的 .ics 文件导出不是一个量级的东西。
部署
- 把代码放到站点根目录;
- 复制
config.example.php为config.php,填写数据库与app_key; - 访问站点根,按引导页确认 PHP 版本、扩展、配置、数据库连接四项都通过。
config.php 不入库(已在 .gitignore 中忽略),其中包含数据库口令与加密密钥。
⚠️ app_key 一旦开始记录数据就不能再改(换掉即解不开已有数据),
并且它必须单独备份 —— 密钥丢失等同于数据永久丢失。
隐私
身份证号、手机号属于敏感个人信息,一律加密存储。 (就家庭自用而言,身份证号其实没有多少必须存的场景,启用前请三思。)
图标
见 assets/icons/。概念是「这本书就是家」:屋顶即一本摊开的书,
屋顶下纸做的墙上,三行横线是这个家写下的日子。
开源协议
Languages
PHP
81.6%
JavaScript
9.3%
CSS
9.1%