Fix visualization: build before delete, add text scene vis, click-to-show

app.py

@@ -1,12 +1,13 @@
 """FastAPI 主服务 — HF Spaces CPU 部署版
 
-改动点（相比原项目）：
-1. 端口改为 7860（HF Spaces Docker 默认端口）
-2. MASt3R 模型加载返回 None，SceneMatcher 使用 DINOv2-only 模式
-3. Qdrant 使用嵌入式本地文件模式
-4. 新增历史图片管理 API（查看/删除）
-5. 新增图片文件服务 API
-6. detect 响应中包含 patch 匹配可视化数据
+改动点：
+1. 端口 7860（HF Spaces）
+2. MASt3R 已禁用，SceneMatcher 使用 DINOv2-only
+3. Qdrant 嵌入式本地文件模式
+4. 历史图片管理 API
+5. 图片文件服务 API
+6. 可视化在删除文件之前生成，支持复杂+文本场景
+7. 可视化按需展示（前端点击按钮触发）
 """
 import os
 import asyncio
@@ -55,13 +56,11 @@ session_data = {
 
 resource_monitor = ResourceMonitor(sample_interval=0.5)
 
-# 用户 Qdrant 缓存: {username: {scene_type: {pid: entry}}}
 _qd_caches = {}
 
 
 @asynccontextmanager
 async def lifespan(app):
-    """FastAPI 生命周期管理：启动时加载模型，关闭时写入日志"""
     global matcher, dinov2_extractor, ocr_engine, bge_tokenizer, bge_model, session_data
 
     startup_t0 = time.perf_counter()
@@ -78,7 +77,6 @@ async def lifespan(app):
     model_load_time = time.perf_counter() - startup_t0
     print(f'[启动] 模型加载完成: {model_load_time:.1f}s')
 
-    # 启动时预加载所有用户 Qdrant 缓存
     qdrant_t0 = time.perf_counter()
     if os.path.isdir(HISTORY_BASE):
         for uname in os.listdir(HISTORY_BASE):
@@ -105,7 +103,7 @@ async def lifespan(app):
     qdrant_load_time = time.perf_counter() - qdrant_t0
     print(f"[qdrant] 缓存检查完成: {len(_qd_caches)} 个用户 ({qdrant_load_time:.1f}s)")
     total_startup = time.perf_counter() - startup_t0
-    print(f"[启动] 总启动时间: {total_startup:.1f}s")
+    print(f'[启动] 总启动时间: {total_startup:.1f}s')
 
     yield
 
@@ -161,7 +159,6 @@ async def login(username: str = Form(...)):
 
 @app.get("/api/history")
 async def list_history(username: str):
-    """获取指定用户的历史图片列表"""
     try:
         uname = validate_username(username)
     except ValueError as e:
@@ -184,7 +181,6 @@ async def list_history(username: str):
 
 @app.get("/api/all_users")
 async def list_all_users():
-    """获取所有用户及其图片数量"""
     users = []
     if os.path.isdir(HISTORY_BASE):
         for uname in sorted(os.listdir(HISTORY_BASE)):
@@ -202,8 +198,6 @@ async def list_all_users():
 
 @app.get("/api/image/{username}/{filename}")
 async def serve_image(username: str, filename: str):
-    """提供历史图片文件服务"""
-    # 安全检查：防止路径遍历
     uname = validate_username(username)
     safe_name = os.path.basename(filename)
     user_dir = get_user_dir(uname)
@@ -212,7 +206,6 @@ async def serve_image(username: str, filename: str):
     if not os.path.exists(img_path):
         raise HTTPException(status_code=404, detail="图片不存在")
 
-    # 验证文件在用户目录内
     if not os.path.abspath(img_path).startswith(os.path.abspath(user_dir)):
         raise HTTPException(status_code=403, detail="无权访问")
 
@@ -221,7 +214,6 @@ async def serve_image(username: str, filename: str):
 
 @app.post("/api/delete_image")
 async def delete_image(username: str = Form(...), filename: str = Form(...)):
-    """删除指定用户的历史图片（同时删除 Qdrant 中的数据）"""
     global _qd_caches
     try:
         uname = validate_username(username)
@@ -238,10 +230,8 @@ async def delete_image(username: str = Form(...), filename: str = Form(...)):
     if not os.path.abspath(img_path).startswith(os.path.abspath(user_dir)):
         raise HTTPException(status_code=403, detail="无权操作")
 
-    # 1. 从 Qdrant 中删除
     try:
         remove_from_qdrant(uname, img_path, scene_type=None)
-        # 刷新内存缓存
         if uname in _qd_caches:
             _qd_caches[uname] = {
                 'text': qdrant_query_scene(uname, 'text'),
@@ -250,10 +240,8 @@ async def delete_image(username: str = Form(...), filename: str = Form(...)):
     except Exception as e:
         print(f"  [删除] Qdrant 清理失败: {e}")
 
-    # 2. 删除文件
     delete_file(img_path)
 
-    # 3. 更新 metadata
     from module.file_manager import load_metadata, save_metadata
     metadata = load_metadata(user_dir)
     metadata['images'] = [m for m in metadata['images']
@@ -301,7 +289,6 @@ def _run_detect_pipeline(uploaded_paths, uname, ocr_engine, bge_tokenizer,
 
     if has_cache:
         cache_used = True
-        print(f"[qdrant] 使用 ANN 搜索管线 (用户 [{uname}], 场景={scene_type_q})")
         final_result, evaluation_logs, best_match = evaluate_scene_consistency_cached(
             matcher, uploaded_paths, uname,
             ocr_engine, bge_tokenizer, bge_model,
@@ -312,7 +299,6 @@ def _run_detect_pipeline(uploaded_paths, uname, ocr_engine, bge_tokenizer,
         )
 
     if not cache_used:
-        print(f"[qdrant] 缓存不可用，回退到原始管线 (用户 [{uname}])")
         final_result, evaluation_logs, best_match = evaluate_scene_consistency(
             matcher, uploaded_paths, history_before,
             ocr_engine, bge_tokenizer, bge_model,
@@ -323,6 +309,33 @@ def _run_detect_pipeline(uploaded_paths, uname, ocr_engine, bge_tokenizer,
         if log['is_same_scene'] and log['query_path'] in uploaded_paths:
             same_scene_paths.add(log['query_path'])
 
+    # ★★★ 关键修复：先构建可视化，再删除文件 ★★★
+    visualization_data = []
+    for log in evaluation_logs:
+        if log.get('is_same_scene'):
+            scene_type = log.get('scene_type', 'complex')
+            if scene_type == 'complex':
+                patch_info = log.get('patch_match_info')
+                if patch_info is None and dinov2_extractor is not None:
+                    # patch_match_info 可能为 None（dinov2_sim_override 模式下）
+                    # 重新用模型推理获取 patch 匹配
+                    q_path = log.get('query_path', '')
+                    h_path = log.get('history_path', '')
+                    if os.path.exists(q_path) and os.path.exists(h_path):
+                        try:
+                            patch_info = dinov2_extractor.compute_patch_matches(q_path, h_path, top_k=50)
+                        except Exception as e:
+                            print(f"  [可视化] 重新计算 patch 匹配失败: {e}")
+                if patch_info:
+                    vis = _build_complex_visualization(log, patch_info)
+                    if vis:
+                        visualization_data.append(vis)
+            elif scene_type == 'text':
+                vis = _build_text_visualization(log)
+                if vis:
+                    visualization_data.append(vis)
+
+    # 现在才删除同一场景的文件
     for path in same_scene_paths:
         delete_file(path)
 
@@ -333,7 +346,7 @@ def _run_detect_pipeline(uploaded_paths, uname, ocr_engine, bge_tokenizer,
         else:
             per_image_results[path] = '通过' if final_result else '未通过'
 
-    return final_result, evaluation_logs, best_match, scene_type_q, same_scene_paths, per_image_results, cache_used, precomputed_text, precomputed_bge, precomputed_dinov2
+    return final_result, evaluation_logs, best_match, scene_type_q, same_scene_paths, per_image_results, cache_used, precomputed_text, precomputed_bge, precomputed_dinov2, visualization_data
 
 
 @app.post("/api/detect")
@@ -390,7 +403,7 @@ async def detect(
             ],
             "evaluation_logs": [],
             "best_match": None,
-            "gamma_warnings": [],
+            "visualizations": [],
         }
 
     pre_stats = _snapshot()
@@ -398,7 +411,7 @@ async def detect(
     resource_monitor.start_monitoring()
 
     loop = asyncio.get_event_loop()
-    final_result, evaluation_logs, best_match, scene_type_q, same_scene_paths, per_image_results, cache_used, precomp_text, precomp_bge, precomp_dino = \
+    final_result, evaluation_logs, best_match, scene_type_q, same_scene_paths, per_image_results, cache_used, precomp_text, precomp_bge, precomp_dino, visualization_data = \
         await loop.run_in_executor(
             executor, _run_detect_pipeline,
             uploaded_paths, uname, ocr_engine, bge_tokenizer,
@@ -408,19 +421,6 @@ async def detect(
     peak = resource_monitor.stop_monitoring()
     detect_duration = asyncio.get_event_loop().time() - detect_start_time
 
-    n_query = len(uploaded_paths)
-    n_pairs = len(evaluation_logs)
-    if peak:
-        print(f"检测完成 | 耗时: {detect_duration:.1f}s | 查询图: {n_query} | 比对数: {n_pairs} | 缓存: {'ON' if cache_used else 'OFF'}")
-
-    detection_record = {
-        'pre_stats': pre_stats,
-        'peak': peak,
-        'duration_sec': round(detect_duration, 1),
-        'cache_used': cache_used,
-    }
-    session_data['detections'].append(detection_record)
-
     kept_saved_info = [(orig, p) for orig, p in saved_info if p not in same_scene_paths]
     update_metadata(user_dir, kept_saved_info, per_image_results)
 
@@ -450,18 +450,6 @@ async def detect(
 
     loop.run_in_executor(executor, _post_update_qdrant)
 
-    gamma_warnings = []
-
-    # 构建可视化数据：对判定为同一场景的日志，生成 patch 匹配可视化图
-    visualization_data = []
-    for log in evaluation_logs:
-        if log.get('is_same_scene') and log.get('scene_type') == 'complex':
-            patch_info = log.get('patch_match_info')
-            if patch_info:
-                vis = _build_visualization(log, patch_info, uname)
-                if vis:
-                    visualization_data.append(vis)
-
     best_match_response = None
     if best_match:
         best_match_response = {
@@ -471,7 +459,6 @@ async def detect(
             'match_count': best_match['match_count'],
             'inlier_ratio': best_match['inlier_ratio'],
             'avg_confidence': best_match['avg_confidence'],
-            'gamma_info': best_match.get('gamma_info', []),
         }
 
     return {
@@ -485,15 +472,8 @@ async def detect(
                 "query_image": log['query_image'],
                 "history_image": log['history_image'],
                 "scene_type": log.get('scene_type', 'complex'),
-                "doc_score1": log.get('doc_score1', 0),
-                "doc_score2": log.get('doc_score2', 0),
                 "similarity_score": log['similarity_score'],
                 "match_count": log['match_count'],
-                "raw_match_count": log.get('raw_match_count', 0),
-                "inlier_ratio": log['inlier_ratio'],
-                "avg_confidence": log['avg_confidence'],
-                "mast3r_is_same": log.get('mast3r_is_same'),
-                "dinov2_is_same": log.get('dinov2_is_same'),
                 "dinov2_similarity": log.get('dinov2_similarity'),
                 "text_similarity": log.get('text_similarity'),
                 "bge_search_score": log.get('bge_search_score'),
@@ -503,20 +483,15 @@ async def detect(
             for log in evaluation_logs
         ],
         "best_match": best_match_response,
-        "gamma_warnings": gamma_warnings,
         "visualizations": visualization_data,
     }
 
 
-def _build_visualization(log_entry, patch_info, username):
-    """根据 patch 匹配信息生成可视化图（base64 编码）
-
-    在两张图片上绘制 patch 匹配连线，展示匹配内点。
-    """
+def _build_complex_visualization(log_entry, patch_info):
+    """复杂场景可视化：DINOv2 patch 匹配连线和矩形框"""
     try:
         import cv2
         import numpy as np
-        from PIL import Image
 
         q_path = log_entry.get('query_path', '')
         h_path = log_entry.get('history_path', '')
@@ -524,13 +499,11 @@ def _build_visualization(log_entry, patch_info, username):
         if not os.path.exists(q_path) or not os.path.exists(h_path):
             return None
 
-        # 读取图片
-        img1 = cv2.imread(q_path)
-        img2 = cv2.imread(h_path)
+        img1 = cv2.imdecode(np.fromfile(q_path, dtype=np.uint8), cv2.IMREAD_COLOR)
+        img2 = cv2.imdecode(np.fromfile(h_path, dtype=np.uint8), cv2.IMREAD_COLOR)
         if img1 is None or img2 is None:
             return None
 
-        # 缩放到统一高度
         max_h = 400
         scale1 = max_h / img1.shape[0]
         scale2 = max_h / img2.shape[0]
@@ -540,81 +513,68 @@ def _build_visualization(log_entry, patch_info, username):
         h1, w1 = img1.shape[:2]
         h2, w2 = img2.shape[:2]
 
-        # 获取 patch 匹配信息
         matches = patch_info.get('matches', [])
         q_grid = patch_info.get('query_grid', (37, 37))
         h_grid = patch_info.get('hist_grid', (37, 37))
         q_orig_size = patch_info.get('query_image_size', (w1, h1))
         h_orig_size = patch_info.get('hist_image_size', (w2, h2))
 
-        # 将 patch 索引转换为像素坐标（patch 中心点）
         q_n_h, q_n_w = q_grid
         h_n_h, h_n_w = h_grid
 
-        # 原始图片中每个 patch 覆盖的像素区域
         q_pw = q_orig_size[0] / q_n_w
         q_ph = q_orig_size[1] / q_n_h
         h_pw = h_orig_size[0] / h_n_w
         h_ph = h_orig_size[1] / h_n_h
 
-        # 缩放后的 patch 尺寸
         q_pw_s = q_pw * scale1
         q_ph_s = q_ph * scale1
         h_pw_s = h_pw * scale2
         h_ph_s = h_ph * scale2
 
-        # 拼接两张图片（水平排列）
         gap = 20
-        canvas = np.ones((max(max_h, max_h), w1 + gap + w2, 3), dtype=np.uint8) * 240
+        canvas = np.ones((max_h, w1 + gap + w2, 3), dtype=np.uint8) * 240
         canvas[:h1, :w1] = img1
         canvas[:h2, w1+gap:] = img2
 
-        # 绘制匹配连线和 patch 区域
         for qi, hi, sim in matches:
-            # patch 索引 → 行列
             q_row, q_col = qi // q_n_w, qi % q_n_w
             h_row, h_col = hi // h_n_w, hi % h_n_w
 
-            # patch 中心坐标（缩放后）
             q_cx = int((q_col + 0.5) * q_pw_s)
             q_cy = int((q_row + 0.5) * q_ph_s)
             h_cx = int(w1 + gap + (h_col + 0.5) * h_pw_s)
             h_cy = int((h_row + 0.5) * h_ph_s)
 
-            # 颜色：相似度越高越绿，越低越黄
             intensity = min(1.0, max(0.0, (sim - 0.3) / 0.7))
             color = (0, int(200 * intensity + 55), int(255 * (1 - intensity)))
 
-            # 绘制连线
             cv2.line(canvas, (q_cx, q_cy), (h_cx, h_cy), color, 1, cv2.LINE_AA)
 
-            # 绘制 patch 矩形（左图）
             q_x1 = int(q_col * q_pw_s)
             q_y1 = int(q_row * q_ph_s)
             cv2.rectangle(canvas, (q_x1, q_y1),
                           (min(q_x1 + int(q_pw_s), w1-1), min(q_y1 + int(q_ph_s), h1-1)),
                           color, 1)
 
-            # 绘制 patch 矩形（右图）
             h_x1 = int(w1 + gap + h_col * h_pw_s)
             h_y1 = int(h_row * h_ph_s)
             cv2.rectangle(canvas, (h_x1, h_y1),
                           (min(h_x1 + int(h_pw_s), w1+gap+w2-1), min(h_y1 + int(h_ph_s), h2-1)),
                           color, 1)
 
-        # 添加文字��注
         n_matches = len(matches)
         avg_sim = sum(s for _, _, s in matches) / max(n_matches, 1)
-        cv2.putText(canvas, f'Query', (10, 25), cv2.FONT_HERSHEY_SIMPLEX, 0.7, (0,0,0), 2)
-        cv2.putText(canvas, f'History', (w1+gap+10, 25), cv2.FONT_HERSHEY_SIMPLEX, 0.7, (0,0,0), 2)
+        cv2.putText(canvas, 'Query', (10, 25), cv2.FONT_HERSHEY_SIMPLEX, 0.7, (0,0,0), 2)
+        cv2.putText(canvas, 'History', (w1+gap+10, 25), cv2.FONT_HERSHEY_SIMPLEX, 0.7, (0,0,0), 2)
         cv2.putText(canvas, f'Patch matches: {n_matches}  Avg sim: {avg_sim:.3f}',
                     (10, max_h - 10), cv2.FONT_HERSHEY_SIMPLEX, 0.5, (0,0,180), 1)
 
-        # 编码为 base64
         _, buffer = cv2.imencode('.jpg', canvas, [cv2.IMWRITE_JPEG_QUALITY, 85])
         img_b64 = base64.b64encode(buffer).decode('utf-8')
 
         return {
+            'scene_type': 'complex',
             'query_image': log_entry['query_image'],
             'history_image': log_entry['history_image'],
             'dinov2_similarity': patch_info.get('cls_similarity', 0),
@@ -623,7 +583,121 @@ def _build_visualization(log_entry, patch_info, username):
             'image_base64': f'data:image/jpeg;base64,{img_b64}',
         }
     except Exception as e:
-        print(f"  [可视化] 生成失败: {e}")
+        print(f"  [可视化-复杂] 生成失败: {e}")
+        return None
+
+
+def _build_text_visualization(log_entry):
+    """文本场景可视化：OCR 文本对比 + 关键词高亮
+
+    展示两张图片的 OCR 文本，用颜色标注：
+    - 绿色：两张图都有的关键词（匹配词）
+    - 红色：仅在一张图中出现的关键词（差异词）
+    同时展示两张图的缩略图并排。
+    """
+    try:
+        import cv2
+        import numpy as np
+
+        q_path = log_entry.get('query_path', '')
+        h_path = log_entry.get('history_path', '')
+
+        if not os.path.exists(q_path) or not os.path.exists(h_path):
+            return None
+
+        img1 = cv2.imdecode(np.fromfile(q_path, dtype=np.uint8), cv2.IMREAD_COLOR)
+        img2 = cv2.imdecode(np.fromfile(h_path, dtype=np.uint8), cv2.IMREAD_COLOR)
+        if img1 is None or img2 is None:
+            return None
+
+        text1 = log_entry.get('query_text', '')
+        text2 = log_entry.get('history_text', '')
+        text_sim = log_entry.get('text_similarity', 0)
+
+        # 提取关键词（按空格和标点分词）
+        import re
+        words1 = set(re.findall(r'[a-zA-Z\u4e00-\u9fff]{2,}', text1))
+        words2 = set(re.findall(r'[a-zA-Z\u4e00-\u9fff]{2,}', text2))
+        common_words = words1 & words2
+        diff_words1 = words1 - words2
+        diff_words2 = words2 - words1
+
+        # 缩放图片
+        max_h = 300
+        scale1 = max_h / img1.shape[0]
+        scale2 = max_h / img2.shape[0]
+        img1_s = cv2.resize(img1, (int(img1.shape[1]*scale1), max_h))
+        img2_s = cv2.resize(img2, (int(img2.shape[1]*scale2), max_h))
+
+        h1, w1 = img1_s.shape[:2]
+        h2, w2 = img2_s.shape[:2]
+
+        # 构建画布：上方两张图并排，下方文本对比
+        text_area_h = 200
+        gap = 10
+        total_w = max(w1 + gap + w2, 600)
+        canvas = np.ones((max_h + text_area_h, total_w, 3), dtype=np.uint8) * 240
+
+        # 上方放图片
+        canvas[:max_h, :w1] = img1_s
+        canvas[:max_h, w1+gap:w1+gap+w2] = img2_s
+
+        # 图片上方标注
+        cv2.putText(canvas, 'Query (OCR text)', (10, 20), cv2.FONT_HERSHEY_SIMPLEX, 0.5, (0,0,0), 1)
+        cv2.putText(canvas, 'History (OCR text)', (w1+gap+10, 20), cv2.FONT_HERSHEY_SIMPLEX, 0.5, (0,0,0), 1)
+
+        # 分隔线
+        cv2.line(canvas, (0, max_h), (total_w, max_h), (100,100,100), 2)
+
+        # 下方文本区域
+        y_off = max_h + 10
+
+        # BGE 相似度
+        cv2.putText(canvas, f'BGE Semantic Similarity: {text_sim:.4f} (threshold: 0.85)',
+                    (10, y_off), cv2.FONT_HERSHEY_SIMPLEX, 0.6, (0,0,180), 2)
+        y_off += 25
+
+        # OCR 文本对比
+        cv2.putText(canvas, 'Query OCR:', (10, y_off), cv2.FONT_HERSHEY_SIMPLEX, 0.5, (0,100,255), 1)
+        y_off += 20
+        # 截断过长文本
+        disp_text1 = text1[:200] + '...' if len(text1) > 200 else text1
+        disp_text2 = text2[:200] + '...' if len(text2) > 200 else text2
+
+        cv2.putText(canvas, disp_text1, (10, y_off), cv2.FONT_HERSHEY_SIMPLEX, 0.4, (0,0,0), 1)
+        y_off += 20
+
+        cv2.putText(canvas, 'History OCR:', (10, y_off), cv2.FONT_HERSHEY_SIMPLEX, 0.5, (0,100,255), 1)
+        y_off += 20
+        cv2.putText(canvas, disp_text2, (10, y_off), cv2.FONT_HERSHEY_SIMPLEX, 0.4, (0,0,0), 1)
+        y_off += 20
+
+        # 关键词统计
+        cv2.putText(canvas, f'Common keywords: {len(common_words)}  Unique(query): {len(diff_words1)}  Unique(hist): {len(diff_words2)}',
+                    (10, y_off), cv2.FONT_HERSHEY_SIMPLEX, 0.5, (0,150,0), 1)
+
+        # 显示部分共同关键词
+        y_off += 20
+        common_str = ' '.join(list(common_words)[:15])
+        if common_str:
+            cv2.putText(canvas, f'Match: {common_str}', (10, y_off), cv2.FONT_HERSHEY_SIMPLEX, 0.4, (0,180,0), 1)
+
+        _, buffer = cv2.imencode('.jpg', canvas, [cv2.IMWRITE_JPEG_QUALITY, 85])
+        img_b64 = base64.b64encode(buffer).decode('utf-8')
+
+        return {
+            'scene_type': 'text',
+            'query_image': log_entry['query_image'],
+            'history_image': log_entry['history_image'],
+            'text_similarity': round(text_sim, 4),
+            'common_keyword_count': len(common_words),
+            'diff_keyword_count_query': len(diff_words1),
+            'diff_keyword_count_history': len(diff_words2),
+            'common_keywords': list(common_words)[:20],
+            'image_base64': f'data:image/jpeg;base64,{img_b64}',
+        }
+    except Exception as e:
+        print(f"  [可视化-文本] 生成失败: {e}")
         return None
 
 

index.html

@@ -8,28 +8,22 @@
 *{margin:0;padding:0;box-sizing:border-box}
 body{font-family:'Segoe UI','Microsoft YaHei',sans-serif;background:#f0f2f5;min-height:100vh;color:#333}
 .container{max-width:960px;margin:0 auto;padding:20px}
-
 .header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px 30px;border-radius:12px;margin-bottom:20px;text-align:center}
 .header h1{font-size:22px;margin-bottom:4px}
 .header p{font-size:13px;opacity:.85}
-
 .status-bar{background:#fff;border-radius:10px;padding:14px 20px;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 2px 8px rgba(0,0,0,.06);flex-wrap:wrap;gap:10px}
 .status-info{display:flex;gap:20px;flex-wrap:wrap;font-size:14px}
 .status-info span{display:flex;align-items:center;gap:4px}
 .status-actions{display:flex;gap:8px}
-
 .card{background:#fff;border-radius:10px;padding:20px;margin-bottom:16px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
 .card h3{font-size:15px;margin-bottom:12px;color:#555}
-
 .upload-zone{border:2px dashed #d9d9d9;border-radius:8px;padding:24px;text-align:center;cursor:pointer;transition:all .2s;position:relative}
 .upload-zone:hover{border-color:#667eea;background:#f8f8ff}
 .upload-zone input{position:absolute;inset:0;opacity:0;cursor:pointer}
 .upload-zone .icon{font-size:32px;margin-bottom:8px}
 .upload-zone .hint{font-size:13px;color:#999}
-
 .file-list{margin-top:10px;font-size:13px;color:#666}
 .file-list div{padding:3px 0}
-
 .btn{padding:10px 20px;border:none;border-radius:8px;font-size:14px;cursor:pointer;transition:all .15s;font-weight:500}
 .btn:disabled{opacity:.5;cursor:not-allowed}
 .btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}
@@ -41,38 +35,30 @@ body{font-family:'Segoe UI','Microsoft YaHei',sans-serif;background:#f0f2f5;min-
 .btn-sm{padding:6px 12px;font-size:12px}
 .btn-success{background:#28a745;color:#fff}
 .btn-success:hover:not(:disabled){background:#218838}
-
+.btn-warning{background:#ffc107;color:#333}
+.btn-warning:hover:not(:disabled){background:#e0a800}
 .result-pass{background:#d4edda;border:2px solid #28a745;border-radius:10px;padding:20px;text-align:center;margin-bottom:16px}
 .result-pass h2{color:#155724;font-size:20px}
 .result-pass p{color:#155724;font-size:14px;margin-top:4px}
-
 .result-fail{background:#f8d7da;border:2px solid #dc3545;border-radius:10px;padding:20px;text-align:center;margin-bottom:16px}
 .result-fail h2{color:#721c24;font-size:20px}
 .result-fail p{color:#721c24;font-size:14px;margin-top:4px}
-
 table{width:100%;border-collapse:collapse;font-size:13px;margin-top:12px}
 th{background:#343a40;color:#fff;padding:10px 8px;text-align:center;font-weight:500}
 td{padding:8px;text-align:center;border-bottom:1px solid #eee}
 tr.row-fail{background:#fff5f5}
 tr.row-fail td{color:#721c24}
-
 .deleted-info{background:#fff5f5;border:1px solid #dc3545;border-radius:8px;padding:10px 16px;margin-bottom:12px;font-size:13px;color:#721c24}
-
 .loading-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:999}
 .loading-box{background:#fff;border-radius:12px;padding:30px 40px;text-align:center;box-shadow:0 8px 30px rgba(0,0,0,.2)}
 .spinner{width:40px;height:40px;border:4px solid #e0e0e0;border-top-color:#667eea;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px}
 @keyframes spin{to{transform:rotate(360deg)}}
-
 .login-card{background:#fff;border-radius:12px;padding:40px;max-width:400px;margin:80px auto;box-shadow:0 4px 20px rgba(0,0,0,.1);text-align:center}
 .login-card h2{margin-bottom:20px;color:#333}
 .login-card input{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:15px;margin-bottom:16px;outline:none;transition:border-color .2s}
 .login-card input:focus{border-color:#667eea}
-
 .error-msg{color:#dc3545;font-size:13px;margin-top:4px;min-height:18px}
-
 .hidden{display:none!important}
-
-/* 历史图片管理 */
 .history-panel{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1000;display:flex;align-items:center;justify-content:center}
 .history-modal{background:#fff;border-radius:12px;padding:24px;max-width:800px;width:95%;max-height:85vh;overflow-y:auto;box-shadow:0 8px 30px rgba(0,0,0,.3)}
 .history-modal h2{margin-bottom:16px;font-size:18px}
@@ -90,13 +76,17 @@ tr.row-fail td{color:#721c24}
 .img-card .del-btn:hover{background:#dc3545}
 .close-btn{float:right;background:none;border:none;font-size:24px;cursor:pointer;color:#999;line-height:1}
 .close-btn:hover{color:#333}
-
-/* 可视化 */
-.vis-card{background:#fff;border-radius:10px;padding:16px;margin-bottom:16px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
-.vis-card h4{font-size:14px;color:#555;margin-bottom:8px}
-.vis-card img{width:100%;border-radius:6px;border:1px solid #eee}
-.vis-stats{display:flex;gap:16px;font-size:13px;color:#666;margin-top:8px}
+.vis-toggle{display:inline-flex;align-items:center;gap:6px;margin:8px 0;padding:8px 16px;background:#fff3cd;border:1px solid #ffc107;border-radius:8px;cursor:pointer;font-size:13px;color:#856404;transition:all .2s}
+.vis-toggle:hover{background:#ffc107;color:#333}
+.vis-content{margin-top:10px;overflow:hidden;transition:max-height .3s ease}
+.vis-content.collapsed{max-height:0;overflow:hidden}
+.vis-content.expanded{max-height:2000px}
+.vis-content img{width:100%;border-radius:6px;border:1px solid #eee}
+.vis-stats{display:flex;gap:16px;font-size:13px;color:#666;margin-top:8px;flex-wrap:wrap}
 .vis-stats b{color:#333}
+.scene-tag{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600}
+.scene-tag.text{background:#e7f3ff;color:#0066cc}
+.scene-tag.complex{background:#fff3e0;color:#cc6600}
 </style>
 </head>
 <body>
@@ -146,7 +136,6 @@ tr.row-fail td{color:#721c24}
   <div id="resultArea"></div>
 </div>
 
-<!-- 历史图片管理面板 -->
 <div id="historyPanel" class="history-panel hidden">
   <div class="history-modal">
     <button class="close-btn" onclick="closeHistory()">&times;</button>
@@ -176,22 +165,15 @@ async function doLogin() {
   const errEl = document.getElementById('loginError');
   errEl.textContent = '';
   if (!name) { errEl.textContent = '用户名不能为空'; return; }
-
   try {
     const fd = new FormData();
     fd.append('username', name);
     const res = await fetch('/api/login', { method: 'POST', body: fd });
-    if (!res.ok) {
-      const d = await res.json();
-      errEl.textContent = d.detail || '登录失败';
-      return;
-    }
+    if (!res.ok) { const d = await res.json(); errEl.textContent = d.detail || '登录失败'; return; }
     const data = await res.json();
     currentUser = data.username;
     showMain(data);
-  } catch (e) {
-    errEl.textContent = '网络错误: ' + e.message;
-  }
+  } catch (e) { errEl.textContent = '网络错误: ' + e.message; }
 }
 
 function showMain(data) {
@@ -212,51 +194,31 @@ function onQueryChange() {
   const files = document.getElementById('queryInput').files;
   const list = document.getElementById('queryFileList');
   list.innerHTML = '';
-  for (const f of files) {
-    list.innerHTML += `<div>📄 ${f.name} (${(f.size/1024).toFixed(1)} KB)</div>`;
-  }
+  for (const f of files) list.innerHTML += `<div>📄 ${f.name} (${(f.size/1024).toFixed(1)} KB)</div>`;
 }
 
 async function doDetect() {
   const queryFiles = document.getElementById('queryInput').files;
-  if (queryFiles.length === 0) {
-    alert('请上传至少一张图片！');
-    return;
-  }
-
+  if (queryFiles.length === 0) { alert('请上传至少一张图片！'); return; }
   const fd = new FormData();
   fd.append('username', currentUser);
   for (const f of queryFiles) fd.append('images', f);
-
   showLoading('正在进行场景比对，请稍候...');
   document.getElementById('detectBtn').disabled = true;
-
   try {
     const res = await fetch('/api/detect', { method: 'POST', body: fd });
-    if (!res.ok) {
-      const d = await res.json();
-      alert('检测失败: ' + (d.detail || '未知错误'));
-      return;
-    }
+    if (!res.ok) { const d = await res.json(); alert('检测失败: ' + (d.detail || '未知错误')); return; }
     const data = await res.json();
     renderResult(data);
-    // 更新历史图片数量
     refreshHistoryCount();
-  } catch (e) {
-    alert('网络错误: ' + e.message);
-  } finally {
-    hideLoading();
-    document.getElementById('detectBtn').disabled = false;
-  }
+  } catch (e) { alert('网络错误: ' + e.message); }
+  finally { hideLoading(); document.getElementById('detectBtn').disabled = false; }
 }
 
 async function refreshHistoryCount() {
   try {
     const res = await fetch(`/api/history?username=${encodeURIComponent(currentUser)}`);
-    if (res.ok) {
-      const data = await res.json();
-      document.getElementById('dispCount').textContent = data.count;
-    }
+    if (res.ok) { const data = await res.json(); document.getElementById('dispCount').textContent = data.count; }
   } catch (e) {}
 }
 
@@ -279,53 +241,89 @@ function renderResult(data) {
     html += `<div class="deleted-info">🗑️ <b>已删除同一场景图片:</b> ${deletedFiles.map(f => f.original_name).join('、')}</div>`;
   }
 
-  // 可视化展示
-  if (data.visualizations && data.visualizations.length > 0) {
-    html += `<div class="card"><h3>🔍 匹配可视化证据</h3>`;
-    for (const vis of data.visualizations) {
-      html += `<div class="vis-card">`;
-      html += `<h4>${vis.query_image} ↔ ${vis.history_image}</h4>`;
-      html += `<img src="${vis.image_base64}" alt="patch匹配可视化">`;
-      html += `<div class="vis-stats">`;
-      html += `<span>DINOv2相似度: <b>${vis.dinov2_similarity}</b></span>`;
-      html += `<span>Patch匹配数: <b>${vis.patch_match_count}</b></span>`;
-      html += `<span>平均Patch相似度: <b>${vis.avg_patch_similarity}</b></span>`;
-      html += `</div></div>`;
-    }
-    html += `</div>`;
-  }
-
+  // 比对日志
   if (data.evaluation_logs && data.evaluation_logs.length > 0) {
     html += `<div class="card"><h3>📋 比对详情日志</h3><table>`;
-    html += `<thead><tr><th>待检测</th><th>历史</th><th>场景</th><th>DINOv2相似度</th><th>文本相似</th><th>BGE搜索</th><th>最终判定</th></tr></thead><tbody>`;
-
+    html += `<thead><tr><th>待检测</th><th>历史</th><th>场景</th><th>相似度</th><th>最终判定</th></tr></thead><tbody>`;
     for (const log of data.evaluation_logs) {
       const rowClass = log.is_same_scene ? ' class="row-fail"' : '';
-      const truncName = (n, max=14) => n.length > max ? n.substring(0, max-2) + '..' : n;
-      const qName = truncName(log.query_image);
-      const hName = truncName(log.history_image);
-      const sceneLabel = log.scene_type === 'text' ? '📄 文本' : '🖼️ 复杂';
-      const dinov2Val = log.dinov2_similarity != null ? log.dinov2_similarity.toFixed(3) : '-';
-      const textSim = log.text_similarity != null ? log.text_similarity.toFixed(3) : '-';
-      const bgeSearchVal = log.bge_search_score != null ? log.bge_search_score.toFixed(4) : '-';
-      const finalStatus = log.is_same_scene ? '❌ 同一' : '✅ 不同';
-      const errNote = log.error ? ` <span style="color:red;font-size:11px">(${log.error.substring(0,30)})</span>` : '';
+      const truncName = (n, max=16) => n.length > max ? n.substring(0, max-2) + '..' : n;
+      const sceneTag = log.scene_type === 'text'
+        ? '<span class="scene-tag text">文本</span>'
+        : '<span class="scene-tag complex">复杂</span>';
+      const simLabel = log.scene_type === 'text'
+        ? (log.text_similarity != null ? `BGE ${log.text_similarity.toFixed(3)}` : '-')
+        : (log.dinov2_similarity != null ? `DINOv2 ${log.dinov2_similarity.toFixed(3)}` : '-');
+      const finalStatus = log.is_same_scene ? '❌ 同一场景' : '✅ 不同场景';
       html += `<tr${rowClass}>`;
-      html += `<td title="${log.query_image}">${qName}</td>`;
-      html += `<td title="${log.history_image}">${hName}</td>`;
-      html += `<td style="font-size:12px">${sceneLabel}</td>`;
-      html += `<td>${dinov2Val}</td>`;
-      html += `<td>${textSim}</td>`;
-      html += `<td>${bgeSearchVal}</td>`;
-      html += `<td>${finalStatus}${errNote}</td>`;
+      html += `<td title="${log.query_image}">${truncName(log.query_image)}</td>`;
+      html += `<td title="${log.history_image}">${truncName(log.history_image)}</td>`;
+      html += `<td>${sceneTag}</td>`;
+      html += `<td>${simLabel}</td>`;
+      html += `<td>${finalStatus}</td>`;
       html += `</tr>`;
     }
     html += `</tbody></table></div>`;
   }
 
+  // 可视化区域（默认隐藏，点击按钮展示）
+  const vis = data.visualizations || [];
+  if (vis.length > 0) {
+    const visId = 'vis_' + Date.now();
+    html += `<div class="card"><h3>🔍 匹配可视化证据 <span style="font-size:12px;color:#999">（点击按钮查看）</span></h3>`;
+    for (let i = 0; i < vis.length; i++) {
+      const v = vis[i];
+      const sceneTag = v.scene_type === 'text'
+        ? '<span class="scene-tag text">文本场景</span>'
+        : '<span class="scene-tag complex">复杂场景</span>';
+      const vid = `${visId}_${i}`;
+      html += `<div style="margin-bottom:12px">`;
+      html += `<div style="display:flex;align-items:center;gap:10px;margin-bottom:6px">`;
+      html += `${sceneTag} <b>${v.query_image}</b> ↔ <b>${v.history_image}</b>`;
+      html += `</div>`;
+      // 摘要信息
+      html += `<div class="vis-stats">`;
+      if (v.scene_type === 'complex') {
+        html += `<span>DINOv2相似度: <b>${v.dinov2_similarity}</b></span>`;
+        html += `<span>Patch匹配数: <b>${v.patch_match_count}</b></span>`;
+        html += `<span>平均Patch相似度: <b>${v.avg_patch_similarity}</b></span>`;
+      } else {
+        html += `<span>BGE语义相似度: <b>${v.text_similarity}</b></span>`;
+        html += `<span>共同关键词: <b>${v.common_keyword_count}</b></span>`;
+        html += `<span>差异词(查询/历史): <b>${v.diff_keyword_count_query}/${v.diff_keyword_count_history}</b></span>`;
+      }
+      html += `</div>`;
+      // 展示/隐藏按钮
+      html += `<div class="vis-toggle" onclick="toggleVis('${vid}')">🖼️ 点击查看可视化图 ▶</div>`;
+      // 可视化图片（默认隐藏）
+      html += `<div id="${vid}" class="vis-content collapsed">`;
+      html += `<img src="${v.image_base64}" alt="可视化">`;
+      if (v.scene_type === 'text' && v.common_keywords && v.common_keywords.length > 0) {
+        html += `<div style="margin-top:8px;font-size:12px;color:#666"><b>共同关键词:</b> ${v.common_keywords.join('、')}</div>`;
+      }
+      html += `</div>`;
+      html += `</div>`;
+    }
+    html += `</div>`;
+  }
+
   area.innerHTML = html;
 }
 
+function toggleVis(id) {
+  const el = document.getElementById(id);
+  const toggle = el.previousElementSibling;
+  if (el.classList.contains('collapsed')) {
+    el.classList.remove('collapsed');
+    el.classList.add('expanded');
+    toggle.innerHTML = '🖼️ 点击收起可视化图 ▼';
+  } else {
+    el.classList.remove('expanded');
+    el.classList.add('collapsed');
+    toggle.innerHTML = '🖼️ 点击查看可视化图 ▶';
+  }
+}
+
 // ==================== 历史图片管理 ====================
 
 async function openHistory() {
@@ -342,19 +340,15 @@ async function loadAllUsers() {
     const res = await fetch('/api/all_users');
     const data = await res.json();
     historyUsers = data.users || [];
-
     const tabsEl = document.getElementById('userTabs');
     if (historyUsers.length === 0) {
       tabsEl.innerHTML = '<span style="color:#999;font-size:13px">暂无用户数据</span>';
       document.getElementById('historyContent').innerHTML = '';
       return;
     }
-
     tabsEl.innerHTML = historyUsers.map((u, i) =>
       `<div class="user-tab${i===0?' active':''}" onclick="selectUserTab(${i})" id="userTab${i}">${u.username} (${u.image_count})</div>`
     ).join('');
-
-    // 默认显示第一个用户
     await loadUserHistory(historyUsers[0].username);
   } catch (e) {
     document.getElementById('historyContent').innerHTML = `<p style="color:red">加载失败: ${e.message}</p>`;
@@ -370,17 +364,14 @@ async function selectUserTab(index) {
 async function loadUserHistory(username) {
   const contentEl = document.getElementById('historyContent');
   contentEl.innerHTML = '<p style="color:#999;text-align:center;padding:20px">加载中...</p>';
-
   try {
     const res = await fetch(`/api/history?username=${encodeURIComponent(username)}`);
     const data = await res.json();
     const images = data.images || [];
-
     if (images.length === 0) {
       contentEl.innerHTML = '<p style="color:#999;text-align:center;padding:20px">该用户暂无历史图片</p>';
       return;
     }
-
     let html = `<div class="img-grid">`;
     for (const img of images) {
       html += `<div class="img-card">`;
@@ -398,25 +389,17 @@ async function loadUserHistory(username) {
 
 async function deleteImage(username, filename) {
   if (!confirm(`确定删除图片 "${filename}" 吗？\n将同时删除 Qdrant 中的向量数据。`)) return;
-
   try {
     const fd = new FormData();
     fd.append('username', username);
     fd.append('filename', filename);
     const res = await fetch('/api/delete_image', { method: 'POST', body: fd });
-    if (!res.ok) {
-      const d = await res.json();
-      alert('删除失败: ' + (d.detail || '未知错误'));
-      return;
-    }
+    if (!res.ok) { const d = await res.json(); alert('删除失败: ' + (d.detail || '未知错误')); return; }
     const data = await res.json();
-    // 刷新当前用户的图片列表
     const tabIndex = historyUsers.findIndex(u => u.username === username);
     if (tabIndex >= 0) {
       historyUsers[tabIndex].image_count = data.remaining_count;
-      // 更新标签
       await loadAllUsers();
-      // 重新选中该用户
       if (historyUsers[tabIndex]) {
         document.querySelectorAll('.user-tab').forEach(t => t.classList.remove('active'));
         const tab = document.getElementById(`userTab${tabIndex}`);
@@ -424,11 +407,8 @@ async function deleteImage(username, filename) {
         await loadUserHistory(username);
       }
     }
-    // 更新主页面计数
     if (username === currentUser) refreshHistoryCount();
-  } catch (e) {
-    alert('删除失败: ' + e.message);
-  }
+  } catch (e) { alert('删除失败: ' + e.message); }
 }
 
 function switchUser() {
@@ -449,7 +429,6 @@ function hideLoading() {
   document.getElementById('loadingOverlay').classList.add('hidden');
 }
 
-// 点击遮罩关闭历史面板
 document.getElementById('historyPanel').addEventListener('click', function(e) {
   if (e.target === this) closeHistory();
 });

module/evaluator.py

@@ -101,6 +101,8 @@ def evaluate_scene_consistency_cached(matcher, query_paths, username,
                         'is_same_scene': result['is_same_scene'],
                         'gamma_info': [],
                         'bge_search_score': round(score, 4),
+                        'query_text': full_text,
+                        'history_text': entry.get('ocr_text', ''),
                     }
                 except Exception as e:
                     log_entry = {