laoyang/TripLog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

节点详情：照片灯箱浏览、参与人点击编辑、花销只记总计

Browse Source 
1) 照片与附件不再新开窗口看
   之前点缩略图直接 target=_blank 打开原始文件，看完还得切回来。
   现在统一走当前页灯箱（templates/_lightbox.php，详情页照片墙与
   照片管理页共用）：左右箭头 / 键盘 ←→ / 手机滑动切上一张下一张，
   Esc 或点背景关闭，带「第几张 / 共几张」计数并预加载相邻两张。
   非图片附件（PDF 等）仍保留直接打开与下载。

2) 参与人可以直接改了
   之前加完只能移出重加。现在每个参与人旁有「编辑」，点开预填弹窗
   （角色标签 / 心情 / 签到时间），保存仍走 members/store ——
   Members::save() 本来就是 upsert（同节点同人一条），服务端零改动。
   失败回填按 user_id 精确匹配，只回填刚才没保存成的那个人。

3) 花销去掉预算，只记真实花费
   明细上移，底部一行「总计（N 笔）¥X」。表单不再有「预算」选项，
   查询一律 is_budget=0（历史预算行不再出现在列表与合计里）；
   活动页统计同步改成「共 N 笔 · 总计」。列保留在库里不删数据。

已验证：本地全链 11 步全绿（php -l / 渲染 286 项 / SQL / PDO / CSS /
Mime / amap / 内联 JS×11 / 布局几何 / 表单交互 73 项）；远端 e2e
296 项 0 失败（含灯箱、编辑弹窗、历史预算行排除的专项断言）；
部署后双 PHP 渲染逐字节一致、60 文件哈希一致，线上 style.css 含新规则。
This commit is contained in:
laoyang
2026-09-23 14:59:02 +08:00
parent 86e0481a19
commit 48237c8947
8 changed files with 386 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/nodes/_expenses.php
+10 -37
View File
@@ -3,18 +3,18 @@
* 节点花销面板
* 依赖外部变量：$node、$expenses、$expenseSummary、$familyUsers、
* $categories、$currencies（code=>中文名）、$expenseSymbols（code=>符号）、$currentUserId
*
* 用户明确反馈「预算没有意义」：只记真实花销，上面一笔一笔列出来，下面给个总计。
* （expenses.is_budget 列仍在库里，但 UI 与查询都不再使用 —— 见 Expenses 类注释。）
*/
$expenses = $expenses ?? [];
$familyUsers = $familyUsers ?? [];
$categories = $categories ?? [];
$currencies = $currencies ?? [];
$expenseSymbols = $expenseSymbols ?? [];
$expenseSummary = $expenseSummary ?? ['budget' => 0.0, 'actual' => 0.0, 'count' => 0, 'diff' => 0.0];
$budget = (float)$expenseSummary['budget'];
$actual = (float)$expenseSummary['actual'];
$diff = (float)$expenseSummary['diff'];
$expenseSummary = $expenseSummary ?? ['total' => 0.0, 'count' => 0];
$total = (float)$expenseSummary['total'];
$money = static function (float $v): string {
return number_format($v, 2);
};
@@ -22,21 +22,6 @@ $money = static function (float $v): string {
<section class="panel" id="expenses">
<h2 class="section-title">💰 花销 (<?= (int)$expenseSummary['count'] ?>)</h2>
<div class="expense-summary">
<div class="expense-stat">
<span class="muted">预算</span>
<strong>¥<?= $money($budget) ?></strong>
</div>
<div class="expense-stat">
<span class="muted">实际</span>
<strong>¥<?= $money($actual) ?></strong>
</div>
<div class="expense-stat">
<span class="muted"><?= $diff > 0 ? '超出预算' : '比预算省' ?></span>
<strong class="<?= $diff > 0 ? 'money-over' : 'money-under' ?>">¥<?= $money(abs($diff)) ?></strong>
</div>
</div>
<?php if (empty($expenses)): ?>
<p class="muted">还没有记账</p>
<?php else: ?>
@@ -53,11 +38,6 @@ $money = static function (float $v): string {
<div class="expense-row">
<div class="expense-main">
<span class="expense-cat"><?= e($ex['category']) ?></span>
<?php if ((int)$ex['is_budget'] === 1): ?>
<span class="expense-kind expense-kind-budget">预算</span>
<?php else: ?>
<span class="expense-kind expense-kind-actual">实际</span>
<?php endif; ?>
<span class="expense-desc"><?= e($ex['description'] ?: $ex['category']) ?></span>
<span class="expense-amount"><?= e($sym) ?><?= $money((float)$ex['total_amount']) ?></span>
</div>
@@ -76,6 +56,11 @@ $money = static function (float $v): string {
</div>
<?php endforeach; ?>
</div>
<div class="expense-total">
<span>总计（<?= (int)$expenseSummary['count'] ?> 笔）</span>
<strong>¥<?= $money($total) ?></strong>
</div>
<?php endif; ?>
<details class="inline-panel">
@@ -126,18 +111,6 @@ $money = static function (float $v): string {
<input type="text" name="description" maxlength="200" placeholder="例如：三人门票">
</div>
<div class="form-row">
<label>性质</label>
<div class="radio-group">
<label class="radio-label">
<input type="radio" name="is_budget" value="0" checked> 实际花费
</label>
<label class="radio-label">
<input type="radio" name="is_budget" value="1"> 预算
</label>
</div>
</div>
<div class="form-row">
<label>分摊人（默认全家平摊，可只勾选部分人）</label>
<div class="check-grid">
templates/nodes/_members.php
+138 -3
View File
@@ -2,6 +2,10 @@
/**
* 节点参与人面板
* 依赖外部变量：$node、$members、$familyUsers、$roleTags（id=>name）、$emotions（emoji=>中文）
*
* 编辑走弹窗：点某个参与人旁的「编辑」，弹出预填好的表单（角色 / 心情 / 签到时间），
* 提交目标仍是 members/store —— Members::save() 本来就是 upsert（同一节点同一人一条），
* 所以「编辑已加入的人」不需要任何新接口。
*/
$members = $members ?? [];
$familyUsers = $familyUsers ?? [];
@@ -16,6 +20,11 @@ $notJoined = [];
foreach ($familyUsers as $u) {
if (!isset($joinedIds[(int)$u['id']])) $notJoined[] = $u;
}
/* 上一次提交的原始值（flash_old 存的）只用来回填「刚才没保存成功的那个人」的表单，
按 user_id 精确匹配，避免污染其他参与人的编辑弹窗。 */
$mOldFilled = !empty($_SESSION['_old']);
$mOldUid = (string)old('user_id', '');
?>
<section class="panel" id="members">
<h2 class="section-title">👥 参与人 (<?= count($members) ?>)</h2>
@@ -27,6 +36,8 @@ foreach ($familyUsers as $u) {
<?php foreach ($members as $m):
$mName = (string)($m['name'] ?? '');
if ($mName === '') $mName = '已注销用户';
$mUid = (int)$m['user_id'];
$mUseOld = $mOldFilled && $mOldUid === (string)$mUid;
?>
<div class="member-row">
<?php if (!empty($m['avatar'])): ?>
@@ -50,14 +61,90 @@ foreach ($familyUsers as $u) {
<span class="member-checkin">✓ 签到 <?= date('m-d H:i', strtotime((string)$m['check_in_time'])) ?></span>
<?php endif; ?>
<button type="button" class="member-edit" data-edit-member="<?= $mUid ?>"
title="修改 <?= e($mName) ?> 的角色 / 心情 / 签到">编辑</button>
<form method="post" action="<?= url('members/destroy') ?>" class="member-del-form"
onsubmit="return confirm('把 <?= e($mName) ?> 从本节点移出？');">
<input type="hidden" name="_csrf" value="<?= e(csrf_token()) ?>">
<input type="hidden" name="node_id" value="<?= (int)$node['id'] ?>">
<input type="hidden" name="user_id" value="<?= (int)$m['user_id'] ?>">
<input type="hidden" name="user_id" value="<?= $mUid ?>">
<button type="submit" class="comment-del">移出</button>
</form>
</div>
<?php /* ── 该参与人的编辑弹窗（预填当前值） ───────────────── */ ?>
<div class="modal" id="member-edit-<?= $mUid ?>" aria-hidden="true" role="dialog"
aria-label="编辑参与人 <?= e($mName) ?>">
<div class="modal-backdrop" data-close-member="1"></div>
<div class="modal-content">
<h3 class="modal-title">编辑参与人：<?= e($mName) ?></h3>
<p class="modal-hint">改完点「保存」即可，同一人只会有一条参与记录。</p>
<form method="post" action="<?= url('members/store') ?>" class="form form-plain">
<input type="hidden" name="_csrf" value="<?= e(csrf_token()) ?>">
<input type="hidden" name="node_id" value="<?= (int)$node['id'] ?>">
<input type="hidden" name="user_id" value="<?= $mUid ?>">
<?php if (!empty($roleTags)): ?>
<div class="form-row">
<label>角色标签（可多选）</label>
<div class="check-grid">
<?php $eSelTags = $mUseOld ? old_array('role_tag_ids') : array_map('strval', $m['role_tag_ids'] ?? []); ?>
<?php foreach ($roleTags as $tagId => $tagName): ?>
<label class="checkbox-label">
<input type="checkbox" name="role_tag_ids[]" value="<?= (int)$tagId ?>"
<?= in_array((string)(int)$tagId, $eSelTags, true) ? ' checked' : '' ?>>
<span><?= e($tagName) ?></span>
</label>
<?php endforeach; ?>
</div>
</div>
<?php else: ?>
<p class="muted" style="font-size:12px;">
还没有角色标签，去
<a href="<?= url('role_tags/index') ?>">角色标签管理</a>
先建几个（例如：司机 / 摄影师 / 记账员）
</p>
<?php endif; ?>
<div class="form-row">
<label>心情（可选）</label>
<div class="emotion-grid">
<?php $eSelEmotion = $mUseOld ? (string)old('emotion', '') : (string)($m['emotion'] ?? ''); ?>
<label class="emotion-option">
<input type="radio" name="emotion" value=""<?= $eSelEmotion === '' ? ' checked' : '' ?>>
<span class="emotion-face">🚫</span>
<span class="emotion-text">不记录</span>
</label>
<?php foreach ($emotions as $emoji => $label): ?>
<label class="emotion-option" title="<?= e($label) ?>">
<input type="radio" name="emotion" value="<?= e($emoji) ?>"<?= $eSelEmotion === (string)$emoji ? ' checked' : '' ?>>
<span class="emotion-face"><?= e($emoji) ?></span>
<span class="emotion-text"><?= e($label) ?></span>
</label>
<?php endforeach; ?>
</div>
</div>
<div class="form-row">
<label>签到时间（可选，留空表示未签到）</label>
<?php
$dtName = 'check_in_time';
$dtValue = $mUseOld ? old_dt('check_in_time', null) : ($m['check_in_time'] ?? null);
$dtRequired = false;
$dtId = 'check-in-date-' . $mUid;
require __DIR__ . '/../_datetime.php';
?>
</div>
<div class="form-actions">
<button type="submit" class="btn-primary">保存</button>
<button type="button" class="btn btn-sm" data-close-member="1">取消</button>
</div>
</form>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
@@ -72,8 +159,7 @@ foreach ($familyUsers as $u) {
<?php endif; ?>
<details class="inline-panel">
<summary>＋ 添加 / 修改参与人</summary>
<?php $mOldFilled = !empty($_SESSION['_old']); ?>
<summary>＋ 添加参与人</summary>
<form method="post" action="<?= url('members/store') ?>" class="form form-plain"
data-old="<?= $mOldFilled ? '1' : '0' ?>">
<input type="hidden" name="_csrf" value="<?= e(csrf_token()) ?>">
@@ -145,3 +231,52 @@ foreach ($familyUsers as $u) {
</form>
</details>
</section>
<script>
(function () {
'use strict';
var openId = null;
function modalOf(uid) {
return document.getElementById('member-edit-' + uid);
}
function openModal(uid) {
var modal = modalOf(uid);
if (!modal) return;
if (openId !== null) closeModal(openId);
openId = uid;
modal.classList.add('open');
modal.setAttribute('aria-hidden', 'false');
document.body.style.overflow = 'hidden';
}
function closeModal(uid) {
var modal = modalOf(uid);
if (!modal) return;
modal.classList.remove('open');
modal.setAttribute('aria-hidden', 'true');
document.body.style.overflow = '';
if (openId === uid) openId = null;
}
document.addEventListener('click', function (ev) {
var opener = ev.target.closest ? ev.target.closest('[data-edit-member]') : null;
if (opener) {
ev.preventDefault();
openModal(opener.getAttribute('data-edit-member'));
return;
}
var closer = ev.target.closest ? ev.target.closest('[data-close-member]') : null;
if (closer && openId !== null) {
ev.preventDefault();
closeModal(openId);
}
});
document.addEventListener('keydown', function (ev) {
if (ev.key === 'Escape' && openId !== null) closeModal(openId);
});
})();
</script>
templates/nodes/attachments.php
+5 -1
View File
@@ -133,7 +133,8 @@ $iconByMime = [
], static fn($v) => $v !== '' && $v !== null);
?>
<div class="photo-card">
<a href="<?= e($url) ?>" target="_blank" rel="noopener" title="<?= e($name) ?>">
<a href="<?= e($url) ?>" title="<?= e($name) ?>"
<?= $isImg ? 'class="js-photo" data-cap="' . e($name) . '"' : 'target="_blank" rel="noopener"' ?>>
<?php if ($isImg): ?>
<img src="<?= e($url) ?>" alt="<?= e($name) ?>" loading="lazy">
<?php else: ?>
@@ -168,6 +169,9 @@ $iconByMime = [
<?php /* ── 裁剪弹窗（与节点表单共用同一份模板，避免两边漂移） ───────────── */ ?>
<?php require dirname(__DIR__) . '/_crop_modal.php'; ?>
<?php /* ── 照片灯箱：已上传的图片在当前页弹窗浏览，左右箭头切换 ────────── */ ?>
<?php require dirname(__DIR__) . '/_lightbox.php'; ?>
<script>
(function () {
'use strict';
templates/nodes/show.php
+7 -3
View File
@@ -162,9 +162,10 @@ $showPhotos = array_slice($photoRows, 0, 12);
<?php if (!empty($showPhotos)): ?>
<div class="photo-grid photo-grid-sm">
<?php foreach ($showPhotos as $attRow): ?>
<a class="photo-card" href="<?= e(media_att((int)$attRow['id'])) ?>"
target="_blank" rel="noopener" title="<?= e($attRow['file_name']) ?>">
<img src="<?= e(media_att((int)$attRow['id'])) ?>" alt="" loading="lazy">
<?php /* js-photo：点击在当前页灯箱里看大图，不再新开窗口（见 _lightbox.php） */ ?>
<a class="photo-card js-photo" href="<?= e(media_att((int)$attRow['id'])) ?>"
data-cap="<?= e($attRow['file_name']) ?>" title="<?= e($attRow['file_name']) ?>">
<img src="<?= e(media_att((int)$attRow['id'])) ?>" alt="<?= e($attRow['file_name']) ?>" loading="lazy">
</a>
<?php endforeach; ?>
<?php if (count($photoRows) > count($showPhotos)): ?>
@@ -194,3 +195,6 @@ $commentTargetType = Comments::TARGET_NODE;
$commentTargetId = (int)$node['id'];
require dirname(__DIR__) . '/comments/_block.php';
?>
<?php /* 照片灯箱：当前页弹窗看大图，左右箭头切换 */ ?>
<?php require dirname(__DIR__) . '/_lightbox.php'; ?>