v37 第 37 批：日期控件换成「年/月/日 + 时/分」五个原生下拉 + 五处界面重做

用户原话（6 条，一次给全）：
  ①「观影详情页面。观影图片下面有一个块…要加照片请点上方「编辑」…这个块不要，
     直接把这个块删除。」
  ②「编辑页面的时间…选日期的这个控件非常非常不好用。就是如果我把年和月那个地方
     拉下来，我选完年和月之后，它并不会回到让我选日的那个界面，它还是不动的…
     要么换一个控件，要么在那个地方加一个确定按钮…现在开始和结束时间分在了两行…
     能放得下的话就应该放一排…不要让它默认显示在两行上…"散场时间可不填。"这句话去掉。」
  ③「首页上今天的日程…分了几列，列之间的空隙非常非常的大…日程里面的那两个色块
     就是紧挨着的。所以…应该让它们紧挨着。」
  ④「现在怎么部署的时间这么长？…你修改了哪些页面，你就只测试哪些页面就可以了。」
  ⑤「日程模块的新建日程…"加上"和"取消"两个按钮在右上角，离得特别远，根本看不到…
     每个输入框前面的标题都太小了…都应该加粗、变大。」
  ⑥「1.新建任务的截止时间，也和观影一致。2.新建任务时竟然没有添加附件…
     3.新建任务也弹出一个框，新建完之后刷新看板页面。4.观影新增也弹框输入所有信息。」

② 日期控件：**真根因是"这个控件给不了"**
  `<input type="date">` 的日历弹层由**浏览器自己画**，我们碰不到 DOM、也控制不了流程；
  Chrome 在"点顶部 `2026年 10月` 切到年月视图"之后，要靠用户**再点一次日期或按 Esc**
  才回得到日期视图，各家还不一致 ⇒ 用户遇到的"选完年月就卡住、选不了日"。
  修：`_datetime.php` 重写成 **年 / 月 / 日 三个原生 <select> + 时 / 分**，
  选完即生效、无需"确定"；秒默认去掉（用户"只记录到时和分"）。
  ⚠️ 提交契约**一字未改**：`*_date` 仍是真字段（改 `type=hidden`）+ `*_hour/_minute`。
  ⚠️ `required` 落在隐藏控件上会让 Chrome 报 "not focusable"（点保存什么都不发生）
     ⇒ 改用 `data-dt-required` 声明、JS 自查（12 个调用点全部受影响）。
  起止两端：`.dt-range.dt-cols` + `flex-wrap` → **宽屏一行、窄屏自动换行**
  （不用 JS 量宽度：字体/动画/缩放时量不准，flex-wrap 是浏览器布局的一部分）。
  🔴 顺带挖出真 bug：旅程「修正」表单的 `.dt-range` 只有 **22px 宽**
     —— 它长在 `.node-ops`（一排小按钮的容器）里，展开的内容只有"修正"两个字那么宽。
     修：`.rev-panel{position:absolute}` 纯 CSS 浮出来（不动 DOM，避免牵动节点列表排版）。

③ 首页冲突色块"空隙特别大"：与日历页逐字对比出来的
  日历页 `left: calc(2px + L%)` / `width: calc(W% - 4px)` → 只留 4px、紧挨；
  首页却写死 `calc(46px + L%)` / `calc(W% - 50px)` —— 每块左右各扣 23/25px，
  两列时那 46px **没法均分**、全挤进了中间的缝（实测 ≈50px）。
  修：`left: calc(46px + L% + 2px)` / `width: calc(W% - 4px)` → 缝恒为 4px。

⑤ 日程弹框"按钮看不到"：**两个**根因叠加
  ① `calendar/index.php` 里**多写了一个 `</div>`** —— `.cal-modal-panel` 被提前闭合，
     底栏 `<div class="cal-modal-foot">` 成了 `.cal-modal` 的直接子元素、被挤到面板外；
  ② `.cal-modal-panel` 是 flex 列，但**它下面的 `<form>` 不是** →
     `.cal-modal-body{flex:1 1 auto}` 的上下文只到 form 为止，body 压不下去也不滚。
  另有 `.cal-modal-panel` 的 max-height 没算上 `.cal-modal` 自己的 padding（差 4px）。
  三处都修；标签只对**弹框里**的 `.field > label` 加粗放大（14px/600/深色）。

⑥ 任务新建：内联卡片 → 弹框；**新增附件**（`attach[]`，服务端零改动能收）；
  `back=tasks` → 新建完回**看板**刷新。观影新增：列表页内嵌同一份 form.php 弹框。

① 详情页删掉那句提示块。④ 流水线改**增量**：`run_suite_if <标签>` + 从 git 改动
  推模块；**一碰共用件就退回全量**（app.js/app.css/layout/index.php/_datetime.php…），
  认不出来也全量（保守：少跑一段发坏东西的代价远大于多跑十分钟）。

🔴🔴 本轮最值得记的教训：**DOM 嵌套错误比语法错误难查得多**
  在 movies/form.php 与 calendar/index.php 各写坏一次嵌套（多/少 `</div>`、多 `</form>`），
  两处**都通过 php -l、页面也打得开**，症状却是"按钮跑到面板外"与
  "编辑保存静默失效"（保存键落到 form 外面）。⇒ 模板里 `<?php if ?>` 与 `</div>`
  必须**按分支配对**，改完用真机渲染 dump 一次 div 深度；光靠 php -l 发现不了。

验证（全部真机 + 反向验证）：
  · _fb_b34_dtrange.py **61/0**（四个页面：年/月/日/时/分 都可见可点 +
    选完三个下拉**立刻**写回 *_date + 改月重建"日"列 + 起止默认同一行 + 无 JS 报错）；
  · _fb_b34_dtrange_falsify **7/0**（三处注入各自必须变红）；
  · _fb_b37_ui.py **27/0**（详情页无提示块 / 首页冲突缝 ≤8px / 弹框按钮在面板内且在
    视口内 / 标签加粗 / 任务弹框+附件+回看板 / 观影列表页弹框）；
  · _fb_b37_falsify **5/0**；
  · _fb_b35_movie_media.py **16/0**、_fb_geom_interact **109/0**、e2e **1503/0**、
    b30_ui2 16/0（含首页冲突分列）、_b30_import 26/0、b18/b21/b23/…全绿、
    DAV 三套全绿、部署静态断言空跑通过；
  · 线上 app.js / app.css / movies/form.php / calendar/index.php 的 SHA256 与本地一致。
  · 顺带修掉 _b30_import 的一个**时序竞争**：它用外部上游（联想词服务）的二次探测
    当对照，浏览器取词在前、探测在后，上游抖一下会误报成"回归"（已改成两次确认）。

assets/css/app.css

@@ -584,126 +584,126 @@ textarea.input { min-height: 76px; resize: vertical; }
 .search { display: flex; gap: 8px; margin-bottom: 16px; }
 .search .input { max-width: 260px; }
 
