v43 第 43 批:六条反馈(界面 5 + 条目详情浮层)
用户 2026-10-11 反馈六条,逐条定位真根因后修复: ① 纪念日「日期」多出一个控件 —— 只保留最新的那个 两层根因:(a)原生 `input[type=date]` 当初没包在 `.dt-native` 里, v42 那条"AntD 挂上后收起原生框"的选择器根本不命中;(b)更要命的是 `.dt-native` 基类写着 `display: contents` —— 该元素**没有盒子**, 给它 position/width 完全无效 ⇒ 必须把 display 显式改回 block 才收得起来。 ② 编辑纪念日把底层列表页弄没 —— 「修改」原来是整页跳 `days/edit` (套 layout = 一张只有弹框的空白页)。改为 `?embed=1` 只吐弹框那一块, 列表页 JS 取回来替换 `#anNewCard` 并打开 —— 与「新建」同一观感。 内嵌形态标 `$anModalOnly` 以免打 standalone 标记(关闭时不再跳页)。 ③ 拖图裁剪的层被弹框盖住 —— `.crop-overlay` 是 z-index:100 而 `.cal-modal` 是 200 ⇒ 裁剪层被整块盖住。提到 260(与 v41 的 .cn-modal 同一处理)。 ④ 行程弹框里"参与的人"弹不出选人框 —— person_picker.js 只绑定一次, 而弹框表单是 AJAX 片段 ⇒ 里面的 `.pp` 从未被 init。三件事一起: 暴露 `window.fbInitPickers()`(幂等)+ layout 暴露 `window.fbLoadPicker()` (脚本是按需加载的)+ 塞完片段后补调初始化。 ⑤ 日程新建排版/控件/文案 —— 改走观影式 `.mv-grid`(标签对齐 + 冒号); 起止补上 `$dtPlugin='antd'`(试点正式推广到日程);标签「时间范围」→「开始 / 结束」; 删三句提示(结束留空 / 多选提醒 / 全天)。 ⑥ 条目详情浮层(首页日程 / 首页近期任务 / 日程页条目)—— 点条目不再直接跳页,弹浮层显示详情;「详细信息」跳该来源详情页; 「编辑」就地换成该来源的编辑表单(四处 `?embed=1` 片段)。 新增 `templates/_entry_popup.php` + `assets/js/entry_popup.js` + `fb_entry_json()`(三个入口共用一个编码函数)。 验证:php -l 157 文件全过;div 深度 33 组合全配平;片段体检 20 片段无越界; 本地 e2e 1510/0;v43 真机 33/0;v43 反向验证 8/0;v38 36/0;v42 33/0; b31/b32 反向验证 8/0 与 5/0;部署断言本地空跑 RC=0;完整流水线 PUSH_RC=0。
This commit is contained in:
+54
-5
@@ -1486,7 +1486,15 @@ body[class] .semi-datepicker-day-inhover { background-color: color-mix(in srgb,
|
||||
Cropper 的四个角手柄画成实心白点,永远落在面板可见区内。 */
|
||||
.crop-overlay { display: none; }
|
||||
.crop-overlay.is-open {
|
||||
display: flex; position: fixed; inset: 0; z-index: 100;
|
||||
/* 🔴🔴 v43(用户 2026-10-11 第 3 条):「新建行程的时候,如果把地图拖进去,
|
||||
它不是开始裁剪吗?但是这个弹出的框把裁剪那个框又盖住了,裁剪的框应该放到前面来。」
|
||||
真根因:裁剪层是 **100**,而行程/观影那些弹框用的 `.cal-modal` 是 **200**
|
||||
⇒ 从弹框里拖图触发的裁剪层被整块盖在下面 —— 看不见、也点不到。
|
||||
(与 v41 那个「新建影院弹框被记一场电影盖住」是**同一个坑**,当时把 .cn-modal
|
||||
提到了 260;这里漏了。)
|
||||
⇒ 提到 **260**:高于所有自建弹框(.cal-modal 200 / .pp-modal 等),
|
||||
与 .cn-modal 同层;低于灯箱(300)、预览层(320) —— 那两者是"看大图"的顶级层。 */
|
||||
display: flex; position: fixed; inset: 0; z-index: 260;
|
||||
align-items: center; justify-content: center;
|
||||
padding: 20px; background: rgba(44, 35, 29, .55);
|
||||
}
|
||||
@@ -5610,14 +5618,55 @@ h5.md-h, h6.md-h { font-size: 14px; }
|
||||
· `.dt-antd` 是 antd 的挂载点(宽度交给它);
|
||||
· 挂上后(`.is-antd`)把**原生 `<input type="date">` 视觉收起** ——
|
||||
它仍是值载体(antd 通过 change 写它),只是不再显示给用户。
|
||||
⚠️ 用 clip 收起(不是 display:none):保留可聚焦、可被表单读到,
|
||||
与 v40 高级搜索那处的取舍一致。 */
|
||||
.dt-input.is-antd > .dt-native { position: absolute; width: 1px; height: 1px;
|
||||
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px; }
|
||||
⚠️ 用 clip 收起(不是 display:none):保留可聚焦、可被表单读到。
|
||||
🔴🔴 v43(用户 2026-10-11 第 1 条):「日期那里多了一个控件,
|
||||
只保留我们最新的控件就行,之前那种控件删除」——真根因有两层:
|
||||
① 纪念日的原生框当初**没包在 `.dt-native` 里** ⇒ 这条选择器根本不命中
|
||||
(模板已补上包装);
|
||||
② **更要命的一层**:`.dt-input .dt-native { display: contents }`(第 619 行)
|
||||
会让这个包装盒**自己不生成盒子**、子元素"提升"成 `.dt-input` 的直接布局项 ——
|
||||
此时给它 `position:absolute; width:1px` **完全无效**(它没有盒子可定位),
|
||||
原生框照样按 flex 项排出来 ⇒ 两个控件并排。
|
||||
⇒ 修法:这里必须把 `display` **从 contents 改成 block**,定位才生效。
|
||||
(只写 position/width/height 是不够的 —— 这是我第一版的错,探针当场抓到。) */
|
||||
.dt-input.is-antd > .dt-native {
|
||||
display: block; position: absolute; width: 1px; height: 1px;
|
||||
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
|
||||
}
|
||||
.dt-input.is-antd > .dt-antd { display: block; width: 100%; }
|
||||
.dt-input.dt-antd-single { display: block; width: 100%; }
|
||||
/* 兜底:万一哪天原生框又变成 `.dt-input` 的**直接子元素**(不包 .dt-native 了),
|
||||
这条按直接子元素也能把它收起来。 */
|
||||
.dt-input.is-antd > input[type="date"] {
|
||||
display: block; position: absolute; width: 1px; height: 1px;
|
||||
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
|
||||
}
|
||||
|
||||
/* ---- v42(用户第 6 条)简介为空时的那句可点占位 ----
|
||||
与 `.trip-sum` 同一视觉位置,只是颜色淡一档(它是要点进去补的提示,不是内容)。 */
|
||||
.trip-sum-empty { margin: 10px 0 0; font-size: 13px; color: var(--muted); }
|
||||
.trip-sum-empty a { color: var(--brand); }
|
||||
|
||||
/* ============================================================================
|
||||
🔴 v43(用户 2026-10-11 第 6 条)条目详情浮层
|
||||
----------------------------------------------------------------------------
|
||||
与 .cal-modal 同一形态(遮罩 + 居中面板 + 底栏),只是层级更高一点:
|
||||
它可能从**另一个浮层**里打开(例如详情页弹框里点了条目),
|
||||
所以要在 200 之上;但低于"看图"的灯箱(300)/预览层(320)。
|
||||
⚠️ 与 .cn-modal(260)、.crop-overlay(260) 同层 —— 它们不会同时出现。
|
||||
⚠️ 面板用 flex 列 + body 滚动,长内容(编辑表单)才有足够的可视区。 */
|
||||
.fb-entry-modal {
|
||||
position: fixed; inset: 0; z-index: 260;
|
||||
display: flex; align-items: flex-start; justify-content: center;
|
||||
padding: 24px 16px; overflow-y: auto;
|
||||
background: rgba(44, 35, 29, .55); overscroll-behavior: contain;
|
||||
}
|
||||
.fb-entry-modal[hidden] { display: none; }
|
||||
.fb-entry-panel { width: min(620px, 100%); max-height: calc(100vh - 64px); }
|
||||
/* 编辑态下正文里就是一张完整表单(内边距由它自己那份 CSS 给)——
|
||||
这里只保证它不双份留白。 */
|
||||
.fb-entry-panel .cal-modal-body > .mv-form-inner,
|
||||
.fb-entry-panel .cal-modal-body > .nf-wrap { padding: 0; }
|
||||
@media (max-width: 640px) {
|
||||
.fb-entry-panel { width: 100%; }
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user