v72：日历本显示与管理合并成一张清单，颜色改用内置调色模态框
用户 2026-10-21 两条：
「日历设置里面日历本显示和日历管理可以放在一起」
「预制的颜色点了之后没反应……选颜色那个地方点了之后是弹出 Windows 的
一个颜色选择框，这个不好，我们把它改成内置的」
改动：
· calendar/display 整页删除，并入 calendar/calendars（保留 302 老地址）
· 新增 templates/_color_picker.php（按钮 + 值载体，表单/独立双模式）
· 新增 templates/_color_picker_modal.php（全页唯一模态框，预置色 + hex 手输）
· 共享本提到同一清单，标注归属与权限；owner 校验服务端做
· 清掉 display.php 时代遗留的死 CSS（.cal-set-page / .cal-set-book* 等）
部署中抓出并修掉两处真问题：
· 部署脚本「清掉被取代文件」清单漏了 display.php —— tar 只新增/覆盖，
git rm 掉的文件在线上永远留着，被第 7 段断言拦下（断言是对的，缺的是删除步骤）
· _color_picker.php 里残留 <input type="color" class="cp-trigger">：
原生取色控件既不能有子元素、也没有 data-cp-open ⇒
按钮回显失效（找不到 .cp-trigger-dot/hex）+ 模态框永远打不开，
用户点到的还是 Windows 取色框。改成 <button type="button"> + 色点 + hex
（v72 探针在修复前实测 2 条红，修复后 50/0）
This commit is contained in:
+196
-28
@@ -170,39 +170,207 @@ a:hover { text-decoration: underline; }
|
|||||||
否则菜单会顶出屏幕、底下的「保存」按钮够不着。 */
|
否则菜单会顶出屏幕、底下的「保存」按钮够不着。 */
|
||||||
.cal-set .menu-list { min-width: 260px; max-width: min(320px, 92vw); }
|
.cal-set .menu-list { min-width: 260px; max-width: min(320px, 92vw); }
|
||||||
.cal-set-list { padding: 10px; gap: 0; }
|
.cal-set-list { padding: 10px; gap: 0; }
|
||||||
.cal-set-form { display: block; }
|
|
||||||
.cal-set-block { padding: 6px 2px; }
|
|
||||||
.cal-set-block + .cal-set-block { border-top: 1px solid var(--line-2); margin-top: 4px; }
|
|
||||||
.cal-set-h { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
|
.cal-set-h { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
|
||||||
.cal-set-views { display: flex; gap: 12px; flex-wrap: wrap; }
|
.cal-set-views { display: flex; gap: 12px; flex-wrap: wrap; }
|
||||||
.cal-set-view { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; cursor: pointer; }
|
.cal-set-view { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; cursor: pointer; }
|
||||||
.cal-set-view input { accent-color: var(--brand); }
|
.cal-set-view input { accent-color: var(--brand); }
|
||||||
/* 本子清单：最多占 42vh，超了内部滚动 —— 菜单本身不滚，否则保存按钮会被推出可视区 */
|
/* 🔴 v72（用户 2026-10-21）—— 这里原有一段 `.cal-set-books / .cal-set-book* /
|
||||||
.cal-set-books { max-height: 42vh; overflow-y: auto; }
|
.cal-set-page / .cal-set-form|block|foot|links` 的样式，随 `calendar/display`
|
||||||
/* 🔴 v51（用户 2026-10-15 第 6 条）：显示设置**独立成页之后**，
|
整页删除（显隐与管理合并进 `calendar/calendars`）**全部失去了使用者**，
|
||||||
`.cal-set-books` 那条 `max-height:42vh; overflow-y:auto` 就不该再套用了 ——
|
已在本轮清掉。留着的代价不只是"没用"：
|
||||||
它是"塞在下拉里"时的妥协（下拉不能太高）。整页里再套一个 42vh 的滚动区，
|
· 其中 `.cal-set-page .cal-set-books { max-height:none; overflow-y:visible; }`
|
||||||
等于"页面里再开一个小窗"，日历本多的时候要**滚动两次**才能看完。
|
曾被 v51 的反向验证当成"守内滚动"的锚点 —— 规则在、页面没了 ⇒
|
||||||
⚠️ 用 `.cal-set-page` 作用域覆盖，**不动**上面那条基础规则 ——
|
注入照旧命中文本、页面照旧全绿 ⇒ **那条反向验证变成空转**，
|
||||||
它现在没有别的使用者，但留着万一将来又要在别处（弹框里）用同一套列表。 */
|
在输出上却看起来"这条断言很结实"（实测踩中，见 `_b51_falsify.py` 注释）。
|
||||||
.cal-set-page .cal-set-books { max-height: none; overflow-y: visible; }
|
· ⇐ 教训：**断言只能锚"当前真有使用者"的规则**；删模板时必须同步删死 CSS，
|
||||||
/* 页面上把每一本排成一行（与下拉里同一套行样式，只是不滚动） */
|
否则验证脚本会静默退化成摆设。
|
||||||
.cal-set-page .cal-set-book { font-size: 14px; }
|
现在"日历本清单不套内滚动"这件事由 `.cal-books` 守（它才是页面上真实的清单容器）。 */
|
||||||
.cal-set-book {
|
|
||||||
display: flex; align-items: center; gap: 7px; padding: 5px 4px;
|
/* ============================================================================
|
||||||
font-size: 13px; cursor: pointer; border-radius: 6px; white-space: normal;
|
v72（用户 2026-10-21）：日历本「显隐 + 管理」合并成一张清单
|
||||||
|
----------------------------------------------------------------------------
|
||||||
|
用户原话：「日历设置里面日历本显示和日历管理可以放在一起啊。就是把日历本全都
|
||||||
|
列出来，然后显示不显示，加个复选框就行了。另外把下面别人共享给我的
|
||||||
|
也提到上面来，把所有的日历都放在一块，只不过在后面标注出来，
|
||||||
|
这个是别人谁谁谁共享给我的？是只读的还是可写的，什么的就可以了呀。」
|
||||||
|
|
||||||
|
⇒ 每行从左到右读下来就是一整句答案：
|
||||||
|
[✓] ■ 名字 [谁·只读/可写] 共享 导出 编辑 删除
|
||||||
|
⚠️ 用 grid 而不是 flex：归属那一列要**对齐**（否则每行标签长短不一时，
|
||||||
|
后面的操作按钮会跟着左右乱跳，看着很脏）。
|
||||||
|
⚠️ 窄屏（<640px）改成两行：第一行勾选+色块+名字+归属，第二行操作。
|
||||||
|
44 行日历本在手机上横着排会挤成碎片（用户可能在手机浏览器里管日历）。
|
||||||
|
========================================================================== */
|
||||||
|
.cal-books { display: flex; flex-direction: column; gap: 2px; }
|
||||||
|
|
||||||
|
/* 分组分隔线：从"我的"切到"共享给我的" */
|
||||||
|
.cal-books-sep {
|
||||||
|
display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
|
||||||
|
margin: 14px 0 6px; padding-top: 12px;
|
||||||
|
border-top: 1px solid var(--line);
|
||||||
|
font-size: 13px; font-weight: 600; color: var(--muted);
|
||||||
}
|
}
|
||||||
.cal-set-book:hover { background: var(--line-2); }
|
.cal-books-sep-note { font-size: 12px; font-weight: 400; color: var(--faint); }
|
||||||
.cal-set-book input { accent-color: var(--brand); flex: 0 0 auto; }
|
|
||||||
.cal-set-book .color-preview { width: 11px; height: 11px; border-radius: 3px; flex: 0 0 auto; }
|
.cal-book-row {
|
||||||
.cal-set-book .cal-name { overflow: hidden; text-overflow: ellipsis; }
|
display: grid;
|
||||||
.cal-set-book .node-badge { margin-left: auto; flex: 0 0 auto; }
|
grid-template-columns: 22px 30px minmax(0, 1fr) auto auto;
|
||||||
.cal-set-foot { margin-top: 10px; }
|
align-items: center; gap: 10px;
|
||||||
.cal-set-foot .btn { width: 100%; justify-content: center; }
|
padding: 8px 6px; border-radius: 8px;
|
||||||
.cal-set-links { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-2); }
|
}
|
||||||
.cal-set-links a { display: flex; align-items: center; gap: 10px; white-space: normal; }
|
.cal-book-row:hover { background: var(--line-2); }
|
||||||
.cal-set-links a .mi { flex: 0 0 16px; color: var(--muted); }
|
/* 关掉的本子整行变淡 —— 一眼看出"这本现在不显示"，
|
||||||
.cal-set-links a:hover .mi { color: currentColor; }
|
但**不 disable**：点一下就能重新勾上（disable 会让人以为"这行坏了"） */
|
||||||
|
.cal-book-row.is-off .cal-book-name,
|
||||||
|
.cal-book-row.is-off .cal-book-dot,
|
||||||
|
.cal-book-row.is-off .cp-trigger-dot { opacity: .45; }
|
||||||
|
|
||||||
|
.cal-book-show { display: inline-flex; align-items: center; cursor: pointer; }
|
||||||
|
.cal-book-show input { accent-color: var(--brand); width: 16px; height: 16px; cursor: pointer; }
|
||||||
|
|
||||||
|
.cal-book-dot {
|
||||||
|
display: inline-block; width: 13px; height: 13px; border-radius: 3px;
|
||||||
|
border: 1px solid var(--line); justify-self: center; flex: 0 0 auto;
|
||||||
|
}
|
||||||
|
.cal-book-name { font-size: 14px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
|
||||||
|
|
||||||
|
.cal-book-tags { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
|
||||||
|
.cal-owner { font-size: 12.5px; color: var(--muted); white-space: nowrap; }
|
||||||
|
.node-badge-quiet { opacity: .7; }
|
||||||
|
/* 可写 / 只读两个徽标要**一眼能分**：可写用品牌色，只读用中性灰。
|
||||||
|
⚠️ 别用"同色深浅"区分 —— 用户要的正是在列表里快速扫出"哪些我能动"。 */
|
||||||
|
.node-badge.is-write { background: var(--brand-soft, rgba(74, 124, 130, .12)); color: var(--brand-ink, var(--brand)); }
|
||||||
|
.node-badge.is-read { background: var(--line-2); color: var(--muted); }
|
||||||
|
|
||||||
|
.cal-book-acts { display: inline-flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
|
||||||
|
.cal-book-acts .link-quiet { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; font-size: 13px; }
|
||||||
|
.cal-book-acts .link-quiet:hover { color: var(--brand); text-decoration: underline; }
|
||||||
|
.cal-book-acts .link-danger:hover { color: var(--danger, #C0533F); }
|
||||||
|
.cal-book-acts .inline-form { display: inline; margin: 0; }
|
||||||
|
|
||||||
|
/* 已共享给谁：第二行，靠名字下方 */
|
||||||
|
.cal-book-shares {
|
||||||
|
grid-column: 3 / -1; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
|
||||||
|
margin-top: 4px; font-size: 12.5px; color: var(--muted);
|
||||||
|
}
|
||||||
|
.cal-book-shares-label { color: var(--faint); }
|
||||||
|
.cal-book-shares .inline-form { display: inline; margin: 0; }
|
||||||
|
.cal-book-shares .link-quiet { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; font-size: 12.5px; }
|
||||||
|
.cal-book-shares .link-danger:hover { color: var(--danger, #C0533F); }
|
||||||
|
|
||||||
|
@media (max-width: 640px) {
|
||||||
|
/* 窄屏：勾选+色块+名字+归属 一行，操作另起一行靠右 */
|
||||||
|
.cal-book-row { grid-template-columns: 22px 26px minmax(0, 1fr); row-gap: 6px; }
|
||||||
|
.cal-book-tags { grid-column: 3 / -1; }
|
||||||
|
.cal-book-acts { grid-column: 1 / -1; justify-content: flex-start; padding-left: 2px; }
|
||||||
|
.cal-book-shares { grid-column: 1 / -1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================================================
|
||||||
|
v72：内置调色器（替代 `<input type="color">`，不再弹 Windows 系统取色框）
|
||||||
|
----------------------------------------------------------------------------
|
||||||
|
用户原话：「选颜色那个地方点了之后是弹出 Windows 的一个颜色选择框，这个不好，
|
||||||
|
我们把它改成内置的，就是就是在网页上弹出一个模态框或者一个什么样的，
|
||||||
|
然后选颜色，不要弹 Windows 的，那个一个体验也不好，另外一个也不好看。」
|
||||||
|
========================================================================== */
|
||||||
|
.cp-field { display: inline-flex; align-items: center; }
|
||||||
|
|
||||||
|
/* 触发按钮：小色块 + hex 值，长得像"一个可点的胶囊"而不是原生控件 */
|
||||||
|
.cp-trigger {
|
||||||
|
display: inline-flex; align-items: center; gap: 7px;
|
||||||
|
padding: 3px 9px 3px 4px; border: 1px solid var(--line); border-radius: 999px;
|
||||||
|
background: var(--surface); cursor: pointer; font: inherit; color: var(--ink);
|
||||||
|
transition: border-color .15s, box-shadow .15s;
|
||||||
|
}
|
||||||
|
.cp-trigger:hover { border-color: var(--brand); }
|
||||||
|
.cp-trigger:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
|
||||||
|
.cp-trigger-dot {
|
||||||
|
width: 18px; height: 18px; border-radius: 50%; flex: 0 0 auto;
|
||||||
|
border: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
}
|
||||||
|
.cp-trigger-hex {
|
||||||
|
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
|
||||||
|
font-size: 11.5px; color: var(--muted); letter-spacing: .3px;
|
||||||
|
}
|
||||||
|
/* 行内（日历本清单里）那个调色器更紧凑一点，别把行撑高 */
|
||||||
|
.cal-book-row .cp-trigger { padding: 2px 4px; border-color: transparent; background: transparent; }
|
||||||
|
.cal-book-row .cp-trigger:hover { border-color: var(--line); background: var(--surface); }
|
||||||
|
.cal-book-row .cp-trigger-hex { display: none; }
|
||||||
|
.cal-book-row .cp-trigger-dot { width: 15px; height: 15px; }
|
||||||
|
|
||||||
|
/* 模态框：与 .cal-modal 同一套"遮罩 + 居中面板"，但独立命名
|
||||||
|
—— 它可能在**没有日历**的页面上也用（影院管理等），别跟日历耦合。 */
|
||||||
|
.cp-modal {
|
||||||
|
position: fixed; inset: 0; z-index: 2000;
|
||||||
|
display: flex; align-items: center; justify-content: center;
|
||||||
|
padding: 16px; background: var(--mask, rgba(20, 24, 26, .42));
|
||||||
|
}
|
||||||
|
.cp-modal[hidden] { display: none; }
|
||||||
|
.cp-modal-panel {
|
||||||
|
width: min(420px, 100%); max-height: calc(100vh - 48px);
|
||||||
|
display: flex; flex-direction: column;
|
||||||
|
background: var(--surface); border-radius: 14px;
|
||||||
|
box-shadow: 0 18px 48px rgba(0, 0, 0, .22);
|
||||||
|
}
|
||||||
|
.cp-modal-head {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
padding: 14px 16px 10px; font-size: 15px;
|
||||||
|
}
|
||||||
|
.cp-modal-body { padding: 0 16px 4px; overflow-y: auto; }
|
||||||
|
.cp-modal-foot {
|
||||||
|
display: flex; gap: 10px; justify-content: flex-end;
|
||||||
|
padding: 12px 16px 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 大预览块：让用户看到"日程条上白字压在这个颜色上"的真实效果 */
|
||||||
|
.cp-preview {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
height: 62px; padding: 0 14px; border-radius: 10px; background: #4A7C82;
|
||||||
|
color: #fff; transition: background .12s;
|
||||||
|
}
|
||||||
|
.cp-preview-chip { font-size: 13.5px; font-weight: 600; }
|
||||||
|
.cp-preview-hex {
|
||||||
|
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
|
||||||
|
font-size: 12px; opacity: .8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cp-swatches {
|
||||||
|
display: grid; grid-template-columns: repeat(8, 1fr);
|
||||||
|
gap: 8px; margin: 14px 0 12px;
|
||||||
|
}
|
||||||
|
.cp-swatch {
|
||||||
|
aspect-ratio: 1 / 1; border-radius: 8px; border: 2px solid transparent;
|
||||||
|
cursor: pointer; padding: 0; transition: transform .12s, border-color .12s;
|
||||||
|
}
|
||||||
|
.cp-swatch:hover { transform: scale(1.08); }
|
||||||
|
/* 选中态：白环 + 深色外环，任何底色上都看得见（只用深色环时，
|
||||||
|
深色块上的环就"消失"了 —— 那正是"点了没反应"的观感来源之一） */
|
||||||
|
.cp-swatch.active {
|
||||||
|
border-color: var(--surface);
|
||||||
|
box-shadow: 0 0 0 2px var(--ink);
|
||||||
|
}
|
||||||
|
.cp-swatch:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
|
||||||
|
|
||||||
|
.cp-custom { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-bottom: 8px; }
|
||||||
|
.cp-custom label { font-size: 13px; color: var(--muted); }
|
||||||
|
.cp-hash { font-family: ui-monospace, monospace; color: var(--faint); }
|
||||||
|
.cp-hex-input { width: 96px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; text-transform: uppercase; }
|
||||||
|
.cp-hex-input.is-bad { border-color: var(--danger, #C0533F); }
|
||||||
|
.cp-bad { font-size: 12px; color: var(--danger, #C0533F); }
|
||||||
|
|
||||||
|
/* 改色成功/失败的小浮条 */
|
||||||
|
.cp-toast {
|
||||||
|
position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%);
|
||||||
|
z-index: 2100; padding: 9px 16px; border-radius: 999px;
|
||||||
|
background: var(--ink); color: var(--surface); font-size: 13px;
|
||||||
|
box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
|
||||||
|
transition: opacity .3s, transform .3s;
|
||||||
|
}
|
||||||
|
.cp-toast.is-err { background: var(--danger, #C0533F); }
|
||||||
|
.cp-toast.is-out { opacity: 0; transform: translateX(-50%) translateY(6px); }
|
||||||
|
|
||||||
|
/* 模态框开着时锁住背景滚动（否则鼠标滚轮会滚到背后的长清单） */
|
||||||
|
body.cp-lock { overflow: hidden; }
|
||||||
|
|
||||||
/* 点了日历空白处就建日程（能力保留，见 templates/calendar/index.php 的 data-new-at）。
|
/* 点了日历空白处就建日程（能力保留，见 templates/calendar/index.php 的 data-new-at）。
|
||||||
🔴 v48（用户 2026-10-14 第 3 条）：「现在鼠标放在视图上时，变成了一个十字。
|
🔴 v48（用户 2026-10-14 第 3 条）：「现在鼠标放在视图上时，变成了一个十字。
|
||||||
|
|||||||
@@ -5240,17 +5240,29 @@ $want = array_keys($want);
|
|||||||
* ⚠️ 保存仍走既有的 `calendar/prefs`（一条没改）—— 它只是从"下拉里的表单"
|
* ⚠️ 保存仍走既有的 `calendar/prefs`（一条没改）—— 它只是从"下拉里的表单"
|
||||||
* 变成"这一页上的表单"，提交契约、字段名、服务端逻辑完全不动。
|
* 变成"这一页上的表单"，提交契约、字段名、服务端逻辑完全不动。
|
||||||
*/
|
*/
|
||||||
|
/**
|
||||||
|
* 显示设置 → **已并入「日历本」页**（v72 用户 2026-10-21）。
|
||||||
|
*
|
||||||
|
* 用户原话：「日历设置里面日历本显示和日历管理可以放在一起啊。就是把日历本全都
|
||||||
|
* 列出来，然后显示不显示，加个复选框就行了。」
|
||||||
|
*
|
||||||
|
* ⇒ v51 拆出来的 `calendar/display`（默认视图 + 显示哪些本子）与
|
||||||
|
* `calendar/calendars`（本子管理）**合并成一页**：一张清单、每行一个复选框。
|
||||||
|
* 那一页现在更完整（显隐 + 归属 + 权限 + 编辑/删除/共享都在一处）。
|
||||||
|
*
|
||||||
|
* ⚠️ 这条路由**必须留着**（302 跳过去，不是删掉）：
|
||||||
|
* · 老书签、浏览器历史里还有 `?r=calendar/display`；
|
||||||
|
* · `_settings_menu.php` 的四行菜单里「显示设置」曾经指向它；
|
||||||
|
* · 直接删掉的话点旧链接会走"不存在的路由"兜底，用户看到的是"设置页没了"。
|
||||||
|
* ⇒ 与 `calendar/caldav_token` / `caldav_revoke` 那两条旧地址同样处理。
|
||||||
|
*
|
||||||
|
* ⚠️ 查询串要**带过去**（`view`）：跳转后「返回日程」还要回到用户原来那个视图，
|
||||||
|
* 丢了 view 就一律变成月视图（用户改完设置回到日程，发现被换成月视图）。
|
||||||
|
*/
|
||||||
case 'calendar/display':
|
case 'calendar/display':
|
||||||
$familyId = (int)Auth::familyId();
|
redirect('calendar/calendars', array_filter([
|
||||||
$me = (int)Auth::personId();
|
'view' => (string)($_GET['view'] ?? ''),
|
||||||
$cals = Calendar::mine($familyId, $me);
|
], static fn($v) => $v !== ''));
|
||||||
View::render('calendar/display', [
|
|
||||||
'title' => '显示设置',
|
|
||||||
'cals' => $cals,
|
|
||||||
'hiddenCals' => array_keys(Calendar::hiddenCalendars($me)),
|
|
||||||
'view' => (string)($_GET['view'] ?? Calendar::defaultView($me)),
|
|
||||||
'anchor' => (string)($_GET['anchor'] ?? date('Y-m-d')),
|
|
||||||
], 'calendar');
|
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case 'calendar/calendars':
|
case 'calendar/calendars':
|
||||||
@@ -5291,6 +5303,15 @@ $want = array_keys($want);
|
|||||||
'shared' => $shared,
|
'shared' => $shared,
|
||||||
'shares' => $shares,
|
'shares' => $shares,
|
||||||
'editing' => $editing,
|
'editing' => $editing,
|
||||||
|
/* 🔴 v72（用户 2026-10-21）：「日历设置里面日历本显示和日历管理可以放在一起。」
|
||||||
|
⇒ 这一页现在同时管**显隐**（原 `calendar/display` 的全部内容）
|
||||||
|
与**本子管理**。所以这两项必须一起传进来：
|
||||||
|
· `hiddenCals` —— 哪些本子没勾（原来是 display 页专属的数据）；
|
||||||
|
· `view` —— 回跳时保持当前视图（display 页本来就有）。
|
||||||
|
⚠️ 别把 `calendar/display` 的取数逻辑复制一份到这里 ——
|
||||||
|
那边已经改成 302 跳本页（见该路由），单一来源。 */
|
||||||
|
'hiddenCals' => array_keys(Calendar::hiddenCalendars($me)),
|
||||||
|
'view' => (string)($_GET['view'] ?? Calendar::defaultView($me)),
|
||||||
'people' => Person::roster($familyId, $me, 'member', ''),
|
'people' => Person::roster($familyId, $me, 'member', ''),
|
||||||
'cdHas' => $cdHas,
|
'cdHas' => $cdHas,
|
||||||
'cdPlain' => $cdPlain,
|
'cdPlain' => $cdPlain,
|
||||||
@@ -5326,6 +5347,65 @@ $want = array_keys($want);
|
|||||||
redirect('calendar/calendars');
|
redirect('calendar/calendars');
|
||||||
break;
|
break;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 单本改色（v72 用户 2026-10-21）—— AJAX 专用。
|
||||||
|
*
|
||||||
|
* 用户原话：「这个颜色选择是有问题的，点了之后是没反应的，就是预制的颜色
|
||||||
|
* 点了之后没反应的。」
|
||||||
|
* ⇒ 真根因不是"预置色没绑事件"这么一层：日历本页把"显隐"做成了**整页一次提交**
|
||||||
|
* （`show[]`），而改色如果也走那张大表单，一次提交就会带上 N 个同名 `color`
|
||||||
|
* 字段 ⇒ 服务端只拿最后一个 ⇒ 出现"改了这行、那行也变了"。
|
||||||
|
* 所以改色必须**单独一条请求**、只带一本。
|
||||||
|
*
|
||||||
|
* ⚠️ 与 cal_update 的区别（两个都留着，别合并）：
|
||||||
|
* · `cal_update` —— 表单提交（改名字 + 改颜色），成功/失败都 `redirect`
|
||||||
|
* （浏览器在页面级操作，跳回去看到 flash 是对的）；
|
||||||
|
* · `cal_color` —— AJAX 提交（**只改颜色**），一律回 **JSON**
|
||||||
|
* （前端要据此决定"保留新颜色"还是"回滚成旧的"）。
|
||||||
|
* 如果这里也 redirect，fetch 会把整页 HTML 当 json 解析失败 ⇒ 用户看到
|
||||||
|
* "改颜色没成功"但其实已经改好了（这类"假失败"最难受）。
|
||||||
|
*
|
||||||
|
* 🔴 权限判据与 cal_update **一字不差**：必须是我自己的、且 kind='custom'。
|
||||||
|
* 共享给我的本子（哪怕是"可写"）也改不了 —— 颜色是主人的东西
|
||||||
|
* （用户明确：「别人共享给我的，不让他编辑」）。
|
||||||
|
*/
|
||||||
|
case 'calendar/cal_color':
|
||||||
|
header('Content-Type: application/json; charset=utf-8');
|
||||||
|
$me = (int)Auth::personId();
|
||||||
|
// ⚠️ 这里**不能**用 csrf_check()：它失败时输出纯文本并 419，
|
||||||
|
// fetch 那边 `.json()` 会抛 ⇒ 只看到"网络不通"，看不到真正原因。
|
||||||
|
$csrfOk = isset($_POST['_csrf'], $_SESSION['_csrf'])
|
||||||
|
&& hash_equals((string)$_SESSION['_csrf'], (string)$_POST['_csrf']);
|
||||||
|
if (!$csrfOk) {
|
||||||
|
http_response_code(419);
|
||||||
|
echo json_encode(['ok' => false, 'error' => '页面已过期，刷新后重试'], JSON_UNESCAPED_UNICODE);
|
||||||
|
exit;
|
||||||
|
}
|
||||||
|
if (!Auth::canWrite()) {
|
||||||
|
http_response_code(403);
|
||||||
|
echo json_encode(['ok' => false, 'error' => '只读账号不能改颜色'], JSON_UNESCAPED_UNICODE);
|
||||||
|
exit;
|
||||||
|
}
|
||||||
|
$id = (int)($_POST['id'] ?? 0);
|
||||||
|
$color = trim((string)($_POST['color'] ?? ''));
|
||||||
|
$cal = Calendar::find($id);
|
||||||
|
if (!$cal || (int)$cal['owner_id'] !== $me || (string)$cal['kind'] !== 'custom') {
|
||||||
|
http_response_code(403);
|
||||||
|
echo json_encode(['ok' => false, 'error' => '这本日历不能改颜色'], JSON_UNESCAPED_UNICODE);
|
||||||
|
exit;
|
||||||
|
}
|
||||||
|
/* ⚠️ 颜色归一化交给 Calendar::update（内部会走 AvatarColor 的归一化并转大写）。
|
||||||
|
但 update 是"整本更新"（name + color 一起写）⇒ 这里把**原名**带回去，
|
||||||
|
否则改个颜色会把名字清成空串（那是个很容易漏的坑：update 的签名是
|
||||||
|
`update($id, $name, $color)`，不是"只更新传进来的字段"）。 */
|
||||||
|
Calendar::update($id, (string)$cal['name'], $color);
|
||||||
|
$saved = (string)Calendar::find($id)['color'];
|
||||||
|
echo json_encode([
|
||||||
|
'ok' => true,
|
||||||
|
'color' => $saved,
|
||||||
|
], JSON_UNESCAPED_UNICODE);
|
||||||
|
exit;
|
||||||
|
|
||||||
case 'calendar/cal_del':
|
case 'calendar/cal_del':
|
||||||
$me = (int)Auth::personId();
|
$me = (int)Auth::personId();
|
||||||
Auth::requireWrite();
|
Auth::requireWrite();
|
||||||
|
|||||||
@@ -0,0 +1,115 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* 内置调色器（v72 用户 2026-10-21）—— 按钮 + 值载体，模态框见 `_color_picker_modal.php`。
|
||||||
|
*
|
||||||
|
* 用户原话：
|
||||||
|
* 「另外一个日历本管理里面，这个颜色选择是有问题的，点了之后是没反应的，
|
||||||
|
* 就是预制的颜色点了之后没反应的。另外选颜色那个地方点了之后是弹出 Windows 的
|
||||||
|
* 一个颜色选择框，这个不好，我们把它改成内置的，就是就是在网页上弹出一个模态框
|
||||||
|
* 或者一个什么样的，然后选颜色，不要弹 Windows 的，那个一个体验也不好，
|
||||||
|
* 另外一个也不好看。」
|
||||||
|
*
|
||||||
|
* ⇒ 两件事：
|
||||||
|
* ① **预置色点了没反应** = `templates/calendar/calendars.php` 里压根没有绑定脚本
|
||||||
|
* （影院管理页 `movies/cinemas.php` 有一段，日历本页抄漏了）。现在由本组件的 JS
|
||||||
|
* 统一接管，**不再依赖调用页自己写一份绑定**（写两份迟早又漏一处）。
|
||||||
|
* ② **不要 Windows 系统取色框** ⇒ 去掉 `<input type="color">`，改成纯网页的
|
||||||
|
* 模态框：预置色板 + 自定义 hex 输入 + 实时预览。
|
||||||
|
*
|
||||||
|
* ─────────────────────────────────────────────────────────────────────
|
||||||
|
* 两种用法（靠 `$cpName` 是否为空区分）：
|
||||||
|
*
|
||||||
|
* **A. 表单模式** —— 值随外层表单一起提交（新建/编辑日历本的弹表单用这个）：
|
||||||
|
* ```php
|
||||||
|
* $cpName='color'; $cpValue='#4A7C82'; $cpPalette=\App\Calendar::PRESET_CAL_COLORS;
|
||||||
|
* require __DIR__ . '/../_color_picker.php';
|
||||||
|
* ```
|
||||||
|
* ⇒ 出 `<input type="hidden" name="color">`。
|
||||||
|
*
|
||||||
|
* **B. 独立模式**（`$cpName` 留空）—— 值**不参与表单提交**，由调用页自己拿去做 AJAX：
|
||||||
|
* ```php
|
||||||
|
* $cpName=''; $cpValue=$cal['color']; $cpId='calColor'.$id;
|
||||||
|
* $cpData=['cal-id'=>$id]; // 附加到 .cp-field 上的 data-*
|
||||||
|
* require __DIR__ . '/../_color_picker.php';
|
||||||
|
* ```
|
||||||
|
* ⇒ 出 `<input type="hidden">`（**无 name**）。调用页监听 `cp:change` 事件。
|
||||||
|
*
|
||||||
|
* 🔴 为什么要 B 模式：日历本清单是"一张大表单管显隐"（`show[]` 整页一次提交），
|
||||||
|
* 如果每行再塞一个 `name="color"`，一次提交会带上 N 个同名 `color` 字段，
|
||||||
|
* 服务端只能拿到最后一个 —— 于是"改了第 3 本的颜色，保存时把第 5 本也改了"。
|
||||||
|
* 所以行内改色走 AJAX 单独落库，**不混进那张大表单**。
|
||||||
|
*
|
||||||
|
* @var string $cpName 隐藏域 name；空串 = 独立模式（不提交）
|
||||||
|
* @var string $cpValue 初始值（'#RRGGBB'）
|
||||||
|
* @var array $cpPalette 预置色板（'#RRGGBB' 列表）
|
||||||
|
* @var string $cpId 可选，值载体的 id；不给则用 'cp_' + $cpName（独立模式必须给）
|
||||||
|
* @var string $cpLabel 可选，按钮上的无障碍名
|
||||||
|
* @var array $cpData 可选，附加到容器上的 data-*（键 => 值）
|
||||||
|
*/
|
||||||
|
$cpName = (string)($cpName ?? 'color');
|
||||||
|
$cpValue = strtoupper((string)($cpValue ?? '#4A7C82'));
|
||||||
|
$cpPalette = array_values(array_filter((array)($cpPalette ?? []), 'is_string'));
|
||||||
|
$cpData = (array)($cpData ?? []);
|
||||||
|
$cpLabel = (string)($cpLabel ?? '选择颜色');
|
||||||
|
/* 🔴🔴 `$cpId` 必须**先给默认值**再用（2026-10-21 实测踩到）：
|
||||||
|
原先只有下面那个 `if (!$cpId)` —— 表单模式下调用页**根本不传** `$cpId`，
|
||||||
|
于是这里读一个未定义变量 ⇒ `Warning: Undefined variable $cpId`
|
||||||
|
⇒ 那条 Warning 被 `display_errors` 打成 HTML **塞进页面正文**：
|
||||||
|
· 页面上会看见一段错字；
|
||||||
|
· 更糟的是它出现在 `<span class="cp-field">` **之前**，
|
||||||
|
某些布局下会把表单控件的行内关系弄乱；
|
||||||
|
· 而**页面照样 200、照样能用** ⇒ 只有"查正文里有没有 PHP 错误"的断言能抓到。
|
||||||
|
⇒ 教训：可选参数一律 `?? ''` 兜底，**不要靠 `if (!$x)` 当存在性判断**
|
||||||
|
（读它那一刻 Warning 就已经产生了）。
|
||||||
|
⚠️ 我的 v72 前端探针当时 47/0 全绿却没抓到它 —— 因为它只查 JS 报错、
|
||||||
|
不查服务端正文。已给探针补上这条（见 `_fb_v72_ui.py` 的「PHP 正文干净」）。 */
|
||||||
|
$cpId = (string)($cpId ?? '');
|
||||||
|
|
||||||
|
if ($cpId === '') {
|
||||||
|
// 表单模式用 name 派生；独立模式没有 name ⇒ 调用页必须给 id
|
||||||
|
$cpId = 'cp_' . preg_replace('/[^A-Za-z0-9_]/', '_', $cpName !== '' ? $cpName : 'color');
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ⚠️ 初始值本身**不是**合法 hex 时（老数据、手工改库），退回落日色而不是把
|
||||||
|
`background: xxx` 直接拼进 style —— 那样会把整条样式声明弄坏，
|
||||||
|
旁边几个属性一起失效（用户看到的是"色块变成一个方块"）。 */
|
||||||
|
if (!preg_match('/^#[0-9A-Fa-f]{6}$/', $cpValue)) {
|
||||||
|
$cpValue = '#4A7C82';
|
||||||
|
}
|
||||||
|
|
||||||
|
$cpDataAttr = '';
|
||||||
|
foreach ($cpData as $k => $v) {
|
||||||
|
$cpDataAttr .= ' data-' . e((string)$k) . '="' . e((string)$v) . '"';
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
<span class="cp-field" data-cp-field="<?= e($cpId) ?>"<?= $cpDataAttr ?>>
|
||||||
|
<?php /* ⚠️ 独立模式下**不写 name**：写了就会跟着外层表单一起提交。
|
||||||
|
独立模式的值靠 JS 读 `.cp-field` 里的这个 input。 */ ?>
|
||||||
|
<input type="hidden"<?= $cpName !== '' ? ' name="' . e($cpName) . '"' : '' ?>
|
||||||
|
id="<?= e($cpId) ?>" value="<?= e($cpValue) ?>">
|
||||||
|
<?php /* 🔴🔴 v72 修正（2026-10-21 部署时才被抓出来）—— 这里原来是一颗
|
||||||
|
`<input type="color" ... class="cp-trigger">`（原生取色控件）。
|
||||||
|
|
||||||
|
那是**没改完的旧写法**，同时踩了两件事：
|
||||||
|
① **用户点名要去掉的就是它**（「选颜色那个地方点了之后是弹出 Windows 的
|
||||||
|
一个颜色选择框，这个不好」）—— 留着它等于需求没做；
|
||||||
|
② CSS/JS 是照「按钮 + 内部小色点 + hex 文本」设计的：
|
||||||
|
`.cp-trigger` 是 `inline-flex` 胶囊、`.cp-trigger-dot` / `.cp-trigger-hex`
|
||||||
|
是它的子元素、模态框靠 `[data-cp-open]` + `[data-cp-target]` 打开并回填。
|
||||||
|
而原生 `<input type="color">` **不能有子元素**，也没有这两个属性
|
||||||
|
⇒
|
||||||
|
· `syncTrigger()` 找不到 `.cp-trigger-dot/hex` ⇒ 改完色**按钮上不刷新**；
|
||||||
|
· `document.querySelectorAll('[data-cp-open]')` 一个都取不到
|
||||||
|
⇒ 模态框**永远打不开**，用户点到的是浏览器原生取色框。
|
||||||
|
⇒ 现在输出的是 `<button type="button">`：**必须写 `type="button"`**，
|
||||||
|
不加会默认 `type="submit"`，点一下就提交外面那张大表单（日历本清单那张）。
|
||||||
|
⚠️ `data-cp-target` 指向**隐藏域**的 id（`$cpId`），不是按钮自己的 id ——
|
||||||
|
`open()` 靠它 `getElementById` 拿当前值，`syncTrigger()` 也靠 `.cp-field`
|
||||||
|
反查隐藏域。三者（field / hidden / button）必须在同一个 `.cp-field` 里。 */ ?>
|
||||||
|
<button type="button" class="cp-trigger"
|
||||||
|
data-cp-open data-cp-target="<?= e($cpId) ?>"
|
||||||
|
aria-label="<?= e($cpLabel) ?>">
|
||||||
|
<span class="cp-trigger-dot" style="background: <?= e($cpValue) ?>"></span>
|
||||||
|
<span class="cp-trigger-hex"><?= e($cpValue) ?></span>
|
||||||
|
</button>
|
||||||
|
</span>
|
||||||
@@ -0,0 +1,253 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* 内置调色模态框（v72 用户 2026-10-21）—— **全页只出现一次**。
|
||||||
|
*
|
||||||
|
* 配套 `_color_picker.php` 用（那边只出按钮 + 隐藏域）。拆两个文件的理由见那边的注释。
|
||||||
|
*
|
||||||
|
* ─────────────────────────────────────────────────────────────────────
|
||||||
|
* 为什么不用 `<input type="color">`（用户明确不要）
|
||||||
|
*
|
||||||
|
* 用户原话：「选颜色那个地方点了之后是弹出 Windows 的一个颜色选择框，这个不好，
|
||||||
|
* 我们把它改成内置的……不要弹 Windows 的，那个一个体验也不好，
|
||||||
|
* 另外一个也不好看。」
|
||||||
|
*
|
||||||
|
* `<input type="color">` 的外观与交互**完全由操作系统决定**：Windows 上弹出的是
|
||||||
|
* 那个带色轮和 HSV 滑条的老式对话框，macOS 上是另一套，手机上是第三套。
|
||||||
|
* ⇒ 站点自己控制不了，也无法与本站的圆角/配色对齐。所以整站不再用它取色。
|
||||||
|
*
|
||||||
|
* ⚠️ **保留自定义 hex 输入**：预置色板只有 16 个，用户想要某个精确颜色时
|
||||||
|
* 手输 `#RRGGBB` 是最快的路（也让"从别处复制一个色值"变得可能）。
|
||||||
|
* 输入非法时不提交非法值 —— 按钮保持 disabled，输入框边框变红。
|
||||||
|
*
|
||||||
|
* ⚠️ **键盘与焦点**：打开时焦点进模态框、关闭时焦点回触发按钮。
|
||||||
|
* 不这么做的话，键盘用户关掉后焦点掉到 `body`，Tab 会从页首重新开始。
|
||||||
|
*
|
||||||
|
* ⚠️ **焦点陷阱（Tab 循环）**：模态框开着时 Tab 不许跑到背后的页面上 ——
|
||||||
|
* 这是 `aria-modal="true"` 的语义要求，也是"看起来能点但其实点不到"的体验修复。
|
||||||
|
*
|
||||||
|
* @var array $cpPalette 预置色板（'#RRGGBB' 列表）
|
||||||
|
* @var string $cpModalTitle 可选，标题
|
||||||
|
*/
|
||||||
|
$cpPalette = array_values(array_filter((array)($cpPalette ?? []), 'is_string'));
|
||||||
|
$cpModalTitle = (string)($cpModalTitle ?? '选个颜色');
|
||||||
|
if (!$cpPalette) {
|
||||||
|
// 没有色板就没有"点一下选中"的价值，只剩 hex 输入 —— 但仍然比系统框好看
|
||||||
|
$cpPalette = ['#4A7C82'];
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
<div class="cp-modal" id="cpModal" hidden role="dialog" aria-modal="true"
|
||||||
|
aria-labelledby="cpModalTitle">
|
||||||
|
<div class="cp-modal-panel">
|
||||||
|
<div class="cp-modal-head">
|
||||||
|
<b id="cpModalTitle"><?= e($cpModalTitle) ?></b>
|
||||||
|
<button type="button" class="cal-modal-x" data-cp-close aria-label="关闭">✕</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cp-modal-body">
|
||||||
|
<?php /* 大预览块：选了才知道"上屏是这个样子"。
|
||||||
|
⚠️ 里面写白字，是为了让用户同时看到"日程条上白字压在色块上"的效果
|
||||||
|
—— 月网格里的日程条就是这个形态（见 PRESET_CAL_COLORS 的注释）。 */ ?>
|
||||||
|
<div class="cp-preview" data-cp-preview>
|
||||||
|
<span class="cp-preview-chip">日程</span>
|
||||||
|
<span class="cp-preview-hex" data-cp-hex>#4A7C82</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cp-swatches" data-cp-swatches>
|
||||||
|
<?php foreach ($cpPalette as $pc): ?>
|
||||||
|
<button type="button" class="cp-swatch" data-cp-swatch="<?= e(strtoupper($pc)) ?>"
|
||||||
|
style="background: <?= e($pc) ?>;" aria-label="<?= e(strtoupper($pc)) ?>"
|
||||||
|
title="<?= e(strtoupper($pc)) ?>"></button>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cp-custom">
|
||||||
|
<label for="cpHexInput">自定义</label>
|
||||||
|
<span class="cp-hash">#</span>
|
||||||
|
<input class="input cp-hex-input" id="cpHexInput" data-cp-hex-input
|
||||||
|
maxlength="6" autocomplete="off" spellcheck="false"
|
||||||
|
placeholder="4A7C82" value="4A7C82">
|
||||||
|
<span class="cp-bad" data-cp-bad hidden>要 6 位十六进制（0-9 / A-F）</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cp-modal-foot">
|
||||||
|
<button type="button" class="btn btn-sm" data-cp-ok>用这个颜色</button>
|
||||||
|
<button type="button" class="btn btn-ghost btn-sm" data-cp-close>取消</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
(function () {
|
||||||
|
var modal = document.getElementById('cpModal');
|
||||||
|
if (!modal) { return; }
|
||||||
|
|
||||||
|
var panel = modal.querySelector('.cp-modal-panel');
|
||||||
|
var swatches = modal.querySelector('[data-cp-swatches]');
|
||||||
|
var preview = modal.querySelector('[data-cp-preview]');
|
||||||
|
var hexLabel = modal.querySelector('[data-cp-hex]');
|
||||||
|
var hexInput = modal.querySelector('[data-cp-hex-input]');
|
||||||
|
var badTip = modal.querySelector('[data-cp-bad]');
|
||||||
|
var okBtn = modal.querySelector('[data-cp-ok]');
|
||||||
|
|
||||||
|
var target = null; // 当前正在编辑的那个隐藏域
|
||||||
|
var draft = '#4A7C82';
|
||||||
|
var lastFocus = null;
|
||||||
|
|
||||||
|
function norm(s) {
|
||||||
|
s = String(s || '').trim().toUpperCase();
|
||||||
|
if (s.charAt(0) === '#') { s = s.slice(1); }
|
||||||
|
return /^[0-9A-F]{6}$/.test(s) ? '#' + s : '';
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 把 draft 刷到"预览块 / 选中态 / hex 输入框"三处。
|
||||||
|
⚠️ 只有合法值才刷 —— 非法时保留上一次的合法颜色做预览，
|
||||||
|
否则预览块会变成透明的白框，看着像坏了。 */
|
||||||
|
function paint() {
|
||||||
|
/* ⚠️ **别在 paint 里回写 hexInput.value**。
|
||||||
|
我原先写的是"ok 时就把 hexInput.value = draft.slice(1)"，后果是：
|
||||||
|
用户在输入框里打 `zzz` → paint 判断 draft（上一次合法的值）ok →
|
||||||
|
把输入框**改回** `4A7C82` ⇒ 用户打的字被当场吃掉、`is-bad` 永远不亮、
|
||||||
|
「用这个颜色」永远可点 ⇒ 探针里那两条"非法输入保护"直接假绿/假红。
|
||||||
|
⇒ 分工固定为：
|
||||||
|
· paint() 只负责"**读**输入框当前内容 → 决定 ok/提示/禁用 + 刷预览"；
|
||||||
|
· 输入框的值只由**用户输入**和 open() 初始化来写。 */
|
||||||
|
var typed = norm(hexInput.value);
|
||||||
|
var ok = typed !== '';
|
||||||
|
if (ok) { draft = typed; }
|
||||||
|
|
||||||
|
// 预览块只在有合法颜色时刷（非法时保留上一次的颜色，别闪成白框）
|
||||||
|
if (norm(draft) !== '') {
|
||||||
|
preview.style.background = draft;
|
||||||
|
hexLabel.textContent = draft;
|
||||||
|
}
|
||||||
|
badTip.hidden = ok;
|
||||||
|
hexInput.classList.toggle('is-bad', !ok);
|
||||||
|
okBtn.disabled = !ok;
|
||||||
|
|
||||||
|
Array.prototype.forEach.call(swatches.children, function (el) {
|
||||||
|
var c = norm(el.getAttribute('data-cp-swatch'));
|
||||||
|
el.classList.toggle('active', ok && c === draft);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function open(trigger) {
|
||||||
|
var id = trigger.getAttribute('data-cp-target') || '';
|
||||||
|
target = id ? document.getElementById(id) : null;
|
||||||
|
if (!target) { return; }
|
||||||
|
lastFocus = trigger;
|
||||||
|
draft = norm(target.value) || '#4A7C82';
|
||||||
|
/* ⚠️ 输入框的初值必须在这里显式写（paint() 现在不代劳，见它的注释） */
|
||||||
|
hexInput.value = draft.slice(1);
|
||||||
|
paint();
|
||||||
|
modal.hidden = false;
|
||||||
|
document.body.classList.add('cp-lock');
|
||||||
|
okBtn.focus();
|
||||||
|
}
|
||||||
|
|
||||||
|
function close() {
|
||||||
|
modal.hidden = true;
|
||||||
|
document.body.classList.remove('cp-lock');
|
||||||
|
if (lastFocus && lastFocus.focus) { lastFocus.focus(); }
|
||||||
|
target = null;
|
||||||
|
lastFocus = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 触发按钮：把点击刷到按钮自己的小色块与 hex 文本上。
|
||||||
|
⚠️ 这一句就是"预置色点了没反应"那个 bug 的补丁所在 ——
|
||||||
|
原来没有任何代码写隐藏域，所以提交上去还是旧颜色。 */
|
||||||
|
function syncTrigger(input) {
|
||||||
|
var field = input.closest ? input.closest('.cp-field') : null;
|
||||||
|
if (!field) { return; }
|
||||||
|
var dot = field.querySelector('.cp-trigger-dot');
|
||||||
|
var txt = field.querySelector('.cp-trigger-hex');
|
||||||
|
if (dot) { dot.style.background = input.value; }
|
||||||
|
if (txt) { txt.textContent = input.value; }
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('click', function (e) {
|
||||||
|
var t = e.target;
|
||||||
|
if (!t || !t.closest) { return; }
|
||||||
|
|
||||||
|
var trigger = t.closest('[data-cp-open]');
|
||||||
|
if (trigger) { e.preventDefault(); open(trigger); return; }
|
||||||
|
|
||||||
|
if (t.closest('[data-cp-close]')) { e.preventDefault(); close(); return; }
|
||||||
|
|
||||||
|
var sw = t.closest('[data-cp-swatch]');
|
||||||
|
if (sw) {
|
||||||
|
e.preventDefault();
|
||||||
|
draft = norm(sw.getAttribute('data-cp-swatch')) || draft;
|
||||||
|
/* 点色板 ⇒ 输入框跟着变（用户接着微调时有起点） */
|
||||||
|
hexInput.value = draft.slice(1);
|
||||||
|
paint();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (t.closest('[data-cp-ok]')) {
|
||||||
|
e.preventDefault();
|
||||||
|
var v = norm(hexInput.value);
|
||||||
|
if (!v || !target) { return; }
|
||||||
|
var oldVal = target.value;
|
||||||
|
target.value = v;
|
||||||
|
syncTrigger(target);
|
||||||
|
|
||||||
|
/* 🔴🔴 必须**先**把要用的东西抓成局部变量，再 close()。
|
||||||
|
这个坑我当场踩了：原先把 `close()` 写在前面，而 close() 会把模块级的
|
||||||
|
`target` 置成 null ⇒ 下面 `target.closest(...)` 抛
|
||||||
|
`Cannot read properties of null (reading 'closest')`
|
||||||
|
⇒ **事件永远发不出去** ⇒ 页面看着"选完颜色变了但没保存"。
|
||||||
|
（探针里表现为：行内色块变了、库里颜色没变 —— 最容易误判成"后端没写"。）
|
||||||
|
⇒ 规矩：`close()` 之后不要再碰任何"关闭时会被清空"的模块级变量。 */
|
||||||
|
var field = target.closest ? target.closest('.cp-field') : null;
|
||||||
|
var inpId = target.id;
|
||||||
|
close();
|
||||||
|
|
||||||
|
/* 🔴 v72：值**真变了**才派发事件 —— 调用页据此决定怎么落库
|
||||||
|
（日历本行内改色是 AJAX 单独提交，见 `calendar/calendars.php` 尾部）。
|
||||||
|
⚠️ 用自定义事件而不是回调：同一页可能有好几个调色器，
|
||||||
|
模态框不该知道"谁在用它、用它做什么"。
|
||||||
|
⚠️ 事件从 `.cp-field` 冒泡出去，`detail` 里带上 id / 新值 / 旧值，
|
||||||
|
调用页连"是哪一行"都不用自己猜。 */
|
||||||
|
if (oldVal !== v) {
|
||||||
|
(field || modal).dispatchEvent(new CustomEvent('cp:change', {
|
||||||
|
bubbles: true,
|
||||||
|
detail: { id: inpId, value: v, old: oldVal, field: field }
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 点遮罩关闭（点面板内部不关）
|
||||||
|
if (t === modal) { close(); }
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 用户输入：paint() 自己会读输入框并把合法值记进 draft，这里不用再动 draft
|
||||||
|
（再写一遍只会让人误以为"draft 与输入框是两份数据"） */
|
||||||
|
hexInput.addEventListener('input', function () { paint(); });
|
||||||
|
|
||||||
|
document.addEventListener('keydown', function (e) {
|
||||||
|
if (modal.hidden) { return; }
|
||||||
|
if (e.key === 'Escape') { e.preventDefault(); close(); return; }
|
||||||
|
|
||||||
|
// Tab 焦点陷阱：只在对话框内的可聚焦元素之间循环
|
||||||
|
if (e.key === 'Tab') {
|
||||||
|
var f = panel.querySelectorAll(
|
||||||
|
'button:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex="-1"])');
|
||||||
|
if (!f.length) { return; }
|
||||||
|
var first = f[0], last = f[f.length - 1];
|
||||||
|
if (e.shiftKey && document.activeElement === first) {
|
||||||
|
e.preventDefault(); last.focus();
|
||||||
|
} else if (!e.shiftKey && document.activeElement === last) {
|
||||||
|
e.preventDefault(); first.focus();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// 打开时把当前值刷进去（页面可能有多个调色器，初始值各不相同）
|
||||||
|
Array.prototype.forEach.call(document.querySelectorAll('[data-cp-open]'), function (b) {
|
||||||
|
var id = b.getAttribute('data-cp-target') || '';
|
||||||
|
var inp = id ? document.getElementById(id) : null;
|
||||||
|
if (inp) { syncTrigger(inp); }
|
||||||
|
});
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
@@ -23,11 +23,21 @@
|
|||||||
* 三处都是"☰ → 一串列表"。
|
* 三处都是"☰ → 一串列表"。
|
||||||
*
|
*
|
||||||
* 四行（顺序是用户点名的）：
|
* 四行（顺序是用户点名的）：
|
||||||
* ① 显示设置 → `calendar/display`（默认视图 + 显示哪些本子）★ 本批新增的独立页
|
* ① 显示设置 → **v72 起与「日历本管理」合并**：两行都落到 `calendar/calendars`
|
||||||
* ② 日历本管理 → `calendar/calendars`（改名/换色/共享/导入）
|
* （用 `#cal-books` 锚点区分落点，见下）
|
||||||
|
* ② 日历本管理 → `calendar/calendars`（显隐 + 改名/换色/共享/导入，全在一页）
|
||||||
* ③ 订阅管理 → `calendar/calendars#caldav`（只读订阅进来的外部日历）
|
* ③ 订阅管理 → `calendar/calendars#caldav`（只读订阅进来的外部日历）
|
||||||
* ④ DAV 口令 → `settings/me#dav`（日历 + 通讯录共用那一把）
|
* ④ DAV 口令 → `settings/me#dav`（日历 + 通讯录共用那一把）
|
||||||
*
|
*
|
||||||
|
* 🔴 v72（用户 2026-10-21）：「日历设置里面日历本显示和日历管理可以放在一起啊。
|
||||||
|
* 就是把日历本全都列出来，然后显示不显示，加个复选框就行了。」
|
||||||
|
* ⇒ ① 与 ② **现在是同一页**。但**四行都留着**，原因：
|
||||||
|
* · 用户 2026-10-15 第 6 条明确点名"下拉就是这四行"，少一行他会以为功能没了；
|
||||||
|
* · 两行落到同一页、用锚点定位到各自那一段 —— 点"显示设置"落在清单、
|
||||||
|
* 点"日历本管理"也落在清单，但**用户想找的东西就在那儿**，不用再跳。
|
||||||
|
* ⚠️ 千万别因为"合并了"就把菜单砍成三行：那是**把用户的入口拿走**，
|
||||||
|
* 而他这次要的是"放一起"，不是"少一个入口"。
|
||||||
|
*
|
||||||
* 用法（require 前 set 好）：
|
* 用法（require 前 set 好）：
|
||||||
* $setCurrent 当前页 key（'view'|'books'|'dav'）用来高亮；
|
* $setCurrent 当前页 key（'view'|'books'|'dav'）用来高亮；
|
||||||
* '' 也行（比如从旅程/观影页挂过来时没有当前项）
|
* '' 也行（比如从旅程/观影页挂过来时没有当前项）
|
||||||
@@ -57,7 +67,7 @@ $setIcon = static function (string $name): string {
|
|||||||
<div class="menu-list cal-set-list">
|
<div class="menu-list cal-set-list">
|
||||||
<?php /* ⚠️ 这里**只放列表**（不做任何表单）—— 见文件头那段「为什么必须这么改」。
|
<?php /* ⚠️ 这里**只放列表**（不做任何表单）—— 见文件头那段「为什么必须这么改」。
|
||||||
表单全在各自的目标页上；下拉绝不随"日历本数量"变长。 */ ?>
|
表单全在各自的目标页上；下拉绝不随"日历本数量"变长。 */ ?>
|
||||||
<a href="<?= e(url('calendar/display')) ?>"<?= $setOn('view') ?>><?= $setIcon('view') ?><span>显示设置</span></a>
|
<a href="<?= e(url('calendar/calendars')) ?>#cal-books"<?= $setOn('view') ?>><?= $setIcon('view') ?><span>显示设置</span></a>
|
||||||
<a href="<?= e(url('calendar/calendars')) ?>"<?= $setOn('books') ?>><?= $setIcon('books') ?><span>日历本管理</span></a>
|
<a href="<?= e(url('calendar/calendars')) ?>"<?= $setOn('books') ?>><?= $setIcon('books') ?><span>日历本管理</span></a>
|
||||||
<a href="<?= e(url('calendar/calendars')) ?>#caldav"<?= $setOn('sub') ?>><?= $setIcon('sub') ?><span>订阅管理</span></a>
|
<a href="<?= e(url('calendar/calendars')) ?>#caldav"<?= $setOn('sub') ?>><?= $setIcon('sub') ?><span>订阅管理</span></a>
|
||||||
<?php /* v24 第 22 批：口令改成通用 DAV 口令（日历 + 通讯录共用）。落到能**生成口令**的
|
<?php /* v24 第 22 批：口令改成通用 DAV 口令（日历 + 通讯录共用）。落到能**生成口令**的
|
||||||
|
|||||||
+345
-151
@@ -1,33 +1,91 @@
|
|||||||
<?php
|
<?php
|
||||||
/**
|
/**
|
||||||
* 日历本管理（v12）：建本 / 改名 / 换色 / 删除 / 共享给别人（只读或可写）。
|
* 日历本（v72 用户 2026-10-21）—— 「显示设置」与「日历本管理」**合并成一页**。
|
||||||
*
|
*
|
||||||
* ⚠️ 「观影」「旅行」两本是系统预置的，不能改名也不能删 ——
|
* 用户原话：
|
||||||
* 它们的日程是从观影模块与旅程模块实时汇总出来的，删掉就再也回不来了
|
* 「日历设置里面日历本显示和日历管理可以放在一起啊。就是把日历本全都列出来，
|
||||||
* （Calendar::delete 里也只删 kind='custom'，这里是同一道栅栏的界面侧）。
|
* 然后显示不显示，加个复选框就行了。另外把下面别人共享给我的也提到上面来，
|
||||||
|
* 把所有的日历都放在一块，只不过在后面标注出来，这个是别人谁谁谁共享给我的？
|
||||||
|
* 是只读的还是可写的，什么的就可以了呀。然后这样的话就是自己的可以改给编辑，
|
||||||
|
* 别人共享给我的，不让他编辑编辑就可以了。」
|
||||||
*
|
*
|
||||||
* @param array $cals 我自己的日历本（kind 任意）
|
* ─────────────────────────────────────────────────────────────────────
|
||||||
* @param array $shared 别人共享给我的
|
* 改之前是两页（v51 拆的）：
|
||||||
* @param array $people 名册（共享下拉用）
|
* · `calendar/display` —— 默认视图 + 「显示哪些日历本」（一堆复选框）
|
||||||
|
* · `calendar/calendars` —— 「我自己的」表格 + 页面最下面「别人共享给我的」小表格
|
||||||
|
* ⇒ 用户要在两个页面之间来回跳，才能回答"这本到底归谁、我要不要看见它"。
|
||||||
|
*
|
||||||
|
* 改成**一张清单**，每本日历一行，从左到右是一条完整的答案：
|
||||||
|
*
|
||||||
|
* [✓] ■ 名字 [谁共享给我的·只读] [共享设置] [编辑] [删除] [导出]
|
||||||
|
* │ │ │ │ │
|
||||||
|
* │ │ │ └ 归属与权限：我的本子这里空着（或只显示"系统"），
|
||||||
|
* │ │ │ 共享进来的写「谁共享·只读/可写」
|
||||||
|
* │ │ └ 名字
|
||||||
|
* │ └ 颜色（点一下就地改色 —— 见下面的「颜色」段）
|
||||||
|
* └ 显示/不显示（就是原来"显示设置"那堆复选框）
|
||||||
|
*
|
||||||
|
* 🔴 **共享给我的本子没有编辑/删除按钮**（用户明确要求「别人共享给我的，不让他编辑」）。
|
||||||
|
* 这不是"界面藏起来"而已：服务端 `cal_update` / `cal_del` 本来就校验
|
||||||
|
* `owner_id === $me`，所以即使手工构造请求也改不动。界面与服务端**两侧都拦**。
|
||||||
|
* ⚠️ 唯一例外是「共享设置」—— 那是我自己本子才有的；共享进来的本子由主人决定给谁，
|
||||||
|
* 我这里不该有那个入口。
|
||||||
|
*
|
||||||
|
* 🔴 **"显示/不显示"与"能不能编辑"是两件独立的事**：共享给我的只读本子，
|
||||||
|
* 我照样可以决定"显示不显示"（那只是我自己的视图偏好，不写对方的数据）。
|
||||||
|
* 所以复选框对**每一行**都在，包括共享进来的。
|
||||||
|
*
|
||||||
|
* ─────────────────────────────────────────────────────────────────────
|
||||||
|
* 变量：
|
||||||
|
* $cals 我**自己的**本子（含 perm='owner'）
|
||||||
|
* $shared 别人共享给我的
|
||||||
|
* $shares [calId => 共享给谁]（只对我自己的本子有意义）
|
||||||
|
* $hiddenCals 我关掉的那些本子 id
|
||||||
|
* $people 名册（共享下拉用）
|
||||||
|
* $editing 正在编辑的那一本（?edit=<id>）
|
||||||
*/
|
*/
|
||||||
$isEditing = !empty($editing);
|
$isEditing = !empty($editing);
|
||||||
$canWrite = \App\Auth::canWrite();
|
$canWrite = \App\Auth::canWrite();
|
||||||
|
$hiddenIds = array_map('intval', (array)($hiddenCals ?? []));
|
||||||
|
$cals = (array)($cals ?? []);
|
||||||
|
$shared = (array)($shared ?? []);
|
||||||
|
$backView = (string)($view ?? 'month');
|
||||||
|
|
||||||
|
/* 「所有的日历都放在一块」：先把"我的"排完，再排"共享给我的"。
|
||||||
|
⚠️ 两组的边界要在页面上**看得出来**（见下面的 `.cal-books-sep`），
|
||||||
|
但**仍然是同一张清单**（用户要的是"放一块"，不是"分两张表"）。 */
|
||||||
|
$allRows = [];
|
||||||
|
foreach ($cals as $c) {
|
||||||
|
$c['_mine'] = true;
|
||||||
|
$allRows[] = $c;
|
||||||
|
}
|
||||||
|
foreach ($shared as $c) {
|
||||||
|
$c['_mine'] = false;
|
||||||
|
$allRows[] = $c;
|
||||||
|
}
|
||||||
|
$totalCount = count($allRows);
|
||||||
?>
|
?>
|
||||||
<div class="page-head">
|
<div class="page-head">
|
||||||
<h1>日历本</h1>
|
<h1>日历本</h1>
|
||||||
<span class="sub">共 <?= count($cals) ?> 本<?= $shared ? '，别人共享给我 ' . count($shared) . ' 本' : '' ?></span>
|
<span class="sub">
|
||||||
|
共 <?= $totalCount ?> 本<?= $shared ? '（其中 ' . count($shared) . ' 本是别人共享给我的）' : '' ?>
|
||||||
|
</span>
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<a class="btn btn-ghost" href="<?= e(url('calendar')) ?>">返回日程</a>
|
<a class="btn btn-ghost" href="<?= e(url('calendar', ['view' => $backView])) ?>">返回日程</a>
|
||||||
<?php /* v51（用户第 6 条）：这一页 = 设置下拉里的「日历本管理」，
|
|
||||||
所以也挂上同一个 ☰（进去后这一项高亮）——
|
|
||||||
这样在四个设置页之间可以互相跳，不用先退回日程页。 */ ?>
|
|
||||||
<?php $setCurrent = 'books'; require __DIR__ . '/_settings_menu.php'; ?>
|
<?php $setCurrent = 'books'; require __DIR__ . '/_settings_menu.php'; ?>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php if (!$canWrite): ?>
|
<?php if (!$canWrite): ?>
|
||||||
<div class="card card-pad empty"><b>只读账号</b>访客只能查看日历本，不能新建或修改。</div>
|
<div class="card card-pad empty"><b>只读账号</b>访客只能查看日历本，不能新建或修改。</div>
|
||||||
<?php else: ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php /* ==================== 新建 / 编辑（仅自己的自定义本）====================
|
||||||
|
用户 2026-10-21 的新要求里没有动这块的形态，只要求"颜色选择别弹 Windows 框"。
|
||||||
|
⇒ 表单保留，但取色器换成内置的（`_color_picker.php`）。
|
||||||
|
⚠️ 共享进来的本子**永远进不了这个表单**：路由层只把 `kind='custom'` 且
|
||||||
|
`owner_id=$me` 的本子塞进 `$editing`（见 index.php `case 'calendar/calendars'`）。 */ ?>
|
||||||
|
<?php if ($canWrite): ?>
|
||||||
<div class="card card-pad">
|
<div class="card card-pad">
|
||||||
<h2 class="cinema-h2"><?= $isEditing ? '编辑日历本' : '新建日历本' ?></h2>
|
<h2 class="cinema-h2"><?= $isEditing ? '编辑日历本' : '新建日历本' ?></h2>
|
||||||
<form method="post" action="<?= e(url($isEditing ? 'calendar/cal_update' : 'calendar/cal_add')) ?>">
|
<form method="post" action="<?= e(url($isEditing ? 'calendar/cal_update' : 'calendar/cal_add')) ?>">
|
||||||
@@ -42,17 +100,15 @@ $canWrite = \App\Auth::canWrite();
|
|||||||
value="<?= e(old('name', $editing['name'] ?? '')) ?>" placeholder="如：体检 / 值日">
|
value="<?= e(old('name', $editing['name'] ?? '')) ?>" placeholder="如：体检 / 值日">
|
||||||
</div>
|
</div>
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label for="cb-color">颜色</label>
|
<label>颜色</label>
|
||||||
<div class="color-row">
|
<?php
|
||||||
<input type="color" id="cb-color" name="color" class="color-picker"
|
/* 🔴 v72：不再用 `<input type="color">`（会弹 Windows 系统取色框）。
|
||||||
value="<?= e(old('color', $editing['color'] ?? '#4A7C82')) ?>">
|
这里只出"按钮 + 隐藏域"，模态框在页尾统一放一份。 */
|
||||||
<span class="color-hex"><?= e(old('color', $editing['color'] ?? '#4A7C82')) ?></span>
|
$cpName = 'color';
|
||||||
<span class="preset-palette">
|
$cpValue = (string)old('color', $editing['color'] ?? '#4A7C82');
|
||||||
<?php foreach (\App\Calendar::PRESET_CAL_COLORS as $pc): ?>
|
$cpPalette = \App\Calendar::PRESET_CAL_COLORS;
|
||||||
<span class="preset-color" data-color="<?= $pc ?>" style="background: <?= $pc ?>;" title="<?= $pc ?>"></span>
|
require __DIR__ . '/../_color_picker.php';
|
||||||
<?php endforeach; ?>
|
?>
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-row">
|
<div class="btn-row">
|
||||||
@@ -65,109 +121,201 @@ $canWrite = \App\Auth::canWrite();
|
|||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<div class="card card-pad">
|
<?php /* ==================== 全部日历本（一张清单）====================
|
||||||
<h2 class="cinema-h2">我自己的</h2>
|
⚠️ 显隐与"保存"必须**在同一个表单里**：显隐是整页一次提交的批量操作，
|
||||||
<?php if (!$cals): ?>
|
"改名/换色"是单本一次提交（各自的小表单，`form=` 关联到行内那颗按钮）。
|
||||||
|
⚠️ HTML 表单**不能嵌套** ⇒ 下面每个"改色/删除"的小按钮用 `form="xxx"` 关联
|
||||||
|
到页尾的隐藏表单，而不是把 <form> 套进大表单里（套了就整个失效）。 */ ?>
|
||||||
|
<form method="post" action="<?= e(url('calendar/prefs')) ?>" class="cal-books-form" id="calBooksForm">
|
||||||
|
<?= csrf_field() ?>
|
||||||
|
<input type="hidden" name="back_view" value="<?= e($backView) ?>">
|
||||||
|
<?php /* ⚠️ 这个隐藏标记是**必须**的（从 v51 的显示设置页原样搬过来）：
|
||||||
|
HTML 里"一个都没勾"会让浏览器整个省掉 `show[]` 键，
|
||||||
|
服务端就分不清「用户想全关掉」与「这次请求没打算改显隐」——
|
||||||
|
没有它的话，将来任何只改默认视图的提交都会把所有日历本静默藏掉。 */ ?>
|
||||||
|
<input type="hidden" name="show_present" value="1">
|
||||||
|
|
||||||
|
<div class="card card-pad" id="cal-books">
|
||||||
|
<h2 class="cinema-h2">
|
||||||
|
全部日历本
|
||||||
|
<span class="hint">勾上就在日历里画出来；取消勾选只是不显示，数据都还在</span>
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<?php if (!$allRows): ?>
|
||||||
<p class="empty-hint">还没有日历本。</p>
|
<p class="empty-hint">还没有日历本。</p>
|
||||||
<?php else: ?>
|
<?php else: ?>
|
||||||
<div class="table-wrap">
|
<div class="cal-books">
|
||||||
<table class="table">
|
<?php foreach ($allRows as $i => $c): ?>
|
||||||
<thead>
|
<?php
|
||||||
<tr><th>名字</th><th>颜色</th><th>共享给</th><?php if ($canWrite): ?><th>操作</th><?php endif; ?></tr>
|
$cid = (int)$c['id'];
|
||||||
</thead>
|
$isMine = (bool)$c['_mine'];
|
||||||
<tbody>
|
$kind = (string)($c['kind'] ?? 'custom');
|
||||||
<?php foreach ($cals as $c): ?>
|
$isCustom = $kind === 'custom';
|
||||||
<tr>
|
$perm = (string)($c['perm'] ?? ($isMine ? 'owner' : 'read'));
|
||||||
<td>
|
$isShown = !in_array($cid, $hiddenIds, true);
|
||||||
<b><?= e((string)$c['name']) ?></b>
|
// 分组分隔线：从"我的"切到"共享给我的"时插一条
|
||||||
<?php if (($c['kind'] ?? '') !== 'custom'): ?>
|
$isFirstShared = (!$isMine && ($i === count($cals)));
|
||||||
<span class="node-badge">系统预置</span>
|
?>
|
||||||
|
<?php if ($isFirstShared): ?>
|
||||||
|
<div class="cal-books-sep">
|
||||||
|
<span>别人共享给我的</span>
|
||||||
|
<span class="cal-books-sep-note">只读的不能改，要改请找主人</span>
|
||||||
|
</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
</td>
|
|
||||||
<td>
|
<div class="cal-book-row<?= $isMine ? '' : ' is-shared' ?><?= $isShown ? '' : ' is-off' ?>"
|
||||||
<span class="color-preview" style="background: <?= e((string)$c['color']) ?>;"></span>
|
data-cal-row="<?= $cid ?>">
|
||||||
<span class="mono"><?= e((string)$c['color']) ?></span>
|
<?php /* ① 显示/不显示 —— 对**每一行**都在，包括共享进来的
|
||||||
</td>
|
（视图偏好是我自己的，不写对方数据）。 */ ?>
|
||||||
<td>
|
<label class="cal-book-show" title="<?= $isShown ? '取消勾选就不在日历里显示' : '勾上就在日历里显示' ?>">
|
||||||
<?php $sh = $shares[(int)$c['id']] ?? []; ?>
|
<input type="checkbox" name="show[]" value="<?= $cid ?>"
|
||||||
<?php if (!$sh): ?>
|
<?= $isShown ? 'checked' : '' ?>>
|
||||||
<span class="link-quiet">不共享</span>
|
<span class="sr-only">显示「<?= e((string)$c['name']) ?>」</span>
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<?php /* ② 颜色：**我的自定义本**点一下就就地改色（走内置调色模态框）；
|
||||||
|
其它情况只显示色块（系统本、共享本不许改色）。
|
||||||
|
🔴 系统本（观影/旅行）也不能改色：它们的内容是从模块实时派生的，
|
||||||
|
颜色是"模块色"的一部分，改了会与观影/旅程页对不上。
|
||||||
|
🔴 v72：这里用**独立模式**（`$cpName=''`）—— 值不带 name，
|
||||||
|
不参与上面那张大表单的提交。行内改色走 AJAX 单独落库。
|
||||||
|
原因：大表单提交的是"显隐"（`show[]`），如果每行还带一个
|
||||||
|
`name="color"`，一次提交就有 N 个同名 color，
|
||||||
|
服务端只拿最后一个 ⇒ 改成"最后一本的颜色套到所有行"。 */ ?>
|
||||||
|
<?php if ($canWrite && $isMine && $isCustom): ?>
|
||||||
|
<?php
|
||||||
|
$cpName = ''; // 独立模式：不提交
|
||||||
|
$cpValue = (string)$c['color'];
|
||||||
|
$cpId = 'calColor' . $cid;
|
||||||
|
$cpPalette = \App\Calendar::PRESET_CAL_COLORS;
|
||||||
|
$cpData = ['cal-id' => $cid];
|
||||||
|
$cpLabel = '改「' . (string)$c['name'] . '」的颜色';
|
||||||
|
require __DIR__ . '/../_color_picker.php';
|
||||||
|
?>
|
||||||
<?php else: ?>
|
<?php else: ?>
|
||||||
<div class="trip-people">
|
<span class="cal-book-dot" style="background: <?= e((string)$c['color']) ?>;"
|
||||||
|
title="<?= e((string)$c['color']) ?>"></span>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php /* ③ 名字 */ ?>
|
||||||
|
<span class="cal-book-name"><?= e((string)$c['name']) ?></span>
|
||||||
|
|
||||||
|
<?php /* ④ 归属与权限 —— 用户要的就是这一列：
|
||||||
|
「在后面标注出来，这个是别人谁谁谁共享给我的？是只读的还是可写的」 */ ?>
|
||||||
|
<span class="cal-book-tags">
|
||||||
|
<?php if ($isMine): ?>
|
||||||
|
<?php if (!$isCustom): ?>
|
||||||
|
<span class="node-badge node-badge-quiet">系统预置</span>
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php else: ?>
|
||||||
|
<?php
|
||||||
|
/* 共享过来的行里"人"的字段带前缀（owner_name / owner_nick），
|
||||||
|
不是 person_name() 直接认的 name / my_nickname —— 在这里适配一次。 */
|
||||||
|
$ownerName = person_name([
|
||||||
|
'name' => $c['owner_name'] ?? '',
|
||||||
|
'my_nickname' => $c['owner_nick'] ?? '',
|
||||||
|
]);
|
||||||
|
?>
|
||||||
|
<span class="cal-owner"><?= e($ownerName) ?> 共享给我</span>
|
||||||
|
<span class="node-badge <?= $perm === 'write' ? 'is-write' : 'is-read' ?>">
|
||||||
|
<?= $perm === 'write' ? '可写' : '只读' ?>
|
||||||
|
</span>
|
||||||
|
<?php endif; ?>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<?php /* ⑤ 操作 —— 共享进来的**一个都不给**（用户：「不让他编辑」）。
|
||||||
|
系统本只给"导出"：内容派生自观影/旅程，但导出来是合理的。 */ ?>
|
||||||
|
<span class="cal-book-acts">
|
||||||
|
<?php if (!$isMine): ?>
|
||||||
|
<span class="link-quiet">不可修改</span>
|
||||||
|
<?php else: ?>
|
||||||
|
<?php if ($canWrite && $people && $isCustom): ?>
|
||||||
|
<button type="button" class="link-quiet btn-inline"
|
||||||
|
data-cal-share-open
|
||||||
|
data-cal-id="<?= $cid ?>"
|
||||||
|
data-cal-name="<?= e((string)$c['name']) ?>">共享</button>
|
||||||
|
<?php endif; ?>
|
||||||
|
<a class="link-quiet" href="<?= e(url('calendar/export', ['id' => $cid])) ?>">导出</a>
|
||||||
|
<?php if ($canWrite && $isCustom): ?>
|
||||||
|
<a class="link-quiet"
|
||||||
|
href="<?= e(url('calendar/calendars', ['edit' => $cid])) ?>">编辑</a>
|
||||||
|
<form method="post" action="<?= e(url('calendar/cal_del')) ?>" class="inline-form"
|
||||||
|
onsubmit="return confirm('删除「<?= e((string)$c['name']) ?>」？本子里的日程会一起删掉。')">
|
||||||
|
<?= csrf_field() ?>
|
||||||
|
<input type="hidden" name="id" value="<?= $cid ?>">
|
||||||
|
<button class="link-quiet link-danger" type="submit">删除</button>
|
||||||
|
</form>
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php endif; ?>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<?php /* ⑥ 已共享给谁（只对我自己的本子有意义）—— 挪到第二行，
|
||||||
|
免得把主行的"名字 + 归属"挤成一团。 */ ?>
|
||||||
|
<?php if ($isMine && $canWrite): ?>
|
||||||
|
<?php $sh = $shares[$cid] ?? []; ?>
|
||||||
|
<?php if ($sh): ?>
|
||||||
|
<div class="cal-book-shares">
|
||||||
|
<span class="cal-book-shares-label">已共享给</span>
|
||||||
<?php foreach ($sh as $s): ?>
|
<?php foreach ($sh as $s): ?>
|
||||||
<?= person_chip($s) ?>
|
<?= person_chip($s) ?>
|
||||||
<span class="node-badge"><?= ($s['perm'] ?? '') === 'write' ? '可写' : '只读' ?></span>
|
<span class="node-badge"><?= ($s['perm'] ?? '') === 'write' ? '可写' : '只读' ?></span>
|
||||||
<?php /* 取消共享：**保留**（每个只是一张小表单，不含选人组件，
|
|
||||||
十几个也不需要优化）。原来它与"选人"一齐被关在
|
|
||||||
<details> 里，现在 <details> 撤了，这里就地给个按钮。 */ ?>
|
|
||||||
<?php if ($canWrite): ?>
|
|
||||||
<form class="inline-form" method="post" action="<?= e(url('calendar/cal_unshare')) ?>">
|
<form class="inline-form" method="post" action="<?= e(url('calendar/cal_unshare')) ?>">
|
||||||
<?= csrf_field() ?>
|
<?= csrf_field() ?>
|
||||||
<input type="hidden" name="id" value="<?= (int)$c['id'] ?>">
|
<input type="hidden" name="id" value="<?= $cid ?>">
|
||||||
<input type="hidden" name="person_id" value="<?= (int)$s['person_id'] ?>">
|
<input type="hidden" name="person_id" value="<?= (int)$s['person_id'] ?>">
|
||||||
<button class="btn btn-ghost btn-sm" type="submit"
|
<button class="link-quiet link-danger" type="submit"
|
||||||
title="取消共享给 <?= e(person_name($s)) ?>">取消</button>
|
title="取消共享给 <?= e(person_name($s)) ?>">取消</button>
|
||||||
</form>
|
</form>
|
||||||
<?php endif; ?>
|
|
||||||
<?php endforeach; ?>
|
<?php endforeach; ?>
|
||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
<?php if ($canWrite && $people): ?>
|
|
||||||
<?php /* 🔴🔴 v48（用户 2026-10-14 第 1 条：「设置日历本共享的时候，
|
|
||||||
弹出框特别慢，好像又是 bitwarden 的问题，需要再彻查一下。」）
|
|
||||||
真根因（线上门禁诊断页实测，不是猜）：
|
|
||||||
本页有 **12 本日历**，原来**每一本都内联一整套选人组件**，
|
|
||||||
而每个组件都把**全部 800 人**化成一份 JSON 与一份 noscript 兜底：
|
|
||||||
html_kb=5876.5, json_attr_kb=1586.8, noscript_kb=4137.8,
|
|
||||||
inputs=9657, labels=9593, pp_components=12
|
|
||||||
⇒ 整页 **5.9 MB / 近万个表单控件**，浏览器 + 密码管理器逐个扫描
|
|
||||||
⇒ "弹出框特别慢"。本地夹具造出同规模后首屏 **4.1 秒 / 9.3 MB**。
|
|
||||||
⚠️ 这**不是 Bitwarden 独有的问题**：任何遍历 `input` / 读整页 HTML
|
|
||||||
的扩展都会中招，Bitwarden 只是最典型的那个。
|
|
||||||
修法与**账目页 #ledPanels / 名册 #rosterMenus 同一套**（同一类问题
|
|
||||||
在这个项目里已经出现过两次，都是"把共享面板收成一份"解决的）：
|
|
||||||
行上只留一个**按钮**（带 data-* 标明是哪本日历），
|
|
||||||
真正的选人表单全页**只有一份**，放在页尾 #calSharePanel，
|
|
||||||
点按钮时把"日历 id / 名字"灌进去。 */ ?>
|
|
||||||
<button type="button" class="link-quiet btn-inline"
|
|
||||||
data-cal-share-open
|
|
||||||
data-cal-id="<?= (int)$c['id'] ?>"
|
|
||||||
data-cal-name="<?= e((string)$c['name']) ?>">共享设置</button>
|
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
</td>
|
</div>
|
||||||
<?php if ($canWrite): ?>
|
<?php endforeach; ?>
|
||||||
<td>
|
</div>
|
||||||
<div class="actions">
|
<?php endif; ?>
|
||||||
<?php /* v24 第 7 条：每本都能导出 .ics（预置本也能 —— 导的是派生出来的内容）。 */ ?>
|
|
||||||
<a class="btn btn-ghost btn-sm"
|
<p class="small muted" style="margin:12px 0 0">
|
||||||
href="<?= e(url('calendar/export', ['id' => (int)$c['id']])) ?>">导出 ics</a>
|
观影、旅行、有截止时间的任务会自动出现在这里，不用另建本子。
|
||||||
<?php if (($c['kind'] ?? '') === 'custom'): ?>
|
</p>
|
||||||
<a class="btn btn-ghost btn-sm"
|
|
||||||
href="<?= e(url('calendar/calendars', ['edit' => (int)$c['id']])) ?>">编辑</a>
|
<div class="btn-row" style="margin-top:14px">
|
||||||
<form method="post" action="<?= e(url('calendar/cal_del')) ?>"
|
<button class="btn" type="submit"<?= $canWrite ? '' : ' disabled' ?>>保存显示设置</button>
|
||||||
onsubmit="return confirm('删除「<?= e((string)$c['name']) ?>」？本子里的日程会一起删掉。')">
|
<a class="btn btn-ghost" href="<?= e(url('calendar', ['view' => $backView])) ?>">取消</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<?php /* 「默认打开时看哪个视图」—— 原来和"显示哪些日历本"挤在同一页（显示设置页），
|
||||||
|
现在日历本清单被合并到本页了，这条偏好也一起搬过来，否则它就成了
|
||||||
|
唯一一个还留在 `calendar/display` 的东西，用户又要多跳一次。
|
||||||
|
⚠️ 它**不在**上面那个大表单里（两个不同 action）⇒ 独立小表单。 */ ?>
|
||||||
|
<div class="card card-pad" style="margin-top:14px">
|
||||||
|
<h2 class="cinema-h2">默认打开时看
|
||||||
|
<span class="hint">打开日程页默认落在哪个视图</span></h2>
|
||||||
|
<form method="post" action="<?= e(url('calendar/prefs')) ?>">
|
||||||
<?= csrf_field() ?>
|
<?= csrf_field() ?>
|
||||||
<input type="hidden" name="id" value="<?= (int)$c['id'] ?>">
|
<input type="hidden" name="back_view" value="<?= e($backView) ?>">
|
||||||
<button class="btn btn-danger btn-sm" type="submit">删除</button>
|
<?php /* ⚠️ **不能**带 `show_present`：不带 ⇒ 服务端不碰显隐（见 index.php 那段注释）。
|
||||||
</form>
|
带了又不带 `show[]` = "把所有本子都藏起来" —— 那是个灾难性副作用。 */ ?>
|
||||||
<?php else: ?>
|
<div class="cal-set-views">
|
||||||
<span class="link-quiet">不可改</span>
|
<?php foreach (\App\Calendar::VIEWS as $vk => $vw): ?>
|
||||||
<?php endif; ?>
|
<label class="cal-set-view">
|
||||||
</div>
|
<input type="radio" name="view" value="<?= e($vk) ?>"
|
||||||
</td>
|
<?= \App\Calendar::defaultView((int)\App\Auth::personId()) === $vk ? 'checked' : '' ?>>
|
||||||
<?php endif; ?>
|
<span><?= e($vw) ?>视图</span>
|
||||||
</tr>
|
</label>
|
||||||
<?php endforeach; ?>
|
<?php endforeach; ?>
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<div class="btn-row" style="margin-top:12px">
|
||||||
|
<button class="btn btn-sm" type="submit"<?= $canWrite ? '' : ' disabled' ?>>保存默认视图</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php if ($canWrite): ?>
|
<?php if ($canWrite): ?>
|
||||||
<?php /* v24 第 7 条：把一个 .ics 文件里的日程整批导进某一本。
|
<?php /* v24 第 7 条：把一个 .ics 文件里的日程整批导进某一本。
|
||||||
只能导进自定义本 —— 观影/旅行两本是派生的，塞进去就成了孤儿日程
|
只能导进自定义本 —— 观影/旅行两本是派生的，塞进去就成了孤儿日程。 */ ?>
|
||||||
（日历里有、观影列表里没有）。 */ ?>
|
|
||||||
<div class="card card-pad">
|
<div class="card card-pad">
|
||||||
<h2 class="cinema-h2">
|
<h2 class="cinema-h2">
|
||||||
导入 ics
|
导入 ics
|
||||||
@@ -191,14 +339,8 @@ $canWrite = \App\Auth::canWrite();
|
|||||||
</div>
|
</div>
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label for="im-file">.ics 文件 *</label>
|
<label for="im-file">.ics 文件 *</label>
|
||||||
<?php /* 🔴 v30 用户第 1 条：$sdStage = false —— 导入型上传**不走暂存**。
|
<?php /* 🔴 v30 用户第 1 条：$sdStage = false —— 导入型上传**不走暂存**。 */ ?>
|
||||||
用户原话：「这个文件导入之后，以后应该就不会再访问它…把它上传到服务器上
|
<?php
|
||||||
个临时目录里面，把数据读出来之后，写入到我们的日程的数据库表中，
|
|
||||||
然后再把这个文件删除就可以了。」
|
|
||||||
⇒ 文件走 PHP 自带的临时文件（$_FILES['ics']['tmp_name']），
|
|
||||||
路由读完即弃；不落存储、不建附件行、不进 OSS。
|
|
||||||
⚠️ 走暂存模式时 `<input>.files` 始终是空的 → 带 required 的提交会被
|
|
||||||
浏览器原生校验拦下，弹「请选择一个文本。」（用户报的就是这句）。 */
|
|
||||||
$sdName = 'ics'; $sdId = 'im-file'; $sdAccept = '.ics,text/calendar';
|
$sdName = 'ics'; $sdId = 'im-file'; $sdAccept = '.ics,text/calendar';
|
||||||
$sdMultiple = false; $sdRequired = true; $sdStage = false;
|
$sdMultiple = false; $sdRequired = true; $sdStage = false;
|
||||||
require __DIR__ . '/../_stage_drop.php'; ?>
|
require __DIR__ . '/../_stage_drop.php'; ?>
|
||||||
@@ -211,12 +353,7 @@ $canWrite = \App\Auth::canWrite();
|
|||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<?php /* v24 第 7 条后半：CalDAV —— 把我的日历本订阅到手机/别的日历程序里。
|
<?php /* v24 第 7 条后半：CalDAV —— 把我的日历本订阅到手机/别的日历程序里。 */ ?>
|
||||||
v24 第 22 批：口令改成**通用 DAV 口令**（日历 + 通讯录共用一把），
|
|
||||||
管理入口也搬到了「个人设置 → DAV 同步」—— 这里只留地址与一个指路按钮。
|
|
||||||
⚠️ 这一页**不再有**生成/撤销表单：同一个口令在两处各放一套按钮，
|
|
||||||
迟早出现"在这里重置了、那页还显示已配置"的对不上（而且密码类的东西
|
|
||||||
有两个入口本身就是坏味道）。 */ ?>
|
|
||||||
<div class="card card-pad" id="caldav">
|
<div class="card card-pad" id="caldav">
|
||||||
<h2 class="cinema-h2">
|
<h2 class="cinema-h2">
|
||||||
CalDAV 订阅
|
CalDAV 订阅
|
||||||
@@ -241,42 +378,13 @@ $canWrite = \App\Auth::canWrite();
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</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; ?>
|
|
||||||
|
|
||||||
<?php /* ==================== 共享设置：全页**唯一**一份（v48）====================
|
<?php /* ==================== 共享设置：全页**唯一**一份（v48）====================
|
||||||
与账目页 #ledPanels、名册 #rosterMenus 同一套思路：行上只留一个按钮，
|
与账目页 #ledPanels、名册 #rosterMenus 同一套思路：行上只留一个按钮，
|
||||||
真正的选人表单集中在这里。
|
真正的选人表单集中在这里。
|
||||||
|
|
||||||
🔴 为什么必须只有一份（用户 2026-10-14 第 1 条「弹出框特别慢」的真根因）：
|
🔴 为什么必须只有一份（用户 2026-10-14 第 1 条「弹出框特别慢」的真根因）：
|
||||||
原来**每本日历**都内联一套 `_person_picker`，而每个组件都把全部 800 人
|
原来**每本日历**都内联一套 `_person_picker`，而每个组件都把全部 800 人
|
||||||
化成 JSON + `<noscript>` 兜底。12 本 ⇒ 整页 5.9 MB / 近万个 input
|
化成 JSON + `<noscript>` 兜底。12 本 ⇒ 整页 5.9 MB / 近万个 input
|
||||||
⇒ 浏览器与密码管理器逐个扫描，慢得能感觉到。
|
⇒ 浏览器与密码管理器逐个扫描，慢得能感觉到。 */ ?>
|
||||||
收成一份之后：**一整套选人组件**（1 份 JSON + 1 份 noscript），
|
|
||||||
与日历本数无关 —— 再多本日历页也不会再变大。
|
|
||||||
|
|
||||||
⚠️ 选人组件是**单选**（`$ppMode='single'`）：行上按钮被点开时，用
|
|
||||||
`window.ppSetSelected('person_id', 0, panel)` 把它重置成"未选"，
|
|
||||||
再让用户挑 —— 否则上一次挑的人会留在表单里（看着像"已经选好了"）。 */ ?>
|
|
||||||
<?php if ($canWrite && $people): ?>
|
<?php if ($canWrite && $people): ?>
|
||||||
<div class="cal-modal" id="calSharePanel" hidden role="dialog" aria-modal="true"
|
<div class="cal-modal" id="calSharePanel" hidden role="dialog" aria-modal="true"
|
||||||
aria-label="共享日历本">
|
aria-label="共享日历本">
|
||||||
@@ -311,9 +419,7 @@ $canWrite = \App\Auth::canWrite();
|
|||||||
</form>
|
</form>
|
||||||
<div class="cal-modal-foot">
|
<div class="cal-modal-foot">
|
||||||
<?php /* ⚠️ 用 `form="calShareForm"` **显式关联**（表单在 .cal-modal-body 里、
|
<?php /* ⚠️ 用 `form="calShareForm"` **显式关联**（表单在 .cal-modal-body 里、
|
||||||
按钮在 .cal-modal-foot 里，不是同一个父节点）。原来写成 `form=""` 是
|
按钮在 .cal-modal-foot 里，不是同一个父节点）。 */ ?>
|
||||||
**无效值**（空串不等于任何表单 id），点了不提交 —— 与 v37 日程弹框
|
|
||||||
那次"按钮看不到"同一类 DOM 结构坑。id 由下面的脚本赋上（避免与别处撞名）。 */ ?>
|
|
||||||
<button class="btn btn-sm" type="submit" form="calShareForm">共享</button>
|
<button class="btn btn-sm" type="submit" form="calShareForm">共享</button>
|
||||||
<button class="btn btn-ghost btn-sm" type="button" data-cal-share-close>取消</button>
|
<button class="btn btn-ghost btn-sm" type="button" data-cal-share-close>取消</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -354,3 +460,91 @@ $canWrite = \App\Auth::canWrite();
|
|||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php /* ==================== 行内改色：AJAX 单独落库（v72）====================
|
||||||
|
模态框选完颜色只会改**隐藏域的值**并派发 `cp:change`，真正落库在这里。
|
||||||
|
|
||||||
|
🔴 为什么走 AJAX 而不是"顺手提交一下表单"：
|
||||||
|
本页那张大表单管的是**显隐**（`show[]`，整页一次提交）。
|
||||||
|
如果改个颜色就整页提交，用户刚勾掉/勾上的复选框会跟着一起生效 ——
|
||||||
|
他本来只想换个色，结果显隐也被保存了，这叫"顺手改了别的东西"。
|
||||||
|
而且整页刷新会把滚动位置丢掉（日历本可能有几十本）。
|
||||||
|
⇒ 只发这一本的颜色，只刷这一行，其它什么都不动。
|
||||||
|
|
||||||
|
🔴 服务端仍然要校验"这本是不是我的、是不是 custom"（`cal_update` 里本来就有），
|
||||||
|
这里不做"信任前端"的假设。失败时把按钮恢复成旧颜色并提示。 */ ?>
|
||||||
|
<script>
|
||||||
|
(function () {
|
||||||
|
var form = document.getElementById('calBooksForm');
|
||||||
|
if (!form) { return; }
|
||||||
|
|
||||||
|
var endpoint = <?= json_encode(url('calendar/cal_color'), JSON_UNESCAPED_UNICODE) ?>;
|
||||||
|
var csrf = <?= json_encode(csrf_token(), JSON_UNESCAPED_UNICODE) ?>;
|
||||||
|
|
||||||
|
function toast(msg, isErr) {
|
||||||
|
// 极简提示：本页没有全局 toast，插一条 2.6 秒后自己消失的浮条
|
||||||
|
var el = document.createElement('div');
|
||||||
|
el.className = 'cp-toast' + (isErr ? ' is-err' : '');
|
||||||
|
el.textContent = msg;
|
||||||
|
document.body.appendChild(el);
|
||||||
|
setTimeout(function () {
|
||||||
|
el.classList.add('is-out');
|
||||||
|
setTimeout(function () { el.remove(); }, 300);
|
||||||
|
}, 2600);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('cp:change', function (e) {
|
||||||
|
var d = e.detail || {};
|
||||||
|
var field = d.field;
|
||||||
|
if (!field) { return; }
|
||||||
|
var calId = field.getAttribute('data-cal-id');
|
||||||
|
if (!calId) { return; } // 不是日历本行上的调色器（比如新建表单）
|
||||||
|
|
||||||
|
var dot = field.querySelector('.cp-trigger-dot');
|
||||||
|
var old = d.old || '';
|
||||||
|
|
||||||
|
var body = new FormData();
|
||||||
|
/* 🔴 键名必须是 `_csrf` —— 服务端读的是 `$_POST['_csrf']`（见 helpers 的 csrf_field）。
|
||||||
|
写成 'csrf' 的后果是**每一次都被判"页面已过期"**（419），
|
||||||
|
而前端只会把它当"改颜色没成功"，用户看到的就是"改了但没保存"。 */
|
||||||
|
body.append('_csrf', csrf);
|
||||||
|
body.append('id', calId);
|
||||||
|
body.append('color', d.value);
|
||||||
|
|
||||||
|
fetch(endpoint, {
|
||||||
|
method: 'POST',
|
||||||
|
body: body,
|
||||||
|
credentials: 'same-origin',
|
||||||
|
headers: { 'X-Requested-With': 'fetch' }
|
||||||
|
}).then(function (r) {
|
||||||
|
return r.json().catch(function () { return { ok: false }; });
|
||||||
|
}).then(function (j) {
|
||||||
|
if (!j || !j.ok) {
|
||||||
|
// 回滚：值、色块都退回去，别让页面显示一个数据库里没有的颜色
|
||||||
|
var inp = document.getElementById(d.id);
|
||||||
|
if (inp) { inp.value = old; }
|
||||||
|
var txt = field.querySelector('.cp-trigger-hex');
|
||||||
|
if (txt) { txt.textContent = old; }
|
||||||
|
if (dot) { dot.style.background = old; }
|
||||||
|
toast((j && j.error) || '改颜色没成功，再试一次', true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
toast('颜色已改');
|
||||||
|
}).catch(function () {
|
||||||
|
var inp = document.getElementById(d.id);
|
||||||
|
if (inp) { inp.value = old; }
|
||||||
|
var txt = field.querySelector('.cp-trigger-hex');
|
||||||
|
if (txt) { txt.textContent = old; }
|
||||||
|
if (dot) { dot.style.background = old; }
|
||||||
|
toast('网络不通，颜色没保存', true);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<?php /* 页尾：内置调色模态框（全页**唯一**一份） */ ?>
|
||||||
|
<?php $cpPalette = \App\Calendar::PRESET_CAL_COLORS;
|
||||||
|
$cpModalTitle = '选个颜色';
|
||||||
|
require __DIR__ . '/../_color_picker_modal.php'; ?>
|
||||||
|
|
||||||
|
<?php unset($allRows, $cals, $shared, $hiddenIds, $backView, $canWrite, $totalCount, $isEditing); ?>
|
||||||
@@ -1,99 +0,0 @@
|
|||||||
<?php
|
|
||||||
/**
|
|
||||||
* 日程「显示设置」——一页只放**个人显示偏好**（v51 用户 2026-10-15 第 6 条）。
|
|
||||||
*
|
|
||||||
* 用户原话：
|
|
||||||
* 「日程的设置，拉下来之后，先是默认打开时的视图，然后还有显示哪些日历本，
|
|
||||||
* 下面是那个设置。应该把这些设置都**放在另外一个页面**里面。因为如果日历本特别多的时候，
|
|
||||||
* 它拉下来会非常长，下面的设置就看不到了，要拉下来才能看到。
|
|
||||||
* 所以点开这个设置之后啊，仍然和其他的设置页面一样，是几个，是一个列表。
|
|
||||||
* 第一个就是**显示设置**，把默认是打开看什么视图和显示哪些日历本放在另外一个页面，
|
|
||||||
* 专门用来设置显示。然后紧接着就是**日历本管理**，再下面是**订阅管理**，
|
|
||||||
* 再下面是 **Dev（DAV）口令**。」
|
|
||||||
*
|
|
||||||
* ⇒ 结构（与旅程/观影/任务模块的"设置下拉 = 一串列表页"完全一致）：
|
|
||||||
* ☰ 下拉里只有四行：显示设置 / 日历本管理 / 订阅管理 / DAV 口令
|
|
||||||
* · 本模板 = **第一行进去的那页**（默认视图 + 显示哪些日历本）；
|
|
||||||
* · 其余三行各自去既有页面（calendar/calendars 的对应区块）。
|
|
||||||
*
|
|
||||||
* ⚠️ 为什么必须单独成页（用户给了理由，值得照抄）：日历本可能有几十本，
|
|
||||||
* 原来把它们**铺在下拉里**，下拉就会拉到屏幕外面去，
|
|
||||||
* 排在后面的"日历本管理 / 订阅 / 口令"全被挤到看不见的地方 ——
|
|
||||||
* 用户原话"下面的设置就看不到了，要拉下来才能看到"。
|
|
||||||
* 挪进独立页面后，下拉永远只有四行（高度恒定），点进去再看长长的一列。
|
|
||||||
*
|
|
||||||
* 变量：
|
|
||||||
* $cals 我可见的日历本（含 perm / color / kind / shared）
|
|
||||||
* $hiddenCals 我关掉的那些本子 id
|
|
||||||
* $view / $anchor 回跳用（保持当前视图与锚定日）
|
|
||||||
*/
|
|
||||||
$canWrite = \App\Auth::canWrite();
|
|
||||||
$myCals = (array)($cals ?? []);
|
|
||||||
$hiddenIds = array_map('intval', (array)($hiddenCals ?? []));
|
|
||||||
$backView = (string)($view ?? 'month');
|
|
||||||
$me = (int)\App\Auth::personId();
|
|
||||||
?>
|
|
||||||
<div class="page-head">
|
|
||||||
<h1>显示设置</h1>
|
|
||||||
<span class="sub">默认看哪个视图、日历上显示哪几本</span>
|
|
||||||
<div class="actions">
|
|
||||||
<a class="btn btn-ghost" href="<?= e(url('calendar', ['view' => $backView])) ?>">返回日程</a>
|
|
||||||
<?php $setCurrent = 'view'; require __DIR__ . '/_settings_menu.php'; ?>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<form method="post" action="<?= e(url('calendar/prefs')) ?>" class="cal-set-page">
|
|
||||||
<?= csrf_field() ?>
|
|
||||||
<input type="hidden" name="back_view" value="<?= e($backView) ?>">
|
|
||||||
<?php /* ⚠️ 这个隐藏标记是**必须**的（从原来的下拉里原样搬过来）：
|
|
||||||
HTML 里"一个都没勾"会让浏览器整个省掉 `show[]` 键，
|
|
||||||
服务端就分不清「用户想全关掉」与「这次请求没打算改显隐」——
|
|
||||||
没有它的话，将来任何只改默认视图的提交都会把所有日历本静默藏掉。 */ ?>
|
|
||||||
<input type="hidden" name="show_present" value="1">
|
|
||||||
|
|
||||||
<div class="card card-pad">
|
|
||||||
<h2 class="cinema-h2">默认打开时看
|
|
||||||
<span class="hint">打开日程页默认落在哪个视图</span></h2>
|
|
||||||
<div class="cal-set-views">
|
|
||||||
<?php foreach (\App\Calendar::VIEWS as $vk => $vw): ?>
|
|
||||||
<label class="cal-set-view">
|
|
||||||
<input type="radio" name="view" value="<?= e($vk) ?>"
|
|
||||||
<?= \App\Calendar::defaultView($me) === $vk ? 'checked' : '' ?>>
|
|
||||||
<span><?= e($vw) ?>视图</span>
|
|
||||||
</label>
|
|
||||||
<?php endforeach; ?>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="card card-pad" style="margin-top:14px">
|
|
||||||
<h2 class="cinema-h2">显示哪些日历本
|
|
||||||
<span class="hint">关掉的本子只是不在日历上画出来，数据都还在</span></h2>
|
|
||||||
<?php if (!$myCals): ?>
|
|
||||||
<p class="small muted" style="margin:0">还没有日历本。</p>
|
|
||||||
<?php else: ?>
|
|
||||||
<div class="cal-set-books">
|
|
||||||
<?php foreach ($myCals as $c): $cid = (int)$c['id']; ?>
|
|
||||||
<label class="cal-set-book">
|
|
||||||
<input type="checkbox" name="show[]" value="<?= $cid ?>"
|
|
||||||
<?= in_array($cid, $hiddenIds, true) ? '' : 'checked' ?>>
|
|
||||||
<span class="color-preview" style="background: <?= e((string)$c['color']) ?>;"></span>
|
|
||||||
<span class="cal-name"><?= e((string)$c['name']) ?></span>
|
|
||||||
<?php if ((string)$c['kind'] !== 'custom'): ?>
|
|
||||||
<span class="node-badge">系统</span>
|
|
||||||
<?php elseif ((int)$c['shared'] === 1): ?>
|
|
||||||
<span class="node-badge"><?= ($c['perm'] ?? '') === 'write' ? '共享·可写' : '共享·只读' ?></span>
|
|
||||||
<?php endif; ?>
|
|
||||||
</label>
|
|
||||||
<?php endforeach; ?>
|
|
||||||
</div>
|
|
||||||
<?php endif; ?>
|
|
||||||
<p class="small muted" style="margin:10px 0 0">
|
|
||||||
观影、旅行、有截止时间的任务会自动出现在这里，不用另建本子。
|
|
||||||
</p>
|
|
||||||
<div class="btn-row" style="margin-top:14px">
|
|
||||||
<button class="btn" type="submit"<?= $canWrite ? '' : ' disabled' ?>>保存显示设置</button>
|
|
||||||
<a class="btn btn-ghost" href="<?= e(url('calendar', ['view' => $backView])) ?>">取消</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
<?php unset($myCals, $hiddenIds, $backView, $me, $canWrite); ?>
|
|
||||||
Reference in New Issue
Block a user