From 00609980a83946f279e9618525209ec151602a22 Mon Sep 17 00:00:00 2001
From: hz4th_coder <hz4th_coder@tphai.com>
Date: Tue, 14 Jul 2026 00:09:59 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=86=85=E5=AE=B9=E5=BA=93?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. 增加每页显示数量从20到100
2. 标题优先显示搜索标题，其次网页标题，最后来源
3. 详情页展示所有信息：搜索标题、网页标题、分类、来源、时间、链接、关键词、摘要、内容
---
 static/css/library.css | 13 +++++++++++++
 static/js/library.js   | 27 ++++++++++++++++++---------
 2 files changed, 31 insertions(+), 9 deletions(-)

diff --git a/static/css/library.css b/static/css/library.css
index c7bba5c..69160c2 100644
--- a/static/css/library.css
+++ b/static/css/library.css
@@ -241,6 +241,19 @@
     color: #667eea;
 }
 
+.article-page-title {
+    font-size: 13px;
+    color: #666;
+    margin-bottom: 10px;
+    padding: 4px 8px;
+    background: #e8f5e9;
+    border-radius: 4px;
+}
+
+.article-page-title i {
+    color: #4caf50;
+}
+
 .article-summary {
     font-size: 14px;
     color: #666;
diff --git a/static/js/library.js b/static/js/library.js
index f4741da..6b68e0f 100644
--- a/static/js/library.js
+++ b/static/js/library.js
@@ -4,7 +4,7 @@ const API_BASE = '';
 // 状态
 let articles = [];
 let currentPage = 1;
-let pageSize = 20;
+let pageSize = 100;  // 增加每页数量
 let totalCount = 0;
 let selectedIds = new Set();
 let currentArticleId = null;
@@ -98,6 +98,9 @@ function displayArticles() {
         const productNames = safeParseJSON(article.product_names, []);
         const keywords = safeParseJSON(article.keywords, []);
         
+        // 确定显示标题：优先 search_title，其次 product_names，最后来源
+        const displayTitle = article.search_title || productNames.join(', ') || article.source || '未命名';
+        
         return `
             <div class="article-card ${selectedIds.has(article.id) ? 'selected' : ''}" id="article-${article.id}">
                 <div class="article-card-header">
@@ -107,7 +110,7 @@ function displayArticles() {
                             onchange="toggleSelect(${article.id})">
                     </label>
                     <div class="article-title" onclick="showDetail(${article.id})">
-                        ${escapeHtml(productNames.join(', ') || '未命名')}
+                        ${escapeHtml(displayTitle)}
                     </div>
                     <div class="article-actions">
                         <button onclick="editArticle(${article.id})" class="btn btn-sm btn-secondary">
@@ -118,9 +121,9 @@ function displayArticles() {
                         </button>
                     </div>
                 </div>
-                ${article.search_title && article.search_title !== productNames.join(', ') ? `
-                    <div class="article-search-title">
-                        <i class="ri-search-line"></i> 搜索标题: ${escapeHtml(article.search_title)}
+                ${article.search_title && productNames.length > 0 && article.search_title !== productNames.join(', ') ? `
+                    <div class="article-page-title">
+                        <i class="ri-article-line"></i> 网页标题: ${escapeHtml(productNames.join(', '))}
                     </div>
                 ` : ''}
                 <div class="article-meta">
@@ -230,16 +233,22 @@ async function showDetail(id) {
     
     const body = document.getElementById('detail-body');
     body.innerHTML = `
+        ${article.search_title ? `
+            <div class="detail-section">
+                <h4><i class="ri-search-line"></i> 搜索标题</h4>
+                <p style="color: #667eea; font-weight: 500;">${escapeHtml(article.search_title)}</p>
+            </div>
+        ` : ''}
         <div class="detail-section">
-            <h4><i class="ri-price-tag-3-line"></i> 产品名称</h4>
-            <p>${escapeHtml(productNames.join(', '))}</p>
+            <h4><i class="ri-article-line"></i> 网页标题（产品名称）</h4>
+            <p>${escapeHtml(productNames.join(', ') || '无')}</p>
         </div>
-        <div class="detail-meta" style="display: flex; gap: 20px; background: #f8f9fa; padding: 15px; border-radius: 8px; margin-bottom: 20px;">
+        <div class="detail-meta" style="display: flex; gap: 20px; background: #f8f9fa; padding: 15px; border-radius: 8px; margin-bottom: 20px; flex-wrap: wrap;">
             <div><strong>分类:</strong> ${escapeHtml(article.category || '未分类')}</div>
             <div><strong>来源:</strong> ${escapeHtml(article.source)}</div>
             <div><strong>时间:</strong> ${formatDate(article.fetch_date)}</div>
         </div>
-        ${article.url ? `<div class="detail-section"><h4><i class="ri-link"></i> 原文链接</h4><a href="${escapeHtml(article.url)}" target="_blank">${escapeHtml(article.url)}</a></div>` : ''}
+        ${article.url ? `<div class="detail-section"><h4><i class="ri-link"></i> 原文链接</h4><a href="${escapeHtml(article.url)}" target="_blank" style="color: #667eea;">${escapeHtml(article.url)}</a></div>` : ''}
         ${keywords.length > 0 ? `<div class="detail-section"><h4><i class="ri-keyword-line"></i> 关键词</h4><p>${escapeHtml(keywords.join(', '))}</p></div>` : ''}
         <div class="detail-section">
             <h4><i class="ri-file-text-line"></i> 摘要</h4>