v82: 首页卡片补「新建日程 / 新增成员」+ 两处红线
用户原话：「日程，没有新建日程按钮，名册，也没有新增成员这个按钮。 另外，首页上的日程，红色线不对，变短了左侧缺了一块。在日程模块中， 那个红线左侧是不是还有一个红点？如果有，去掉。」 首页卡片就地操作（不用进模块）： - HomeCards.php 的 agenda/contacts 补 add + add_modal 元数据 - templates/calendar/_add_modal.php：从 calendar/index.php 抽出的 「新建日程」弹框片段（首页与日程页共用；片段自读变量一律加 cal 前缀， 避免 require 共享作用域覆盖宿主变量） - templates/people/form.php：加弹框形态（pfModalOnly / pfModal）， 弹框形态下「取消」走 data-fb-add-close - index.php：首页 agenda/contacts 两个 $homeAddModals 分支； calendar/event_add 支持 back=home 白名单跳转（不采信任意 POST 字符串） 红线（左端缺一块 / 多余红点）： - .ag-now 原来写 left: var(--ag-gutter,50px)，但 v80 起它已经在 .ag-lines 内部（那层自己已有同样缩进）⇒ 左沿跑到 100px、比车道多 出一整份刻度宽。改成 left: 0 - .tg-now::before 整条删除（日程模块页那个 8px 红点） 涉及共用件（HomeCards/index.php），已跑全量：e2e 1572/0、 v82 正向 20/0、v82 反向 15/0、流水线全绿并已部署。
This commit is contained in:
+33
-175
@@ -148,182 +148,40 @@ $headText = $view === 'month' ? date('Y 年 n 月', $ts)
|
||||
只把它的容器从"页面上的一格"换成"浮层里的一块"。
|
||||
`calendar_id` 那个 select 也保留（第 7 条要求"选择日历本，带上颜色"，
|
||||
见下面给每个 option 加的色块）。 */ ?>
|
||||
<?php if ($canWrite && $writable): ?>
|
||||
<div class="cal-modal" id="calAddCard" role="dialog" aria-modal="true"
|
||||
aria-label="新建日程" hidden>
|
||||
<div class="cal-modal-panel">
|
||||
<div class="cal-modal-head">
|
||||
<b>新建日程</b>
|
||||
<button type="button" class="cal-modal-x" id="calAddCancel"
|
||||
aria-label="关闭">✕</button>
|
||||
</div>
|
||||
<form method="post" action="<?= e(url('calendar/event_add')) ?>"
|
||||
enctype="multipart/form-data" id="calAddForm">
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="ym" value="<?= e($ym) ?>">
|
||||
<input type="hidden" name="back_view" value="<?= e($view) ?>">
|
||||
<input type="hidden" name="back_anchor" value="<?= e($anchor) ?>">
|
||||
<div class="cal-modal-body">
|
||||
<?php /* ⚠️ v44：`.mv-grid` 在这里就打开 —— 下面的「日历本」行
|
||||
与「日期范围」字段块都要走观影式排版（标签右对齐 + 冒号）。
|
||||
原来 `.mv-grid` 是包在字段块那一小段里的，日课本在它**外面**，
|
||||
于是"日历本：下拉"落不到这套排版上（正是用户报的"不在一行"）。 */ ?>
|
||||
<div class="mv-grid">
|
||||
<?php /* 🔴🔴 v44（用户 2026-10-12 第 1 条）：「新建日程，放在哪本，改成日历本后面加冒号。
|
||||
现在这句话和日历本下拉框还有前面的颜色，仍然不在一行，
|
||||
我建议把颜色放在下拉框里面，就跟电影的影院选择一样，
|
||||
让日历本这三个字和下拉框在一条线上。」
|
||||
<?php /* 🔴 v82（用户 2026-10-23）：这一大段弹框**抽成公共片段**了 ——
|
||||
首页日程卡片要"在首页就能新建日程"，两处必须用同一张表单。
|
||||
片段：`templates/calendar/_add_modal.php`（表单契约一字未改）。
|
||||
⚠️ 抽片段后**必须**同步改部署脚本的静态断言：那批断言原来按
|
||||
`calendar/index.php` 找 `id="calPicker"` / `id="cbDot"` /
|
||||
`class="cs-dot" style="background:` / `<span class="mv-lb">日历本</span>`
|
||||
/ `$evMvStyle = true` —— 现在这些串在新片段里。
|
||||
不改的话：正向断言当场中止部署，负向断言恒真没牙齿（v78 原话）。 */
|
||||
?>
|
||||
<?php
|
||||
$calCanNew = $canWrite && (bool)$writable;
|
||||
$calWritable = $writable;
|
||||
$calCtx = [
|
||||
'ym' => $ym, 'view' => $view, 'anchor' => $anchor,
|
||||
'new_at' => $newAt,
|
||||
// 模块页只管自己：'' = 提交完回日程模块（不写 'home'）
|
||||
'back' => '',
|
||||
];
|
||||
require __DIR__ . '/_add_modal.php';
|
||||
/* 🔴🔴 v82：**只清掉三个"调用参数"**，别的什么都不许 unset。
|
||||
为什么：`require` 与宿主**同一作用域**，片段里赋的每个变量都会留下来。
|
||||
我第一版顺手把 `$ym/$view/$anchor/$newAt/$writable` 也 unset 了 ——
|
||||
而这五个正是**模块页自己后文还要用的**（页头标题、翻页链接、周/日网格、
|
||||
`.tg-now` 的 top 计算全依赖它们）。unset 掉不会报错，只会让后半页
|
||||
静默变成空值：页头显示"1970 年"、翻页链接丢参数、时间网格画不出来。
|
||||
这类"清了别人的变量"比"片段拿不到变量"更难查 —— 页面能开，只是全错。
|
||||
⇒ 判据：unset 之前先 grep 一下后文还用不用它（本项目吃过"片段覆盖宿主变量"的亏）。
|
||||
|
||||
三件事：
|
||||
① 标签改「日历本」（用户点名要这三个字），冒号由观影式排版的
|
||||
`.mv-row > .mv-lb::after` 给（与观影/任务一致）；
|
||||
② **颜色不再是下拉框外的一个色块**，而是像"影院选择"那样
|
||||
**画进下拉里**（每行左边一个该本子的色点）。
|
||||
原生 `<option>` 画不出元素 ⇒ 换成**自定义下拉**
|
||||
（复用全站的 `.cs` 组件：按钮 + 弹出列表 + 搜索），
|
||||
真值仍写进隐藏的 `<input name="calendar_id">`（表单契约不变）。
|
||||
③ 因为换成了一个自绘的下拉，三者天然在同一行 ——
|
||||
不再有"标签一行、色块+下拉下一行"的错位。
|
||||
|
||||
⚠️ 无 JS 兜底：`.cs` 里**仍然保留**一个原生 `<select name="calendar_id">`
|
||||
（视觉收起、但它是真的提交字段）—— JS 没跑时它就是那个下拉，
|
||||
与 `_datetime.php` 的"隐藏 date 当值载体"是同一套思路
|
||||
（v43 那条"没有盒子的元素定位无效"的教训：这里用 `position:absolute;
|
||||
width:1px` 而非 `display:none`，保留可聚焦、可提交）。
|
||||
⚠️ 组件 id 保持 `cinemaPicker/csBtn/csMenu/csDot/csText` **不合适**
|
||||
（那是观影的编号）—— 用 `calPicker/cb*` 一套独立的，
|
||||
免得将来两处互相 getElementById 抢。
|
||||
⚠️ e2e / 断言里按 `#ce-cal` 定位的写法**必须继续成立**：
|
||||
原生 select 的 id 保持 `ce-cal`（只是被视觉收起）。 */ ?>
|
||||
|
||||
<?php /* 🔴 v24 第 21 批 第 7 条：**默认必须选"我自己的普通日历本"**。
|
||||
原来直接取 `$writable[0]` —— 而顺序是按 id，观影 / 旅行两本
|
||||
通常排在最前面。于是用户打开"新建日程"、直接打字、点"加上"，
|
||||
建出来的其实是一条**观影记录**（或旅程）。
|
||||
这不是"显示不对"，是**建错东西**，而且事后很难发现
|
||||
—— 用户以为日历里多了条日程，其实观影列表里多了一条记录。
|
||||
所以：优先把自己建的 kind='custom' 本子排在前面当默认；
|
||||
没有普通本时才退到第一个可写的本子。 */
|
||||
$firstCal = null;
|
||||
foreach ($writable as $c) {
|
||||
if ((string)($c['kind'] ?? '') === 'custom') { $firstCal = $c; break; }
|
||||
}
|
||||
if ($firstCal === null) { $firstCal = $writable ? $writable[0] : null; }
|
||||
/* ⚠️ 模板里**再兜一道**"快照"：路由只会在**页面级**补一次本子，
|
||||
而这张表单是页面渲染时定格的 —— 万一补本失败（DB 异常等），
|
||||
这里至少还能看出"没有可写的普通本"，不至于把"选中了观影本"
|
||||
当成正常状态。 */
|
||||
$hasPersonal = $firstCal !== null
|
||||
&& (string)($firstCal['kind'] ?? '') === 'custom'; ?>
|
||||
|
||||
<div class="mv-row">
|
||||
<span class="mv-lb">日历本</span>
|
||||
<div class="cs cal-book-cs" id="calPicker" data-open="0">
|
||||
<button type="button" class="cs-btn" id="cbBtn" aria-haspopup="listbox" aria-expanded="false">
|
||||
<span class="cs-dot" id="cbDot"
|
||||
style="background: <?= e((string)($firstCal['color'] ?? '#4A7C82')) ?>;"></span>
|
||||
<span class="cs-text" id="cbText"><?= e((string)($firstCal['name'] ?? '未选择')) ?></span>
|
||||
<span class="cs-caret" aria-hidden="true">▾</span>
|
||||
</button>
|
||||
<div class="cs-menu" id="cbMenu" hidden role="listbox">
|
||||
<div class="cs-list" id="cbList">
|
||||
<?php foreach ($writable as $c): $ro = \App\Calendar::isReadonlyKind((string)$c['kind']);
|
||||
$isDef = $firstCal && (int)$c['id'] === (int)$firstCal['id']; ?>
|
||||
<?php /* v24 第 21 批 第 7 条：纯派生的本子（农历/节假日/传统节日/节气）
|
||||
列出来但**禁用** —— 直接不列的话，用户会以为"我的本子丢了"；
|
||||
列为可选项又会让他白选一次再吃一个错误提示。
|
||||
禁用 + 一句 title 说明，是这个取舍里最不费解的一种。
|
||||
观影 / 旅行**不禁用**：它们可写（加一条 = 建一条观影/旅程）。 */ ?>
|
||||
<button type="button" class="cs-item<?= $ro ? ' is-disabled' : '' ?>"
|
||||
role="option"<?= $ro ? ' disabled' : '' ?>
|
||||
data-id="<?= (int)$c['id'] ?>"
|
||||
data-color="<?= e((string)$c['color']) ?>"
|
||||
data-text="<?= e((string)$c['name']) ?>"
|
||||
<?= $ro ? 'title="系统自动生成，不能直接加日程"' : '' ?>>
|
||||
<span class="cs-dot" style="background: <?= e((string)$c['color']) ?>;"></span>
|
||||
<span><?= e((string)$c['name']) ?><?= $ro ? '（自动生成）' : '' ?></span>
|
||||
</button>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php /* 一个都没匹配上时露出来（平时 hidden，不占高度） */ ?>
|
||||
<div class="cs-empty" id="cbEmpty" hidden>没有匹配的日历本</div>
|
||||
</div>
|
||||
<?php /* ⚠️⚠️ 这是**真的提交字段**（不是"只给 JS 用"的影子）：
|
||||
自定义下拉只是它的外观；JS 没跑时它就是那个原生下拉。
|
||||
视觉收起用 position:absolute + 1px（**不用 display:none**）——
|
||||
后者会让表单校验时不可聚焦（v37 那次的坑）。
|
||||
桌面无 JS 时它贴在按钮下方 1px 处、可点，仍能选。 */ ?>
|
||||
<select class="select cal-book-native" id="ce-cal" name="calendar_id" aria-label="日历本">
|
||||
<?php foreach ($writable as $c): $ro = \App\Calendar::isReadonlyKind((string)$c['kind']);
|
||||
$isDef = $firstCal && (int)$c['id'] === (int)$firstCal['id']; ?>
|
||||
<option value="<?= (int)$c['id'] ?>"
|
||||
data-color="<?= e((string)$c['color']) ?>"
|
||||
<?= $isDef ? ' selected' : '' ?>
|
||||
<?= $ro ? 'disabled title="系统自动生成，不能直接加日程"' : '' ?>><?= e((string)$c['name']) ?><?= $ro ? '（自动生成）' : '' ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
<?php /* 兼容旧断言/旧 JS：外面那个独立色块曾经叫 ce-cal-dot。
|
||||
现在颜色已经画进下拉里、不再需要它 —— 保留一个**隐藏**的同名元素，
|
||||
免得旧探针 document.getElementById('ce-cal-dot').style 直接抛错。 */ ?>
|
||||
<span class="cal-book-dot" id="ce-cal-dot" hidden
|
||||
style="background: <?= e((string)($firstCal['color'] ?? '#4A7C82')) ?>;"></span>
|
||||
</div>
|
||||
</div>
|
||||
<?php if (!$hasPersonal): ?>
|
||||
<span class="tip" style="display:block;margin-top:6px">
|
||||
⚠️ 你还没有**自己的日程本**，上面选的是一本"派生本"
|
||||
（加进去会变成观影 / 旅程记录）。去
|
||||
<a href="<?= e(url('calendar/calendars')) ?>">日历本</a> 建一本吧。
|
||||
</span>
|
||||
<?php endif; ?>
|
||||
<?php /* v24 第 6 条：字段按 iCalendar / CalDAV 的 VEVENT 定（见 _event_fields.php）。
|
||||
新建时「全天」默认**不勾**（用户原话）。开始时间默认：
|
||||
带了 new_at 就用它（点日历的那一格），否则今天 09:00。
|
||||
🔴 v43（用户 2026-10-11 第 5 条）：「新建日程页面的排版还是不对，
|
||||
也是一样的：把标题放在前面，后面加冒号，再跟上输入框。」
|
||||
⇒ 用观影/行程那套 `.mv-grid`（标签 62px 右对齐 + CSS ::after 冒号 +
|
||||
控件占满剩余宽度）包住字段块。
|
||||
`$evMvStyle = true` 让字段块输出 `.mv-row` / `.mv-lb`
|
||||
而不是 `.field` / `<label>`；编辑页不传，保持原两列。 */ ?>
|
||||
<?php
|
||||
// 点的位置优先；没点就"月视图当月 → 该月 1 号 / 本月 → 今天"的 09:00
|
||||
$defDay = $newAt !== '' ? substr($newAt, 0, 10)
|
||||
: (($ym === $thisYm ? date('Y-m-d') : $ym . '-01'));
|
||||
$defHM = $newAt !== '' && strlen($newAt) > 10
|
||||
? substr($newAt, 11, 5) : '09:00';
|
||||
$defEndH = sprintf('%02d', (min(23, (int)substr($defHM, 0, 2) + 1)));
|
||||
$evFields = ['starts_at' => $defDay . ' ' . $defHM . ':00',
|
||||
'ends_at' => $defDay . ' ' . $defEndH . ':' . substr($defHM, 3, 2) . ':00'];
|
||||
$evAllDay = false;
|
||||
/* ⚠️ v44：`.mv-grid` 容器**已经在上面日课本那一行之前打开了**
|
||||
（日课本自己也要走观影式排版）—— 这里只 require 字段块，
|
||||
不要再包一层，否则会出现嵌套的第二个 `.mv-grid`。 */
|
||||
$evMvStyle = true; // 观影式排版（用户第 5 条）
|
||||
require __DIR__ . '/_event_fields.php';
|
||||
unset($evMvStyle);
|
||||
?>
|
||||
</div><?php /* /mv-grid */ ?>
|
||||
</div><?php /* /cal-modal-body */ ?>
|
||||
<div class="cal-modal-foot">
|
||||
<span class="cal-modal-tip" id="calAddTip"></span>
|
||||
<?php /* 🔴 v37 用户第 5 条：「"加上"和"取消"两个按钮在右上角，离得特别远，
|
||||
根本看不到。应该把它们放在下方…」
|
||||
真根因（真机量出来的，不是猜）：
|
||||
原来这里**多写了一个 `</div>`** —— `.cal-modal-panel` 被提前闭合、
|
||||
跟着又被多关一层，于是 `<div class="cal-modal-foot">` 跑到了
|
||||
**面板外面**（DOM 上它是 `.cal-modal` 的直接子元素）。
|
||||
面板 `max-height` 一卡，底栏就被挤到面板下方 → 用户看不到。
|
||||
另有 CSS 一层：`.cal-modal-panel > form` 原先不是 flex 列，
|
||||
`.cal-modal-body{flex:1 1 auto}` 因此不起作用（两处都已修）。
|
||||
⚠️ 提交键用 `form="calAddForm"` **显式关联**：多一层/少一层 DOM 的
|
||||
意外都不会再让它失效（它本来就在 form 内部，但显式写更稳）。 */ ?>
|
||||
<button class="btn btn-sm" type="submit" form="calAddForm" id="calAddSubmit">加上</button>
|
||||
<button class="btn btn-ghost btn-sm" type="button" id="calAddCancel2">取消</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
🔴 v82 再修（同日）：片段内部现在已经**改用 `$cal*` 前缀**，不再覆盖
|
||||
宿主的 `$anchor/$newAt/$writable/$view/$ym`（见该片段头部那段说明）。
|
||||
所以这里连"片段残留物"都不必再清 —— 真正要清的只有本模板自己传进去的
|
||||
三个 `$cal*` 入参。 */
|
||||
unset($calCanNew, $calWritable, $calCtx);
|
||||
?>
|
||||
|
||||
<?php if ($view === 'week' || $view === 'day'): ?>
|
||||
<?php /* ===== 周 / 天：按小时铺的时间网格（全天日程单独挂顶上） ===== */ ?>
|
||||
|
||||
Reference in New Issue
Block a user