From a24099fc53259403c42b96887373a934520113b0 Mon Sep 17 00:00:00 2001
From: laoyang <i@yangyq.net>
Date: Wed, 23 Sep 2026 17:36:58 +0800
Subject: [PATCH] =?UTF-8?q?=E8=8A=82=E7=82=B9=E8=AF=A6=E6=83=85=E9=A1=B5?=
 =?UTF-8?q?=EF=BC=9A=E6=89=80=E6=9C=89=E9=99=84=E4=BB=B6=E7=BB=9F=E4=B8=80?=
 =?UTF-8?q?=E5=B1=95=E7=A4=BA=EF=BC=8C=E4=B8=8D=E5=86=8D=E6=8A=8A=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E5=92=8C=E5=85=B6=E5=AE=83=E9=99=84=E4=BB=B6=E5=88=86?=
 =?UTF-8?q?=E5=BC=80=E5=88=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

之前照片墙只显示图片，非图片附件只给一句「另有 N 个非图片附件」，要看得再进管理页。
现在全部附件同列在照片与附件区：图片仍是缩略图，视频 / PDF / Word 等按 MIME
显示类型图标（🎬 / 📄 / 📎），和缩略图一样占满 4:3 格子。

点击行为沿用批 7 的灯箱四态：图片 / 视频 / PDF 直接预览（视频可拖进度条、
PDF 内嵌阅读器），预览不了的（Word / ZIP 等）灯箱里给下载按钮。
页头与底部入口文案同步改为「附件 (N) / 管理附件（N）」，
最多展示 12 个，超出给「+N 个」入口进管理页。

已验证：本地全链 11 步全绿（渲染检查 316 项，新增图标格 / 四态标记 /
不再出现「另有」等 8 项断言）；远端 e2e 322 项 0 失败（新增详情页统一展示
专项断言 7 项）；部署后双 PHP 渲染逐字节一致、60 文件哈希一致。
---
 assets/style.css         |  4 +++
 templates/nodes/show.php | 69 +++++++++++++++++++++++++---------------
 2 files changed, 48 insertions(+), 25 deletions(-)

diff --git a/assets/style.css b/assets/style.css
index fff8e96..053ac90 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -843,6 +843,10 @@ input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; padding
     display: flex; align-items: center; justify-content: center;
     height: 96px; font-size: 30px; background: var(--bg-soft);
 }
