v24 第 11 批：7 大条 20 子项（首页/名册/观影/裁剪/日程/财务）
用户 2026-10-04 第 11 批，7 大条： - #1 首页：未来七天过滤掉「农历」（每日一条会淹掉真日程）；右侧日历本标签 从灰字(.dash-tag)改成**实心色块**（底色=日历色、白字、text-shadow 兜底浅色）。 - #2 名册：分组改**居中模态框**（用户要"像选观影人一样"）。修掉"点第二次失效" ——根因是旧实现用**捕获阶段**监听 document click 做"点外面就关"，与触发按钮 的 click 打架；模态把关闭收敛到遮罩/✕/取消。卡片「编辑」后加「删除」 （→ people/destroy）；详情页底部删除改成 btn-danger + btn-block-lg 大红按钮 + 两步确认。 - #3 名册详情页重排：.detail(260px+1fr) → .pcard（头像左上 + 右侧姓名/标签） + .detail-stack 全宽往下。旧布局头像卡比右栏矮，头像下留一大片空白。 - #4 观影：影院下拉换**自定义组件**（原生 <option> 画不了色块）——按钮+列表、 每行色点，值仍写隐藏 input[name=cinema_id]；「管理影院」→「新建影院」弹框 （带 back=movies/new，存完回本页并 ?cinema=<id> 自动选中）。 修「开始/结束时间标签跑到控件下面」：upgradeRange 原来 insertBefore(host, group.firstChild) 把控件插到了 label 之上 —— 改成插在第一个原生控件之前。 - #5 裁剪改 **Cropper.js**（assets/vendor/cropper/，按需加载走 fb-cropper meta）： 弹框 overflow:hidden + 固定画布（**无滚动条**）、**去掉缩放条**改滚轮 wheelZoomRatio、 viewMode:1 + autoCropArea 保证框小于画布、8 个触点全露。 结果仍写 *_crop = 归一化 x,y,w,h（提交契约不变）。 - #6 日程：内置节假日原来每天只标**一天**（国庆只出一条）→ FIXED 改成 [名字, 放假天数] 按区间铺；月视图从周日改**周一**起（表头同步）； 跳转日期从"长条+原生框"改成**单个 btn-icon**，点开弹 Semi 日期选择器。 - #7 财务：单条曲线无盘点时只回一个点（图看着像全 0）→ 改成"从创建日(0)画到今天"； 图下条目从"每账目一张小图卡"改成**一张 chart_multi 多线图 + 颜色图例** （Ledger::LEGEND_COLORS 按 id 取模，保证颜色稳定）；账目页卡顿同源治理 （行上只留按钮、表单全页一份 #ledPanels）；修改按钮改弹框并回填归属人。 ## 顺带修的真 bug（本批最要紧的三条） 1. **观影表单提交静默失效**：「新建影院」弹框被误嵌在观影主表单 <form> 内。 HTML 不允许 form 嵌套 → 浏览器拆开内层，弹框里 required 的"影院名称"变成 主表单必填项、又因 hidden 无法聚焦 → 点「记下这场电影」什么都不发生 （Chrome: invalid form control with name='name' is not focusable）。 → 弹框移到主表单之后。部署脚本加防线：按顺序配平 form 开闭判断是否嵌套。 2. **裁剪取消没清空文件框**（换 Cropper 时丢）→ close(cancelled)，4 个取消入口 传 true 清空；否则"点了取消"仍会把没裁的原图传上去。 3. **裁剪预览退化成原图**（同批丢）→ 用 canvas 按 Cropper 的原图像素矩形重画， toDataURL 写回预览，恢复"所见即所得"。 ## 连带修复：选人组件懒渲染（线上实测的必要性） 线上真实数据下账目页 6939 KB / 16788 个 input、观影表单 1194 个 input —— 根因是 _person_picker.php 首屏就把**全部候选人**渲成 <label>+<input>。 改成：首屏只留「不选」+ data-pp-people(JSON)，**打开弹框时**才 buildList()； 无 JS 兜底走 <noscript>（HTML5 规定启用脚本时其内容按纯文本解析，不产生节点）。 新增 window.ppSetSelected / decorateItems（动态项要补算首字母）。 实测账目页 6939 KB → 544 KB。新增 _fb_picker_lazy_check.py（11/0 + 反向 2 红）。 验证：e2e 786/0、交互 90/0、半集成 27/0、batch_e 91/0、batch10 46/0、batch9 38/0、 crop 17/0（+反向）、picker_unify 28/0、picker_lazy 11/0（+反向）、formbloat 9/0、 upgrade 126/0、mobile 688/0、drag 5/0、geom 5/5。 线上自检 19/19；线上真实账号验收 7/0（含"主表单无隐藏必填""线上 Cropper 接管+取消清空"）。
This commit is contained in:
+111
-55
@@ -184,6 +184,18 @@ $renderGrid = function (array $list) use ($meId, $canMove, $groups): void {
|
||||
<a class="btn btn-ghost btn-sm person-edit" data-no-drag
|
||||
href="<?= e(url('people/edit', ['id' => $pid])) ?>"
|
||||
title="编辑 <?= e($pshow) ?> 的资料">编辑</a>
|
||||
<?php /* 用户 2026-10-04 第 11 批 #2 原话：「在编辑后面，放一个按钮，删除，
|
||||
用来删除一个人。」
|
||||
⚠️ 它与「⋯→从我的名册移走」不是一件事，别混：
|
||||
· 「从我的名册移走」= 只是不在**我的**名册里显示，人还在家里；
|
||||
· 「删除」= 真的把这个人删掉（账号与亲属关系一起走，不可恢复）。
|
||||
所以它必须是显式的红色按钮 + 二次确认，不能收进 ⋯ 里。
|
||||
没有删除权限（非管理员）时不画，并给出原因提示。 */ ?>
|
||||
<?php if (\App\Auth::isAdmin()): ?>
|
||||
<button type="button" class="btn btn-danger btn-sm person-del"
|
||||
data-pd-open="<?= $pid ?>" data-pd-name="<?= e($pshow) ?>"
|
||||
title="删除 <?= e($pshow) ?>">删除</button>
|
||||
<?php endif; ?>
|
||||
<?php if ($canMove): ?>
|
||||
<button type="button" class="btn btn-ghost btn-sm person-more-btn"
|
||||
data-pm-open="<?= $pid ?>"
|
||||
@@ -317,26 +329,65 @@ $renderBlock = function (int $gid, string $name, array $list) use ($renderGrid):
|
||||
⚠️ 表单里留了原生「保存」按钮：即使 JS 出错，用户手动点它也能提交，
|
||||
不会掉进"按钮点了没反应"的黑洞。 */ ?>
|
||||
<?php if ($canMove): ?>
|
||||
<div class="roster-menus" id="rosterMenus" hidden>
|
||||
<div class="rm-panel" id="rmGroup" hidden>
|
||||
<?php /* 用户 2026-10-04 第 11 批 #2 原话：「名册的分组功能，点击一次之后，再次点击就失效了，
|
||||
应该**弹出一个框，就像选择观影人一样**，选择分组。」
|
||||
所以分组从"贴在按钮下方的浮层"改成**居中弹框 + 遮罩**（与选人弹窗同一形态）。
|
||||
⚠️ "第二次点击失效"的根因：旧实现把浮层贴在按钮下方，并在**捕获阶段**监听
|
||||
文档点击来"点外面就关"——于是点第二次时，mousedown 先被关闭逻辑吃掉、
|
||||
随后的 click 又把面板打开，视觉上就是"闪一下没反应/要用第三次才行"。
|
||||
改成居中的模态框后，外部点击只关模态本身，触发按钮的语义不再冲突。 */ ?>
|
||||
<div class="rm-modal" id="rosterMenus" hidden>
|
||||
<div class="rm-mask" data-rm-close></div>
|
||||
<div class="rm-panel" id="rmGroup" role="dialog" aria-modal="true" aria-label="选择分组" hidden>
|
||||
<div class="rm-head"><b>把「<span class="pg-who"></span>」分到</b>
|
||||
<button type="button" class="rm-x" data-rm-close aria-label="关闭">✕</button></div>
|
||||
<form method="post" action="<?= e(url('people/group')) ?>" class="pg-menu">
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="person_id" value="">
|
||||
<p class="pg-title">把「<b class="pg-who"></b>」分到</p>
|
||||
<label class="pg-item">
|
||||
<input type="radio" name="group_id" value="">
|
||||
<span>未分类</span>
|
||||
</label>
|
||||
<?php foreach ($groups as $g): ?>
|
||||
<div class="rm-body">
|
||||
<label class="pg-item">
|
||||
<input type="radio" name="group_id" value="<?= (int)$g['id'] ?>">
|
||||
<span><?= e((string)$g['name']) ?></span>
|
||||
<input type="radio" name="group_id" value="">
|
||||
<span>未分类</span>
|
||||
</label>
|
||||
<?php endforeach; ?>
|
||||
<button class="btn btn-sm pg-save" type="submit">保存</button>
|
||||
<?php foreach ($groups as $g): ?>
|
||||
<label class="pg-item">
|
||||
<input type="radio" name="group_id" value="<?= (int)$g['id'] ?>">
|
||||
<span><?= e((string)$g['name']) ?></span>
|
||||
</label>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="rm-foot">
|
||||
<button class="btn" type="submit">保存</button>
|
||||
<button class="btn btn-ghost" type="button" data-rm-close>取消</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="rm-panel" id="rmMore" hidden>
|
||||
|
||||
<div class="rm-panel" id="rmDel" role="dialog" aria-modal="true" aria-label="删除成员" hidden>
|
||||
<div class="rm-head"><b>删除「<span class="pd-who"></span>」</b>
|
||||
<button type="button" class="rm-x" data-rm-close aria-label="关闭">✕</button></div>
|
||||
<?php /* ⚠️ 路由是 people/destroy（与详情页底部那个删除同一个）——
|
||||
不要写成 people/delete，那会 404 且看起来像"点了没反应"。 */ ?>
|
||||
<form method="post" action="<?= e(url('people/destroy')) ?>" class="pd-form">
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="id" value="">
|
||||
<div class="rm-body">
|
||||
<p class="rm-warn">
|
||||
会把他从名册中删除，<b>并且</b>删掉他的登录账号与全部亲属关系连线。
|
||||
<b>不可恢复。</b>
|
||||
</p>
|
||||
<p class="small muted" style="margin:8px 0 0">
|
||||
只是"不想在名册里看到他"？那用卡片上的「⋯ → 从我的名册移走」，人还留在家里。
|
||||
</p>
|
||||
</div>
|
||||
<div class="rm-foot">
|
||||
<button class="btn btn-danger" type="submit">确认删除</button>
|
||||
<button class="btn btn-ghost" type="button" data-rm-close>取消</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="rm-panel" id="rmMore" role="dialog" aria-modal="true" aria-label="更多操作" hidden>
|
||||
<p class="small muted person-move is-kin" hidden style="margin:0 0 6px">
|
||||
因家谱关系自动加入；解除关系后自动移出。
|
||||
</p>
|
||||
@@ -371,91 +422,96 @@ $renderBlock = function (int $gid, string $name, array $list) use ($renderGrid):
|
||||
syncClear();
|
||||
})();
|
||||
|
||||
<?php /* ==================== 共享浮层的交互（v24 第 10 批 #6）====================
|
||||
一行只留一个按钮，真正的表单在 #rosterMenus 里（全页一份）。
|
||||
这里负责：点按钮 → 把该行的数据填进共享表单 → 浮层贴着那个按钮弹出来。 */ ?>
|
||||
<?php /* ==================== 卡片动作弹框的交互（v24 第 11 批 #2 重写）====================
|
||||
一行只留按钮，真正的表单在 #rosterMenus 里（全页一份，见前面的说明）。
|
||||
这一版把"贴按钮的浮层"换成**居中模态框**（与选人弹窗同形态）—— 用户明确要求
|
||||
「应该弹出一个框，就像选择观影人一样」。
|
||||
|
||||
⚠️ 为什么旧版"点第二次会失效"：
|
||||
旧实现在**捕获阶段**监听 document 的 click，只要目标不在浮层里就 closeAll()。
|
||||
点第二次时事件顺序是 mousedown → （捕获阶段 closeAll）→ click（又打开）→ …
|
||||
于是按钮像是"时灵时不灵"。模态框把"关闭"收敛到遮罩/关闭键/取消键上，
|
||||
按钮自己只负责"打开"，语义不再打架。
|
||||
⚠️ 外部点击用**冒泡**阶段监听，且只认遮罩本身（data-rm-close），
|
||||
不用"点哪儿都关"那种一刀切 —— 那正是上一版出问题的写法。 */ ?>
|
||||
(function () {
|
||||
var wrap = document.getElementById('rosterMenus');
|
||||
if (!wrap) { return; }
|
||||
var gPanel = document.getElementById('rmGroup');
|
||||
var dPanel = document.getElementById('rmDel');
|
||||
var mPanel = document.getElementById('rmMore');
|
||||
var openFor = null; // 当前为哪张卡开着
|
||||
|
||||
function closeAll() {
|
||||
wrap.hidden = true;
|
||||
if (gPanel) { gPanel.hidden = true; }
|
||||
if (mPanel) { mPanel.hidden = true; }
|
||||
openFor = null;
|
||||
[gPanel, dPanel, mPanel].forEach(function (p) { if (p) { p.hidden = true; } });
|
||||
}
|
||||
|
||||
/* 浮层贴到触发按钮下方；贴太靠右就向左收，贴太靠下就翻到上方 */
|
||||
function place(panel, btn) {
|
||||
var b = btn.getBoundingClientRect();
|
||||
var w = panel.offsetWidth, h = panel.offsetHeight;
|
||||
var vw = document.documentElement.clientWidth, vh = document.documentElement.clientHeight;
|
||||
var left = Math.min(Math.max(8, b.right - w), vw - w - 8);
|
||||
var top = b.bottom + 6;
|
||||
if (top + h > vh - 8) { top = Math.max(8, b.top - h - 6); }
|
||||
panel.style.left = Math.round(left) + 'px';
|
||||
panel.style.top = Math.round(top) + 'px';
|
||||
function open(panel) {
|
||||
[gPanel, dPanel, mPanel].forEach(function (p) { if (p && p !== panel) { p.hidden = true; } });
|
||||
panel.hidden = false;
|
||||
wrap.hidden = false;
|
||||
// 焦点进面板：点开就能用键盘选（Esc 也能关，见下）
|
||||
var first = panel.querySelector('input:not([type=hidden]), button');
|
||||
if (first) { first.focus(); }
|
||||
}
|
||||
|
||||
// ---- 打开：分组 ----
|
||||
document.addEventListener('click', function (e) {
|
||||
var t = e.target;
|
||||
if (!t || !t.closest) { return; }
|
||||
|
||||
// ---- 分组 ----
|
||||
var gb = t.closest('[data-pg-open]');
|
||||
if (gb) {
|
||||
e.preventDefault();
|
||||
var pid = gb.getAttribute('data-pg-open');
|
||||
var cur = parseInt(gb.getAttribute('data-pg-cur') || '0', 10) || 0;
|
||||
var form = gPanel.querySelector('form');
|
||||
form.querySelector('input[name="person_id"]').value = pid;
|
||||
form.querySelector('input[name="person_id"]').value = gb.getAttribute('data-pg-open');
|
||||
gPanel.querySelector('.pg-who').textContent = gb.getAttribute('data-pg-name') || '';
|
||||
// 预选当前分组
|
||||
// 预选当前分组（点开就知道他现在在哪一栏）
|
||||
var cur = parseInt(gb.getAttribute('data-pg-cur') || '0', 10) || 0;
|
||||
Array.prototype.forEach.call(form.querySelectorAll('input[name="group_id"]'), function (r) {
|
||||
r.checked = (parseInt(r.value || '0', 10) || 0) === cur;
|
||||
});
|
||||
mPanel.hidden = true;
|
||||
gPanel.hidden = false;
|
||||
wrap.hidden = false;
|
||||
place(gPanel, gb);
|
||||
openFor = pid;
|
||||
open(gPanel);
|
||||
return;
|
||||
}
|
||||
|
||||
// ---- ⋯ ----
|
||||
// ---- 打开：删除 ----
|
||||
var db = t.closest('[data-pd-open]');
|
||||
if (db) {
|
||||
e.preventDefault();
|
||||
dPanel.querySelector('form input[name="id"]').value = db.getAttribute('data-pd-open');
|
||||
dPanel.querySelector('.pd-who').textContent = db.getAttribute('data-pd-name') || '';
|
||||
open(dPanel);
|
||||
return;
|
||||
}
|
||||
|
||||
// ---- 打开：⋯ ----
|
||||
var mb = t.closest('[data-pm-open]');
|
||||
if (mb) {
|
||||
e.preventDefault();
|
||||
var pid2 = mb.getAttribute('data-pm-open');
|
||||
var kin = mb.getAttribute('data-pm-hint') === '1';
|
||||
mPanel.querySelector('.is-kin').hidden = !kin;
|
||||
mPanel.querySelector('form.is-self').hidden = kin;
|
||||
if (!kin) {
|
||||
mPanel.querySelector('form.is-self input[name="person_id"]').value = pid2;
|
||||
mPanel.querySelector('form.is-self input[name="person_id"]').value =
|
||||
mb.getAttribute('data-pm-open');
|
||||
}
|
||||
gPanel.hidden = true;
|
||||
mPanel.hidden = false;
|
||||
wrap.hidden = false;
|
||||
place(mPanel, mb);
|
||||
openFor = pid2;
|
||||
open(mPanel);
|
||||
return;
|
||||
}
|
||||
|
||||
// 点浮层内部 → 不动
|
||||
if (wrap.contains(t)) { return; }
|
||||
closeAll();
|
||||
}, true);
|
||||
// ---- 关闭：只有遮罩 / ✕ / 取消 会关（不做"点哪儿都关"）----
|
||||
if (t.closest('[data-rm-close]')) {
|
||||
e.preventDefault();
|
||||
closeAll();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('keydown', function (e) {
|
||||
if (e.key === 'Escape') { closeAll(); }
|
||||
});
|
||||
window.addEventListener('resize', closeAll);
|
||||
window.addEventListener('scroll', function () { if (openFor) { closeAll(); } }, true);
|
||||
|
||||
/* 选中即提交（与原来一样是"锦上添花"：面板里那个「保存」按钮一直都在） */
|
||||
/* 选中即提交（面板里那个「保存」按钮一直都在，这条只是顺手） */
|
||||
document.addEventListener('change', function (e) {
|
||||
var inp = e.target;
|
||||
if (!inp || inp.type !== 'radio' || inp.name !== 'group_id') { return; }
|
||||
|
||||
+94
-29
@@ -67,24 +67,53 @@ $shortKind = \App\Birthday::KINDS;
|
||||
<p class="motto-line">“<?= e((string)$p['slogan']) ?>”</p>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="detail">
|
||||
<aside class="detail-photo">
|
||||
<?php /* 用户 2026-10-04 第 11 批 #3 原话：「名册详情页面，需要修改。现在左侧是一个头像，
|
||||
下面都是空白的，太浪费空间了。应该这样，左上角是头像，头像右侧开始排放姓名什么的基本信息，
|
||||
然后就是其他信息开始往下顺序排放。」
|
||||
|
||||
⚠️ 旧布局是 `.detail { grid-template-columns: 260px 1fr }` 两栏：
|
||||
左栏（头像卡）只有 ~330px 高，右栏好几张卡片 → **头像下面空出一大片**。
|
||||
现在改成：
|
||||
· 顶部一张「名片卡」：头像（左上）+ 右侧姓名/称呼/性别/账号身份等基本信息；
|
||||
· 名片卡**下方**，其余各块全宽依次往下排。
|
||||
这样无论信息多少都不会留白。 */ ?>
|
||||
<div class="pcard">
|
||||
<div class="pcard-avatar">
|
||||
<img src="<?= e(avatar_url($p['avatar'])) ?>" alt="">
|
||||
<div class="name"><?= e($pShown) ?></div>
|
||||
<?php if ($isMyNick): ?><div class="sub">本名 <?= e((string)$p['name']) ?></div><?php endif; ?>
|
||||
<div class="sub">
|
||||
<?php if ($role === 'admin' && $p['account_status'] === 'active'): ?>
|
||||
家庭管理员
|
||||
<?php elseif ($role === 'guest'): ?>
|
||||
访客（只读）
|
||||
<?php elseif (!empty($p['account_id'])): ?>
|
||||
已开通登录<?= $p['account_status'] === 'disabled' ? '（已停用）' : '' ?>
|
||||
<?php else: ?>
|
||||
还没有开通登录
|
||||
</div>
|
||||
<div class="pcard-main">
|
||||
<div class="pcard-name">
|
||||
<?= e($pShown) ?>
|
||||
<?php if ($isMyNick): ?><span class="pcard-real">本名 <?= e((string)$p['name']) ?></span><?php endif; ?>
|
||||
<?php if (!empty($p['is_placeholder'])): ?><span class="badge">虚拟人物</span><?php endif; ?>
|
||||
</div>
|
||||
<div class="pcard-meta">
|
||||
<?php if (!$isSelf && (string)$labelToMe !== ''): ?>
|
||||
<span class="rel-label"><?= e($labelToMe) ?></span>
|
||||
<?php endif; ?>
|
||||
<span class="pcard-chip">
|
||||
<?php if ($role === 'admin' && $p['account_status'] === 'active'): ?>
|
||||
<b>家庭管理员</b>
|
||||
<?php elseif ($role === 'guest'): ?>
|
||||
访客（只读）
|
||||
<?php elseif (!empty($p['account_id'])): ?>
|
||||
已开通登录<?= $p['account_status'] === 'disabled' ? '（已停用）' : '' ?>
|
||||
<?php else: ?>
|
||||
还没有开通登录
|
||||
<?php endif; ?>
|
||||
</span>
|
||||
<span class="pcard-chip"><?= e(\App\Person::genderWord((string)($p['gender'] ?? '')) ?: '性别未填') ?></span>
|
||||
<?php if (!empty($p['birth_rank'])): ?>
|
||||
<span class="pcard-chip">第 <?= (int)$p['birth_rank'] ?> 个孩子</span>
|
||||
<?php endif; ?>
|
||||
<?php if ($age !== null): ?>
|
||||
<span class="pcard-chip"><?= (int)$age ?> 岁</span>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="detail-stack">
|
||||
<div>
|
||||
<div class="card card-pad">
|
||||
<dl class="kv">
|
||||
@@ -593,7 +622,7 @@ $shortKind = \App\Birthday::KINDS;
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div><?php /* /detail-stack —— 名片卡下方的全宽堆叠到此结束 */ ?>
|
||||
|
||||
<?php /* ==================== 危险操作：删除（用户 2026-10-03 第 2 条）====================
|
||||
「删除」从右上角搬到了页面**最下方**、「开通登录账号」下面。
|
||||
@@ -602,26 +631,62 @@ $shortKind = \App\Birthday::KINDS;
|
||||
原来那句"从名册里移除"听着像"只是从我的名册里移走"，
|
||||
实际会删账号与亲属关系，说法与后果不符。 */ ?>
|
||||
<?php if ($admin): ?>
|
||||
<?php /* 用户 2026-10-04 第 11 批 #2 原话：「个人详情页，最下面的删除，竟然是个链接，
|
||||
应该是个按钮，跟开通账号一样，是个大按钮，只不过背景用红色。」
|
||||
→ 从 <details> + 文字链接 + 小按钮，改成**与「开通登录账号」同规格的大按钮**，
|
||||
只把底色换成红色。确认仍保留（破坏性操作），但改成弹框式的二次确认，
|
||||
不再用浏览器原生 confirm（那玩意儿在不同浏览器里长相差异大）。 */ ?>
|
||||
<div class="danger-zone">
|
||||
<details class="del-wrap">
|
||||
<summary class="link-quiet">删除这个人…</summary>
|
||||
<div class="del-confirm">
|
||||
<p class="small muted" style="margin:0 0 8px;flex:1 1 100%">
|
||||
会把他从名册中删除，**并且**删掉他的登录账号与全部亲属关系连线（不可恢复）。
|
||||
如果你只是想让他从<b>你的</b>名册里消失，用名册列表上的「⋯ → 从我的名册移走」。
|
||||
</p>
|
||||
<form method="post" action="<?= e(url('people/destroy')) ?>"
|
||||
onsubmit="return confirm('确定要删除 <?= e($p['name']) ?> 吗？账号与亲属关系会一起删掉，无法恢复。')">
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="id" value="<?= $pid ?>">
|
||||
<button class="btn btn-danger btn-sm" type="submit">确认删除</button>
|
||||
</form>
|
||||
<div class="del-big">
|
||||
<p class="del-big-tip">
|
||||
删除会把他从名册中移除，<b>并且</b>删掉登录账号与全部亲属关系连线，<b>不可恢复</b>。<br>
|
||||
如果你只是想让他从<b>你的</b>名册里消失，用名册列表上的「⋯ → 从我的名册移走」。
|
||||
</p>
|
||||
<button type="button" class="btn btn-danger btn-block-lg" id="delBigBtn">
|
||||
删除 <?= e((string)$p['name']) ?>
|
||||
</button>
|
||||
<form method="post" action="<?= e(url('people/destroy')) ?>" id="delBigForm" hidden>
|
||||
<?= csrf_field() ?>
|
||||
<input type="hidden" name="id" value="<?= $pid ?>">
|
||||
</form>
|
||||
<div class="del-big-confirm" id="delBigConfirm" hidden>
|
||||
<span>确定删除？此操作无法撤销。</span>
|
||||
<button class="btn btn-danger" type="button" id="delBigYes">确认删除</button>
|
||||
<button class="btn btn-ghost" type="button" id="delBigNo">取消</button>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<script>
|
||||
/* 大删除按钮的两步确认（用户第 11 批 #2）：第一次点露出"确认删除/取消"，
|
||||
第二次点才真的提交。比原生 confirm 可控，也与页面其它确认长得一致。 */
|
||||
(function () {
|
||||
var btn = document.getElementById('delBigBtn');
|
||||
var box = document.getElementById('delBigConfirm');
|
||||
var form = document.getElementById('delBigForm');
|
||||
if (!btn || !box || !form) { return; }
|
||||
btn.addEventListener('click', function () {
|
||||
box.hidden = false;
|
||||
btn.hidden = true;
|
||||
});
|
||||
var no = document.getElementById('delBigNo');
|
||||
if (no) {
|
||||
no.addEventListener('click', function () {
|
||||
box.hidden = true;
|
||||
btn.hidden = false;
|
||||
});
|
||||
}
|
||||
var yes = document.getElementById('delBigYes');
|
||||
if (yes) {
|
||||
yes.addEventListener('click', function () {
|
||||
yes.disabled = true;
|
||||
yes.textContent = '正在删除…';
|
||||
form.submit();
|
||||
});
|
||||
}
|
||||
})();
|
||||
|
||||
// 关系表单的「是哪一位」下拉有**两种含义**：
|
||||
// kind=parent → 对方是父亲/母亲（填的是对方）
|
||||
// kind=child → 我是孩子的父亲/母亲（填的是自己）
|
||||
|
||||
Reference in New Issue
Block a user