-/* ---------------- 日期 + 时:分:秒 组合控件（templates/_datetime.php） ----------------
+/* ============================================================================
-   原生 datetime-local 的显示格式由浏览器 UI 语言/系统时间格式决定，
+   日期 + 时:分 组合控件（templates/_datetime.php）—— v37 重做
-   中文环境渲染成「下午 03:30」且没有秒，所以自己拼一个。
+   ----------------------------------------------------------------------------
-   日期部分仍是原生 date 控件 → app.js 的 showPicker 让它整框可点。 */
+   形态（用户 2026-10-09 第 4 次反馈点名要的）：
+     日期 = 年 / 月 / 日 三个原生下拉；时间 = 时 : 分 两个原生下拉。
+   起止两端默认同一行，放不下时自动换到下一行（flex-wrap，见 .dt-cols）。
+
+   为什么把浏览器自带的 <input type=date> 换掉：
+     它的日历弹层是浏览器自己画的，我们碰不到 DOM、也控制不了流程；
+     Chrome 在"点顶部 2026年 10月 切到年月视图"之后要靠用户再点一次日期或
+     按 Esc 才回得到日期视图，各家还不一致 → 用户遇到的就是"选完年月就卡住、
+     选不了日"。三个原生下拉选完即生效，不需要任何确定按钮。
+
+   这一整段不再有"未升级就藏原生控件"的逻辑（v24~v36 有过）。
+   服务端给的就是最终形态，JS 只负责绑事件 —— 所以"JS 没跑 / 加载失败"时
+   控件依然完整可用，不是"骨架占位"。
+   ============================================================================ */
 .dt-input { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
-/* v24 第 9 批 #9：Semi DatePicker 升级态 —— .dt-native 是 display:contents（不干扰
-   flex 布局），升级成功后由 app.js 内联 display:none 藏掉；.dt-semi 顶上同一格。 */
 .dt-input .dt-native { display: contents; }
-/* ---- v24 第 12 批 #2：消除「先闪原生框、再变 Semi」----
-   html.js 由 <head> 里的内联脚本立刻加上（见 layout.php 的 no-js/js 二态）。
-   有 JS 时：原生控件**从一开始就不显示**，等 Semi 就绪（app.js 加 .is-semi）再露出。
-   没 JS 时（html 仍是 no-js）：什么都不藏，原生控件照旧可用 —— 渐进增强的兜底不变。
-   ⚠️ 用 visibility:hidden 而不是 display:none —— 保留元素占位高度，
-      否则升级完成的那一瞬表单会"跳"一下（高度从 0 变 40px）。 */
-html.js .dt-input:not(.is-semi) .dt-native { visibility: hidden; }
-/* 🔴🔴 v36：`.is-native` 态下，原生控件**必须可见**。
-   用 `!important` 是**故意**的：v35 那次就是被
-     `html.js .dt-input:not(.is-semi) .dt-native{visibility:hidden}`
-   （特异性 0,3,0，比我那条覆盖规则更强/更早）又藏回了 hidden ——
-   用户看到"一片空白、点不到"，而探针因为用错判据（offsetParent）还"全绿"两轮。
-   ⇒ 这条用 `!important` 一次性钉死，别再让任何历史规则把它藏起来。 */
-html.js .dt-input.is-native .dt-native { visibility: visible !important; }
-html.js .dt-input.is-native::after { display: none !important; }
-html.js .dt-range.is-native-range .dt-input { visibility: visible !important; }
-html.js .dt-range.is-native-range > .dt-range-label { visibility: visible !important; }
-html.js .dt-range.is-native-range::before { display: none !important; }
-html.js .dt-range.is-native-range > .dt-input,
-html.js .dt-range.is-native-range > .field { display: flex !important; }
-/* ⚠️ v24 第 21 批 第 7 条：两端现在各自被 `.field` 包着，所以选择器要跟着下沉一层。
-      写成 `> .dt-input` 的话这条**永远不会命中** → 未升级时原生控件照旧可见，
-      与下面那块"占位骨架"叠在一起，会看到两套控件重影。 */
-html.js .dt-range:not(.is-semi-range) .dt-input { visibility: hidden; }
-html.js .dt-range:not(.is-semi-range) > .dt-range-label { visibility: hidden; }
-/* Semi 未就绪前，先给一个同高的"占位骨架"，让表单高度在升级前后保持一致 */
-html.js .dt-input:not(.is-semi)::after {
-  content: ''; display: block; flex: 1 1 150px; height: 40px;
-  border: 1px solid var(--line); border-radius: var(--radius-s);
-  background: var(--surface); opacity: .55;
-}
-html.js .dt-range:not(.is-semi-range)::before {
-  content: ''; display: block; width: 100%; max-width: 460px; height: 40px;
-  border: 1px solid var(--line); border-radius: var(--radius-s);
-  background: var(--surface); opacity: .55;
-}
-html.js .dt-range.is-semi-range::before { display: none; }
 .dt-input .dt-semi { display: none; flex: 1 1 220px; min-width: 0; }
-.dt-input.is-semi .dt-semi { display: block; }
+
-.dt-input.is-semi::after { display: none; }
+/* ---- 日期：年 / 月 / 日 三个下拉 ---- */
-/* 工作经历的月份选择器（type="month" 升级）：占满原 .job-cell 格子 */
+.dt-date-sel { display: flex; align-items: center; gap: 4px; min-width: 0; }
+.dt-input .dt-year,
+.dt-input .dt-month,
+.dt-input .dt-day {
+  padding: 9px 6px; border: 1px solid var(--line); border-radius: var(--radius-s);
+  background: var(--surface); color: var(--ink); font: inherit; font-size: 13.5px;
+  font-variant-numeric: tabular-nums; cursor: pointer; min-width: 0;
+}
+/* 年最宽（4 位数 + 箭头），月/日短一些 —— 省下来的宽度留给时:分 */
+.dt-input .dt-year  { flex: 0 1 86px; }
+.dt-input .dt-month { flex: 0 1 66px; }
+.dt-input .dt-day   { flex: 0 1 64px; }
+/* 隐藏的 `*_date` 真正的字段（提交契约）—— 它必须留在 DOM 里 */
+.dt-input input.dt-date[type="hidden"] { display: none; }
+/* 旧「原生 date 框」形态（$dtDateType='native' 时才出现）保留样式 */
+.dt-input .dt-date:not([type="hidden"]) {
+  flex: 1 1 150px; min-width: 0; cursor: pointer;
+  padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--radius-s);
+  background: var(--surface); color: var(--ink); font: inherit;
+  accent-color: var(--brand);
+}
+.dt-input .dt-date:not([type="hidden"])::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .65; }
+
+/* ---- 时间：时 : 分 ---- */
+.dt-time { display: flex; align-items: center; gap: 3px; flex: 0 0 auto; }
+.dt-input .dt-hour,
+.dt-input .dt-minute,
+.dt-input .dt-second {
+  padding: 9px 6px; border: 1px solid var(--line); border-radius: var(--radius-s);
+  background: var(--surface); color: var(--ink); font: inherit; font-size: 13.5px;
+  font-variant-numeric: tabular-nums; cursor: pointer;
+}
+.dt-input .dt-colon { color: var(--muted); font-weight: 600; }
+
+/* 必填但没填时描红（由 app.js 的 guardRequired 打类） */
+.dt-input.dt-missing .dt-year,
+.dt-input.dt-missing .dt-month,
+.dt-input.dt-missing .dt-day,
+.dt-input.dt-missing .dt-date { border-color: #C0392B !important; }
+
+/* ============================================================================
+   起止范围（.dt-range）：两端一行优先，放不下才换行
+   ============================================================================
+   用户原话（2026-10-09 第 4 次反馈）：
+     现在开始和结束时间分在了两行，导致日期这个特别特别的长，后面的时和分又
+     非常非常的短，非常不协调。所以这两个日期如果能放一排，如果能放得下的话，
+     就应该放一排。因为日期和时间，分和时和分的这个长度基本上是固定的，
+     所以你可以判断一下它到底能不能一行，能不能放得下。如果能放下的话就放在一行。
+     如果在手机上，比如说它这个页面非常窄，它就可以把它挤到下一行。
+     但是现在不要让它默认显示在两行上，应该默认显示在一行上才对。
+
+   ⇒ 做法：flex 容器 + flex-wrap。每端有一个最小的可用宽度（.dt-part 的
+     min-width），浏览器在每次布局时自己判断放不放得下；放得下 → 一行；
+     放不下 → 第二端自然掉到下一行。
+     ⚠️ 不用 JS 量宽度：字体没加载完 / 容器动画中都会量错，窗口缩放还要重算；
+        flex-wrap 是浏览器布局的一部分，永远是对的。
+   ⚠️ .dt-range 的标签只在组上留一个（见 _event_fields.php 的说明）：
+      两端是同一个范围的两个端点，各挂一个标签会变成"看着像两个字段"的错觉。 */
+.dt-range { display: flex; flex-direction: column; gap: 8px; }
+.dt-range-label { font-size: 14px; color: var(--ink); font-weight: 600; }
+/* 升级（= app.js 挂上 .dt-cols）之后：两端并排、必要才换行 */
+.dt-range.dt-cols {
+  flex-direction: row; flex-wrap: wrap; align-items: center;
+  gap: 10px 18px;
+}
+/* 两端的"最小可用宽度"：日期(年+月+日) + 时:分 摆得下。
+   值取 250px —— 实测"年(86)+月(66)+日(64)+时:分(约 96)+间距"约 330px 才舒服，
+   但最小可用是 250px（会各自压缩一点），这样在常见的 560px+ 容器里
+   两端（250×2 + 18 间距 = 518）肯定放得下 → 默认就是一行。 */
+.dt-range.dt-cols > .dt-input,
+.dt-range.dt-cols > .field { flex: 1 1 250px; min-width: 250px; display: flex; }
+.dt-range.dt-cols > .field { flex-direction: column; gap: 6px; }
+/* 标签占满整行（不然它会跟第一端挤在一起） */
+.dt-range.dt-cols > .dt-range-label { flex: 1 1 100%; }
+/* 极窄屏：两端各自铺满一行（用户说的"手机上就挤到下一行"） */
+@media (max-width: 560px) {
+  .dt-range.dt-cols > .dt-input,
+  .dt-range.dt-cols > .field { flex: 1 1 100%; min-width: 0; }
+}
+
+/* ============================================================================
+   Semi 仅剩的用途：工作经历的「年月选择」（<input type="month"> 的升级）
+   ----------------------------------------------------------------------------
+   ⚠️ 日期/时间控件（.dt-input）v37 起已完全不用 Semi —— 上面那套自建下拉
+      就是因为它给的弹层交互不可控（选完年月卡住）。这里保留的是另一处。
+   ============================================================================ */
 .dt-semi.dt-semi-month { display: none; }
 .dt-semi.dt-semi-month.is-live { display: block; width: 100%; }
-
-/* ---- v24 第 10 批 #7：起止范围用一个控件（Semi dateTimeRange）----
-   一对 .dt-input 被包在 .dt-range 里；升级后两端各自 display:none，
-   由**一个** .dt-semi-range 顶上来。未升级（JS 没跑/加载失败）时，
-   里面两个原生控件照旧各占一行 —— 也就是"功能没变，只是不好看"。 */
-.dt-range { display: flex; flex-direction: column; gap: 8px; }
-/* 范围控件自己的标签（只有一个，见 _event_fields.php 的说明） */
-.dt-range-label { font-size: 13px; color: var(--muted); font-weight: 500; }
-.dt-range.is-semi-range { display: block; }
-.dt-range.is-semi-range > .dt-input { display: none; }   /* 两端都让位给范围控件 */
-/* 两端被 .field 包着时的同一条规则（见上面第 21 批的说明） */
-.dt-range.is-semi-range > .field { display: none; }
-.dt-semi-range { display: none; width: 100%; max-width: 460px; }
-.dt-range.is-semi-range .dt-semi-range { display: block; }
-/* Semi 范围输入框：与站内 .input 同高同圆角；宽度撑开一点（要放两个时间） */
-body[class] .dt-semi-range .semi-input-wrapper {
-  height: 40px; border: 1px solid var(--line); border-radius: var(--radius-s);
-  background: var(--surface);
-}
-body[class] .dt-semi-range .semi-input-wrapper:hover { border-color: var(--brand-2); }
-body[class] .dt-semi-range .semi-input { font: inherit; font-size: 13.5px; color: var(--ink); }
-/* ---- v24 第 12 批 #2：范围控件的「灰底 + 不垂直居中」（实测定位）----
-   用真浏览器量出来两个毛病：
-     ① 灰底：Semi 的 **外层** `.semi-datepicker-input` 自带 `rgba(46,50,56,.05)`
-        灰底、高只有 32px；而内层 `.semi-input-wrapper` 是白底、40px ——
-        两层套着，灰的那层露在外面（用户看到的"灰色背景色"）。
-     ② 不居中：外层 32px < 内层 40px，输入框上下都被挤出去
-        （实测 gapTop=1 / gapBottom=17 → 文字贴顶）。
-   修法：把**外层容器**改成透明 + 不限高 + 垂直居中，让内层 40px 的白底框
-   自己撑起来（与站内 .input 完全一致）。 */
-body[class] .dt-semi-range .semi-datepicker-input {
-  background: transparent !important;
-  height: auto !important;
-  min-height: 0 !important;
-  align-items: center;
-  padding: 0;
-  border: 0;
-}
-body[class] .dt-semi-range .semi-datepicker-range-input-wrapper {
-  align-items: center;
-  background: transparent;
-}
-/* 两端的白底框就是"可见的输入框"：撑满高度、文字垂直居中 */
-body[class] .dt-semi-range .semi-input-wrapper {
-  display: flex; align-items: center;
-}
-body[class] .dt-semi-range .semi-input-wrapper .semi-input {
-  height: 100%; line-height: 40px; padding: 0 8px;
-  background: transparent;
-}
-@media (max-width: 640px) {
-  .dt-semi-range { max-width: none; }
-}
-.dt-input.dt-missing .semi-input-wrapper { border-color: #C0392B !important; box-shadow: 0 0 0 1px #C0392B inset; }
-/* Semi 主题对齐宣纸色。semi.min.css 是懒加载的、必然排在 app.css 之后，
-   所以这里赢在**优先级**：body[class] 特异性(0,1,1) > semi 的 body(0,0,1)。 */
 body[class] {
   --semi-color-primary: var(--brand, #A84A28);
   --semi-color-primary-hover: var(--brand-2, #C05F38);
   --semi-color-primary-active: var(--brand-ink, #8D3C20);
   --semi-color-focus-border: var(--brand, #A84A28);
 }
-/* 输入框本体：跟站内 .input / .dt-date 同一轮廓（描边、圆角、纸面底色、同高） */
 body[class] .dt-semi .semi-input-wrapper {
   width: 100%; height: 40px;
   border: 1px solid var(--line); border-radius: var(--radius-s);
   background: var(--surface); color: var(--ink);
-  /* v24 第 12 批 #2：单点控件也做同样处理 —— 外层半透明灰底去掉、文字垂直居中
-     （用户说"这种情况同样出现在其他的日期选择功能中"）。 */
   display: flex; align-items: center;
 }
 body[class] .dt-semi .semi-input-wrapper:hover { border-color: var(--brand-2); background: var(--surface); }
@@ -711,43 +711,16 @@ body[class] .dt-semi .semi-input { font: inherit; color: var(--ink); }
 body[class] .dt-semi .semi-input::placeholder { color: var(--muted); }
 body[class] .dt-semi .semi-datepicker-input,
 body[class] .dt-semi .semi-datepicker {
-  background: transparent !important;
+  background: transparent !important; height: auto !important;
-  height: auto !important;
+  min-height: 0 !important; border: 0; padding: 0;
-  min-height: 0 !important;
-  border: 0;
-  padding: 0;
 }
 body[class] .dt-semi .semi-input-wrapper .semi-input {
   height: 100%; line-height: 40px; padding: 0 11px; background: transparent;
 }
-/* 日历面板：白纸底色统一成卡片的纸色，选中/悬停色走上面的 brand 变量 */
 body[class] .semi-popover .semi-datepicker { background: var(--surface, #fff); }
 body[class] .semi-datepicker-day-selected { background-color: var(--brand, #A84A28); }
 body[class] .semi-datepicker-day-hoverday,
 body[class] .semi-datepicker-day-inhover { background-color: color-mix(in srgb, var(--brand, #A84A28) 12%, transparent); }
-.dt-input .dt-date {
-  flex: 1 1 150px; min-width: 0;
-  padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--radius-s);
-  background: var(--surface); color: var(--ink); font: inherit;
-  accent-color: var(--brand);
-}
-.dt-input .dt-date { cursor: pointer; }   /* 整框可点，光标也要说明这一点 */
-.dt-input .dt-date::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .65; }
-.dt-time { display: flex; align-items: center; gap: 3px; }
-.dt-input .dt-hour,
-.dt-input .dt-minute,
-.dt-input .dt-second {
-  padding: 9px 6px; border: 1px solid var(--line); border-radius: var(--radius-s);
-  background: var(--surface); color: var(--ink); font: inherit;
-  font-variant-numeric: tabular-nums; cursor: pointer;
-}
-.dt-input .dt-colon { color: var(--muted); font-weight: 600; }
-
-/* 🔴 v36：时间不再有"合成的时间框"（v35 试过 `<input type="time">`，已弃用）。
-   `.dt-merged` / `.dt-time-input` 的规则一并删掉 —— 免得将来有人误以为
-   还有"被收起来的下拉"。用户要的形态就是**日期 + 时/分下拉**直接显示。 */
-.dt-input.is-native-range { gap: 8px; }
-.dt-range.is-native-range { display: flex; flex-direction: column; gap: 10px; }
 
 /* 「以哪个生日为准」的两块：被选中的那块描一圈，一眼看出填的是哪边 */
 .bd-source { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
@@ -3206,6 +3179,29 @@ body[class] .semi-datepicker-day-inhover { background-color: color-mix(in srgb,
   border: 1px solid var(--line); border-radius: 10px;
 }
 .rev-tip { margin: 0 0 10px; font-size: 12.5px; line-height: 1.7; color: var(--muted); }
+
+/* 🔴🔴 v37：修正面板必须**浮**在按钮列之外，否则它只有 ~22px 宽、完全没法填。
+   真机实测（1400px 视口、品心 1080px）：
+     .dt-range 宽 **22px**、`.nf-grid` 宽 **22px** —— 整张修正表单被压成一条线。
+     根因：`.node-ops` 是"一排小按钮"的容器
+       `flex: 0 0 auto; justify-content: flex-end;`（见上面），
+     而「修正」是 `<details class="rev-open">`：**展开的内容也长在这个按钮列里**
+     ⇒ 列宽只有"修正"两个字那么宽（22px），里面的表单跟着一起被压扁。
+   ⚠️ 这不只是"不好看"：日期控件在 22px 里根本点不到（用户报的就是这个）。
+   修法：面板 `position: absolute` 脱离按钮列的宽度约束，浮到卡片上。
+     · 宽度取 `min(720px, container 宽)` —— 720 刚好摆得下"两端各 304"（608+间距）。
+     · `right: 0` 让它从按钮列右缘向左展开，不会超出卡片右边。
+     · `z-index: 30` 盖在后面的行上面（它是临时展开的面板，本来就该在最上层）。
+   ⚠️ 不动 templates/trips/show.php 的 DOM：
+      `.node-list`/`.node-row` 的 flex 结构一动就会牵动"节点列表"的排版
+      （那是清单页最核心的视觉），而这里只需要把它**浮出来**，纯 CSS 就够。 */
+.rev-open { position: relative; }
+.rev-panel {
+  position: absolute; right: 0; top: calc(100% + 6px); z-index: 30;
+  width: min(720px, calc(100vw - 48px));
+  max-height: min(76vh, 720px); overflow-y: auto;
+  box-shadow: var(--shadow-l, 0 12px 32px rgba(0, 0, 0, .16));
+}
 .rev-form .btn-row { margin-top: 10px; }
 
 /* 修正历史对比表 */
@@ -3964,11 +3960,15 @@ button.btn, a.btn, summary.btn, .seg-btn, .icon-btn, .rv-act-btn, .cs-btn, .bf-b
   background: rgba(44, 35, 29, .55); overscroll-behavior: contain;
 }
 .cal-modal[hidden] { display: none; }
+/* 🔴 v37：`max-height` 必须把 `.cal-modal`（本面板的父层）自己的 `padding: 24px`
+   算进去 —— 只减 48 会让面板底部**刚好探出视口 4px**，
+   于是 `.cal-modal-foot` 里那两个按钮有半截在屏幕外（用户"看不到按钮"的另一半原因）。
+   ⇒ 减 **64px** = 上下各 24px 的遮罩内边距 + 16px 余量。 */
 .cal-modal-panel {
   width: min(680px, 100%); margin: auto;
   background: var(--surface); border-radius: 14px;
   box-shadow: var(--shadow-l); display: flex; flex-direction: column;
-  max-height: calc(100vh - 48px);
+  max-height: calc(100vh - 64px);
 }
 .cal-modal-head {
   display: flex; align-items: center; gap: 10px;
@@ -5084,3 +5084,63 @@ h5.md-h, h6.md-h { font-size: 14px; }
   .ntf-main { flex-wrap: wrap; gap: 2px 10px; }
   .ntf-title { flex: 1 1 100%; }
 }
+
+/* ============================================================================
+   v37(2026-10-09) —— 弹框：按钮位置 / 标签加粗 / 观影弹框宽度
+   ----------------------------------------------------------------------------
+   用户原话（4 条，都指向"弹框"）：
+     ⑤「日程模块的新建日程里，弹出一个对话框。但是"加上"和"取消"两个按钮在
+        右上角，离得特别远，根本看不到。应该把它们放在下方，或者放在"新建日程"
+        标题的右侧，不要放那么远。
+        另外，每个输入框前面的标题都太小了…比如"放在哪本""标题""地点""提醒"这些，
+        都应该加粗、变大，这样跟里面的内容产生一些差异，看起来更醒目一些。」
+     ⑥「新建任务也和新建日程一样，新建时弹出一个框…」
+   ============================================================================ */
+
+/* 🔴🔴 日程弹框"按钮跑到右上角、还根本看不到"的真根因（实测定位，不是猜）：
+   `.cal-modal-panel` 是 flex 列（head / form / foot 三段），但**它下面的 <form>
+   不是** —— form 是块级元素，`cal-modal-body{flex:1 1 auto}` 的 flex 上下文
+   只到 form 为止。于是 form 的高度 = head + 内容**全部**高度，而面板 `max-height`
+   又把外层卡住 ⇒ foot 被挤出面板可视区，出现在**面板底部之外**，
+   而面板本身不滚（滚的是 body）→ 用户看到的就是"按钮飘在很远的地方 / 看不见"。
+   ⇒ 让 form 也参与那个 flex 列、body 才能真正被压缩到可滚动。 */
+.cal-modal-panel > form {
+  display: flex; flex-direction: column;
+  flex: 1 1 auto; min-height: 0;
+  overflow: hidden;   /* 圆角裁切：body 滚动时不要顶出面板 */
+}
+/* ⚠️ v37 起"加上"主键改用 `form="calAddForm"` 关联 ——
+      它不再长在 form 内部，`:not()` 那条老规则会失效，这里按 id 补回。 */
+.cal-modal-foot .btn[type="submit"],
+.cal-modal-foot #calAddSubmit { margin-left: auto; }
+
+/* ---- 弹框里的字段标签：加粗、变大、深色 ----
+   用户原话：「每个输入框前面的标题都太小了…都应该加粗、变大，这样跟里面的内容
+              产生一些差异，看起来更醒目一些。」
+   ⚠️ 只改**弹框里**的（.cal-modal / .pp-modal 等浮层面板内）：
+      页面内的普通表单标签维持原样，避免"改一处动了全站"。
+   ⚠️ 用 `.cal-modal .field > label` 而不是 `.cal-modal label`：
+      后者会连"提醒"那排 checkbox 的每个小标签一起加粗，看起来一片糊。 */
+.cal-modal .field > label,
+.cal-modal .field > .dt-range-label,
+.cn-panel .field > label,
+.pp-modal .field > label {
+  font-size: 14px; font-weight: 600; color: var(--ink);
+}
+
+/* ---- 观影"记一场电影"弹框 ----
+   ⚠️ 字段比日程多得多（海报 + 观影照片 + 简介 + 同行人…），620px 太窄了，
+      用 760px 让两列字段摆得开；高度放到 88vh，长表单才有足够的可视区。 */
+.cal-modal-panel.mv-panel { width: min(760px, 100%); max-height: calc(100vh - 64px); }
+.mv-form-inner { padding: 16px; }   /* 弹框里的内边距（编辑态用的是 .card-pad） */
+/* 弹框形态下，页面上那条"记下这场电影 / 取消"一整行是多余的（foot 里已有），
+   但它在**编辑态**必须留着 —— JS 没跑时它是唯一的提交入口。 */
+.mv-foot-inner { display: none; }
+@media (max-width: 640px) {
+  .cal-modal-panel.mv-panel { width: 100%; }
+}
+
+/* ---- 窄屏：弹框字段全部单列（form-grid 是两列，手机上会把标签挤成两个字） ---- */
+@media (max-width: 560px) {
+  .cal-modal .form-grid { grid-template-columns: 1fr; }
+}

assets/js/app.js

@@ -1268,18 +1268,39 @@
   })();
 })();
 
-// ==================== Semi Design DatePicker（v24 第 9 批 #9） ====================
+// ==================== 日期时间控件：绑事件 + 工作经历的年月选择 ====================
-// 用户点名「所有日期选择换 https://semi.design 的 DatePicker，样式与系统统一」。
+/* 🔴🔴 v37：这一段的职责**大幅缩小**了。
-// 这里是**渐进增强**的升级层：templates/_datetime.php 照旧渲染原生「日期+时/分/秒」
+   原来它是"Semi DatePicker 渐进增强层"：藏掉原生控件、挂上 Semi、把值写回原字段。
-// 四字段（表单契约与服务端 read_dt_input() 不动），Semi 的资源（合计约 4 MB）只在
+   现在日期/时间控件（.dt-input）**完全自建**（年/月/日 + 时/分 原生下拉，
-// 页面上真出现 .dt-input 时才懒加载；加载成功 → 藏原生、挂 DatePicker、值回写原字段；
+   见 templates/_datetime.php 与 upgradeRange / upgrade / bindParts）
-// 加载失败 → 原生控件原样可用，页面不会坏。
+   —— 因为它们要的交互（"选完年月要能回来选日"）浏览器自带的弹层给不了，
+   Semi 的弹层同样给不了（v35 实测：它的时间面板根本是空的）。
+
+   ⚠️ 仍然**必须**跑起来，因为还有一件事离不开这套加载器：
+      **工作经历的 `<input type="month">`**（Firefox 压根不支持原生 month，
+      Chrome 的弹层也是同一个"选完年月卡住"的毛病）—— 它继续用 Semi 的
+      月选择器（`type: 'month'`，只需点月份格，没有"切回来"的问题）。
+   ⚠️ 连带的好处：没有 month 控件的页面**不再下载那 4 MB** Semi 资源。
+      以前只要页面上有任何 .dt-input 就会去拉；现在只按 hasMonth 判断。 */
 (function () {
   var boxes = Array.prototype.slice.call(document.querySelectorAll('.dt-input[data-dt]'));
   var hasMonth = !!document.querySelector('input[type="month"]');
-  if (!boxes.length && !hasMonth) { return; }
+  /* ⚠️ 只要还有 month 控件就得拉 Semi；纯 .dt-input 页面（绝大多数）不用拉。 */
+  if (!hasMonth) {
+    // 没有 month 控件：**只做绑定**，不下载任何外部资源。
+    // 这一步不能省 —— 三个日期下拉写回隐藏 *_date 全靠它。
+    Array.prototype.forEach.call(document.querySelectorAll('.dt-range'), upgradeRange);
+    boxes.forEach(upgrade);
+    watchNewControls();
+    return;
+  }
   var meta = document.querySelector('meta[name="fb-semi"]');
-  if (!meta) { return; }
+  if (!meta) {
+    Array.prototype.forEach.call(document.querySelectorAll('.dt-range'), upgradeRange);
+    boxes.forEach(upgrade);
+    watchNewControls();
+    return;
+  }
   var conf;
   try { conf = JSON.parse(meta.getAttribute('content')); } catch (e) { return; }
   if (!conf || !conf.css || !conf.react || !conf.dom || !conf.ui) { return; }
@@ -1385,73 +1406,28 @@
     });
     if (!a || !b) { return; }
 
-    /* 🔴🔴 v35：**范围控件不再用 Semi 的 dateTimeRange**，改用原生
+    /* 🔴🔴 v37：**最彻底的简化 —— 不再"升级"任何东西、不再隐藏任何东西**。
-       「日期框 + 时间框」两个小控件。
+       控件从服务端出来就（应当）是它**最终该有的样子**（见 templates/_datetime.php）：
-       用户原话：「选择日期那个地方给，非常不好用。如果我不选日期，只选时间，
+         · 日期 = 年 / 月 / 日 三个原生下拉；
-                  框里面仍然是空白的，也没有确定按钮，这个需要重新调整一下。」
+         · 时间 = 时 / 分 两个原生下拉。
+       这里只做两件事：① 把三个日期下拉绑成"改哪个算哪个"（写回隐藏的 *_date）；
+                      ② 给范围组排版（两端一行、窄屏自动换行）。
 
-       实测结论（独立最小复现 + 真机，2026-10-09）：
+       用户原话（2026-10-09 第 4 次反馈）：
-       · Semi 的 dateTimeRange 面板**只给日期网格**，时间藏在
+         「…选日期的这个控件非常非常不好用。就是如果我把年和月那个地方拉下来，
-         `.semi-datepicker-switch-time` 那个小时钟按钮后面；
+           我选完年和月之后，它并不会回到让我选日的那个界面，它还是不动的，
-       · 点了那个按钮切到时间面板，**面板仍然是空的**
+           所以这时候就没有办法选日。」
-         （`timeLists = 0`、无选项、无 footer、无"确定"）→ 根本没法只选时间；
+       —— 那是**浏览器自带日历弹层**的行为（我们碰不到它的 DOM，也就没法治）；
-       · 单点 `dateTime` 同样（面板里没有可选的时间列）。
+          三个原生下拉是我们能完全控制的形态，选完即生效、不需要"确定"。
-       ⇒ 该组件在这套资源下**给不了"选完即确认"的时间选择**，也不能"只选时间"，
+       「另外一个问题是，现在开始和结束时间分在了两行…如果能放得下的话，
-         与用户描述的症状完全一致。
+         就应该放一排。」→ 见下面 layoutRange() + CSS 的 .dt-cols。 */
-       ⇒ 改用原生 `type="time" step="1"`：24 小时制、精确到秒、点了就选、
-         不选日期也照样有值（实测 `21:45:30` 会保留），且**不需要**确认按钮。
 
-       ⚠️ 提交契约**一点没变**：仍是 `*_date` / `*_hour` / `*_minute` / `*_second`
+    layoutRange(group);
-         四个字段（服务端 read_dt_input 照收、既有 e2e 照过）。
+    bindParts(a);
-         这里只是把两端的日期框**露出来**、并把原来的 时/分/秒 三个下拉
+    bindParts(b);
-         合成**一个**原生时间框（三个下拉仍留在 DOM 里，只是不单独显示）。 */
 
-
+    // 供 fbSetDT / fbUpgradeRange 的既有调用点使用
-    /* 🔴🔴 v36：**不合成任何"时间框"，直接把原生的「日期 + 时/分下拉」露出来**。
-       用户原话（第 2 次反馈，2026-10-09）：
-         「观影模块，开始时间和结束时间是空白的，无法选择，可以调整为，
-           前面是日期，后面是时和分，只记录到时和分就行了。时和分，是下拉的。」
-
-       ⚠️ v35 那一版为什么用户看到的是**一片空白**（我的锅）：
-         当时只给范围**组**加了 `.is-native-range`，**没给两个端点 `.dt-input`
-         加 `.is-native`** —— 于是 CSS 里
-           `html.js .dt-input:not(.is-semi) .dt-native { visibility: hidden; }`
-         照样命中 ⇒ 控件 `visibility:hidden`（**占着 48px 高度、但完全不可见、点不到**）。
-         🔴 更糟的是探针当时用 `offsetParent !== null` 判"可见" ——
-            对 `visibility:hidden` 的元素它**仍然返回 true**，于是连续两轮都"通过"。
-            ⇒ 判可见**必须看 computed visibility**（_fb_b34_dtrange.py 已改）。
-
-       ⇒ 本版走最笨但最稳的路：**不造新控件**，直接把原有的 日期 + 时/分 下拉显示出来。 */
-    function revealEndpoint(box) {
-      var native = box.querySelector('.dt-native');
-      if (!native) { return; }
-      // ① 端点加 `.is-native`（压掉"未 .is-semi 就藏原生"那条规则）
-      box.classList.add('is-native');
-      // ② 去掉"秒"那一档（用户只要到分）；紧跟它的那个冒号一起收掉
-      var secEl = native.querySelector('.dt-second');
-      if (secEl) {
-        var prev = secEl.previousElementSibling;
-        if (prev && prev.classList && prev.classList.contains('dt-colon')) { prev.remove(); }
-        secEl.remove();
-      }
-      // ③ 显示（inline 覆盖，避免再被任何 CSS 规则藏住 —— 这是 v35 的教训）
-      native.style.display = 'contents';
-      native.style.visibility = 'visible';
-      box.style.display = '';
-      box.style.visibility = 'visible';
-      box.classList.add('has-value');
-    }
-
-    revealEndpoint(a);
-    revealEndpoint(b);
-
-    // 供 fbSetDT / fbUpgradeRange 的既有调用点使用（不再挂 Semi，无需同步）
     group.__fbRemount = function () {};
-
-    /* ⚠️ 原来这里会隐藏"端点最外层的包装"（因为 Semi 范围控件顶替了两端）。
-       v35 起两端**就是要显示**的，所以不再隐藏任何东西 ——
-       v34 那个"共用包装导致整组被藏"的 bug 也随之不再可能发生。
-       （v34 的修法保留在 _fb_b34_dtrange.py 的断言里：组必须可见。） */
     guardRequired(a);
     guardRequired(b);
     group.setAttribute('data-semi-range-done', '1');
@@ -1459,33 +1435,101 @@
     group.classList.add('is-native-range');
   }
 
+  /* ============================================================================
+     v37 的共用件（单点与范围两端都走它们）
+     ============================================================================ */
+
+  /**
+   * 把「年 / 月 / 日」三个下拉绑成"改哪个算哪个"，并写回隐藏的 `*_date`。
+   *
+   * ⚠️ `*_date` 仍然是**真正的表单字段**（只是 type=hidden）——
+   *    「提交契约一字不改」是这样在**结构上**保证的，而不是靠前后端约定。
+   * ⚠️ 改年 / 月会重建"日"那一列：2 月在闰年 29 天、4 月 30 天。
+   *    原来选的那一天若在新月份里不存在（31 号 → 2 月），**清空**而不是
+   *    静默挪到别的一天 —— 用户没选过的日子不能替他选。
+   */
+  function bindParts(box) {
+    var native = box.querySelector('.dt-native');
+    if (!native) { return; }
+    var date = native.querySelector('input.dt-date');
+    var y  = native.querySelector('select.dt-year');
+    var mo = native.querySelector('select.dt-month');
+    var d  = native.querySelector('select.dt-day');
+    if (!date || !y || !mo || !d) { return; }   // 不是"下拉版"（native 模式）→ 无事可做
+    if (box.__fbBound) { return; }
+    box.__fbBound = true;
+
+    function daysIn(yy, mm) {
+      return (yy && mm) ? new Date(yy, mm, 0).getDate() : 31;   // new Date(y, m, 0) = 上月末
+    }
+
+    function rebuildDays(keep) {
+      var yy = parseInt(y.value, 10), mm = parseInt(mo.value, 10);
+      var n  = daysIn(yy, mm);
+      var cur = keep ? d.value : '';
+      d.innerHTML = '<option value="">日</option>';
+      for (var i = 1; i <= n; i++) {
+        var o = document.createElement('option');
+        o.value = String(i);
+        o.textContent = i + '日';
+        d.appendChild(o);
+      }
+      d.value = (cur && parseInt(cur, 10) <= n) ? cur : '';
+    }
+
+    function sync() {
+      var v = (y.value && mo.value && d.value)
+        ? y.value + '-' + pad(+mo.value) + '-' + pad(+d.value)
+        : '';
+      if (date.value !== v) {
+        date.value = v;
+        date.dispatchEvent(new Event('change', { bubbles: true }));
+      }
+      box.classList.toggle('has-value', v !== '');
+    }
+
+    y.addEventListener('change', function () { rebuildDays(true); sync(); });
+    mo.addEventListener('change', function () { rebuildDays(true); sync(); });
+    d.addEventListener('change', sync);
+    rebuildDays(false);   // 首屏：把"日"列按当前年月铺对
+    sync();
+
+    // 供 fbSetDT / writeDT 程序化改值之后让三个下拉跟上
+    box.__fbSyncParts = function () {
+      var m = (date.value || '').match(/^(\d{4})-(\d{2})-(\d{2})$/);
+      if (!m) { y.value = ''; mo.value = ''; rebuildDays(false); d.value = ''; return; }
+      y.value = String(+m[1]);
+      mo.value = String(+m[2]);
+      rebuildDays(false);
+      d.value = String(+m[3]);
+    };
+  }
+
+  /**
+   * 范围组排版：两端各占一列，**宽屏一行、窄屏换行**。
+   *
+   * ⚠️ 几何全部交给 CSS（flex + flex-wrap + 每端的 min-width），
+   *    这里**只挂类名**。为什么不在这里算宽度：
+   *    用 JS 量宽度会在字体没加载完 / 容器动画中量错，而且窗口缩放要重算；
+   *    `flex-wrap` 由浏览器在**每次布局时**自己算，永远是对的。
+   *    这也正是用户要的：「如果能放得下就放一排；手机上很窄就挤到下一行」。
+   */
+  function layoutRange(group) {
+    group.classList.add('dt-cols');
+  }
+
   function upgrade(box) {
     if (box.getAttribute('data-semi-done')) { return; }
     // 范围对的成员由 upgradeRange 统一处理
     if (box.classList.contains('dt-part')) { return; }
-    var cfg = {};
-    try { cfg = JSON.parse(box.getAttribute('data-dt') || '{}'); } catch (e) {}
     var native = box.querySelector('.dt-native');
     if (!native) { return; }
 
-    /* 🔴 v36：单点控件也**不合成时间框**了 —— 与范围那两端同一套做法
+    /* v37：单点控件**也不再"升级"** —— 服务端给的就是最终形态（年/月/日 + 时/分下拉）。
-       （见上面 revealEndpoint 的说明）。直接把原生的「日期 + 时/分下拉」显示出来。
+       这里只负责绑定与打标记。 */
-       ⚠️ 秒那一档按用户要求去掉（"只记录到时和分就行了"）。 */
+    bindParts(box);
-    if (!box.__fbRevealed) {
-      box.__fbRevealed = true;
-      var secEl1 = native.querySelector('.dt-second');
-      if (secEl1) {
-        var prev1 = secEl1.previousElementSibling;
-        if (prev1 && prev1.classList && prev1.classList.contains('dt-colon')) { prev1.remove(); }
-        secEl1.remove();
-      }
-    }
-    // 端点加 .is-native（压掉"未 .is-semi 就藏原生"的规则）+ 直接显示
     box.classList.add('is-native');
     box.classList.add('has-value');
-    native.style.display = 'contents';
-    native.style.visibility = 'visible';
-    box.style.visibility = 'visible';
     box.__fbRemount = function () {};
     guardRequired(box);
     box.setAttribute('data-semi-done', '1');
@@ -1507,8 +1551,14 @@
    */
   function guardRequired(box) {
     var req = box.querySelector('.dt-date[required]');
-    if (!req) { return; }
+    /* 🔴 v37：日期改成"年/月/日 下拉 + 隐藏 *_date"之后，
-    req.removeAttribute('required');
+       **隐藏框上不能挂 `required`** —— 隐藏控件在表单校验时不可聚焦，
+       Chrome 会报 "An invalid form control is not focusable"：点了保存
+       **什么都不发生、也没有红字提示**（这正是引入本守卫的原因）。
+       所以模板改用 `data-dt-required="1"` 声明"这个控件必填"，由下面自查。 */
+    var wantReq = box.getAttribute('data-dt-required') === '1';
+    if (!req && !wantReq) { return; }
+    if (req) { req.removeAttribute('required'); }
     box.setAttribute('data-required', '1');
     var form = box.closest('form');
     if (!form || form.getAttribute('data-dt-guard')) { return; }
@@ -1523,10 +1573,10 @@
       if (bad.length) {
         ev.preventDefault();
         bad.forEach(function (b) { b.classList.add('dt-missing'); });
-        // v35：不再有 .dt-semi —— 焦点落到原生日期框（那才是"该补的字段"）
+        // v37：焦点落到**年**那一档（下拉版的第一个可见控件；那才是"该补的字段"）
-        var inp = bad[0].querySelector('.dt-semi input')
+        var inp = bad[0].querySelector('select.dt-year')
                || bad[0].querySelector('.dt-date')
-               || bad[0].querySelector('input, select');
+               || bad[0].querySelector('select, input');
         if (inp) { inp.focus(); }
       }
     });
@@ -1668,6 +1718,10 @@
     });
     if (!box) { return false; }
     writeDT(box, str);
+    /* 🔴 v37：隐藏的 *_date 写完还不算完 —— 页面上真正给用户看的是
+       「年 / 月 / 日」三个下拉，必须让它们**跟着走到同一个值**，
+       否则会出现"程序设了 15:00，下拉里还写着 09:00"这种最难解释的不一致。 */
+    if (box.__fbSyncParts) { box.__fbSyncParts(); }
     // 原生写完了 —— 现在把 Semi 一侧也刷新成同一个值
     var group = box.closest ? box.closest('.dt-range') : null;
     if (group && group.getAttribute('data-semi-range-done') && group.__fbRemount) {

index.php

@@ -2568,13 +2568,21 @@ switch ($r) {
     /** 观影瀑布流（v9，MovieLog 同款海报墙；带关键词搜索）。 */
     case 'movies':
         $familyId = (int)Auth::familyId();
+        $me       = (int)Auth::personId();
         $keyword  = trim((string)($_GET['keyword'] ?? ''));
-        $rows     = Movie::all($familyId, $keyword, (int)Auth::personId());
+        $rows     = Movie::all($familyId, $keyword, $me);
+        /* 🔴 v37 用户第 6 条第 4 点：「观影模块也是一样，新增一部电影时，
+           也弹出一个框来输入所有信息。」⇒ 列表页内嵌"记一场电影"弹框，
+           所以这里要把表单需要的两组数据一并给它（原来只有 movies/new 才传）。 */
         View::render('movies/index', [
             'title'   => '观影记录',
             'rows'    => $rows,
             'total'   => count($rows),
             'keyword' => $keyword,
+            'peopleForModal'  => Person::roster($familyId, $me, 'member', ''),
+            'cinemasForModal' => Cinema::all($familyId),
+            /* 从"新建影院"弹框存完回来的（?cinema=）→ 顺手把外层弹框打开 */
+            'openModal' => (int)($_GET['cinema'] ?? 0) > 0,
         ], 'movies');
         break;
 
@@ -5459,6 +5467,17 @@ $want = array_keys($want);
             }
             flash('ok', '任务已新建。');
         }
+        /* 🔴 v37 用户第 6 条第 3 点：「新建任务也和新建日程一样，新建时弹出一个框，
+           新建完之后刷新新建任务的**列表、看板**页面。」
+           ⇒ 从看板上的"新建任务"弹框提交时带 `back=tasks` → 回看板（刷新了看板）。
+           ⚠️ 白名单取值，绝不把 POST 的字符串直接当跳转地址（开放重定向）。
+           ⚠️ **只对新建生效**：编辑是从详情页进来的，回详情页才对
+              （子任务那个 inline-form 也不带 back → 照旧回详情页看子任务）。
+           ⚠️ 新建后不再回详情页的另一个好处：附件/共享在表单里已经填完了，
+              没必要让用户再看一遍同一份内容。 */
+        if (!$isEdit && (string)($_POST['back'] ?? '') === 'tasks') {
+            redirect('tasks');
+        }
         redirect('tasks/show', ['id' => $tid]);
         break;
 

templates/_datetime.php

@@ -1,69 +1,124 @@
 <?php
 /**
- * 「日期 + 24 小时制时:分:秒」组合输入控件（从 TripLog 的 _datetime.php 移植）。
+ * 「日期 + 24 小时制时:分」组合输入控件。
  *
  * ⚠️ 为什么不用 <input type="datetime-local">：
  *    它的显示格式由**浏览器 UI 语言 / 系统时间格式**决定，<html lang> 与元素 lang
- *    都压不过它。中文环境实测会渲染成「下午 03:30」，用户很容易把上下午填反；
+ *    都压不过它。中文环境实测会渲染成「下午 03:30」，用户很容易把上下午填反。
- *    而且它只有时:分，**没有秒**。拆成「原生日期选择器 + 三个下拉」后，
- *    24 小时制与"精确到秒"都由控件本身保证，浏览器改不掉。
  *
- * 日期部分仍是原生 `<input type="date">`（app.js 里的 showPicker 脚本对它同样生效，
+ * ════════════════════════════════════════════════════════════════
- * 点输入框任意位置都能弹出日历 —— 这正是"整个输入框点击都可以弹出"的落点）。
+ * 🔴🔴 v37：**日期部分默认改成「年 / 月 / 日」三个原生下拉**（不再用 <input type=date>）
+ * ════════════════════════════════════════════════════════════════
+ * 用户原话（2026-10-09 第 4 次反馈，两次都提到同一个痛点）：
+ *   「编辑页面的时间，我还是不是特别满意…选日期的这个控件非常非常不好用。
+ *     就是如果我把年和月那个地方拉下来，我选完年和月之后，它并不会回到让我选日的
+ *     那个界面，它还是不动的，所以这时候就没有办法选日。这个地方要么换一个控件，
+ *     要么在那个地方加一个确定按钮…」
+ *
+ * 为什么会这样（不是我们调错了参数）：`<input type="date">` 的日历弹层是
+ * **浏览器自己画的**，我们既拿不到它的 DOM，也控制不了它的交互流程。
+ * Chrome 的弹层在"点顶部 `2026年 10月` 切到年月视图"之后，**切回日期视图要靠
+ * 用户再点一次日期或按 Esc** —— 各家浏览器行为还不一致，用户遇到的就是"卡住"。
+ * ⇒ 换成**我们能完全控制的原生 `<select>`**：三个下拉，选哪个改哪个、
+ *    **选完即生效**、不需要任何"确定"按钮。
+ *
+ * ⚠️ 提交契约**一个字都没变**：仍然产出
+ *      `*_date`（隐藏框，'YYYY-MM-DD'）/ `*_hour` / `*_minute`
+ *    服务端 read_dt_input()/read_due_input() 原样收，既有 e2e 与部署断言照过。
+ * ⚠️ 「秒」默认**不再产出**（$dtSeconds 默认 false）——
+ *    用户 2026-10-09 第 2 条：「只记录到时和分就行了」。
+ *    需要秒的老调用方显式传 $dtSeconds = true。
  *
  * 用法（include 前 set 好这些变量；模板里只读它们）：
- *   $dtName     字段基名，如 'birthday_solar' → 产出 *_date / _hour / _minute / _second
+ *   $dtName     字段基名，如 'starts_at' → 产出 *_date / _hour / _minute
- *   $dtValue    可空；'Y-m-d H:i:s' / 'Y-m-d H:i' / 'Y-m-d'。服务端用 read_dt_input($dtName) 取值
+ *   $dtValue    可空；'Y-m-d H:i:s' / 'Y-m-d H:i' / 'Y-m-d'
  *   $dtRequired 日期是否必填（默认 false）
- *   $dtId       可选；日期控件的 id（供 <label for>）
+ *   $dtId       可选；给外层一个 id（供 <label for> 与测试定位）
- *   $dtSeconds  是否要"秒"这一档（默认 true；生日要精确到时分秒）
+ *   $dtSeconds  是否要"秒"这一档（**默认 false**，见上面 v37 说明）
+ *   $dtRange    'start' | 'end' —— 这对控件属于同一个起止范围（见下）
+ *   $dtDateType 'select'（默认，年/月/日下拉）| 'native'（旧的原生 date 框）
+ *   $dtYearFrom / $dtYearTo  年份下拉的范围（默认：今年 -120 ~ 今年 +10；生日建议 1900）
  */
 $dtName     = (string)($dtName ?? 'time');
 $dtValue    = $dtValue ?? null;
 $dtRequired = (bool)($dtRequired ?? false);
 $dtId       = (string)($dtId ?? '');
-$dtSeconds  = (bool)($dtSeconds ?? true);
+/* 🔴 v37：秒默认关掉了（用户「只记录到时和分就行了」）。
-/* 用户 2026-10-04 第 7 条原话：「所有的时间选择，都已更换新插件，但是有个问题，
+   ⚠️ 这是**行为变更**：以前不传 = 有秒。所有调用方都已在本批逐一看过，
-   如果是选择一个时间范围的情况，就是说，有开始时间，有结束时间，应该用这个日期插件的
+      确实需要秒的（工作经历那种）会显式传 true。 */
-   时间范围选择方式，而不是将这个范围拆成两个，这样不好看，也多一步操作。」
+$dtSeconds  = (bool)($dtSeconds ?? false);
+$dtDateType = (string)($dtDateType ?? 'select');
+/* 年/月/日下拉 ⇄ 隐藏的 `*_date` 之间的同步由 app.js 负责（见 upgrade 里的 bindParts）。
+   `native` 模式则完全走旧路（原生 date 框），保留给将来可能的回退。 */
+$dtUseParts = ($dtDateType !== 'native');
+$dtYearFrom = (int)($dtYearFrom ?? ((int)date('Y') - 120));
+$dtYearTo   = (int)($dtYearTo   ?? ((int)date('Y') + 10));
 
-   → 有起止两端的场景不再并列两个控件，而是**一个范围控件**。
+/* 起止成对的场景：两端属于同一个范围（调用方用 <div class="dt-range"> 包住两者）。
-   实现方式是"服务端照旧渲染两个原生控件（表单契约/e2e 都不动），
+   留空 = 普通单点控件。 */
-   由 app.js 在升级时识别成一对、只挂一个 Semi 范围选择器"。所以这里只加标记：
-     $dtRange = 'start' | 'end'  —— 这对控件属于同一个范围（调用方还要用
-     <div class="dt-range"> 把两者包在一起，见 movies/form.php 等）。
-   留空 = 普通单点控件（默认，行为完全不变）。 */
 $dtRange    = (string)($dtRange ?? '');
 
-// ⚠️⚠️ 临时变量**一律带 dt 前缀**，一个都不能漏：这里原来写成
+/* ⚠️⚠️ 临时变量**一律带 dt 前缀**，一个都不能漏：这里原来写成
-//   `$t = strtotime(...)`，把宿主模板里表示「这条任务 / 这条记录」的 `$t`
+      `$t = strtotime(...)`，把宿主模板里表示「这条任务 / 这条记录」的 `$t`
-//   覆盖成了 int —— 于是 include 之后凡是读 `$t['id']`、`$t['status']` 的地方
+      覆盖成了 int —— 于是 include 之后凡是读 `$t['id']`、`$t['status']` 的地方
-//   全部拿到 null，子任务列表空、评论不渲染、@高亮消失，而且**不报任何错**
+      全部拿到 null，子任务列表空、评论不渲染、@高亮消失，而且**不报任何错**。
-//   （PHP 8 对 "Trying to access array offset on value of type int" 只 Warning）。
+      （tasks/show.php 上就是这么被 e2e 抓到的，2026-10-02。） */
-//   tasks/show.php 上就是这么被 e2e 抓到的（2026-10-02）。
 $dtTs   = (!empty($dtValue) && ($dtTsTmp = strtotime(trim((string)$dtValue)))) ? $dtTsTmp : false;
 $dtDate = $dtTs ? date('Y-m-d', $dtTs) : '';
+$dtY    = $dtTs ? (int)date('Y', $dtTs) : 0;
+$dtMo   = $dtTs ? (int)date('n', $dtTs) : 0;
+$dtD    = $dtTs ? (int)date('j', $dtTs) : 0;
 $dtHour = $dtTs ? (int)date('G', $dtTs) : 0;   // G = 0..23，天然 24 小时制
 $dtMin  = $dtTs ? (int)date('i', $dtTs) : 0;
 $dtSec  = $dtTs ? (int)date('s', $dtTs) : 0;
 ?>
-<?php /* v24 第 9 批 #9：所有日期选择换 Semi Design DatePicker（用户点名，样式与宣纸主题统一）。
+<?php /* v24 第 9 批 #9：Semi DatePicker 曾用于这里；v37 起日期改自建下拉、
-   策略是**渐进增强**，原生四字段原样保留：
+   时间改原生 select，**Semi 只剩「工作经历的年月选择」还在用**（那是另一处）。
-   · 表单契约（*_date/_hour/_minute/_second → read_dt_input()）不变，服务端零改动；
+   .dt-semi 这个占位 span 保留 —— 老代码路径与 CSS 还在引用它，删了会牵连。 */
-   · Semi 资源（3.4 MB JS）只有页面真出现 .dt-input 才由 app.js 懒加载；
-   · 加载成功 → 隐藏 .dt-native、在 .dt-semi 里挂 DatePicker，值回写原字段；
-   · 加载失败/断网 → 原生控件原样可见可用，页面不会坏。 */
 $dtCfg = ['name' => $dtName, 'seconds' => $dtSeconds, 'required' => $dtRequired,
-          'id' => $dtId, 'range' => $dtRange];
+          'id' => $dtId, 'range' => $dtRange, 'parts' => $dtUseParts || null];
 ?>
-<div class="dt-input<?= $dtRange !== '' ? ' dt-part' : '' ?><?= $dtRange === 'start' ? ' is-pending' : '' ?>"
+<div class="dt-input<?= $dtRange !== '' ? ' dt-part' : '' ?><?= $dtUseParts ? ' dt-parts' : '' ?><?= $dtRange === 'start' ? ' is-pending' : '' ?>"
-     data-dt="<?= e(json_encode($dtCfg, JSON_UNESCAPED_UNICODE | JSON_HEX_APOS | JSON_HEX_QUOT)) ?>">
+     data-dt="<?= e(json_encode($dtCfg, JSON_UNESCAPED_UNICODE | JSON_HEX_APOS | JSON_HEX_QUOT)) ?>"
+     <?= $dtRequired ? 'data-dt-required="1"' : '' ?>>
   <span class="dt-semi" aria-hidden="true"></span>
   <span class="dt-native">
-    <input type="date" class="dt-date" name="<?= e($dtName) ?>_date"
+    <?php if ($dtUseParts): ?>
-           <?= $dtId !== '' ? 'id="' . e($dtId) . '"' : '' ?>
+      <?php /* ---- 日期：年 / 月 / 日 三个原生下拉（v37） ----
-           value="<?= e($dtDate) ?>"<?= $dtRequired ? ' required' : '' ?>
+               ⚠️ `*_date` 仍然是**真的那个字段**，只是变成隐藏框：
-           aria-label="日期">
+                  三个下拉只负责把它算出来（app.js 的 bindParts）。
+                  这样"表单契约不变"是**结构上**保证的，不是靠约定。 */ ?>
+      <span class="dt-date-sel">
+        <input type="hidden" class="dt-date" name="<?= e($dtName) ?>_date"
+               <?= $dtId !== '' ? 'id="' . e($dtId) . '"' : '' ?>
+               value="<?= e($dtDate) ?>">
+        <select class="dt-year" aria-label="年">
+          <option value="">年</option>
+          <?php for ($dtYy = $dtYearTo; $dtYy >= $dtYearFrom; $dtYy--): ?>
+            <option value="<?= $dtYy ?>"<?= $dtYy === $dtY ? ' selected' : '' ?>><?= $dtYy ?></option>
+          <?php endfor; ?>
+        </select>
+        <select class="dt-month" aria-label="月">
+          <option value="">月</option>
+          <?php for ($dtMm = 1; $dtMm <= 12; $dtMm++): ?>
+            <option value="<?= $dtMm ?>"<?= $dtMm === $dtMo ? ' selected' : '' ?>><?= $dtMm ?>月</option>
+          <?php endfor; ?>
+        </select>
+        <select class="dt-day" aria-label="日">
+          <option value="">日</option>
+          <?php /* 初始按已选的年月给天数；用户改年/月时 app.js 会重建这一列 */
+                $dtDays = ($dtY && $dtMo) ? (int)date('t', mktime(0, 0, 0, $dtMo, 1, $dtY)) : 31; ?>
+          <?php for ($dtDd = 1; $dtDd <= $dtDays; $dtDd++): ?>
+            <option value="<?= $dtDd ?>"<?= $dtDd === $dtD ? ' selected' : '' ?>><?= $dtDd ?>日</option>
+          <?php endfor; ?>
+        </select>
+      </span>
+    <?php else: ?>
+      <input type="date" class="dt-date" name="<?= e($dtName) ?>_date"
+             <?= $dtId !== '' ? 'id="' . e($dtId) . '"' : '' ?>
+             value="<?= e($dtDate) ?>"<?= $dtRequired ? ' required' : '' ?>
+             aria-label="日期">
+    <?php endif; ?>
     <span class="dt-time">
       <select class="dt-hour" name="<?= e($dtName) ?>_hour" aria-label="时（24 小时制）">
       <?php for ($dtH = 0; $dtH < 24; $dtH++): $hv = sprintf('%02d', $dtH); ?>
@@ -74,7 +129,7 @@ $dtCfg = ['name' => $dtName, 'seconds' => $dtSeconds, 'required' => $dtRequired,
     <select class="dt-minute" name="<?= e($dtName) ?>_minute" aria-label="分">
       <?php /* ⚠️ 循环变量一律带 dt 前缀：这里曾被写成 $m，把宿主模板里
                表示「观影记录」的 $m 覆盖成了 int —— 编辑页的简介/备注回填
-               被静默清空、取消链接变 id=0，还不止一个 Warning（2026-09-30 e2e 抓到）。 */ ?>
+               被静默清空、取消链接变 id=0（2026-09-30 e2e 抓到）。 */ ?>
       <?php for ($dtM = 0; $dtM < 60; $dtM++): $mv = sprintf('%02d', $dtM); ?>
         <option value="<?= $mv ?>"<?= $dtM === $dtMin ? ' selected' : '' ?>><?= $mv ?></option>
       <?php endfor; ?>
@@ -92,6 +147,8 @@ $dtCfg = ['name' => $dtName, 'seconds' => $dtSeconds, 'required' => $dtRequired,
 </div>
 <?php /* 用完即清，避免残留变量影响下一次 include */ unset(
     $dtName, $dtValue, $dtRequired, $dtId, $dtSeconds, $dtCfg, $dtRange,
-    $dtTs, $dtTsTmp, $dtDate, $dtHour, $dtMin, $dtSec,
+    $dtDateType, $dtUseParts, $dtYearFrom, $dtYearTo,
-    $dtH, $dtM, $dtS, $hv, $mv, $sv
+    $dtTs, $dtTsTmp, $dtDate, $dtY, $dtMo, $dtD, $dtDays,
-); ?>
+    $dtHour, $dtMin, $dtSec,
+    $dtH, $dtM, $dtS, $hv, $mv, $sv, $dtYy, $dtMm, $dtDd
+); ?>

templates/calendar/_event_fields.php

@@ -82,13 +82,13 @@ $evIsAllDay = array_key_exists('all_day', $evF) ? !empty($evF['all_day']) : $evA
   <span class="dt-range-label">开始 / 结束 *</span>
   <div class="field ev-dt" data-dt>
     <?php $dtName = 'starts_at'; $dtId = 'ev-start';
-          $dtValue = $evF['starts_at'] ?? null; $dtRequired = true; $dtSeconds = true;
+          $dtValue = $evF['starts_at'] ?? null; $dtRequired = true;
           $dtRange = 'start';
           require __DIR__ . '/../_datetime.php'; ?>
   </div>
   <div class="field ev-dt" data-dt id="ev-end-field">
     <?php $dtName = 'ends_at'; $dtId = 'ev-end';
-          $dtValue = $evF['ends_at'] ?? null; $dtRequired = false; $dtSeconds = true;
+          $dtValue = $evF['ends_at'] ?? null; $dtRequired = false;
           $dtRange = 'end';
           require __DIR__ . '/../_datetime.php'; ?>
   </div>

templates/calendar/index.php

@@ -229,11 +229,21 @@ $headText = $view === 'month' ? date('Y 年 n 月', $ts)
               $evAllDay = false;
               require __DIR__ . '/_event_fields.php';
             ?>
-          </div>
             </div><?php /* /cal-modal-body */ ?>
             <div class="cal-modal-foot">
               <span class="cal-modal-tip" id="calAddTip"></span>
-              <button class="btn btn-sm" type="submit" id="calAddSubmit">加上</button>
+              <?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>

templates/home.php

@@ -334,8 +334,28 @@ unset($evRef);
                  style="background: <?= e((string)$ev['color']) ?>;
                         top: <?= number_format($topPct, 2) ?>%;
                         height: <?= number_format($hPct, 2) ?>%;
-                        left: calc(46px + <?= (float)($ev['left'] ?? 0) ?>%);
+                        <?php /* 🔴 v37 用户第 3 条：「首页上今天的日程…如果它分了三列
-                        width: calc(<?= (float)($ev['width'] ?? 100) ?>% - 50px);"
+                               或者是几列，这三列之间的距离或者是空隙非常非常的大，
+                               是分开的，中间有非常大的空隙。我看了一下日程里面的那个
+                               显示，那两个色块就是紧挨着的。所以…应该让它们紧挨着。」
+
+                               根因（与日历页 .tg-block 逐字对比出来的）：
+                                 · 日历页写的是 `left: calc(2px + L%)` / `width: calc(W% - 4px)`
+                                   —— 只留 2px+2px 的缝，所以色块**紧挨**；
+                                 · 这里却写死了 `calc(46px + L%)` / `calc(W% - 50px)`
+                                   —— 每块左右各扣 23px/25px。两列时那 46px 的扣减
+                                   **没法均分**，全挤进了两块之间的缝里 →
+                                   实测缝 ≈ 50px（等于把 46px 全加在了中间），
+                                   日历页只有 ≈ 4px。
+
+                               ⇒ 改法与日历页对齐：
+                                     left  = 46px（给小时刻度）+ 列内的 2px
+                                     width = 列宽 - 4px（左右各 2px）
+                                 这样列间缝恒为 4px（紧挨），而且与"放得下多少列、
+                                 每列多宽"的解耦是干净的 —— 列宽由 width% 决定，
+                                 缝由那 4px 决定，两者不再互相污染。 */ ?>
+                        left: calc(46px + <?= (float)($ev['left'] ?? 0) ?>% + 2px);
+                        width: calc(<?= (float)($ev['width'] ?? 100) ?>% - 4px);"
                  title="<?= e((string)$ev['title']) ?>"
                  data-cal="<?= (int)$ev['cal'] ?>">
                 <span class="ag-ev-t"><?= e((string)$ev['time']) ?></span>

templates/movies/form.php

@@ -30,6 +30,13 @@ $selCinema = (int)old('cinema_id', (int)($_GET['cinema'] ?? 0) ?: ($m['cinema_id
 $curAttendees = array_map('intval', array_column($m['attendees'] ?? [], 'id'));
 $selAttendees = array_map('intval', (array)old('attendees', $curAttendees));
 ?>
+<?php /* 🔴 v37：本模板现在有两种用法 ——
+     ① **整页**（`movies/edit` 的编辑页；以及 `movies/new` 的直接访问 / 校验失败重画）；
+     ② **弹框片段**（被 `movies/index.php` require，`$mvModalOnly = true`，
+        在观影列表页上弹出"记一场电影"）。
+   ⚠️ 用法 ② 里**不能**输出 page-head / 设置菜单 —— 否则列表页会莫名多出一个大标题。 */
+$mvModalOnly = !empty($mvModalOnly); ?>
+<?php if (!$mvModalOnly): ?>
 <div class="page-head">
   <h1><?= $isEdit ? '编辑观影记录' : '记一场电影' ?></h1>
   <span class="sub"><?= $isEdit ? e($m['title']) : '片名必填，其他都可以以后再补' ?></span>
@@ -44,15 +51,42 @@ $selAttendees = array_map('intval', (array)old('attendees', $curAttendees));
     <?php $setCurrent = 'form'; $setCanWrite = \App\Auth::canWrite(); require __DIR__ . '/_settings_menu.php'; ?>
   </div>
 </div>
+<?php endif; /* /!$mvModalOnly */ ?>
 
+<?php /* 🔴🔴 v37 用户 2026-10-09 第 6 条第 4 点：「观影模块也是一样，新增一部电影时，
+       也弹出一个框来输入所有信息。填写完之后，再刷新观影页面就可以了。」
+       ⇒ **新增**走弹框（与日程 / 任务同一套形态），**编辑**仍留在页面里
+         （编辑是从详情页进来的、本来就不在列表中，没有"被顶走"的问题）。
+       ⚠️ 表单本身**一个字没动**（字段名 / 服务端契约 / CSRF / enctype 全照旧），
+          只是把它的容器从"页面上的卡片"换成"浮层里的面板"。 */ ?>
+<?php
+/* ⚠️ 弹框的初始显隐规则：
+     · 被列表页内嵌（$mvModalOnly）→ **关闭**（用户点"记一场电影"才开）；
+     · 整页直接访问 `movies/new`（含**校验失败重画**）→ **打开** ——
+       否则用户提交失败后跳到这一页，只会看到空白页面（所有提示都在弹框里）。 */
+$mvModal = !$isEdit;
+$mvOpen  = $mvModal && !$mvModalOnly;
+?>
+<div class="<?= $mvModal ? 'cal-modal' : 'mv-form-wrap' ?>"<?= $mvModal ? ' id="mvAddCard" role="dialog" aria-modal="true" aria-label="记一场电影"' . ($mvOpen ? '' : ' hidden') : '' ?>>
+  <?php if ($mvModal): ?>
+    <div class="cal-modal-panel mv-panel">
+      <div class="cal-modal-head">
+        <b>记一场电影</b>
+        <button type="button" class="cal-modal-x" id="mvAddX" aria-label="关闭">✕</button>
+      </div>
+  <?php endif; ?>
 <form method="post" enctype="multipart/form-data"
-      action="<?= e(url($isEdit ? 'movies/update' : 'movies/create')) ?>">
+      action="<?= e(url($isEdit ? 'movies/update' : 'movies/create')) ?>"
+      id="mvForm">
   <?= csrf_field() ?>
   <?php if ($isEdit): ?>
     <input type="hidden" name="id" value="<?= (int)$m['id'] ?>">
   <?php endif; ?>
+  <?php /* ⚠️ 弹框模式下"主要动作在右下角"（与日程 / 任务弹框一致）：
+          body 滚、foot 固定。编辑态仍是页面上的普通卡片。 */ ?>
+  <?php if ($mvModal): ?><div class="cal-modal-body"><?php endif; ?>
 
-  <div class="card card-pad">
+  <div class="<?= $mvModal ? 'mv-form-inner' : 'card card-pad' ?>">
     <div class="form-grid">
       <div class="field full">
         <label for="title">片名 *</label>
@@ -79,7 +113,7 @@ $selAttendees = array_map('intval', (array)old('attendees', $curAttendees));
                「前面是日期，后面是时和分，只记录到时和分就行了。时和分，是下拉的。」
                ⇒ 形态 = 日期框 + 时/分两个下拉（**没有秒**，见 app.js upgradeRange 的说明）。 */ ?>
       <div class="field full dt-range">
-        <label <?= $isEdit ? '' : 'for="starts_at_date"' ?>>开始 / 结束时间（时:分）</label>
+        <span class="dt-range-label">开始 / 结束时间（时:分）</span>
         <?php $dtName = 'starts_at'; $dtValue = $dtStart; $dtId = 'starts_at_date';
               $dtRange = 'start';
               require __DIR__ . '/../_datetime.php'; ?>
@@ -88,8 +122,7 @@ $selAttendees = array_map('intval', (array)old('attendees', $curAttendees));
               $dtRange = 'end';
               require __DIR__ . '/../_datetime.php'; ?>
         <?php if (!empty($errors['ends_at'])): ?><span class="err"><?= e($errors['ends_at']) ?></span><?php endif; ?>
-        <span class="tip">散场时间可不填。</span>
+              </div>
-      </div>
 
       <?php /* 用户 2026-10-04 第 11 批 #4（三件事）：
                ① 「选择影院的时候，影院的颜色要出现在下拉列表中，用来显示不同的影院」
@@ -258,15 +291,37 @@ $mDelForms  = [];   // 收集起来，在表单**外面**统一渲染
         require __DIR__ . '/../_stage_drop.php'; ?>
   <span class="tip"><?= $isEdit ? '观影照片都可以放这里（可多选）；删掉的在保存后生效。'
                                : '观影照片都可以放这里（可多选）；之后也能在详情页里逐张补传。' ?></span>
-</div>
+</div><?php /* /.field.full（观影照片） */ ?>
-
+</div><?php /* /.form-grid */ ?>
-<div class="btn-row">
+    </div><?php /* /.mv-form-inner */ ?>
-      <button type="submit" class="btn"><?= $isEdit ? '保存' : '记下这场电影' ?></button>
+    <?php /* 🔴🔴 下面这一段**严格按分支配对**，别再把 </div> 与 <?php if ?> 混着写 ——
-      <a class="btn btn-ghost"
+           v37 前两版就是在这里把 `.mv-form-inner` / `.cal-modal-body` 关错了层数，
-         href="<?= e($isEdit ? url('movies/show', ['id' => (int)$m['id']]) : url('movies')) ?>">取消</a>
+           结果编辑态的「保存」按钮被甩到 form **外面**：
-    </div>
+             点它不提交表单、也不报错（用户看到的是"保存没反应"）。
-  </div>
+           修一次的成本远大于把结构写直白。每一层都标了名字，
+           以后动这里只要保证：**开的数量 = 关的数量，且顺序一致**。 */ ?>
+    <?php if ($mvModal): ?>
+      </div><?php /* /.cal-modal-body（仅弹框形态） */ ?>
+      <div class="cal-modal-foot">
+        <span class="cal-modal-tip" id="mvAddTip"></span>
+        <button class="btn btn-sm" type="submit" form="mvForm" id="mvAddSubmit">记下这场电影</button>
+        <button class="btn btn-ghost btn-sm" type="button" id="mvAddCancel">取消</button>
+      </div>
+    </div><?php /* /.cal-modal-panel（仅弹框形态） */ ?>
+    <?php else: ?>
+      <div class="btn-row">
+        <button type="submit" class="btn">保存</button>
+        <a class="btn btn-ghost"
+           href="<?= e(url('movies/show', ['id' => (int)$m['id']])) ?>">取消</a>
+      </div>
+    <?php endif; ?>
+  </div><?php /* /.mv-form-inner 或 .card.card-pad（编辑态） */ ?>
 </form>
+<?php if ($mvModal): ?>
+  </div><?php /* /.cal-modal（弹框壳） */ ?>
+<?php else: ?>
+  </div><?php /* /.mv-form-wrap（编辑态包装） */ ?>
+<?php endif; ?>
 
 <?php /* ---- 删除海报 / 票根 / 合影的**独立表单**（必须在外层表单之外）----
    ⚠️ 见本文件顶部关于 form 嵌套的说明：按钮用 `form="id"` 指过来，按钮位置不变。

templates/movies/index.php

@@ -24,7 +24,11 @@ $fmtNum = static function ($v): string {
   </span>
   <div class="actions">
     <?php if ($canWrite): ?>
-      <a class="btn" href="<?= e(url('movies/new')) ?>">记一场电影</a>
+      <?php /* 🔴 v37 用户第 6 条第 4 点：新增改成**弹框**（不再跳到单独的页面）。
+             ⚠️ 仍然保留 href —— JS 没跑时它就是"跳到 movies/new"的普通链接
+                （那一页会把同一个弹框自动打开），所以**无 JS 也能用**。 */ ?>
+      <button class="btn" type="button" id="mvAddBtn" aria-haspopup="dialog" aria-expanded="false"
+              data-href="<?= e(url('movies/new')) ?>">记一场电影</button>
     <?php endif; ?>
     <?php /* 「设置」下拉：影院管理 / 高级搜索 / 统计 / 年度报告。
              ⚠️ 片段必须放在 actions 的**最后**：它靠 margin-left:auto 贴右，
@@ -84,3 +88,48 @@ $fmtNum = static function ($v): string {
     <?php endforeach; ?>
   </div>
 <?php endif; ?>
+
+<?php /* 🔴 v37：把"记一场电影"的弹框内嵌进列表页（同一份模板，避免两处维护）。
+   ⚠️ 只在**能写**的账号上渲染：表单 action 是 movies/create，只读账号点了也是 403。 */
+if ($canWrite) {
+    $mvModalOnly = true;                    // 不输出 page-head / 设置菜单
+    $m = null; $errors = [];                // 新增态
+    $people  = $peopleForModal ?? [];
+    $cinemas = $cinemasForModal ?? [];
+    require __DIR__ . '/form.php';
+} ?>
+
+<script>
+(function () {
+  /* ---- "记一场电影"弹框：打开 / 关闭 + 提交后刷新列表 ----
+     用户原话（第 6 条第 4 点）：「新增一部电影时，也弹出一个框来输入所有信息。
+     填写完之后，再刷新观影页面就可以了。」
+     ⇒ 提交**照旧走原生表单**（服务端 302 回详情页），这里不拦截、不做 AJAX ——
+       用户要的是"填完刷新"，跳详情页正合直觉，而且**零新增失败模式**。 */
+  var modal = document.getElementById('mvAddCard');
+  if (!modal) { return; }
+  var btn  = document.getElementById('mvAddBtn');
+  var x    = document.getElementById('mvAddX');
+  var c1   = document.getElementById('mvAddCancel');
+
+  function open() {
+    modal.hidden = false;
+    if (btn) { btn.setAttribute('aria-expanded', 'true'); }
+    var t = document.getElementById('title');
+    if (t) { t.focus(); }
+  }
+  function close() {
+    modal.hidden = true;
+    if (btn) { btn.setAttribute('aria-expanded', 'false'); }
+  }
+  if (btn) { btn.addEventListener('click', open); }
+  if (x)   { x.addEventListener('click', close); }
+  if (c1)  { c1.addEventListener('click', close); }
+  /* 点遮罩关、面板内不关；Esc 关 —— 与站内其它浮层同一套行为。 */
+  modal.addEventListener('click', function (e) { if (e.target === modal) { close(); } });
+  document.addEventListener('keydown', function (e) {
+    if (e.key === 'Escape' && !modal.hidden) { close(); }
+  });
+  <?php if (!empty($openModal)): ?>open();<?php endif; ?>
+})();
+</script>

templates/movies/show.php

@@ -282,17 +282,9 @@ $commentBox = static function (int $reviewId, int $parentId, string $summary) us
     </div>
   </div>
 <?php endif; ?>
-<?php /* 🔴 v36：详情页**不再提供"补照片"**（用户 2026-10-09 第 2 条：
+<?php /* 🔴 v37 用户 2026-10-09 第 1 条：「观影详情页面。观影图片下面有一个块，
-       「观影详情页面，不需要设置补充照片的功能，都放在编辑页面就行了。」）
+       里面写着一句话。要加照片请点上方「编辑」…这个块不要，直接把这个块删除。」
-       ⇒ 加照片统一走「编辑」按钮（编辑页的"观影照片"块可多选/可多次拖）。
+       ⇒ 整块删掉（v36 留的那句提示也一起去掉）。加照片统一走「编辑」按钮。 */ ?>
-       这里留一个入口链接，免得到详情页想加照片时找不到路。 */ ?>
-<?php if ($canWrite): ?>
-  <div class="detail-section">
-    <p class="tip" style="margin:0">
-      要加照片请点上方「编辑」——「观影照片」在编辑页里一起传（可多选）。
-    </p>
-  </div>
-<?php endif; ?>
 
 <!-- 评价与评论 -->
 <div class="detail-section" id="reviews">

templates/tasks/index.php

@@ -66,11 +66,30 @@ $lastColIdx = count($colList) - 1;
 </div>
 
 <?php if ($canWrite): ?>
-  <div class="card card-pad" id="taskAddCard" hidden>
+  <?php /* 🔴🔴 v37 用户第 6 条第 3 点：「新建任务也和新建日程一样，新建时弹出一个框，
-    <h2 class="cinema-h2">新建任务</h2>
+       新建完之后刷新新建任务的列表、看板页面。」
-    <form method="post" action="<?= e(url('tasks/create')) ?>">
+       ⇒ 从"页面上展开的一张卡片"改成**浮层弹框**（与日程弹框同一套形态 / 类名），
-      <?= csrf_field() ?>
+         提交后照旧 302 回看板刷新 —— 用户要的"刷新看板页面"就是这样。
-      <div class="form-grid">
+       ⚠️ 表单字段本身**一个字没动**（除了新加的附件框），服务端契约照旧。 */ ?>
+  <div class="cal-modal" id="taskAddCard" 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="taskAddX" aria-label="关闭">✕</button>
+      </div>
+      <?php /* ⚠️ enctype 必须有：本批新增了**附件**上传（用户第 6 条第 2 点
+             「新建任务时，竟然没有添加附件，这个应该加上」）。
+             没有它的话文件根本不会随表单发出去，而且 $_FILES 是空的。 */ ?>
+      <form method="post" action="<?= e(url('tasks/create')) ?>"
+            enctype="multipart/form-data" id="taskAddForm">
+        <?= csrf_field() ?>
+        <?php /* ⚠️ 新建后回**看板**（用户：「新建完之后刷新…看板页面」）。
+           原来服务端一律 redirect('tasks/show')，新建完会跳去详情页。
+           `back=tasks` 走白名单。 */ ?>
+        <input type="hidden" name="back" value="tasks">
+        <div class="cal-modal-body">
+        <div class="form-grid">
         <div class="field full">
           <label for="tk-title">要做什么 *</label>
           <input class="input" id="tk-title" name="title" required placeholder="如：周末大扫除">
@@ -81,7 +100,7 @@ $lastColIdx = count($colList) - 1;
         <div class="field">
           <label for="tk-due">截止时间（有才会出现在日历里）</label>
           <?php $dtName = 'due_at'; $dtId = 'tk-due'; $dtValue = null;
-                $dtRequired = false; $dtSeconds = true;
+                $dtRequired = false;
                 require __DIR__ . '/../_datetime.php'; ?>
         </div>
         <div class="field">
@@ -157,12 +176,28 @@ $lastColIdx = count($colList) - 1;
           <label for="tk-note">备注</label>
           <textarea class="input" id="tk-note" name="note" rows="2"></textarea>
         </div>
-      </div>
+
-      <div class="btn-row">
+        <?php /* 🔴 v37 用户第 6 条第 2 点：「新建任务时，竟然没有添加附件，
-        <button class="btn" type="submit">新建</button>
+             这个应该加上。」
-        <button class="btn btn-ghost" type="button" id="taskAddCancel">收起</button>
+             ⚠️ 走全站统一的「点击或拖动进行上传」框（templates/_stage_drop.php）；
-      </div>
+                字段名 `attach[]` 与详情页的附件上传**一致** ——
-    </form>
+                服务端 attach_save_files(..., 'attach', ...) 零改动就能收。
+             ⚠️ 拖进来的走暂存（stage_token[]），随表单一起认领；
+                直接点选走 $_FILES 路径。两条路服务端都接（见 attach_save_files）。 */ ?>
+        <div class="field full">
+          <label for="sd-tk-attach">附件（可多选）</label>
+          <?php $sdName = 'attach[]'; $sdId = 'sd-tk-attach'; $sdSlot = 'photo';
+                require __DIR__ . '/../_stage_drop.php'; ?>
+        </div>
+        </div><?php /* /.form-grid */ ?>
+        </div><?php /* /.cal-modal-body */ ?>
+        <div class="cal-modal-foot">
+          <span class="cal-modal-tip" id="taskAddTip"></span>
+          <button class="btn btn-sm" type="submit" form="taskAddForm" id="taskAddSubmit">新建</button>
+          <button class="btn btn-ghost btn-sm" type="button" id="taskAddCancel">取消</button>
+        </div>
+      </form>
+    </div>
   </div>
 <?php endif; ?>
 
@@ -326,16 +361,30 @@ $lastColIdx = count($colList) - 1;
 
 <script>
 (function () {
+  /* ---- "新建任务"弹框（v37：从内联卡片改成浮层）----
+     ⚠️ 不再 scrollIntoView —— 那是"卡片长在页面上"时代才需要的动作；
+        浮层固定在视口中央，底下的看板一动不动。 */
   var addBtn = document.getElementById('taskAddBtn');
   var addCard = document.getElementById('taskAddCard');
+  var addX = document.getElementById('taskAddX');
   var addCancel = document.getElementById('taskAddCancel');
-  if (addBtn && addCard) {
+  function openAdd() {
-    addBtn.addEventListener('click', function () {
+    if (!addCard) { return; }
-      addCard.hidden = !addCard.hidden;
+    addCard.hidden = false;
-      if (!addCard.hidden) { addCard.scrollIntoView({ block: 'nearest' }); }
+    var t = document.getElementById('tk-title');
-    });
+    if (t) { t.focus(); }
   }
-  if (addCancel && addCard) { addCancel.addEventListener('click', function () { addCard.hidden = true; }); }
+  function closeAdd() { if (addCard) { addCard.hidden = true; } }
+  if (addBtn && addCard) { addBtn.addEventListener('click', openAdd); }
+  if (addX) { addX.addEventListener('click', closeAdd); }
+  if (addCancel) { addCancel.addEventListener('click', closeAdd); }
+  /* 点遮罩关（点面板内不关）/ Esc 关 —— 与站内其它浮层同一套行为。 */
+  if (addCard) {
+    addCard.addEventListener('click', function (e) { if (e.target === addCard) { closeAdd(); } });
+  }
+  document.addEventListener('keydown', function (e) {
+    if (e.key === 'Escape' && addCard && !addCard.hidden) { closeAdd(); }
+  });
 
   /* ---- 左右搬（不需要拖也能用）----
      ⚠️ 列的集合**从 DOM 现取**，不要写死数组：看板是用户自己建的，

templates/tasks/show.php

@@ -123,7 +123,7 @@ $isChild = !empty($t['parent_id']);
           <div class="field">
             <label>截止时间（留空=不上日历）</label>
             <?php $dtName = 'due_at'; $dtValue = $t['due_at'] ?? null;
-                  $dtRequired = false; $dtSeconds = true;
+                  $dtRequired = false;
                   require __DIR__ . '/../_datetime.php'; ?>
           </div>
           <div class="field">
@@ -236,7 +236,7 @@ $isChild = !empty($t['parent_id']);
           <?= csrf_field() ?>
           <input type="hidden" name="parent_id" value="<?= (int)$t['id'] ?>">
           <input class="input" name="title" required placeholder="如：擦玻璃">
-          <?php $dtName = 'due_at'; $dtValue = null; $dtRequired = false; $dtSeconds = true;
+          <?php $dtName = 'due_at'; $dtValue = null; $dtRequired = false;
                 require __DIR__ . '/../_datetime.php'; ?>
           <button class="btn btn-sm" type="submit">加上</button>
         </form>

templates/trips/_revise_form.php

@@ -32,10 +32,10 @@ $rvN      = (int)($rvNode['revision_n'] ?? 0);
     <div class="field dt-range full">
       <label>实际的开始 / 结束</label>
       <?php $dtName = 'rev_starts_at'; $dtValue = $rvNode['starts_at'] ?? '';
-            $dtId = $rvPrefix . '-s'; $dtSeconds = true; $dtRange = 'start';
+            $dtId = $rvPrefix . '-s'; $dtRange = 'start';
             require __DIR__ . '/../_datetime.php'; ?>
       <?php $dtName = 'rev_ends_at'; $dtValue = $rvNode['ends_at'] ?? '';
-            $dtId = $rvPrefix . '-e'; $dtSeconds = true; $dtRange = 'end';
+            $dtId = $rvPrefix . '-e'; $dtRange = 'end';
             require __DIR__ . '/../_datetime.php'; ?>
       <span class="tip">默认是计划的时间，改成实际发生的即可。</span>
     </div>

templates/trips/node_form.php

@@ -135,10 +135,10 @@ $amap = \App\Geo::jsConfig();
       <div class="field dt-range full">
         <label>开始 / 结束</label>
         <?php $dtName = 'starts_at'; $dtValue = $n['starts_at'] ?? '';
-              $dtId = 'nf-s'; $dtSeconds = true; $dtRange = 'start';
+              $dtId = 'nf-s'; $dtRange = 'start';
               require __DIR__ . '/../_datetime.php'; ?>
         <?php $dtName = 'ends_at'; $dtValue = $n['ends_at'] ?? '';
-              $dtId = 'nf-e'; $dtSeconds = true; $dtRange = 'end';
+              $dtId = 'nf-e'; $dtRange = 'end';
               require __DIR__ . '/../_datetime.php'; ?>
         <span class="tip">结束时间可不填；填到几点几分，详情页就显示到几点几分。</span>
       </div>