+/* 批 8：详情页附件墙里的图标格 —— 和图片缩略图一样占满 4:3 格子 */
+.photo-card .attachment-icon {
+    height: 100%; aspect-ratio: 4 / 3; font-size: 34px;
+}
 .attachment-meta { padding: 9px 11px; display: flex; align-items: center; gap: 6px; }
 .attachment-name {
     font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0;
diff --git a/templates/nodes/show.php b/templates/nodes/show.php
index 539522d..ff86373 100644
--- a/templates/nodes/show.php
+++ b/templates/nodes/show.php
@@ -57,7 +57,7 @@ if (!empty($node['duration_minutes'])) {
     </div>
     <div class="actions" style="display:flex; gap:8px; flex-wrap:wrap;">
         <a href="<?= url('nodes/edit', ['id' => $node['id']]) ?>" class="btn">编辑节点</a>
-        <a href="<?= url('attachments/node', ['id' => $node['id']]) ?>" class="btn">📷 照片 (<?= (int)$attachmentCount ?>)</a>
+        <a href="<?= url('attachments/node', ['id' => $node['id']]) ?>" class="btn">📎 附件 (<?= (int)$attachmentCount ?>)</a>
         <a href="<?= url('activities/show', ['id' => $node['activity_id']]) ?>" class="btn">返回活动</a>
         <form method="post" action="<?= url('nodes/destroy') ?>" style="display:inline;"
               onsubmit="return confirm('确定删除这个节点？它的附件、参与记录、花销和讨论都会一并删除。');">
@@ -144,33 +144,55 @@ if (!empty($node['duration_minutes'])) {
 </div>
 
 <?php
-/* 照片墙：地址一律走 media/show 代理，页面里不出现存储后端的真实地址 */
-$photoRows  = [];
-$otherCount = 0;
-foreach (($attachments ?? []) as $attRow) {
-    if (Attachments::isImageRow($attRow)) {
-        $photoRows[] = $attRow;
-    } else {
-        $otherCount++;
-    }
-}
-$showPhotos = array_slice($photoRows, 0, 12);
+/* 附件墙（批 8 起统一展示）：不再把图片和其它附件分开列 ——
+   图片给缩略图，视频 / PDF / 其它给类型图标；全部走 media/show 代理，
+   能预览的（图片 / 视频 / PDF）点击进灯箱直接看，
+   预览不了的（Word / ZIP 等）灯箱里给下载按钮（见 _lightbox.php） */
+$showAtts = array_slice(array_values($attachments ?? []), 0, 12);
+$attIcon  = static function (string $mime): string {
+    if (strpos($mime, 'video/') === 0) return '🎬';
+    if ($mime === 'application/pdf')  return '📄';
+    return '📎';
+};
 ?>
 <?php if (!empty($attachments)): ?>
     <h2 class="section-title" id="photos">照片与附件（<?= count($attachments) ?>）</h2>
 
-    <?php if (!empty($showPhotos)): ?>
+    <?php if (!empty($showAtts)): ?>
         <div class="photo-grid photo-grid-sm">
-            <?php foreach ($showPhotos as $attRow): ?>
-                <?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 foreach ($showAtts as $attRow):
+                $attId   = (int)$attRow['id'];
+                $attName = (string)($attRow['file_name'] ?? '');
+                $attMime = (string)($attRow['mime_type'] ?? '');
+                $isImg   = Attachments::isImageRow($attRow);
+                if ($isImg) {
+                    $kind = 'image';
+                } elseif (strpos($attMime, 'video/') === 0) {
+                    $kind = 'video';
+                } elseif ($attMime === 'application/pdf') {
+                    $kind = 'pdf';
+                } else {
+                    $kind = 'file';
+                }
+            ?>
+                <?php if ($isImg): ?>
+                    <?php /* js-photo：图片点击在当前页灯箱里看大图 */ ?>
+                    <a class="photo-card js-photo" href="<?= e(media_att($attId)) ?>"
+                       data-cap="<?= e($attName) ?>" title="<?= e($attName) ?>">
+                        <img src="<?= e(media_att($attId)) ?>" alt="<?= e($attName) ?>" loading="lazy">
+                    </a>
+                <?php else: ?>
+                    <?php /* js-media：非图片走四态灯箱（视频/PDF 可预览，其它给下载） */ ?>
+                    <a class="photo-card photo-card-icon js-media" href="<?= e(media_att($attId)) ?>"
+                       data-kind="<?= $kind ?>" data-cap="<?= e($attName) ?>"
+                       data-dl="<?= e(media_att($attId, true)) ?>" title="<?= e($attName) ?>">
+                        <span class="attachment-icon"><?= $attIcon($attMime) ?></span>
+                    </a>
+                <?php endif; ?>
             <?php endforeach; ?>
-            <?php if (count($photoRows) > count($showPhotos)): ?>
+            <?php if (count($attachments) > count($showAtts)): ?>
                 <a class="photo-more" href="<?= url('attachments/node', ['id' => (int)$node['id']]) ?>#photos">
-                    +<?= count($photoRows) - count($showPhotos) ?><span>张</span>
+                    +<?= count($attachments) - count($showAtts) ?><span>个</span>
                 </a>
             <?php endif; ?>
         </div>
@@ -178,11 +200,8 @@ $showPhotos = array_slice($photoRows, 0, 12);
 
     <div class="photo-bar">
         <a class="btn btn-sm" href="<?= url('attachments/node', ['id' => (int)$node['id']]) ?>">
-            📷 管理照片（<?= count($attachments) ?>）
+            📎 管理附件（<?= count($attachments) ?>）
         </a>
-        <?php if ($otherCount > 0): ?>
-            <span class="muted">另有 <?= (int)$otherCount ?> 个非图片附件</span>
-        <?php endif; ?>
     </div>
 <?php endif; ?>