From 7d72a778dd18011d065e4427ec5f1938bb732c4b Mon Sep 17 00:00:00 2001
From: hubian <908234780@qq.com>
Date: Sat, 23 May 2026 23:51:06 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=90=9C=E7=B4=A2=E9=9D=A2?=
 =?UTF-8?q?=E6=9D=BFUI=EF=BC=9A=E5=85=B3=E9=94=AE=E8=AF=8D=E8=BE=93?=
 =?UTF-8?q?=E5=85=A5=E6=A1=86=E6=94=BE=E5=A4=A7=E3=80=81=E5=8F=82=E6=95=B0?=
 =?UTF-8?q?=E7=BC=A9=E5=B0=8F=E3=80=81=E6=90=9C=E7=B4=A2=E5=8E=86=E5=8F=B2?=
 =?UTF-8?q?=E9=BB=98=E8=AE=A4=E6=8A=98=E5=8F=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 templates/topic.html | 58 +++++++++++++++++++++++++++++---------------
 1 file changed, 39 insertions(+), 19 deletions(-)

diff --git a/templates/topic.html b/templates/topic.html
index 57c09aa..2712f3b 100644
--- a/templates/topic.html
+++ b/templates/topic.html
@@ -115,6 +115,7 @@
         .search-panel .card-body { padding: 16px; }
         .search-bar { display: flex; gap: 6px; }
         .search-bar input { flex: 1; }
+        .search-group-arrow { transition: transform 0.15s; }
         .search-bar select { width: auto; min-width: 100px; }
         .search-result-item { background: var(--bg-dark); border: 1px solid var(--border); border-radius: 8px; padding: 12px; margin-bottom: 8px; transition: all 0.15s; }
         .search-result-item:hover { border-color: var(--accent); }
@@ -232,23 +233,25 @@
                         </div>
                     </div>
                     <div class="card-body" id="searchPanelBody">
-                        <div class="search-bar mb-3">
-                            <input type="text" class="form-control form-control-sm" id="searchQuery" placeholder="输入关键词搜索相关资料..." onkeydown="if(event.key==='Enter'){event.preventDefault();doSearch();}">
-                            <input type="number" class="form-control form-control-sm" id="searchMaxResults" value="10" min="1" max="20" title="结果数量" style="width:70px;">
-                            <select class="form-select form-select-sm" id="searchDepth" style="width:auto;min-width:90px;">
-                                <option value="basic">基础</option>
-                                <option value="advanced">深度</option>
-                            </select>
-                            <select class="form-select form-select-sm" id="searchTimeRange" style="width:auto;min-width:90px;">
-                                <option value="">不限时间</option>
-                                <option value="day">最近一天</option>
-                                <option value="week">最近一周</option>
-                                <option value="month">最近一月</option>
-                                <option value="year">最近一年</option>
-                            </select>
-                            <button class="btn btn-sm btn-accent" onclick="doSearch()" id="searchBtn">
-                                <i class="bi bi-search me-1"></i>搜索
-                            </button>
+                        <div class="mb-3">
+                            <div class="d-flex gap-1 mb-2 align-items-center" style="flex-wrap:wrap;">
+                                <input type="number" class="form-control" id="searchMaxResults" value="10" min="1" max="20" title="结果数量" style="width:52px;height:26px;font-size:0.75rem;padding:0 4px;text-align:center;">
+                                <select class="form-select" id="searchDepth" style="width:auto;min-width:68px;height:26px;font-size:0.75rem;padding:0 4px;">
+                                    <option value="basic">基础</option>
+                                    <option value="advanced">深度</option>
+                                </select>
+                                <select class="form-select" id="searchTimeRange" style="width:auto;min-width:68px;height:26px;font-size:0.75rem;padding:0 4px;">
+                                    <option value="">不限</option>
+                                    <option value="day">一天</option>
+                                    <option value="week">一周</option>
+                                    <option value="month">一月</option>
+                                    <option value="year">一年</option>
+                                </select>
+                                <button class="btn btn-accent" onclick="doSearch()" id="searchBtn" style="height:26px;font-size:0.75rem;padding:0 10px;">
+                                    <i class="bi bi-search"></i>
+                                </button>
+                            </div>
+                            <input type="text" class="form-control" id="searchQuery" placeholder="输入关键词搜索相关资料..." onkeydown="if(event.key==='Enter'){event.preventDefault();doSearch();}" style="font-size:1rem;padding:10px 14px;">
                         </div>
                         <div id="searchResults">
                             <div class="search-empty">
@@ -1016,6 +1019,15 @@
         } catch(e) {}
     }
 
+    function toggleSearchGroup(groupIdx) {
+        const groupEl = document.getElementById('search-group-' + groupIdx);
+        const iconEl = document.getElementById('search-group-icon-' + groupIdx);
+        if (!groupEl) return;
+        const isHidden = groupEl.style.display === 'none';
+        groupEl.style.display = isHidden ? '' : 'none';
+        if (iconEl) iconEl.className = isHidden ? 'bi bi-chevron-down' : 'bi bi-chevron-right';
+    }
+
     function renderAllSearchResults() {
         const resultsEl = document.getElementById('searchResults');
         const results = Object.values(searchResultsMap);
@@ -1032,10 +1044,18 @@
             groups[r.query].push(r);
         });
         let html = '';
+        let groupIdx = 0;
         for (const [query, items] of Object.entries(groups)) {
-            html += `<div class="mb-3"><div class="small text-warning fw-bold mb-1"><i class="bi bi-search me-1"></i>${escapeHtml(query)} <span class="text-muted fw-normal">(${items.length}条)</span></div>`;
+            const isCollapsed = groupIdx > 0; // 最近的搜索展开，旧的折叠
+            html += `<div class="mb-3">
+                <div class="d-flex align-items-center gap-2 mb-1" style="cursor:pointer;" onclick="toggleSearchGroup(${groupIdx})">
+                    <i class="bi ${isCollapsed ? 'bi-chevron-right' : 'bi-chevron-down'}" id="search-group-icon-${groupIdx}" style="font-size:0.85rem;color:var(--text-muted);"></i>
+                    <span class="small text-warning fw-bold"><i class="bi bi-search me-1"></i>${escapeHtml(query)} <span class="text-muted fw-normal">(${items.length}条)</span></span>
+                </div>
+                <div id="search-group-${groupIdx}" style="${isCollapsed ? 'display:none;' : ''}">`;
             items.forEach(r => { html += renderSearchResultFromDB(r); });
-            html += '</div>';
+            html += '</div></div>';
+            groupIdx++;
         }
         resultsEl.innerHTML = html;
     }