laoyang
b2ca4f336e
- #6 名册线上真实数据（1184 人）卡顿：根因是**每张卡片内联一整份分组弹层**—— 全页 2369 个 form / 27234 个 input / 22496 个 radio / 98100 DOM 节点， 密码管理器（Bitwarden 等）逐个扫描 form 把主线程占死（用户报的就是这个冲突）。 改为卡片只带 data 属性 + 全页**唯一一份**共享浮层 #rosterMenus。 实测：form 2369→3、input 27234→25、DOM 98100→17659、解压 7694→2306 KB、 长任务 1/52ms → 0。新增哨兵 _fb_formbloat_check.py（含反向验证）。 - #5 日视图翻页失效：day_columns() 无条件吸到周一，天视图只有 1 列 → 永远显示那周周一。 改为仅 span>1 时吸附（周视图行为不变）。 - #2 财务「欠款」类别（负债）；并修一个真 bug：负债填负数会让净资产**反向变大**。 写入口 normalizeAmount 归一化 + summary/timeline 侧 abs 防御 + Schema v17 纠正老数据。 - #3 账目行「盘点」「修改」两个并列按钮（各自就地弹面板）；图移到账目上方， 总金额图跨整行 + 每个账目一条线 + 类别筛选条；charts() 改为覆盖全部账目。 - #4 日程新增「农历」「节假日」两本不可删除只读日历（app/Holiday.php）： 两级自动更新 —— 内置规则（公历固定 + 清明节气 + 农历节日）保证断网也有； 官方 JSON 镜像自动抓取补齐调休。抓取**不在渲染路径联网**（响应后 fastcgi_finish_request + 频率闸门），缓存落 storage/cache。仅派生本不可写日程。 - #6 日程页设置按钮前加「跳到某一天」（选中即跳）。 - #7 起止范围改用一个 Semi dateTimeRange 控件（观影/旅程/节点/日程共 4 处）； 新增 window.fbSetDT / fbUpgradeRange；修范围重挂（React 非受控组件须 unmount 再 createRoot） 与范围里 required 未摘除导致表单无法提交两个真实问题。 验证：e2e 786/0、batch10 44/0、batch9 38/0、batch_e 91/0、upgrade 126/0、picker 28/0、 semi_integrate 27/0、formbloat 5/0（+反向 3 红）、mobile 688/0、interact 97/0、drag 5/0、geom 5/5； 线上自检 19/19 + 线上真实账号巡检 28/0（含 Firefox 实测）。
454 lines
22 KiB
PHP
454 lines
22 KiB
PHP
<?php
|
||
/**
|
||
* 财务 / 账本（v24 用户第 15 条；2026-10-03 第 7、8 条重排）。
|
||
*
|
||
* 用户要求的页面结构（第 7 条原话）：
|
||
* 「上面是概览，下面就是具体账目，添加账目的功能和新增日程之类的一样，
|
||
* 放在右侧的按钮。……共享账本，改名等内容，都放在账本的设置中，
|
||
* 也是一样的，在新建账目按钮旁边，加一个设置按钮，在里面对账本进行设置、共享等。
|
||
* 挂在谁名下，应该默认是自己，如果要更改，点一下，弹出选人框。」
|
||
*
|
||
* 第 8 条（盘点）：
|
||
* 「我点击盘点，让我对一个账目的金额进行重新输入，但是盘点之前的账目数目不能清空，
|
||
* 要记住，这样的话，每个账目的变化，就知道了……然后把这种变化，每个账目的
|
||
* 金额变化，还有总金额的变化，在账本列表上面，画出一个图，折线图这样的。」
|
||
* → 所以「账目」这块的最上面是**图**（整本账 + 每条有盘点记录的账目），
|
||
* 下面是账目表，每行带一个「盘点」入口。
|
||
*
|
||
* ⚠️ 金额全程以**分**参与计算（Ledger 里做的），这里只负责显示成元。
|
||
* 任何地方都不要拿元去加总。
|
||
*
|
||
* @param array $books 我能看到的账本（带 my_perm / entry_count）
|
||
* @param array $cur 当前账本
|
||
* @param array $entries 当前账本的账目
|
||
* @param array $summary ['asset','debt','net','by_kind','count']（单位：分）
|
||
* @param array $shares 当前账本的共享列表
|
||
* @param array $charts 有盘点历史的账目 → ['entry'=>行, 'series'=>[…] ]
|
||
* @param array $timeline 整本账的净资产时间线
|
||
* @param array $people 名册
|
||
*/
|
||
$canWrite = \App\Auth::canWrite() && \App\Ledger::canWrite($cur);
|
||
$curId = (int)$cur['id'];
|
||
$money = static fn($c): string => \App\Ledger::money($c);
|
||
$charts = $charts ?? [];
|
||
$timeline = $timeline ?? [];
|
||
// 用户第 8 条：「挂在谁名下，应该默认是自己」。这里的 $me 由 index.php 传进来（当前登录者）。
|
||
// ⚠️ 别用 `$me ?? 0` 再判 0 —— 那样一旦没传进来就会静默变成"不选"，看着像默认值丢了。
|
||
$ledMe = (int)($me ?? 0);
|
||
?>
|
||
<div class="page-head">
|
||
<h1>财务</h1>
|
||
<span class="sub"><?= e((string)$cur['name']) ?> · 共享后双方都能记、都能看</span>
|
||
<div class="actions">
|
||
<?php /* 用户第 7 条：加账目 = 右侧按钮（与「新建日程」同一套） */ ?>
|
||
<?php if ($canWrite): ?>
|
||
<button class="btn" type="button" id="ledAddBtn">记一笔</button>
|
||
<?php else: ?>
|
||
<span class="link-quiet">只读</span>
|
||
<?php endif; ?>
|
||
<?php /* 用户第 7 条：共享 / 改名 / 新建 / 删除 全在账本设置里（☰） */ ?>
|
||
<?php $setCurrent = 'book'; require __DIR__ . '/_settings_menu.php'; ?>
|
||
</div>
|
||
</div>
|
||
|
||
<?php if (count($books) > 1): ?>
|
||
<div class="seg">
|
||
<?php foreach ($books as $b): ?>
|
||
<a class="seg-btn<?= (int)$b['id'] === $curId ? ' is-on' : '' ?>"
|
||
href="<?= e(url('ledger', ['book' => (int)$b['id']])) ?>">
|
||
<?= e((string)$b['name']) ?><?= ($b['my_perm'] ?? '') === 'read' ? '（只读）' : '' ?>
|
||
</a>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<?php /* ==================== ① 概览 ==================== */ ?>
|
||
<div class="card card-pad led-sum">
|
||
<div class="led-sum-head">
|
||
<h2 class="cinema-h2" style="margin:0"><?= e((string)$cur['name']) ?></h2>
|
||
<span class="small muted">
|
||
<?= (int)($cur['entry_count'] ?? count($entries)) ?> 笔账
|
||
<?php if (($cur['my_perm'] ?? '') === 'read'): ?>
|
||
· <b>只读</b>（不能记账）
|
||
<?php endif; ?>
|
||
</span>
|
||
</div>
|
||
<div class="led-total">
|
||
<div class="led-total-item">
|
||
<span class="led-total-lb">总资产</span>
|
||
<span class="led-total-num led-asset"><?= e($money($summary['asset'])) ?></span>
|
||
</div>
|
||
<div class="led-total-item">
|
||
<span class="led-total-lb">总负债</span>
|
||
<span class="led-total-num led-debt"><?= e($money($summary['debt'])) ?></span>
|
||
</div>
|
||
<div class="led-total-item led-net">
|
||
<span class="led-total-lb">净资产</span>
|
||
<span class="led-total-num"><?= e($money($summary['net'])) ?></span>
|
||
</div>
|
||
</div>
|
||
<?php if ($summary['by_kind']): ?>
|
||
<div class="led-kinds">
|
||
<?php foreach ($summary['by_kind'] as $k => $c): ?>
|
||
<span class="led-kind-chip<?= \App\Ledger::isDebt((string)$k) ? ' is-debt' : '' ?>">
|
||
<?= \App\Ledger::kindIcon((string)$k) ?> <?= e(\App\Ledger::kindWord((string)$k)) ?>
|
||
<b><?= e($money($c)) ?></b>
|
||
</span>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<?php if ($canWrite): ?>
|
||
<div class="card card-pad led-add" id="ledAddCard" hidden>
|
||
<h2 class="cinema-h2">记一笔</h2>
|
||
<form method="post" action="<?= e(url('ledger/entry_add')) ?>">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="ledger_id" value="<?= $curId ?>">
|
||
<div class="form-grid">
|
||
<div class="field">
|
||
<label for="le-kind">类别 *</label>
|
||
<select class="select" id="le-kind" name="kind">
|
||
<?php foreach (\App\Ledger::KINDS as $k => $v): ?>
|
||
<option value="<?= e($k) ?>"><?= e($v[2] . ' ' . $v[0]) ?><?= $v[1] === 'debt' ? '（负债）' : '' ?></option>
|
||
<?php endforeach; ?>
|
||
</select>
|
||
</div>
|
||
<div class="field">
|
||
<label for="le-title">名称 *</label>
|
||
<input class="input" id="le-title" name="title" required placeholder="如：工商银行定期">
|
||
</div>
|
||
<div class="field">
|
||
<label for="le-amount">金额（元）*</label>
|
||
<input class="input" id="le-amount" name="amount" required inputmode="decimal"
|
||
placeholder="如：120000.00">
|
||
<span class="tip">负债（贷款/信用卡）也填正数，系统按类别算成负债。</span>
|
||
</div>
|
||
<div class="field">
|
||
<?php /* 用户第 7 条：「挂在谁名下，应该默认是自己，如果要更改，点一下，弹出选人框」
|
||
—— 用全局选人组件（与观影选人同一套，含拼音首字母联想）。 */ ?>
|
||
<label>挂在谁名下</label>
|
||
<?php
|
||
$ppName = 'person_id';
|
||
$ppPeople = $people;
|
||
// 默认就是**我自己**（用户第 8 条）。单选组件按 $ppSelected 勾选并渲染 chip，
|
||
// 传 [0] 的话会渲染成"未选择"——所以必须传真实 id。
|
||
$ppSelected = $ledMe > 0 ? [$ledMe] : [];
|
||
$ppMode = 'single';
|
||
$ppOpenBtn = '更换归属人';
|
||
$ppTitle = '这笔账挂在谁名下';
|
||
$ppEmptyText= '不指定';
|
||
$ppAllowEmpty = true;
|
||
require __DIR__ . '/../_person_picker.php';
|
||
?>
|
||
</div>
|
||
<div class="field full">
|
||
<label for="le-note">备注</label>
|
||
<input class="input" id="le-note" name="note" placeholder="可选">
|
||
</div>
|
||
</div>
|
||
<div class="btn-row"><button class="btn" type="submit">添加账目</button></div>
|
||
</form>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<?php /* ==================== ② 变化图（v24 第 10 批 #3 重做）====================
|
||
用户原话：「在账目上面，增加一个图表显示，**显示所有账目和总金额的变化曲线**，
|
||
根据盘点的金额进行显示。横轴就是时间，纵轴是金额，用折线图。」
|
||
⚠️ 与旧版的差别：① 总金额（净资产）**永远在最前**；② 每条账目都出线（不再只画盘点过的）；
|
||
③ 加一条"按类别看"的切换条 —— 因为"所有账目"在几百条时会变成一坨，
|
||
把筛选交给用户，而不是我们偷偷少画几条。 */ ?>
|
||
<?php if ($entries): ?>
|
||
<div class="card card-pad led-charts">
|
||
<h2 class="cinema-h2">
|
||
金额变化
|
||
<span class="hint">横轴时间 · 纵轴金额；每次「盘点」记一个点，旧数字不会被清掉</span>
|
||
</h2>
|
||
|
||
<?php if ($timeline): ?>
|
||
<div class="ck-card ck-total">
|
||
<div class="ck-head">
|
||
<b>总金额 · 净资产</b>
|
||
<span class="small muted"><?= count($timeline) ?> 个时间点</span>
|
||
</div>
|
||
<?= chart_line($timeline, '净资产', 'asset', 900) ?>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<?php if ($charts): ?>
|
||
<?php
|
||
// 类别筛选条：只列出**真有账目**的类别，点一下只看这一类。
|
||
$kindsPresent = [];
|
||
foreach ($charts as $ch) {
|
||
$k = (string)$ch['entry']['kind'];
|
||
$kindsPresent[$k] = ($kindsPresent[$k] ?? 0) + 1;
|
||
}
|
||
?>
|
||
<div class="ck-filter" data-ck-filter>
|
||
<button type="button" class="ck-chip is-on" data-ck-kind="">全部（<?= count($charts) ?>）</button>
|
||
<?php foreach ($kindsPresent as $k => $n): ?>
|
||
<button type="button" class="ck-chip<?= \App\Ledger::isDebt((string)$k) ? ' is-debt' : '' ?>"
|
||
data-ck-kind="<?= e((string)$k) ?>">
|
||
<?= \App\Ledger::kindIcon((string)$k) ?> <?= e(\App\Ledger::kindWord((string)$k)) ?>（<?= (int)$n ?>）
|
||
</button>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
|
||
<div class="ck-grid">
|
||
<?php foreach ($charts as $ch): ?>
|
||
<?php $en = $ch['entry']; $ek = (string)$en['kind']; ?>
|
||
<div class="ck-card" data-ck-card="<?= e($ek) ?>">
|
||
<div class="ck-head">
|
||
<b><?= e((string)$en['title']) ?></b>
|
||
<span class="small muted">
|
||
<?= \App\Ledger::kindIcon($ek) ?> <?= e(\App\Ledger::kindWord($ek)) ?>
|
||
· <?= count($ch['series']) ?> 个点
|
||
</span>
|
||
</div>
|
||
<?= chart_line($ch['series'], (string)$en['title'], \App\Ledger::isDebt($ek) ? 'debt' : 'asset', 320) ?>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<p class="small muted" style="margin:8px 2px 0">
|
||
没有盘点记录的账目只会显示一个点（它一直没变过）——
|
||
在下面账目表里点「盘点」记下当前金额，这条线就长出来了。
|
||
</p>
|
||
<?php endif; ?>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<?php /* ==================== ③ 账目 ==================== */ ?>
|
||
<div class="card card-pad">
|
||
<h2 class="cinema-h2">账目（<?= count($entries) ?>）</h2>
|
||
<?php if (!$entries): ?>
|
||
<p class="empty-hint">这本账还没有账目。上面「记一笔」开始记吧。</p>
|
||
<?php else: ?>
|
||
<div class="table-wrap">
|
||
<table class="table">
|
||
<thead>
|
||
<tr><th>类别</th><th>名称</th><th class="num">金额</th><th>挂在谁名下</th><th>备注</th><th></th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<?php foreach ($entries as $en): ?>
|
||
<?php $ek = (string)$en['kind']; $debt = \App\Ledger::isDebt($ek); $eid = (int)$en['id']; ?>
|
||
<tr>
|
||
<td class="nowrap">
|
||
<span class="led-kind-chip<?= $debt ? ' is-debt' : '' ?>">
|
||
<?= \App\Ledger::kindIcon($ek) ?> <?= e(\App\Ledger::kindWord($ek)) ?>
|
||
</span>
|
||
</td>
|
||
<td><?= e((string)$en['title']) ?></td>
|
||
<td class="num<?= $debt ? ' led-debt' : ' led-asset' ?>">
|
||
<?= $debt ? '-' : '' ?><?= e($money((int)$en['amount_cents'])) ?>
|
||
</td>
|
||
<td class="nowrap">
|
||
<?php if (!empty($en['person_name'])): ?>
|
||
<?= person_chip([
|
||
'id' => (int)$en['person_id'], 'name' => (string)$en['person_name'],
|
||
'my_nickname' => (string)($en['person_nick'] ?? ''),
|
||
'avatar' => $en['avatar'] ?? null, 'avatar_color' => $en['avatar_color'] ?? null,
|
||
]) ?>
|
||
<?php else: ?><span class="small muted">—</span><?php endif; ?>
|
||
</td>
|
||
<td class="small muted"><?= e((string)($en['note'] ?? '')) ?></td>
|
||
<td class="nowrap led-acts">
|
||
<?php /* 用户 2026-10-04 第 3 条原话：「账目列表，右侧两个按钮，
|
||
一个**盘点**，点击后，输入最新的金额；一个按钮**修改**，
|
||
用来修改名称、挂在谁名下、备注等。」
|
||
→ 所以这两个是**并列的按钮**，各自弹自己的面板；
|
||
不再是一个「操作」里塞两坨表单（那要展开两层才够得着）。 */ ?>
|
||
<?php if ($canWrite): $histN = count(\App\Ledger::history($eid)); ?>
|
||
<button type="button" class="btn btn-ghost btn-sm led-act"
|
||
data-led-open="recon-<?= $eid ?>">盘点</button>
|
||
<button type="button" class="btn btn-ghost btn-sm led-act"
|
||
data-led-open="edit-<?= $eid ?>">修改</button>
|
||
|
||
<div class="led-panel" id="recon-<?= $eid ?>" hidden>
|
||
<form method="post" action="<?= e(url('ledger/reconcile')) ?>" class="led-recon">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="ledger_id" value="<?= $curId ?>">
|
||
<input type="hidden" name="id" value="<?= $eid ?>">
|
||
<h4 class="led-form-h">盘点「<?= e((string)$en['title']) ?>」</h4>
|
||
<div class="field">
|
||
<label>最新金额（元）</label>
|
||
<input class="input" name="amount" inputmode="decimal" required
|
||
value="<?= e(\App\Ledger::amountYuan((int)$en['amount_cents'])) ?>">
|
||
<span class="tip">盘点前的金额会记进历史，图表上就多一个点。</span>
|
||
</div>
|
||
<div class="field">
|
||
<label>盘点备注</label>
|
||
<input class="input" name="note" placeholder="如：2026 年初盘点">
|
||
</div>
|
||
<div class="btn-row">
|
||
<button class="btn btn-sm" type="submit">记下这次盘点</button>
|
||
<button class="btn btn-ghost btn-sm" type="button" data-led-close>取消</button>
|
||
</div>
|
||
<?php if ($histN): ?>
|
||
<details class="led-hist">
|
||
<summary class="link-quiet">看历史（<?= $histN ?> 次）</summary>
|
||
<ul class="led-hist-list">
|
||
<?php foreach (\App\Ledger::history($eid) as $hs): ?>
|
||
<li>
|
||
<span class="nowrap"><?= e(substr((string)$hs['created_at'], 0, 10)) ?></span>
|
||
<b><?= e($money((int)$hs['amount_cents'])) ?></b>
|
||
<?php if (($hs['note'] ?? '') !== ''): ?>
|
||
<span class="muted small"><?= e((string)$hs['note']) ?></span>
|
||
<?php endif; ?>
|
||
</li>
|
||
<?php endforeach; ?>
|
||
</ul>
|
||
</details>
|
||
<?php endif; ?>
|
||
</form>
|
||
</div>
|
||
|
||
<div class="led-panel" id="edit-<?= $eid ?>" hidden>
|
||
<?php /* 用户第 3 条：修改的作用域是**名称 / 挂在谁名下 / 备注等** ——
|
||
与"更正金额"分开：改金额属于"当初录错了"，那走盘点（留历史）；
|
||
这里改的是描述性字段，所以**也可以含类别与金额**（都是描述），
|
||
但文案上讲清楚它与盘点的区别。 */ ?>
|
||
<form method="post" action="<?= e(url('ledger/entry_update')) ?>">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="ledger_id" value="<?= $curId ?>">
|
||
<input type="hidden" name="id" value="<?= $eid ?>">
|
||
<h4 class="led-form-h">修改「<?= e((string)$en['title']) ?>」</h4>
|
||
<p class="tip" style="margin:0 0 8px">
|
||
改的是名称、归属与备注。若只是**金额变了**（不是录错），
|
||
请用「盘点」——那样才会记进历史、在图上多一个点。
|
||
</p>
|
||
<div class="field">
|
||
<label>名称</label>
|
||
<input class="input" name="title" value="<?= e((string)$en['title']) ?>" required>
|
||
</div>
|
||
<div class="field">
|
||
<label>挂在谁名下</label>
|
||
<?php
|
||
$ppName = 'person_id';
|
||
$ppPeople = $people;
|
||
$ppSelected = !empty($en['person_id']) ? [(int)$en['person_id']] : [];
|
||
$ppMode = 'single';
|
||
$ppOpenBtn = '更换归属人';
|
||
$ppTitle = '这笔账挂在谁名下';
|
||
$ppEmptyText= '不指定';
|
||
$ppAllowEmpty = true;
|
||
require __DIR__ . '/../_person_picker.php';
|
||
?>
|
||
</div>
|
||
<div class="field">
|
||
<label>类别</label>
|
||
<select class="select" name="kind">
|
||
<?php foreach (\App\Ledger::KINDS as $k => $v): ?>
|
||
<option value="<?= e($k) ?>" <?= $ek === $k ? 'selected' : '' ?>>
|
||
<?= e($v[2] . ' ' . $v[0]) ?><?= $v[1] === 'debt' ? '（负债）' : '' ?>
|
||
</option>
|
||
<?php endforeach; ?>
|
||
</select>
|
||
</div>
|
||
<div class="field">
|
||
<label>金额（元）</label>
|
||
<input class="input" name="amount"
|
||
value="<?= e(\App\Ledger::amountYuan((int)$en['amount_cents'])) ?>" required>
|
||
</div>
|
||
<div class="field">
|
||
<label>备注</label>
|
||
<input class="input" name="note" value="<?= e((string)($en['note'] ?? '')) ?>">
|
||
</div>
|
||
<div class="btn-row">
|
||
<button class="btn btn-sm" type="submit">保存</button>
|
||
<button class="btn btn-ghost btn-sm" type="button" data-led-close>取消</button>
|
||
</div>
|
||
</form>
|
||
<form method="post" action="<?= e(url('ledger/entry_del')) ?>" class="res-inline"
|
||
style="margin-top:8px">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="ledger_id" value="<?= $curId ?>">
|
||
<input type="hidden" name="id" value="<?= $eid ?>">
|
||
<button class="btn btn-ghost btn-sm" type="submit"
|
||
onclick="return confirm('删掉这笔账目？')">删除这笔</button>
|
||
</form>
|
||
</div>
|
||
<?php endif; ?>
|
||
</td>
|
||
</tr>
|
||
<?php endforeach; ?>
|
||
</tbody>
|
||
<tfoot>
|
||
<tr>
|
||
<th colspan="2">合计（资产 − 负债）</th>
|
||
<th class="num led-net"><?= e($money($summary['net'])) ?></th>
|
||
<th colspan="3"></th>
|
||
</tr>
|
||
</tfoot>
|
||
</table>
|
||
</div>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<script>
|
||
(function () {
|
||
/* ---- 「记一笔」开合 ---- */
|
||
var btn = document.getElementById('ledAddBtn');
|
||
var card = document.getElementById('ledAddCard');
|
||
if (btn && card) {
|
||
btn.addEventListener('click', function () {
|
||
card.hidden = !card.hidden;
|
||
btn.textContent = card.hidden ? '记一笔' : '收起';
|
||
if (!card.hidden) { card.scrollIntoView({ block: 'nearest' }); }
|
||
});
|
||
}
|
||
|
||
/* ---- 每行「盘点 / 修改」两个按钮：弹各自的面板（v24 第 10 批 #3）----
|
||
面板贴着那一行展开（不是弹窗遮罩），改完就在原地看得到结果。
|
||
同时只开一个；点别处 / Esc 收起。 */
|
||
var openPanel = null;
|
||
function closePanel() {
|
||
if (openPanel) { openPanel.hidden = true; openPanel = null; }
|
||
}
|
||
document.addEventListener('click', function (e) {
|
||
var t = e.target;
|
||
if (!t || !t.closest) { return; }
|
||
if (t.closest('[data-led-close]')) { closePanel(); return; }
|
||
var trigger = t.closest('[data-led-open]');
|
||
if (trigger) {
|
||
var id = trigger.getAttribute('data-led-open');
|
||
var panel = document.getElementById(id);
|
||
if (!panel) { return; }
|
||
var wasOpen = (panel === openPanel);
|
||
closePanel();
|
||
if (wasOpen) { return; } // 再点一次 = 收起
|
||
panel.hidden = false;
|
||
openPanel = panel;
|
||
// 把面板插到这一行**后面**（作为整行的兄弟），而不是塞在 <td> 里 ——
|
||
// 表格单元格会被列宽切碎，表单在格子里根本排不开。
|
||
var tr = trigger.closest('tr');
|
||
if (tr && panel.parentNode !== tr.parentNode) {
|
||
tr.parentNode.insertBefore(panel, tr.nextSibling);
|
||
}
|
||
// 焦点给到第一个输入框：点完就能打字
|
||
var inp = panel.querySelector('input:not([type=hidden]), select');
|
||
if (inp) { inp.focus(); }
|
||
return;
|
||
}
|
||
if (openPanel && !openPanel.contains(t)) { closePanel(); }
|
||
}, true);
|
||
document.addEventListener('keydown', function (e) {
|
||
if (e.key === 'Escape') { closePanel(); }
|
||
});
|
||
|
||
/* ---- 图表按类别筛选（"所有账目"在几百条时会变成一坨）---- */
|
||
var bar = document.querySelector('[data-ck-filter]');
|
||
if (bar) {
|
||
bar.addEventListener('click', function (e) {
|
||
var chip = e.target.closest('.ck-chip');
|
||
if (!chip) { return; }
|
||
var kind = chip.getAttribute('data-ck-kind') || '';
|
||
Array.prototype.forEach.call(bar.querySelectorAll('.ck-chip'), function (c) {
|
||
c.classList.toggle('is-on', c === chip);
|
||
});
|
||
Array.prototype.forEach.call(document.querySelectorAll('[data-ck-card]'), function (c) {
|
||
c.hidden = kind !== '' && c.getAttribute('data-ck-card') !== kind;
|
||
});
|
||
});
|
||
}
|
||
})();
|
||
</script>
|