Rain-Bus
0d293422ac
- Replace image_extractor with pdf_image_extractor service - Enhance pi_client with expanded API capabilities - Improve summarizer service with additional features - Update admin routes with more endpoints - Add login page template - Enhance detail page with comprehensive layout - Improve search and trends pages - Update base template with additional elements - Refactor tests for better coverage - Add validate_summary script - Update project configuration and dependencies
521 lines
16 KiB
HTML
521 lines
16 KiB
HTML
{% extends "base.html" %} {% block title %}{{ page_title }} — HF Daily Papers{%
|
||
endblock %} {% block content %}
|
||
<article class="paper-detail">
|
||
<a href="/day/{{ paper.paper_date.isoformat() }}" class="back-link"
|
||
>← 返回 {{ paper.paper_date.isoformat() }}</a
|
||
>
|
||
|
||
{# 标题 #}
|
||
<h1 class="detail-title">
|
||
{{ paper.title_zh or paper.title_en }} {% if paper.title_zh and
|
||
paper.title_en != paper.title_zh %}
|
||
<small class="title-en">{{ paper.title_en }}</small>
|
||
{% endif %}
|
||
</h1>
|
||
|
||
{# 元信息 #}
|
||
<div class="detail-meta">
|
||
<span class="detail-authors"
|
||
>{{ paper.authors|map(attribute='name')|join(', ') }}</span
|
||
>
|
||
<span class="detail-date"
|
||
>📅 {{ paper.published_at or paper.paper_date }}</span
|
||
>
|
||
<span class="detail-upvotes">👍 {{ paper.upvotes }}</span>
|
||
</div>
|
||
|
||
{# 标签 #} {% if paper.tags %}
|
||
<div class="detail-tags">
|
||
{% for tag in paper.tags %}
|
||
<span class="tag">{{ tag.tag }}</span>
|
||
{% endfor %}
|
||
</div>
|
||
{% endif %} {# 链接 #}
|
||
<div class="detail-links">
|
||
{% if paper.arxiv_url %}<a
|
||
href="{{ paper.arxiv_url }}"
|
||
target="_blank"
|
||
class="ext-link"
|
||
>arXiv</a
|
||
>{% endif %} {% if paper.hf_url %}<a
|
||
href="{{ paper.hf_url }}"
|
||
target="_blank"
|
||
class="ext-link"
|
||
>HuggingFace</a
|
||
>{% endif %} {% if paper.pdf_url %}<a
|
||
href="{{ paper.pdf_url }}"
|
||
target="_blank"
|
||
class="ext-link"
|
||
>PDF</a
|
||
>{% endif %}
|
||
</div>
|
||
|
||
{# 总结内容 — 按状态降级 #} {% if summary_state == 'done' and paper.summary %}
|
||
{% if paper.summary_status and paper.summary_status.quality == 'low' %}
|
||
<div class="quality-warning">⚠️ AI 总结质量较低，仅供参考</div>
|
||
{% elif paper.summary_status and paper.summary_status.quality == 'degraded' %}
|
||
<div class="quality-warning">📝 总结部分字段不完整</div>
|
||
{% endif %} {% if paper.summary.one_line %}
|
||
<section class="summary-section">
|
||
<p class="one-line">{{ paper.summary.one_line }}</p>
|
||
</section>
|
||
{% endif %}
|
||
|
||
{# ── 前置知识 ── #}
|
||
{% if prereqs and prereqs.concepts %}
|
||
<section class="summary-section">
|
||
<h2>前置知识</h2>
|
||
<div class="prerequisites-list">
|
||
{% for c in prereqs.concepts %}
|
||
<div class="concept-card">
|
||
<h3>{{ c.term }}</h3>
|
||
<p>{{ c.explanation }}</p>
|
||
{% if c.why_matters %}
|
||
<p class="concept-why">{{ c.why_matters }}</p>
|
||
{% endif %}
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
</section>
|
||
{% endif %}
|
||
|
||
{# ── 研究动机 ── #}
|
||
{% if paper.summary.motivation_problem %}
|
||
<section class="summary-section">
|
||
<h2>研究动机</h2>
|
||
<div class="motivation-block">
|
||
{% if paper.summary.motivation_problem %}
|
||
<p>{{ paper.summary.motivation_problem }}</p>
|
||
{% endif %}
|
||
{% if paper.summary.motivation_goal %}
|
||
<p>本文的目标是{{ paper.summary.motivation_goal }}</p>
|
||
{% endif %}
|
||
{% if paper.summary.motivation_gap %}
|
||
<p>与已有工作不同的是，{{ paper.summary.motivation_gap }}</p>
|
||
{% endif %}
|
||
</div>
|
||
</section>
|
||
{% endif %}
|
||
|
||
{# ── 核心方法 ── #}
|
||
{% if paper.summary.method_key_idea %}
|
||
<section class="summary-section">
|
||
<h2>核心方法</h2>
|
||
{% if paper.summary.method_overview %}
|
||
<p>{{ paper.summary.method_overview }}</p>
|
||
{% endif %}
|
||
<div class="key-idea">
|
||
<p>{{ paper.summary.method_key_idea }}</p>
|
||
</div>
|
||
{% if paper.summary.method_steps_json %}
|
||
<details>
|
||
<summary>方法步骤详情</summary>
|
||
<p>{{ paper.summary.method_steps_json }}</p>
|
||
</details>
|
||
{% endif %}
|
||
{% if paper.summary.method_novelty %}
|
||
<details>
|
||
<summary>技术新颖性</summary>
|
||
<p>{{ paper.summary.method_novelty }}</p>
|
||
</details>
|
||
{% endif %}
|
||
</section>
|
||
{% endif %}
|
||
|
||
{# ── 实验结果 ── #}
|
||
{% if paper.summary.results_main_json %}
|
||
<section class="summary-section">
|
||
<h2>实验结果</h2>
|
||
<p>{{ paper.summary.results_main_json }}</p>
|
||
{% if table_figures and table_figures|length > 0 %}
|
||
{# 优先展示原文表格截图 #}
|
||
{% for tf in table_figures %}
|
||
<figure class="inline-figure table-screenshot">
|
||
<img src="{{ tf.image_url }}" alt="{{ tf.caption or tf.id }}" loading="lazy" />
|
||
<figcaption>
|
||
<strong>{{ tf.id }}</strong>{% if tf.caption %}: {{ tf.caption }}{% endif %}
|
||
</figcaption>
|
||
</figure>
|
||
{% endfor %}
|
||
{% if benchmarks and benchmarks|length > 0 %}
|
||
<details>
|
||
<summary>查看结构化数据</summary>
|
||
<table class="benchmarks-table">
|
||
<thead>
|
||
<tr><th>任务</th><th>指标</th><th>本文</th><th>基线</th><th>提升</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for b in benchmarks %}
|
||
{% if b is mapping %}
|
||
<tr>
|
||
<td>{{ b.get('task','') }}</td>
|
||
<td>{{ b.get('metric','') }}</td>
|
||
<td><strong>{{ b.get('this_work','') }}</strong></td>
|
||
<td>{{ b.get('baseline','') }}</td>
|
||
<td class="improvement">{{ b.get('improvement','') }}</td>
|
||
</tr>
|
||
{% endif %}
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</details>
|
||
{% endif %}
|
||
{% elif benchmarks and benchmarks|length > 0 %}
|
||
{# 无截图时回退到 HTML 表格 #}
|
||
<table class="benchmarks-table">
|
||
<thead>
|
||
<tr><th>任务</th><th>指标</th><th>本文</th><th>基线</th><th>提升</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for b in benchmarks %}
|
||
{% if b is mapping %}
|
||
<tr>
|
||
<td>{{ b.get('task','') }}</td>
|
||
<td>{{ b.get('metric','') }}</td>
|
||
<td><strong>{{ b.get('this_work','') }}</strong></td>
|
||
<td>{{ b.get('baseline','') }}</td>
|
||
<td class="improvement">{{ b.get('improvement','') }}</td>
|
||
</tr>
|
||
{% endif %}
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
{% endif %}
|
||
</section>
|
||
{% endif %}
|
||
|
||
{# ── 局限与改进 ── #}
|
||
{% if paper.summary.limitations_json or paper.summary.weaknesses_json or paper.summary.future_work_json %}
|
||
<section class="summary-section">
|
||
<h2>局限与改进</h2>
|
||
{% if paper.summary.limitations_json %}
|
||
<p>{{ paper.summary.limitations_json }}</p>
|
||
{% endif %}
|
||
{% if paper.summary.weaknesses_json %}
|
||
<details>
|
||
<summary>独立分析的弱点</summary>
|
||
<p>{{ paper.summary.weaknesses_json }}</p>
|
||
</details>
|
||
{% endif %}
|
||
{% if paper.summary.future_work_json %}
|
||
<details>
|
||
<summary>未来方向</summary>
|
||
<p>{{ paper.summary.future_work_json }}</p>
|
||
</details>
|
||
{% endif %}
|
||
{% if paper.summary.reproducibility %}
|
||
<details>
|
||
<summary>复现评估</summary>
|
||
<p>{{ paper.summary.reproducibility }}</p>
|
||
</details>
|
||
{% endif %}
|
||
</section>
|
||
{% endif %} {% elif summary_state == 'processing' %}
|
||
<div class="summary-placeholder processing">
|
||
<p>🔄 正在生成 AI 总结，请稍后刷新页面</p>
|
||
</div>
|
||
|
||
{% elif summary_state in ('failed', 'permanent_failure') %}
|
||
<div class="summary-placeholder failed">
|
||
<p>
|
||
❌ 总结生成失败{% if paper.summary_status and
|
||
paper.summary_status.error_type %}（{{ paper.summary_status.error_type
|
||
}}）{% endif %}
|
||
</p>
|
||
{% if paper.summary_status and paper.summary_status.error %}
|
||
<p class="error-detail">{{ paper.summary_status.error }}</p>
|
||
{% endif %}
|
||
</div>
|
||
|
||
{% else %}
|
||
<div class="summary-placeholder none">
|
||
<p>📝 AI 总结尚未生成</p>
|
||
</div>
|
||
{% endif %} {# 英文摘要 — 始终显示 #} {% if paper.abstract %}
|
||
<section class="summary-section abstract-section">
|
||
<h2>Abstract</h2>
|
||
<p class="abstract-en">{{ paper.abstract }}</p>
|
||
</section>
|
||
{% endif %}
|
||
|
||
{# ── 论文图表（关联 figures 元数据）── #}
|
||
{% if figures or paper_images %}
|
||
<section class="image-gallery">
|
||
<h2>论文图表</h2>
|
||
{% for fig in figures %}
|
||
<figure class="inline-figure">
|
||
{% if fig.image_url %}
|
||
<img src="{{ fig.image_url }}" alt="{{ fig.caption or fig.id }}" loading="lazy" />
|
||
{% endif %}
|
||
<figcaption>
|
||
<strong>{{ fig.id }}</strong>{% if fig.caption %}: {{ fig.caption }}{% endif %}
|
||
{% if fig.description %}
|
||
<p>{{ fig.description }}</p>
|
||
{% endif %}
|
||
{% if fig.reason %}
|
||
<p class="concept-why">{{ fig.reason }}</p>
|
||
{% endif %}
|
||
</figcaption>
|
||
</figure>
|
||
{% endfor %}
|
||
{# 如果有图片但没有对应的 figures 元数据，仍然展示 #}
|
||
{% if not figures and paper_images %}
|
||
<div class="gallery-grid">
|
||
{% for img in paper_images %}
|
||
<div class="gallery-item">
|
||
<img src="{{ img.url }}" alt="{{ img.name }}" loading="lazy" />
|
||
<div class="gallery-caption">{{ img.name }}</div>
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
{% endif %}
|
||
</section>
|
||
{% endif %} {% if similar_papers %}
|
||
<section class="similar-papers">
|
||
<h2>相似论文推荐</h2>
|
||
{% for sp in similar_papers %}
|
||
<div class="similar-paper-item">
|
||
<span class="similar-paper-title">
|
||
<a href="/paper/{{ sp.arxiv_id }}">{{ sp.title_zh }}</a>
|
||
</span>
|
||
<span class="similar-paper-dist"
|
||
>🎯 {{ "%.3f"|format(sp.distance) }}</span
|
||
>
|
||
</div>
|
||
{% endfor %}
|
||
</section>
|
||
{% endif %}
|
||
</article>
|
||
{% endblock %}
|
||
|
||
{% block scripts %}
|
||
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.js"></script>
|
||
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/contrib/auto-render.min.js"
|
||
onload="renderMathInElement(document.querySelector('.paper-detail'),{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false}]});">
|
||
</script>
|
||
<style>
|
||
.lightbox-overlay {
|
||
position: fixed !important;
|
||
top: 0 !important;
|
||
left: 0 !important;
|
||
right: 0 !important;
|
||
bottom: 0 !important;
|
||
width: 100vw !important;
|
||
height: 100vh !important;
|
||
z-index: 99999 !important;
|
||
background: rgba(0, 0, 0, 0.85);
|
||
overflow: hidden;
|
||
margin: 0 !important;
|
||
padding: 0 !important;
|
||
opacity: 0;
|
||
transition: opacity 0.2s;
|
||
}
|
||
.lightbox-overlay.active {
|
||
opacity: 1;
|
||
}
|
||
.lightbox-overlay img {
|
||
position: absolute;
|
||
transform-origin: 0 0;
|
||
border-radius: 4px;
|
||
box-shadow: 0 0 40px rgba(0, 0, 0, 0.4);
|
||
cursor: grab;
|
||
user-select: none;
|
||
-webkit-user-drag: none;
|
||
}
|
||
.lightbox-overlay img.dragging {
|
||
cursor: grabbing;
|
||
}
|
||
/* 工具栏 */
|
||
.lightbox-toolbar {
|
||
position: absolute;
|
||
bottom: 24px;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
display: flex;
|
||
gap: 8px;
|
||
background: rgba(0, 0, 0, 0.6);
|
||
padding: 8px 14px;
|
||
border-radius: 24px;
|
||
z-index: 100000;
|
||
}
|
||
.lightbox-toolbar button {
|
||
background: none;
|
||
border: 1px solid rgba(255,255,255,0.3);
|
||
color: #fff;
|
||
width: 36px;
|
||
height: 36px;
|
||
border-radius: 50%;
|
||
font-size: 1.1rem;
|
||
cursor: pointer;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
transition: background 0.15s;
|
||
}
|
||
.lightbox-toolbar button:hover {
|
||
background: rgba(255,255,255,0.15);
|
||
}
|
||
</style>
|
||
<script>
|
||
(function() {
|
||
function openLightbox(src, alt) {
|
||
var existing = document.querySelector('.lightbox-overlay');
|
||
if (existing) existing.remove();
|
||
|
||
var overlay = document.createElement('div');
|
||
overlay.className = 'lightbox-overlay';
|
||
|
||
var img = document.createElement('img');
|
||
img.src = src;
|
||
img.alt = alt || '';
|
||
img.draggable = false;
|
||
|
||
// 工具栏
|
||
var toolbar = document.createElement('div');
|
||
toolbar.className = 'lightbox-toolbar';
|
||
toolbar.innerHTML =
|
||
'<button title="缩小">−</button>' +
|
||
'<button title="放大">+</button>' +
|
||
'<button title="适合窗口">⊡</button>' +
|
||
'<button title="原始大小">1:1</button>' +
|
||
'<button title="关闭">✕</button>';
|
||
|
||
overlay.appendChild(img);
|
||
overlay.appendChild(toolbar);
|
||
document.body.appendChild(overlay);
|
||
|
||
// 视图状态
|
||
var scale = 1, tx = 0, ty = 0;
|
||
var baseW = 0, baseH = 0;
|
||
var dragging = false, dragStartX = 0, dragStartY = 0, startTx = 0, startTy = 0;
|
||
|
||
function apply() {
|
||
img.style.transform = 'translate(' + tx + 'px,' + ty + 'px) scale(' + scale + ')';
|
||
}
|
||
|
||
function fitToScreen() {
|
||
if (!baseW) return;
|
||
var sw = window.innerWidth, sh = window.innerHeight;
|
||
scale = Math.min(sw * 0.9 / baseW, sh * 0.9 / baseH, 1);
|
||
tx = (sw - baseW * scale) / 2;
|
||
ty = (sh - baseH * scale) / 2;
|
||
apply();
|
||
}
|
||
|
||
function resetOrigin() {
|
||
scale = 1;
|
||
tx = (window.innerWidth - baseW) / 2;
|
||
ty = (window.innerHeight - baseH) / 2;
|
||
apply();
|
||
}
|
||
|
||
function zoomAt(factor, cx, cy) {
|
||
var newScale = Math.max(0.1, Math.min(scale * factor, 20));
|
||
// 保持鼠标指向的图片点不变
|
||
tx = cx - (cx - tx) * (newScale / scale);
|
||
ty = cy - (ty - ty) * (newScale / scale); // 这行有误，下面修正
|
||
scale = newScale;
|
||
apply();
|
||
}
|
||
|
||
function zoomCenter(factor) {
|
||
var cx = window.innerWidth / 2;
|
||
var cy = window.innerHeight / 2;
|
||
var newScale = Math.max(0.1, Math.min(scale * factor, 20));
|
||
tx = cx - (cx - tx) * (newScale / scale);
|
||
ty = cy - (cy - ty) * (newScale / scale);
|
||
scale = newScale;
|
||
apply();
|
||
}
|
||
|
||
// 图片加载后初始化
|
||
img.onload = function() {
|
||
baseW = img.naturalWidth;
|
||
baseH = img.naturalHeight;
|
||
fitToScreen();
|
||
};
|
||
// 如果已缓存
|
||
if (img.complete && img.naturalWidth) {
|
||
baseW = img.naturalWidth;
|
||
baseH = img.naturalHeight;
|
||
fitToScreen();
|
||
}
|
||
|
||
// 工具栏按钮
|
||
var btns = toolbar.querySelectorAll('button');
|
||
// 缩小 / 放大 / 适合 / 原始 / 关闭
|
||
btns[0].onclick = function(e) { e.stopPropagation(); zoomCenter(0.7); };
|
||
btns[1].onclick = function(e) { e.stopPropagation(); zoomCenter(1.4); };
|
||
btns[2].onclick = function(e) { e.stopPropagation(); fitToScreen(); };
|
||
btns[3].onclick = function(e) { e.stopPropagation(); resetOrigin(); };
|
||
btns[4].onclick = function(e) { e.stopPropagation(); close(); };
|
||
|
||
// 滚轮缩放（以鼠标为中心）
|
||
overlay.addEventListener('wheel', function(e) {
|
||
e.preventDefault();
|
||
var factor = e.deltaY < 0 ? 1.15 : 0.87;
|
||
var rect = overlay.getBoundingClientRect();
|
||
var cx = e.clientX - rect.left;
|
||
var cy = e.clientY - rect.top;
|
||
var newScale = Math.max(0.1, Math.min(scale * factor, 20));
|
||
tx = cx - (cx - tx) * (newScale / scale);
|
||
ty = cy - (cy - ty) * (newScale / scale);
|
||
scale = newScale;
|
||
apply();
|
||
}, { passive: false });
|
||
|
||
// 拖拽平移
|
||
overlay.addEventListener('pointerdown', function(e) {
|
||
if (e.target.closest('.lightbox-toolbar')) return;
|
||
dragging = true;
|
||
dragStartX = e.clientX;
|
||
dragStartY = e.clientY;
|
||
startTx = tx;
|
||
startTy = ty;
|
||
img.classList.add('dragging');
|
||
overlay.setPointerCapture(e.pointerId);
|
||
});
|
||
overlay.addEventListener('pointermove', function(e) {
|
||
if (!dragging) return;
|
||
tx = startTx + (e.clientX - dragStartX);
|
||
ty = startTy + (e.clientY - dragStartY);
|
||
apply();
|
||
});
|
||
overlay.addEventListener('pointerup', function() {
|
||
dragging = false;
|
||
img.classList.remove('dragging');
|
||
});
|
||
|
||
// ESC 关闭
|
||
function onKey(e) {
|
||
if (e.key === 'Escape') { close(); }
|
||
else if (e.key === '+' || e.key === '=') { zoomCenter(1.4); }
|
||
else if (e.key === '-') { zoomCenter(0.7); }
|
||
else if (e.key === '0') { fitToScreen(); }
|
||
}
|
||
|
||
function close() {
|
||
overlay.remove();
|
||
document.removeEventListener('keydown', onKey);
|
||
}
|
||
|
||
document.addEventListener('keydown', onKey);
|
||
|
||
// 激活动画
|
||
requestAnimationFrame(function() {
|
||
overlay.classList.add('active');
|
||
});
|
||
}
|
||
|
||
document.addEventListener('click', function(e) {
|
||
var img = e.target;
|
||
if (img.tagName !== 'IMG') return;
|
||
if (!img.closest('.inline-figure') && !img.closest('.gallery-item')) return;
|
||
if (img.closest('.lightbox-overlay')) return;
|
||
e.preventDefault();
|
||
openLightbox(img.src, img.alt);
|
||
});
|
||
})();
|
||
</script>
|
||
{% endblock %}
|