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:
@@ -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`（默认视图 + 显示哪些本子）★ 本批新增的独立页
|
||||
* ② 日历本管理 → `calendar/calendars`（改名/换色/共享/导入）
|
||||
* ① 显示设置 → **v72 起与「日历本管理」合并**：两行都落到 `calendar/calendars`
|
||||
* （用 `#cal-books` 锚点区分落点，见下）
|
||||
* ② 日历本管理 → `calendar/calendars`（显隐 + 改名/换色/共享/导入，全在一页）
|
||||
* ③ 订阅管理 → `calendar/calendars#caldav`（只读订阅进来的外部日历）
|
||||
* ④ DAV 口令 → `settings/me#dav`（日历 + 通讯录共用那一把）
|
||||
*
|
||||
* 🔴 v72（用户 2026-10-21）：「日历设置里面日历本显示和日历管理可以放在一起啊。
|
||||
* 就是把日历本全都列出来，然后显示不显示，加个复选框就行了。」
|
||||
* ⇒ ① 与 ② **现在是同一页**。但**四行都留着**，原因：
|
||||
* · 用户 2026-10-15 第 6 条明确点名"下拉就是这四行"，少一行他会以为功能没了；
|
||||
* · 两行落到同一页、用锚点定位到各自那一段 —— 点"显示设置"落在清单、
|
||||
* 点"日历本管理"也落在清单，但**用户想找的东西就在那儿**，不用再跳。
|
||||
* ⚠️ 千万别因为"合并了"就把菜单砍成三行：那是**把用户的入口拿走**，
|
||||
* 而他这次要的是"放一起"，不是"少一个入口"。
|
||||
*
|
||||
* 用法（require 前 set 好）：
|
||||
* $setCurrent 当前页 key（'view'|'books'|'dav'）用来高亮；
|
||||
* '' 也行（比如从旅程/观影页挂过来时没有当前项）
|
||||
@@ -57,7 +67,7 @@ $setIcon = static function (string $name): string {
|
||||
<div class="menu-list cal-set-list">
|
||||
<?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')) ?>#caldav"<?= $setOn('sub') ?>><?= $setIcon('sub') ?><span>订阅管理</span></a>
|
||||
<?php /* v24 第 22 批：口令改成通用 DAV 口令（日历 + 通讯录共用）。落到能**生成口令**的
|
||||
|
||||
+363
-169
@@ -1,33 +1,91 @@
|
||||
<?php
|
||||
/**
|
||||
* 日历本管理（v12）：建本 / 改名 / 换色 / 删除 / 共享给别人（只读或可写）。
|
||||
* 日历本（v72 用户 2026-10-21）—— 「显示设置」与「日历本管理」**合并成一页**。
|
||||
*
|
||||
* ⚠️ 「观影」「旅行」两本是系统预置的，不能改名也不能删 ——
|
||||
* 它们的日程是从观影模块与旅程模块实时汇总出来的，删掉就再也回不来了
|
||||
* （Calendar::delete 里也只删 kind='custom'，这里是同一道栅栏的界面侧）。
|
||||
* 用户原话：
|
||||
* 「日历设置里面日历本显示和日历管理可以放在一起啊。就是把日历本全都列出来，
|
||||
* 然后显示不显示，加个复选框就行了。另外把下面别人共享给我的也提到上面来，
|
||||
* 把所有的日历都放在一块，只不过在后面标注出来，这个是别人谁谁谁共享给我的？
|
||||
* 是只读的还是可写的，什么的就可以了呀。然后这样的话就是自己的可以改给编辑，
|
||||
* 别人共享给我的，不让他编辑编辑就可以了。」
|
||||
*
|
||||
* @param array $cals 我自己的日历本（kind 任意）
|
||||
* @param array $shared 别人共享给我的
|
||||
* @param array $people 名册（共享下拉用）
|
||||
* ─────────────────────────────────────────────────────────────────────
|
||||
* 改之前是两页（v51 拆的）：
|
||||
* · `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);
|
||||
$canWrite = \App\Auth::canWrite();
|
||||
$isEditing = !empty($editing);
|
||||
$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">
|
||||
<h1>日历本</h1>
|
||||
<span class="sub">共 <?= count($cals) ?> 本<?= $shared ? '，别人共享给我 ' . count($shared) . ' 本' : '' ?></span>
|
||||
<span class="sub">
|
||||
共 <?= $totalCount ?> 本<?= $shared ? '（其中 ' . count($shared) . ' 本是别人共享给我的）' : '' ?>
|
||||
</span>
|
||||
<div class="actions">
|
||||
<a class="btn btn-ghost" href="<?= e(url('calendar')) ?>">返回日程</a>
|
||||
<?php /* v51（用户第 6 条）：这一页 = 设置下拉里的「日历本管理」，
|
||||
所以也挂上同一个 ☰（进去后这一项高亮）——
|
||||
这样在四个设置页之间可以互相跳，不用先退回日程页。 */ ?>
|
||||
<a class="btn btn-ghost" href="<?= e(url('calendar', ['view' => $backView])) ?>">返回日程</a>
|
||||
<?php $setCurrent = 'books'; require __DIR__ . '/_settings_menu.php'; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if (!$canWrite): ?>
|
||||
<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">
|
||||
<h2 class="cinema-h2"><?= $isEditing ? '编辑日历本' : '新建日历本' ?></h2>
|
||||
<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="如：体检 / 值日">
|
||||
</div>
|
||||
<div class="field">
|
||||
<label for="cb-color">颜色</label>
|
||||
<div class="color-row">
|
||||
<input type="color" id="cb-color" name="color" class="color-picker"
|
||||
value="<?= e(old('color', $editing['color'] ?? '#4A7C82')) ?>">
|
||||
<span class="color-hex"><?= e(old('color', $editing['color'] ?? '#4A7C82')) ?></span>
|
||||
<span class="preset-palette">
|
||||
<?php foreach (\App\Calendar::PRESET_CAL_COLORS as $pc): ?>
|
||||
<span class="preset-color" data-color="<?= $pc ?>" style="background: <?= $pc ?>;" title="<?= $pc ?>"></span>
|
||||
<?php endforeach; ?>
|
||||
</span>
|
||||
</div>
|
||||
<label>颜色</label>
|
||||
<?php
|
||||
/* 🔴 v72：不再用 `<input type="color">`（会弹 Windows 系统取色框）。
|
||||
这里只出"按钮 + 隐藏域"，模态框在页尾统一放一份。 */
|
||||
$cpName = 'color';
|
||||
$cpValue = (string)old('color', $editing['color'] ?? '#4A7C82');
|
||||
$cpPalette = \App\Calendar::PRESET_CAL_COLORS;
|
||||
require __DIR__ . '/../_color_picker.php';
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-row">
|
||||
@@ -65,109 +121,201 @@ $canWrite = \App\Auth::canWrite();
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="card card-pad">
|
||||
<h2 class="cinema-h2">我自己的</h2>
|
||||
<?php if (!$cals): ?>
|
||||
<p class="empty-hint">还没有日历本。</p>
|
||||
<?php else: ?>
|
||||
<div class="table-wrap">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr><th>名字</th><th>颜色</th><th>共享给</th><?php if ($canWrite): ?><th>操作</th><?php endif; ?></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($cals as $c): ?>
|
||||
<tr>
|
||||
<td>
|
||||
<b><?= e((string)$c['name']) ?></b>
|
||||
<?php if (($c['kind'] ?? '') !== 'custom'): ?>
|
||||
<span class="node-badge">系统预置</span>
|
||||
<?php /* ==================== 全部日历本（一张清单）====================
|
||||
⚠️ 显隐与"保存"必须**在同一个表单里**：显隐是整页一次提交的批量操作，
|
||||
"改名/换色"是单本一次提交（各自的小表单，`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>
|
||||
<?php else: ?>
|
||||
<div class="cal-books">
|
||||
<?php foreach ($allRows as $i => $c): ?>
|
||||
<?php
|
||||
$cid = (int)$c['id'];
|
||||
$isMine = (bool)$c['_mine'];
|
||||
$kind = (string)($c['kind'] ?? 'custom');
|
||||
$isCustom = $kind === 'custom';
|
||||
$perm = (string)($c['perm'] ?? ($isMine ? 'owner' : 'read'));
|
||||
$isShown = !in_array($cid, $hiddenIds, true);
|
||||
// 分组分隔线：从"我的"切到"共享给我的"时插一条
|
||||
$isFirstShared = (!$isMine && ($i === count($cals)));
|
||||
?>
|
||||
<?php if ($isFirstShared): ?>
|
||||
<div class="cal-books-sep">
|
||||
<span>别人共享给我的</span>
|
||||
<span class="cal-books-sep-note">只读的不能改，要改请找主人</span>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="cal-book-row<?= $isMine ? '' : ' is-shared' ?><?= $isShown ? '' : ' is-off' ?>"
|
||||
data-cal-row="<?= $cid ?>">
|
||||
<?php /* ① 显示/不显示 —— 对**每一行**都在，包括共享进来的
|
||||
（视图偏好是我自己的，不写对方数据）。 */ ?>
|
||||
<label class="cal-book-show" title="<?= $isShown ? '取消勾选就不在日历里显示' : '勾上就在日历里显示' ?>">
|
||||
<input type="checkbox" name="show[]" value="<?= $cid ?>"
|
||||
<?= $isShown ? 'checked' : '' ?>>
|
||||
<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: ?>
|
||||
<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; ?>
|
||||
</td>
|
||||
<td>
|
||||
<span class="color-preview" style="background: <?= e((string)$c['color']) ?>;"></span>
|
||||
<span class="mono"><?= e((string)$c['color']) ?></span>
|
||||
</td>
|
||||
<td>
|
||||
<?php $sh = $shares[(int)$c['id']] ?? []; ?>
|
||||
<?php if (!$sh): ?>
|
||||
<span class="link-quiet">不共享</span>
|
||||
<?php else: ?>
|
||||
<div class="trip-people">
|
||||
<?php foreach ($sh as $s): ?>
|
||||
<?= person_chip($s) ?>
|
||||
<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')) ?>">
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="id" value="<?= (int)$c['id'] ?>">
|
||||
<input type="hidden" name="person_id" value="<?= (int)$s['person_id'] ?>">
|
||||
<button class="btn btn-ghost btn-sm" type="submit"
|
||||
title="取消共享给 <?= e(person_name($s)) ?>">取消</button>
|
||||
</form>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?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 / 名字"灌进去。 */ ?>
|
||||
<?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="<?= (int)$c['id'] ?>"
|
||||
data-cal-name="<?= e((string)$c['name']) ?>">共享设置</button>
|
||||
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; ?>
|
||||
</td>
|
||||
<?php if ($canWrite): ?>
|
||||
<td>
|
||||
<div class="actions">
|
||||
<?php /* v24 第 7 条：每本都能导出 .ics（预置本也能 —— 导的是派生出来的内容）。 */ ?>
|
||||
<a class="btn btn-ghost btn-sm"
|
||||
href="<?= e(url('calendar/export', ['id' => (int)$c['id']])) ?>">导出 ics</a>
|
||||
<?php if (($c['kind'] ?? '') === 'custom'): ?>
|
||||
<a class="btn btn-ghost btn-sm"
|
||||
href="<?= e(url('calendar/calendars', ['edit' => (int)$c['id']])) ?>">编辑</a>
|
||||
<form method="post" action="<?= e(url('calendar/cal_del')) ?>"
|
||||
onsubmit="return confirm('删除「<?= e((string)$c['name']) ?>」？本子里的日程会一起删掉。')">
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="id" value="<?= (int)$c['id'] ?>">
|
||||
<button class="btn btn-danger btn-sm" type="submit">删除</button>
|
||||
</form>
|
||||
<?php else: ?>
|
||||
<span class="link-quiet">不可改</span>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</td>
|
||||
<?php endif; ?>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</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): ?>
|
||||
<?= person_chip($s) ?>
|
||||
<span class="node-badge"><?= ($s['perm'] ?? '') === 'write' ? '可写' : '只读' ?></span>
|
||||
<form class="inline-form" method="post" action="<?= e(url('calendar/cal_unshare')) ?>">
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="id" value="<?= $cid ?>">
|
||||
<input type="hidden" name="person_id" value="<?= (int)$s['person_id'] ?>">
|
||||
<button class="link-quiet link-danger" type="submit"
|
||||
title="取消共享给 <?= e(person_name($s)) ?>">取消</button>
|
||||
</form>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<p class="small muted" style="margin:12px 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>
|
||||
<?php endif; ?>
|
||||
</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() ?>
|
||||
<input type="hidden" name="back_view" value="<?= e($backView) ?>">
|
||||
<?php /* ⚠️ **不能**带 `show_present`：不带 ⇒ 服务端不碰显隐（见 index.php 那段注释）。
|
||||
带了又不带 `show[]` = "把所有本子都藏起来" —— 那是个灾难性副作用。 */ ?>
|
||||
<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((int)\App\Auth::personId()) === $vk ? 'checked' : '' ?>>
|
||||
<span><?= e($vw) ?>视图</span>
|
||||
</label>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="btn-row" style="margin-top:12px">
|
||||
<button class="btn btn-sm" type="submit"<?= $canWrite ? '' : ' disabled' ?>>保存默认视图</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<?php if ($canWrite): ?>
|
||||
<?php /* v24 第 7 条：把一个 .ics 文件里的日程整批导进某一本。
|
||||
只能导进自定义本 —— 观影/旅行两本是派生的，塞进去就成了孤儿日程
|
||||
（日历里有、观影列表里没有）。 */ ?>
|
||||
只能导进自定义本 —— 观影/旅行两本是派生的，塞进去就成了孤儿日程。 */ ?>
|
||||
<div class="card card-pad">
|
||||
<h2 class="cinema-h2">
|
||||
导入 ics
|
||||
@@ -191,17 +339,11 @@ $canWrite = \App\Auth::canWrite();
|
||||
</div>
|
||||
<div class="field">
|
||||
<label for="im-file">.ics 文件 *</label>
|
||||
<?php /* 🔴 v30 用户第 1 条：$sdStage = false —— 导入型上传**不走暂存**。
|
||||
用户原话：「这个文件导入之后，以后应该就不会再访问它…把它上传到服务器上
|
||||
个临时目录里面，把数据读出来之后，写入到我们的日程的数据库表中，
|
||||
然后再把这个文件删除就可以了。」
|
||||
⇒ 文件走 PHP 自带的临时文件（$_FILES['ics']['tmp_name']），
|
||||
路由读完即弃；不落存储、不建附件行、不进 OSS。
|
||||
⚠️ 走暂存模式时 `<input>.files` 始终是空的 → 带 required 的提交会被
|
||||
浏览器原生校验拦下，弹「请选择一个文本。」（用户报的就是这句）。 */
|
||||
$sdName = 'ics'; $sdId = 'im-file'; $sdAccept = '.ics,text/calendar';
|
||||
$sdMultiple = false; $sdRequired = true; $sdStage = false;
|
||||
require __DIR__ . '/../_stage_drop.php'; ?>
|
||||
<?php /* 🔴 v30 用户第 1 条：$sdStage = false —— 导入型上传**不走暂存**。 */ ?>
|
||||
<?php
|
||||
$sdName = 'ics'; $sdId = 'im-file'; $sdAccept = '.ics,text/calendar';
|
||||
$sdMultiple = false; $sdRequired = true; $sdStage = false;
|
||||
require __DIR__ . '/../_stage_drop.php'; ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-row">
|
||||
@@ -211,12 +353,7 @@ $canWrite = \App\Auth::canWrite();
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php /* v24 第 7 条后半：CalDAV —— 把我的日历本订阅到手机/别的日历程序里。
|
||||
v24 第 22 批：口令改成**通用 DAV 口令**（日历 + 通讯录共用一把），
|
||||
管理入口也搬到了「个人设置 → DAV 同步」—— 这里只留地址与一个指路按钮。
|
||||
⚠️ 这一页**不再有**生成/撤销表单：同一个口令在两处各放一套按钮，
|
||||
迟早出现"在这里重置了、那页还显示已配置"的对不上（而且密码类的东西
|
||||
有两个入口本身就是坏味道）。 */ ?>
|
||||
<?php /* v24 第 7 条后半：CalDAV —— 把我的日历本订阅到手机/别的日历程序里。 */ ?>
|
||||
<div class="card card-pad" id="caldav">
|
||||
<h2 class="cinema-h2">
|
||||
CalDAV 订阅
|
||||
@@ -241,42 +378,13 @@ $canWrite = \App\Auth::canWrite();
|
||||
</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）====================
|
||||
与账目页 #ledPanels、名册 #rosterMenus 同一套思路：行上只留一个按钮，
|
||||
真正的选人表单集中在这里。
|
||||
|
||||
🔴 为什么必须只有一份（用户 2026-10-14 第 1 条「弹出框特别慢」的真根因）：
|
||||
原来**每本日历**都内联一套 `_person_picker`，而每个组件都把全部 800 人
|
||||
化成 JSON + `<noscript>` 兜底。12 本 ⇒ 整页 5.9 MB / 近万个 input
|
||||
⇒ 浏览器与密码管理器逐个扫描，慢得能感觉到。
|
||||
收成一份之后：**一整套选人组件**（1 份 JSON + 1 份 noscript），
|
||||
与日历本数无关 —— 再多本日历页也不会再变大。
|
||||
|
||||
⚠️ 选人组件是**单选**（`$ppMode='single'`）：行上按钮被点开时，用
|
||||
`window.ppSetSelected('person_id', 0, panel)` 把它重置成"未选"，
|
||||
再让用户挑 —— 否则上一次挑的人会留在表单里（看着像"已经选好了"）。 */ ?>
|
||||
⇒ 浏览器与密码管理器逐个扫描，慢得能感觉到。 */ ?>
|
||||
<?php if ($canWrite && $people): ?>
|
||||
<div class="cal-modal" id="calSharePanel" hidden role="dialog" aria-modal="true"
|
||||
aria-label="共享日历本">
|
||||
@@ -311,9 +419,7 @@ $canWrite = \App\Auth::canWrite();
|
||||
</form>
|
||||
<div class="cal-modal-foot">
|
||||
<?php /* ⚠️ 用 `form="calShareForm"` **显式关联**（表单在 .cal-modal-body 里、
|
||||
按钮在 .cal-modal-foot 里，不是同一个父节点）。原来写成 `form=""` 是
|
||||
**无效值**（空串不等于任何表单 id），点了不提交 —— 与 v37 日程弹框
|
||||
那次"按钮看不到"同一类 DOM 结构坑。id 由下面的脚本赋上（避免与别处撞名）。 */ ?>
|
||||
按钮在 .cal-modal-foot 里，不是同一个父节点）。 */ ?>
|
||||
<button class="btn btn-sm" type="submit" form="calShareForm">共享</button>
|
||||
<button class="btn btn-ghost btn-sm" type="button" data-cal-share-close>取消</button>
|
||||
</div>
|
||||
@@ -354,3 +460,91 @@ $canWrite = \App\Auth::canWrite();
|
||||
})();
|
||||
</script>
|
||||
<?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