{"repo": "callioper/ebook-pdf-downloader", "files": {"frontend/src/components/settings/OCRNetworkSection.tsx": {"0be0544d107358c0fa422cb66ffa7d9d9faf1af0": {"t": 1785747357.4945219, "n": 49257, "h": "57f1b74e63731383", "c": "import React, { useState, useEffect, useRef, useCallback } from 'react'\nimport { SectionProps } from './types'\nimport { LLM_OCR_RECOMMENDED, API_BASE } from '../../constants'\n\nfunction StatusDot({ status }: { status: 'green' | 'red' | 'yellow' | null }) {\n  const colors: Record<string, string> = {\n    green: 'bg-green-500',\n    red: 'bg-red-500',\n    yellow: 'bg-yellow-500',\n  }\n  return (\n    <span className={`inline-block w-2 h-2 rounded-full ${status ? colors[status] : 'bg-gray-300'}`} />\n  )\n}\n\nconst OCR_ENGINES = [\n  { key: 'tesseract', name: 'Tesseract OCR', desc: '内置引擎，需 chi_sim 语言包' },\n  { key: 'paddleocr', name: 'PaddleOCR', desc: '百度引擎，需 Python 3.11 虚拟环境' },\n  { key: 'llm_ocr', name: 'LLM OCR', desc: '大模型视觉识别，无需本地引擎' },\n  { key: 'mineru', name: 'MinerU', desc: '线上 API 精准解析，需 Token' },\n  { key: 'paddleocr_online', name: 'PaddleOCR-VL-1.5', desc: '线上 API，需 Token' },\n]\n\nconst OCR_INSTALL_GUIDE = `## 安装 OCR 引擎\n\n**注意**：Python 3.14 与 \\`paddlepaddle\\` 不兼容。建议使用 Python 3.11 创建虚拟环境。\n\n---\n\n### 1. 创建/重建虚拟环境（Python 3.11）\n\n\\`\\`\\`powershell\n# 如果原 venv 不支持 Python 3.11，先删除\nRemove-Item -Recurse -Force backend\\\\venv\n\n# 使用 Python 3.11 创建新 venv\nC:\\\\Python311\\\\python.exe -m venv backend\\\\venv\n\\`\\`\\`\n\n### 2. 激活虚拟环境（PowerShell）\n\n\\`\\`\\`powershell\n# 方法一：PowerShell 执行策略问题\npowershell -ExecutionPolicy Bypass -Command \"backend\\\\venv\\\\Scripts\\\\Activate.ps1\"\n\n# 方法二：直接用 python 运行（无需激活）\nC:\\\\Python311\\\\python.exe -m pip install ...\n\\`\\`\\`\n\n### 3. 安装 OCRmyPDF 核心\n\n\\`\\`\\`powershell\npython -m pip install ocrmypdf\n\\`\\`\\`\n\n### 4. 安装引擎插件\n\n\\`\\`\\`powershell\n# 安装所有 OCR 引擎（推荐，一步到位）\npython -m pip install ocrmypdf-paddleocr paddleocr\n\n# 或分开安装\npython -m pip install paddleocr\npython -m pip install ocrmypdf-paddleocr  # 需要先装好 paddleocr\n\\`\\`\\`\n\n### 5. 安装 Tesseract OCR 系统依赖\n\n\\`\\`\\`powershell\nwinget install --id UB-Mannheim.TesseractOCR --accept-package-agreements --accept-source-agreements\n\\`\\`\\`\n\n### 6. 将 Tesseract 添加到 PATH\n\n\\`\\`\\`powershell\n[Environment]::SetEnvironmentVariable(\"Path\", [Environment]::GetEnvironmentVariable(\"Path\", \"User\") + \";C:\\\\Program Files\\\\Tesseract-OCR\", \"User\")\n\\`\\`\\`\n\n> ⚠️ 添加后需**重启终端或IDE**使 PATH 生效，或使用完整路径验证：\n> \\`\\`\\`powershell\n> & \"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n> \\`\\`\\`\n\n### 7. 验证安装\n\n\\`\\`\\`powershell\npython -c \"import ocrmypdf; print('ocrmypdf:', ocrmypdf.__version__)\"\npython -c \"from paddle import paddle; print('paddle:', paddle.__version__)\"\n\"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n\\`\\`\\`\n\n### 常见问题\n\n| 问题 | 解决 |\n|------|------|\n| \\`ModuleNotFoundError: No module named 'paddlepaddle'\\` | \\`import paddle\\` 而非 \\`import paddlepaddle\\` |\n| \\`ocrmypdf-paddleocr\\` 依赖冲突 | 先装 \\`paddleocr\\`，再装 \\`ocrmypdf-paddleocr\\` |\n| Tesseract 找不到 | 重启终端，或使用完整路径 \\`C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\\` |`\n\nconst AI_VISION_ENDPOINTS: Record<string, string> = {\n  openai_compatible: 'https://api.openai.com/v1',\n  openai_responses: 'https://api.openai.com/v1',\n  azure: 'https://RESOURCE_NAME.openai.azure.com',\n  anthropic: 'https://api.anthropic.com',\n  gemini: 'https://generativelanguage.googleapis.com/v1beta',\n  minimax_openai: 'https://api.minimaxi.com/v1',\n  minimax_anthropic: 'https://api.minimaxi.com',\n  custom: '',\n}\n\nfunction OCRNetworkSection({ form, updateForm, mountedRef }: SectionProps) {\n  const [ocrChecking, setOcrChecking] = useState(false)\n  const [ocrStatus, setOcrStatus] = useState<'green' | 'red' | 'yellow' | null>(null)\n  const [ocrMsg, setOcrMsg] = useState('')\n  const [ocrEngines, setOcrEngines] = useState<Record<string, { installed: boolean; installing: boolean; msg: string }>>({})\n  const [llmModels, setLlmModels] = useState<any[]>([])\n  const [llmFetchMsg, setLlmFetchMsg] = useState('')\n  const [onlineEngineStatus, setOnlineEngineStatus] = useState<Record<string, 'ok' | 'fail' | ''>>({ mineru: '', paddleocr: '' })\n  const [onlineTesting, setOnlineTesting] = useState<Record<string, boolean>>({ mineru: false, paddleocr: false })\n  const [llmFetching, setLlmFetching] = useState(false)\n  const [llmTestMsg, setLlmTestMsg] = useState('')\n  const [llmTesting, setLlmTesting] = useState(false)\n  const [aiModels, setAiModels] = useState<{ id: string; name: string }[]>([])\n  const [fetchingModels, setFetchingModels] = useState(false)\n  const [fetchModelsMsg, setFetchModelsMsg] = useState('')\n  const [aiVisionTest, setAiVisionTest] = useState<'testing' | 'ok' | 'fail' | null>(null)\n  const [aiVisionMsg, setAiVisionMsg] = useState('')\n  const [saving, setSaving] = useState(false)\n  const [saveMsg, setSaveMsg] = useState('')\n  const [updateChecking, setUpdateChecking] = useState(false)\n  const [updateResult, setUpdateResult] = useState('')\n\n  // --- OCR logic ---\n  const checkOcr = useCallback(async (engine?: string) => {\n    setOcrChecking(true)\n    try {\n      const eng = engine || form.ocr_engine || 'tesseract'\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrStatus(data.ok ? 'green' : 'red')\n      setOcrMsg(data.message || (data.ok ? data.version || '已安装' : '未检测到'))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrStatus('red')\n        setOcrMsg('检测失败')\n      }\n    } finally {\n      if (mountedRef.current) setOcrChecking(false)\n    }\n  }, [form.ocr_engine, mountedRef])\n\n  const handleDetectOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: false, msg: '检测中...' } }))\n    try {\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(engine)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n          has_chi_sim: data.has_chi_sim,\n          languages: data.languages,\n          venv: data.venv,\n        } as any,\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '检测失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleInstallOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: true, msg: '安装中...' } }))\n    try {\n      const res = await fetch('/api/v1/install-ocr', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ engine }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.message || (data.ok ? '安装成功' : '安装失败'),\n        },\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '安装请求失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleTestMineru = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, mineru: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, mineru: '' }))\n    try {\n      const res = await fetch('/api/v1/check-mineru', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).mineru_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, mineru: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n  }, [form, mountedRef])\n\n  const handleTestPaddleocrOnline = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, paddleocr: '' }))\n    try {\n      const res = await fetch('/api/v1/check-paddleocr-online', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).paddleocr_online_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, paddleocr: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n  }, [form, mountedRef])\n\n  // Auto-detect OCR engine statuses\n  const autoOcrRef = useRef(false)\n  useEffect(() => {\n    if (autoOcrRef.current) return\n    autoOcrRef.current = true\n    const engines = ['tesseract', 'paddleocr']\n    engines.forEach((eng) => {\n      fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n        .then((r) => r.json())\n        .then((data) => {\n          if (!mountedRef.current) return\n          setOcrEngines((prev) => ({\n            ...prev,\n            [eng]: {\n              installed: data.ok || false,\n              installing: false,\n              msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n              has_chi_sim: data.has_chi_sim,\n              languages: data.languages,\n              venv: data.venv,\n            } as any,\n          }))\n        })\n        .catch(() => {})\n    })\n    const defaultEngine = form.ocr_engine || 'tesseract'\n    fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(defaultEngine)}`)\n      .then((r) => r.json())\n      .then((data) => {\n        if (!mountedRef.current) return\n        setOcrStatus(data.ok ? 'green' : 'red')\n        setOcrMsg(data.version || data.message || (data.ok ? '已安装' : '未检测到'))\n      })\n      .catch(() => {})\n  }, [form.ocr_engine, mountedRef])\n\n  // Auto-detect PaddleOCR availability on mount\n  // PaddleOCR already covered by B1's forEach loop\n  useEffect(() => {\n    fetch(`${API_BASE}/check-ocr?engine=paddleocr`)\n      .then((r) => r.json())\n      .then((data) => {\n        if (!mountedRef.current) return\n        setOcrEngines((prev) => ({\n          ...prev,\n          paddleocr: {\n            installed: data.ok || false,\n            installing: false,\n            msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n            has_chi_sim: data.has_chi_sim,\n            languages: data.languages,\n            venv: data.venv,\n          } as any,\n        }))\n      })\n      .catch(() => {})\n  }, [form.ocr_engine, mountedRef])\n\n  // Update OCR header status when engine selection changes\n  useEffect(() => {\n    const eng = form.ocr_engine || 'tesseract'\n    const info = ocrEngines[eng]\n    if (info) {\n      setOcrStatus(info.installed ? 'green' : 'red')\n      setOcrMsg(info.msg || (info.installed ? '已安装' : '未检测到'))\n    }\n  }, [form.ocr_engine, ocrEngines])\n\n  // Auto-detect online API connectivity\n  const autoOnlineRef = useRef(false)\n  useEffect(() => {\n    if (autoOnlineRef.current) return\n    autoOnlineRef.current = true\n    const check = async () => {\n      if ((form as any).mineru_token) {\n        setOnlineTesting(prev => ({ ...prev, mineru: true }))\n        try {\n          const r = await fetch('/api/v1/check-mineru', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).mineru_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n      }\n      if ((form as any).paddleocr_online_token) {\n        setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n        try {\n          const r = await fetch('/api/v1/check-paddleocr-online', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).paddleocr_online_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n      }\n    }\n    check()\n  }, [mountedRef])\n\n  // --- Save / Update ---\n  const handleSave = useCallback(async () => {\n    setSaving(true)\n    setSaveMsg('')\n    try {\n      const body = JSON.stringify(form)\n      const res = await fetch('/api/v1/config', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body,\n      })\n      if (!res.ok) {\n        setSaveMsg('保存失败: HTTP ' + res.status)\n        setSaving(false)\n        return\n      }\n      setSaveMsg('保存成功')\n      setTimeout(() => setSaveMsg(''), 2000)\n    } catch (e: any) {\n      setSaveMsg('保存失败: ' + (e.message || '未知错误'))\n    }\n    setSaving(false)\n  }, [form, mountedRef])\n\n  const handleCheckUpdate = useCallback(async () => {\n    setUpdateChecking(true)\n    setUpdateResult('')\n    try {\n      const res = await fetch('/api/v1/check-update')\n      const data = await res.json()\n      if (!mountedRef.current) return\n      if (data.has_update) {\n        setUpdateResult(`新版本 v${data.latest} 可用 (当前 v${data.current})`)\n      } else {\n        setUpdateResult(`已是最新版本 v${data.current}`)\n      }\n    } catch (e) {\n      if (mountedRef.current) setUpdateResult('检查失败')\n    } finally {\n      if (mountedRef.current) setUpdateChecking(false)\n    }\n  }, [mountedRef])\n\n  return (\n    <div className=\"space-y-3\">\n      {/* OCRmyPDF 独立状态区 */}\n      <div>\n        <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCRmyPDF 状态</label>\n        <div className=\"flex items-center gap-2\">\n          <StatusDot status={(ocrEngines['ocrmypdf'] as any)?.installed ? 'green' : (ocrEngines['ocrmypdf'] as any)?.msg ? 'red' : null} />\n          <span className=\"text-xs text-gray-500\">\n            {(ocrEngines['ocrmypdf'] as any)?.msg || '点击检测'}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => handleDetectOcrEngine('ocrmypdf')}\n            className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n          >\n            检测\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => handleInstallOcrEngine('ocrmypdf')}\n            disabled={(ocrEngines['ocrmypdf'] as any)?.installing}\n            className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n          >\n            {(ocrEngines['ocrmypdf'] as any)?.installing ? '安装中...' : '一键安装'}\n          </button>\n        </div>\n      </div>\n\n      {/* 引擎切换区 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">引擎切换</span>\n        <div className=\"grid grid-cols-2 gap-2\">\n          {OCR_ENGINES.filter(eng => eng.key !== 'llm_ocr' && eng.key !== 'mineru' && eng.key !== 'paddleocr_online').map((eng) => {\n            const info = (ocrEngines[eng.key] as any) || { installed: eng.key === 'llm_ocr', msg: '' }\n            const isSelected = form.ocr_engine === eng.key\n            return (\n              <div\n                key={eng.key}\n                className={`rounded border p-2.5 ${isSelected ? 'border-blue-400 bg-blue-50' : 'border-gray-200 bg-white'}`}\n              >\n                <div className=\"flex items-center justify-between mb-1\">\n                  <span className=\"text-xs font-medium text-gray-700\">{eng.name}</span>\n                  <div className=\"flex items-center gap-1\">\n                    <StatusDot status={info?.installed ? 'green' : info?.msg ? 'red' : null} />\n                  </div>\n                </div>\n                <p className=\"text-xs text-gray-400 mb-2\">{eng.desc}</p>\n                {eng.key !== 'llm_ocr' && info?.msg && (\n                  <p className={`text-xs mb-1.5 ${info.installed ? 'text-green-600' : 'text-red-500'}`}>\n                    {info.msg}\n                  </p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && !info?.installed && (\n                  <p className=\"text-xs text-gray-400 mb-1.5\">需要 Python 3.11 虚拟环境，点击安装自动搭建</p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && info?.installed && (info as any)?.venv && (\n                  <p className=\"text-xs text-green-600 mb-1.5\">运行环境: {(info as any).venv}</p>\n                )}\n                <div className=\"flex items-center gap-1.5\">\n                  {eng.key !== 'llm_ocr' && (\n                    <>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleDetectOcrEngine(eng.key)}\n                        className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n                      >\n                        检测\n                      </button>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleInstallOcrEngine(eng.key)}\n                        disabled={info?.installing}\n                        className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n                      >\n                        {info?.installing ? '安装中...' : '安装'}\n                      </button>\n                    </>\n                  )}\n                  {eng.key === form.ocr_engine ? null : (\n                    <button\n                      type=\"button\"\n                      onClick={() => updateForm({ ocr_engine: eng.key })}\n                      className=\"px-2 py-1 text-xs rounded text-blue-600 hover:bg-blue-50 ml-auto\"\n                    >\n                      选用\n                    </button>\n                  )}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n\n      {/* Tesseract 语言包状态 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <div className=\"border-t border-gray-200 pt-3\">\n          <span className=\"text-xs font-medium text-gray-600 mb-2 block\">Tesseract 语言包</span>\n          <div className=\"flex items-center gap-2\">\n            <StatusDot status={\n              form.ocr_engine === 'tesseract' && (ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'green'\n                : form.ocr_engine === 'tesseract'\n                  ? 'red'\n                  : null\n            } />\n            <span className=\"text-xs text-gray-500\">\n              {(ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'chi_sim 已安装'\n                : (ocrEngines['tesseract'] as any)?.languages\n                  ? 'chi_sim 未安装'\n                  : '请先检测 Tesseract'}\n            </span>\n            {!((ocrEngines['tesseract'] as any)?.has_chi_sim) && (\n              <button\n                type=\"button\"\n                onClick={async () => {\n                  try {\n                    await fetch('/api/v1/install-tesseract-lang?lang=chi_sim')\n                    handleDetectOcrEngine('tesseract')\n                  } catch (e) {\n                  }\n                }}\n                className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600\"\n              >\n                安装语言包\n              </button>\n            )}\n          </div>\n        </div>\n      )}\n\n      <div className=\"grid grid-cols-4 gap-3 pt-2\">\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">语言</label>\n          <select\n            value={form.ocr_languages || 'chi_sim+eng'}\n            onChange={(e) => updateForm({ ocr_languages: e.target.value })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value=\"chi_sim+eng\">chi_sim+eng</option>\n            <option value=\"chi_sim\">chi_sim</option>\n            <option value=\"eng\">eng</option>\n            <option value=\"chi_sim+eng+jpn\">chi_sim+eng+jpn</option>\n          </select>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">并行线程</label>\n          <select\n            value={form.ocr_jobs ?? 1}\n            onChange={(e) => updateForm({ ocr_jobs: parseInt(e.target.value) || 1 })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value={1}>1</option>\n            <option value={2}>2</option>\n            <option value={4}>4</option>\n          </select>\n          <p className=\"text-[10px] text-gray-400 mt-0.5 leading-tight\">Tesseract 支持多线程，PaddleOCR 仅单线程</p>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">超时 (秒)</label>\n          <input\n            type=\"number\"\n            value={form.ocr_timeout ?? 1800}\n            onChange={(e) => updateForm({ ocr_timeout: parseInt(e.target.value) || 3600 })}\n            min={60}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCR 采样 DPI</label>\n          <input\n            type=\"number\"\n            min={150}\n            max={400}\n            step={50}\n            value={(form as any).ocr_oversample || 200}\n            onChange={(e) => updateForm({ ocr_oversample: parseInt(e.target.value) } as any)}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n          <span className=\"text-xs text-gray-400\">越低越快，150-400，推荐 200</span>\n        </div>\n      </div>\n\n      {/* OCR 安装指引 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <details className=\"group\">\n          <summary className=\"text-xs font-medium text-gray-600 cursor-pointer list-none flex items-center gap-1 select-none hover:text-gray-800\">\n            <svg className=\"w-3 h-3 text-gray-400 transition-transform group-open:rotate-90\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n            </svg>\n            OCR 命令行安装指引\n          </summary>\n          <div className=\"mt-2 bg-blue-50 border border-blue-200 rounded p-3\">\n            <p className=\"text-xs text-blue-800 font-medium mb-2\">📋 将以下提示词复制并发送给 OpenCode：</p>\n            <pre className=\"text-xs text-blue-700 bg-blue-100 rounded p-2 overflow-x-auto whitespace-pre-wrap font-mono\">{OCR_INSTALL_GUIDE}</pre>\n            <p className=\"text-xs text-blue-600 mt-2\">安装后返回设置页点击\"检测\"按钮确认状态。</p>\n          </div>\n        </details>\n      )}\n\n      {/* LLM OCR */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'llm_ocr' ? (\n              <span className=\"text-blue-600\">LLM OCR 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">LLM OCR</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'llm_ocr' ? 'tesseract' : 'llm_ocr' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'llm_ocr'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'llm_ocr' ? '停用并回到 OCRmyPDF' : '启用 LLM OCR'}\n          </button>\n        </div>\n      </div>\n\n      {form.ocr_engine === 'llm_ocr' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用视觉大模型逐框识别文字层。需要运行 lmstudio / ollama 加载对应模型。\n            推荐模型已验证中文 PDF 可用。\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">接口地址</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_endpoint || 'http://127.0.0.1:1234/v1'}\n                onChange={(e) => updateForm({ llm_ocr_endpoint: e.target.value } as any)}\n                placeholder=\"http://127.0.0.1:1234/v1\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmTesting(true); setLlmTestMsg('');\n                try {\n                  const r = await fetch('/api/v1/check-llm-ocr', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint, model: (form as any).llm_ocr_model })\n                  });\n                  const d = await r.json();\n                  setLlmTestMsg(d.message || (d.ok ? 'OK' : 'Failed'));\n                } catch (e) { setLlmTestMsg(String(e)); }\n                setLlmTesting(false);\n              }} disabled={llmTesting}\n                className=\"px-3 py-1.5 text-xs rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 whitespace-nowrap\">\n                {llmTesting ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {llmTestMsg && <p className={`text-xs mt-1 ${llmTestMsg.includes('成功') || llmTestMsg.includes('OK') ? 'text-green-600' : 'text-red-500'}`}>{llmTestMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                placeholder=\"qwen3-vl-4b-instruct\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmFetching(true); setLlmFetchMsg('');\n                try {\n                  const r = await fetch('/api/v1/fetch-llm-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint })\n                  });\n                  const d = await r.json();\n                  if (d.ok && d.models.length > 0) {\n                    setLlmModels(d.models);\n                    setLlmFetchMsg(`${d.models.length} 个模型`);\n                  } else {\n                    setLlmFetchMsg(d.message || '无可用模型');\n                  }\n                } catch (e) { setLlmFetchMsg(String(e)); }\n                setLlmFetching(false);\n              }} disabled={llmFetching || !(form as any).llm_ocr_endpoint}\n                className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\">\n                {llmFetching ? '...' : '拉取模型'}\n              </button>\n            </div>\n            {llmModels.length > 0 && (\n              <select value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n                size={Math.min(llmModels.length + 1, 8)}>\n                <option value=\"\" disabled>-- 选择模型 --</option>\n                {llmModels.map((m: any) => (\n                  <option key={m.id} value={m.id}>{m.name}</option>\n                ))}\n              </select>\n            )}\n            {llmFetchMsg && <p className={`text-xs mt-1 ${llmFetchMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>{llmFetchMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              并发数: {(form as any).llm_ocr_concurrency || 1}\n            </label>\n            <input type=\"range\" min=\"1\" max=\"5\" step=\"1\"\n              value={(form as any).llm_ocr_concurrency || 1}\n              onChange={(e) => updateForm({ llm_ocr_concurrency: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>1 (默认)</span><span>5 (最快)</span>\n            </div>\n          </div>\n          <div className=\"mt-2\">\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              版面检测批次: {(form as any).llm_ocr_detect_batch || 20} 页/批\n            </label>\n            <input type=\"range\" min=\"5\" max=\"50\" step=\"5\"\n              value={(form as any).llm_ocr_detect_batch || 20}\n              onChange={(e) => updateForm({ llm_ocr_detect_batch: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>5 页 (低内存)</span><span>50 页 (更快)</span>\n            </div>\n            <p className=\"text-xs text-gray-400 mt-0.5\">Surya 版面检测每批处理页数。内存不足时降低。</p>\n          </div>\n          <details className=\"text-xs\">\n            <summary className=\"cursor-pointer text-blue-600 hover:text-blue-800\">\n              推荐模型 (已验证中文 PDF)\n            </summary>\n            <div className=\"mt-2 space-y-1\">\n              {LLM_OCR_RECOMMENDED.map(m => (\n                <button key={m.model}\n                  onClick={() => updateForm({ llm_ocr_model: m.model } as any)}\n                  title={m.note}\n                  className=\"block w-full text-left px-2 py-1 rounded hover:bg-blue-100 text-gray-700 text-xs\">\n                  <span className=\"font-mono\">{m.model}</span>\n                  <span className=\"text-gray-400 ml-2\">{m.note}</span>\n                </button>\n              ))}\n            </div>\n          </details>\n        </div>\n      )}\n\n      {/* MinerU */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'mineru' ? (\n              <span className=\"text-blue-600\">MinerU 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">MinerU 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'mineru' ? 'tesseract' : 'mineru' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'mineru'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'mineru' ? '停用 MinerU' : '启用 MinerU'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'mineru' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用 MinerU v4 精准解析 API 进行文档 OCR。PDF 将上传至 MinerU 服务器处理。\n            仅限中国大陆网络访问，单文件 ≤200MB / ≤200页。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Token</label>\n            <input value={(form as any).mineru_token || ''}\n              onChange={(e) => updateForm({ mineru_token: e.target.value } as any)}\n              placeholder=\"输入 MinerU API Token（Bearer 认证）\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <button\n              type=\"button\"\n              onClick={handleTestMineru}\n              disabled={onlineTesting.mineru || !(form as any).mineru_token}\n              className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed\">\n              {onlineTesting.mineru ? '测试中...' : '检测'}\n            </button>\n            {onlineEngineStatus.mineru === 'ok' && (\n              <span className=\"text-xs text-green-600\">连接正常</span>\n            )}\n            {onlineEngineStatus.mineru === 'fail' && (\n              <span className=\"text-xs text-red-500\">连接失败</span>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            需要先申请 Token：<a href=\"https://mineru.net/apiManage/docs\" target=\"_blank\" className=\"text-blue-500 hover:underline\">MinerU API 文档</a>\n          </p>\n        </div>\n      )}\n\n      {/* PaddleOCR-VL-1.5 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'paddleocr_online' ? (\n              <span className=\"text-blue-600\">PaddleOCR-VL-1.5 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">PaddleOCR-VL-1.5 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'paddleocr_online' ? 'tesseract' : 'paddleocr_online' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'paddleocr_online'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'paddleocr_online' ? '停用 PaddleOCR-VL-1.5' : '启用 PaddleOCR-VL-1.5'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'paddleocr_online' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用百度 PaddleOCR-VL-1.5 视觉大模型进行文档版面解析。\n            支持中英文文档，无需本地 GPU。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">识别模式 <span className=\"text-[11px] text-blue-500 ml-1\">推荐逐框识别，次选混合识别</span></label>\n            <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n              {[\n                { key: 'spatial', label: '空间分配（快）' },\n                { key: 'perbox', label: '逐框识别（慢）' },\n                { key: 'hybrid', label: '混合识别' },\n              ].map(({ key, label }) => (\n                <button\n                  key={key}\n                  type=\"button\"\n                  onClick={() => updateForm({ paddleocr_online_mode: key } as any)}\n                  className={`flex-1 py-1.5 text-center transition-colors ${\n                    ((form as any).paddleocr_online_mode || 'spatial') === key\n                      ? 'bg-blue-500 text-white'\n                      : 'bg-white text-gray-600 hover:bg-gray-50'\n                  }`}\n                >\n                  {label}\n                </button>\n              ))}\n            </div>\n            <p className=\"text-[11px] text-gray-400 mt-1\">\n              {((form as any).paddleocr_online_mode || 'spatial') === 'spatial' && '段落文字精准，行识别不精确'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'perbox' && '行识别精准，有乱码风险'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'hybrid' && '逐框为主、空间填补，可能产生识别重复'}\n            </p>\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">Access Token</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).paddleocr_online_token || ''}\n                onChange={(e) => updateForm({ paddleocr_online_token: e.target.value } as any)}\n                placeholder=\"输入 PaddleOCR access token\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button\n                type=\"button\"\n                onClick={handleTestPaddleocrOnline}\n                disabled={onlineTesting.paddleocr || !(form as any).paddleocr_online_token}\n                className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap\">\n                {onlineTesting.paddleocr ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {onlineEngineStatus.paddleocr === 'ok' && (\n              <p className=\"text-xs text-green-600 mt-1\">连接正常</p>\n            )}\n            {onlineEngineStatus.paddleocr === 'fail' && (\n              <p className=\"text-xs text-red-500 mt-1\">连接失败</p>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            从 <a href=\"https://aistudio.baidu.com/paddleocr/task\" target=\"_blank\" className=\"text-blue-500 hover:underline\">PaddleOCR 控制台</a> 获取 Access Token。\n            <a href=\"https://ai.baidu.com/ai-doc/AISTUDIO/Cmkz2m0ma\" target=\"_blank\" className=\"text-blue-500 hover:underline ml-2\">API 文档</a>\n          </p>\n        </div>\n      )}\n\n      <div className=\"flex items-center gap-2 pt-3\">\n        <input type=\"checkbox\" id=\"ocr_confirm_enabled\"\n          checked={(form as any).ocr_confirm_enabled ?? false}\n          onChange={(e) => updateForm({ ocr_confirm_enabled: e.target.checked } as any)}\n          className=\"rounded\" />\n        <label htmlFor=\"ocr_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n          管道执行到 OCR 步骤时弹出确认对话框\n        </label>\n      </div>\n\n      {/* ============ AI Vision / 书签 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">AI Vision 目录提取</span>\n        <div className=\"flex items-center gap-2\">\n          <input type=\"checkbox\" id=\"ai_vision_enabled\"\n            checked={(form as any).ai_vision_enabled ?? true}\n            onChange={(e) => updateForm({ ai_vision_enabled: e.target.checked } as any)} className=\"rounded\" />\n          <label htmlFor=\"ai_vision_enabled\" className=\"text-xs\">启用 AI Vision 目录提取</label>\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 端点</label>\n          <input type=\"text\" value={(form as any).ai_vision_endpoint || ''}\n            onChange={(e) => updateForm({ ai_vision_endpoint: e.target.value } as any)}\n            placeholder={\n              (form as any).ai_vision_provider === 'gemini' ? 'https://generativelanguage.googleapis.com/v1beta' :\n              (form as any).ai_vision_provider === 'azure' ? 'https://{resource}.openai.azure.com' :\n              (form as any).ai_vision_provider === 'anthropic' || (form as any).ai_vision_provider === 'minimax_anthropic' ? 'https://api.anthropic.com' :\n              (form as any).ai_vision_provider === 'minimax_openai' ? 'https://api.minimaxi.com/v1' :\n              'http://127.0.0.1:12345/v1'\n            }\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n          <div className=\"flex gap-1\">\n            <input type=\"text\" value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              placeholder=\"sabafallah/deepseek-ocr\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n            <button\n              type=\"button\"\n              onClick={async () => {\n                setFetchingModels(true)\n                setFetchModelsMsg('')\n                try {\n                  const res = await fetch('/api/v1/fetch-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({\n                      endpoint: (form as any).ai_vision_endpoint,\n                      api_key: (form as any).ai_vision_api_key,\n                      provider: (form as any).ai_vision_provider,\n                    }),\n                  })\n                  const data = await res.json()\n                  if (data.ok && data.models.length > 0) {\n                    setAiModels(data.models)\n                    setFetchModelsMsg(`${data.models.length} 个模型`)\n                  } else {\n                    setFetchModelsMsg(data.message || '无可用模型')\n                  }\n                } catch (e) {\n                  setFetchModelsMsg(String(e))\n                }\n                setFetchingModels(false)\n              }}\n              disabled={fetchingModels || !(form as any).ai_vision_endpoint}\n              className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\"\n              title=\"从提供商拉取可用模型列表\"\n            >\n              {fetchingModels ? '...' : '获取模型'}\n            </button>\n          </div>\n          {aiModels.length > 0 && (\n            <select\n              value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n              size={Math.min(aiModels.length + 1, 8)}\n            >\n              <option value=\"\" disabled>-- 选择模型 --</option>\n              {aiModels.map(m => (\n                <option key={m.id} value={m.id}>{m.name}</option>\n              ))}\n            </select>\n          )}\n          {fetchModelsMsg && (\n            <p className={`text-xs mt-1 ${fetchModelsMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>\n              {fetchModelsMsg}\n            </p>\n          )}\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Key</label>\n          <input type=\"password\" value={(form as any).ai_vision_api_key || ''}\n            onChange={(e) => updateForm({ ai_vision_api_key: e.target.value } as any)}\n            placeholder=\"sk-...  (支持 {env:VAR_NAME})\"\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 格式</label>\n          <select value={(form as any).ai_vision_provider || 'openai_compatible'}\n            onChange={(e) => {\n              const newProvider = e.target.value\n              const defaultEndpoint = AI_VISION_ENDPOINTS[newProvider] || ''\n              updateForm({\n                ai_vision_provider: newProvider,\n                ai_vision_endpoint: defaultEndpoint,\n              } as any)\n            }}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\">\n            <option value=\"openai_compatible\">OpenAI / DeepSeek / 智谱 / Qwen / Ollama / lmstudio</option>\n            <option value=\"openai_responses\">OpenAI Responses (新版 /v1/responses)</option>\n            <option value=\"azure\">Azure OpenAI</option>\n            <option value=\"anthropic\">Anthropic Claude</option>\n            <option value=\"gemini\">Google Gemini</option>\n            <option value=\"minimax_openai\">MiniMax (OpenAI 兼容 · 国内/国际通用)</option>\n            <option value=\"minimax_anthropic\">MiniMax (Anthropic 兼容 · Token Plan)</option>\n            <option value=\"custom\">自定义 (Custom)</option>\n          </select>\n        </div>\n        {(form as any).ai_vision_provider === 'custom' && (\n          <div className=\"flex items-center gap-2 mt-2\">\n            <input type=\"checkbox\" id=\"ai_vision_messages_api\"\n              checked={(form as any).ai_vision_messages_api ?? false}\n              onChange={(e) => updateForm({ ai_vision_messages_api: e.target.checked } as any)} className=\"rounded\" />\n            <label htmlFor=\"ai_vision_messages_api\" className=\"text-xs font-medium text-gray-600\">\n              使用 Anthropic Messages API 格式 (默认 OpenAI Chat Completions)\n            </label>\n          </div>\n        )}\n        <div className=\"grid grid-cols-2 gap-3 mt-2\">\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">DPI</label>\n            <input type=\"number\" value={(form as any).ai_vision_dpi ?? 150}\n              onChange={(e) => updateForm({ ai_vision_dpi: parseInt(e.target.value) || 150 } as any)}\n              min={72} max={300} className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\" />\n          </div>\n        </div>\n        <button\n          type=\"button\"\n          onClick={async () => {\n            setAiVisionTest('testing');\n            try {\n              const res = await fetch('/api/v1/check-ai-vision', {\n                method: 'POST',\n                headers: { 'Content-Type': 'application/json' },\n                body: JSON.stringify({\n                  endpoint: (form as any).ai_vision_endpoint,\n                  model: (form as any).ai_vision_model,\n                  api_key: (form as any).ai_vision_api_key,\n                  provider: (form as any).ai_vision_provider,\n                  messages_api: (form as any).ai_vision_messages_api,\n                }),\n              });\n              const data = await res.json();\n              setAiVisionTest(data.ok ? 'ok' : 'fail');\n              setAiVisionMsg(data.message || data.error || '');\n            } catch (e) {\n              setAiVisionTest('fail');\n              setAiVisionMsg(String(e));\n            }\n          }}\n          disabled={aiVisionTest === 'testing'}\n          className=\"px-3 py-1.5 mt-2 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50\"\n        >\n          {aiVisionTest === 'testing' ? '测试中...' : '检测'}\n        </button>\n        {aiVisionMsg && (\n          <p className={`text-xs mt-1 ${aiVisionTest === 'ok' ? 'text-green-600' : 'text-red-600'}`}>\n            {aiVisionMsg}\n          </p>\n        )}\n        <p className=\"text-xs text-gray-400 mt-1\">\n          阶段1 从 OCR 文字层提取目录（免费），阶段2 用 AI Vision 从目录页图片提取。\n          支持 OpenAI 兼容 / Gemini / MiniMax 格式。\n        </p>\n        <div className=\"flex items-center gap-2 mt-2\">\n          <input type=\"checkbox\" id=\"bookmark_confirm_enabled\"\n            checked={(form as any).bookmark_confirm_enabled ?? false}\n            onChange={(e) => updateForm({ bookmark_confirm_enabled: e.target.checked } as any)}\n            className=\"rounded\" />\n          <label htmlFor=\"bookmark_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n            管道执行到书签步骤时弹出确认对话框\n          </label>\n        </div>\n      </div>\n\n      {/* ============ 主题 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">主题</label>\n        <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n          {[\n            { key: 'auto', label: '自动' },\n            { key: 'light', label: '白昼' },\n            { key: 'dark', label: '黑夜' },\n          ].map(({ key, label }) => (\n            <button\n              key={key}\n              type=\"button\"\n              onClick={() => updateForm({ theme: key })}\n              className={`flex-1 py-1.5 text-center transition-colors ${\n                ((form as any).theme || 'auto') === key\n                  ? 'bg-blue-500 text-white'\n                  : 'bg-white text-gray-600 hover:bg-gray-50'\n              }`}\n            >\n              {label}\n            </button>\n          ))}\n        </div>\n      </div>\n\n      {/* ============ 保存按钮 ============ */}\n      <div className=\"flex items-center gap-3 pt-2\">\n        <button\n          type=\"button\"\n          onClick={handleSave}\n          disabled={saving}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {saving ? '保存中...' : '保存设置'}\n        </button>\n        <button\n          type=\"button\"\n          onClick={handleCheckUpdate}\n          disabled={updateChecking}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {updateChecking ? '检测中...' : '检查更新'}\n        </button>\n        {saveMsg && (\n          <span className={`text-xs ${saveMsg.includes('成功') ? 'text-green-600' : 'text-red-500'}`}>\n            {saveMsg}\n          </span>\n        )}\n        {updateResult && (\n          <span className={`text-xs px-2 py-1 rounded ${updateResult.includes('失败') ? 'text-red-600 bg-red-50' : updateResult.includes('新版本') ? 'text-blue-600 bg-blue-50 font-semibold' : 'text-green-600 bg-green-50'}`}>\n            {updateResult}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(OCRNetworkSection)\n"}, "edc250d5d4ab762c3915f5cd33fdce3ac09d9fce": {"t": 1785772779.7189453, "n": 49257, "h": "57f1b74e63731383", "c": "import React, { useState, useEffect, useRef, useCallback } from 'react'\nimport { SectionProps } from './types'\nimport { LLM_OCR_RECOMMENDED, API_BASE } from '../../constants'\n\nfunction StatusDot({ status }: { status: 'green' | 'red' | 'yellow' | null }) {\n  const colors: Record<string, string> = {\n    green: 'bg-green-500',\n    red: 'bg-red-500',\n    yellow: 'bg-yellow-500',\n  }\n  return (\n    <span className={`inline-block w-2 h-2 rounded-full ${status ? colors[status] : 'bg-gray-300'}`} />\n  )\n}\n\nconst OCR_ENGINES = [\n  { key: 'tesseract', name: 'Tesseract OCR', desc: '内置引擎，需 chi_sim 语言包' },\n  { key: 'paddleocr', name: 'PaddleOCR', desc: '百度引擎，需 Python 3.11 虚拟环境' },\n  { key: 'llm_ocr', name: 'LLM OCR', desc: '大模型视觉识别，无需本地引擎' },\n  { key: 'mineru', name: 'MinerU', desc: '线上 API 精准解析，需 Token' },\n  { key: 'paddleocr_online', name: 'PaddleOCR-VL-1.5', desc: '线上 API，需 Token' },\n]\n\nconst OCR_INSTALL_GUIDE = `## 安装 OCR 引擎\n\n**注意**：Python 3.14 与 \\`paddlepaddle\\` 不兼容。建议使用 Python 3.11 创建虚拟环境。\n\n---\n\n### 1. 创建/重建虚拟环境（Python 3.11）\n\n\\`\\`\\`powershell\n# 如果原 venv 不支持 Python 3.11，先删除\nRemove-Item -Recurse -Force backend\\\\venv\n\n# 使用 Python 3.11 创建新 venv\nC:\\\\Python311\\\\python.exe -m venv backend\\\\venv\n\\`\\`\\`\n\n### 2. 激活虚拟环境（PowerShell）\n\n\\`\\`\\`powershell\n# 方法一：PowerShell 执行策略问题\npowershell -ExecutionPolicy Bypass -Command \"backend\\\\venv\\\\Scripts\\\\Activate.ps1\"\n\n# 方法二：直接用 python 运行（无需激活）\nC:\\\\Python311\\\\python.exe -m pip install ...\n\\`\\`\\`\n\n### 3. 安装 OCRmyPDF 核心\n\n\\`\\`\\`powershell\npython -m pip install ocrmypdf\n\\`\\`\\`\n\n### 4. 安装引擎插件\n\n\\`\\`\\`powershell\n# 安装所有 OCR 引擎（推荐，一步到位）\npython -m pip install ocrmypdf-paddleocr paddleocr\n\n# 或分开安装\npython -m pip install paddleocr\npython -m pip install ocrmypdf-paddleocr  # 需要先装好 paddleocr\n\\`\\`\\`\n\n### 5. 安装 Tesseract OCR 系统依赖\n\n\\`\\`\\`powershell\nwinget install --id UB-Mannheim.TesseractOCR --accept-package-agreements --accept-source-agreements\n\\`\\`\\`\n\n### 6. 将 Tesseract 添加到 PATH\n\n\\`\\`\\`powershell\n[Environment]::SetEnvironmentVariable(\"Path\", [Environment]::GetEnvironmentVariable(\"Path\", \"User\") + \";C:\\\\Program Files\\\\Tesseract-OCR\", \"User\")\n\\`\\`\\`\n\n> ⚠️ 添加后需**重启终端或IDE**使 PATH 生效，或使用完整路径验证：\n> \\`\\`\\`powershell\n> & \"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n> \\`\\`\\`\n\n### 7. 验证安装\n\n\\`\\`\\`powershell\npython -c \"import ocrmypdf; print('ocrmypdf:', ocrmypdf.__version__)\"\npython -c \"from paddle import paddle; print('paddle:', paddle.__version__)\"\n\"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n\\`\\`\\`\n\n### 常见问题\n\n| 问题 | 解决 |\n|------|------|\n| \\`ModuleNotFoundError: No module named 'paddlepaddle'\\` | \\`import paddle\\` 而非 \\`import paddlepaddle\\` |\n| \\`ocrmypdf-paddleocr\\` 依赖冲突 | 先装 \\`paddleocr\\`，再装 \\`ocrmypdf-paddleocr\\` |\n| Tesseract 找不到 | 重启终端，或使用完整路径 \\`C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\\` |`\n\nconst AI_VISION_ENDPOINTS: Record<string, string> = {\n  openai_compatible: 'https://api.openai.com/v1',\n  openai_responses: 'https://api.openai.com/v1',\n  azure: 'https://RESOURCE_NAME.openai.azure.com',\n  anthropic: 'https://api.anthropic.com',\n  gemini: 'https://generativelanguage.googleapis.com/v1beta',\n  minimax_openai: 'https://api.minimaxi.com/v1',\n  minimax_anthropic: 'https://api.minimaxi.com',\n  custom: '',\n}\n\nfunction OCRNetworkSection({ form, updateForm, mountedRef }: SectionProps) {\n  const [ocrChecking, setOcrChecking] = useState(false)\n  const [ocrStatus, setOcrStatus] = useState<'green' | 'red' | 'yellow' | null>(null)\n  const [ocrMsg, setOcrMsg] = useState('')\n  const [ocrEngines, setOcrEngines] = useState<Record<string, { installed: boolean; installing: boolean; msg: string }>>({})\n  const [llmModels, setLlmModels] = useState<any[]>([])\n  const [llmFetchMsg, setLlmFetchMsg] = useState('')\n  const [onlineEngineStatus, setOnlineEngineStatus] = useState<Record<string, 'ok' | 'fail' | ''>>({ mineru: '', paddleocr: '' })\n  const [onlineTesting, setOnlineTesting] = useState<Record<string, boolean>>({ mineru: false, paddleocr: false })\n  const [llmFetching, setLlmFetching] = useState(false)\n  const [llmTestMsg, setLlmTestMsg] = useState('')\n  const [llmTesting, setLlmTesting] = useState(false)\n  const [aiModels, setAiModels] = useState<{ id: string; name: string }[]>([])\n  const [fetchingModels, setFetchingModels] = useState(false)\n  const [fetchModelsMsg, setFetchModelsMsg] = useState('')\n  const [aiVisionTest, setAiVisionTest] = useState<'testing' | 'ok' | 'fail' | null>(null)\n  const [aiVisionMsg, setAiVisionMsg] = useState('')\n  const [saving, setSaving] = useState(false)\n  const [saveMsg, setSaveMsg] = useState('')\n  const [updateChecking, setUpdateChecking] = useState(false)\n  const [updateResult, setUpdateResult] = useState('')\n\n  // --- OCR logic ---\n  const checkOcr = useCallback(async (engine?: string) => {\n    setOcrChecking(true)\n    try {\n      const eng = engine || form.ocr_engine || 'tesseract'\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrStatus(data.ok ? 'green' : 'red')\n      setOcrMsg(data.message || (data.ok ? data.version || '已安装' : '未检测到'))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrStatus('red')\n        setOcrMsg('检测失败')\n      }\n    } finally {\n      if (mountedRef.current) setOcrChecking(false)\n    }\n  }, [form.ocr_engine, mountedRef])\n\n  const handleDetectOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: false, msg: '检测中...' } }))\n    try {\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(engine)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n          has_chi_sim: data.has_chi_sim,\n          languages: data.languages,\n          venv: data.venv,\n        } as any,\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '检测失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleInstallOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: true, msg: '安装中...' } }))\n    try {\n      const res = await fetch('/api/v1/install-ocr', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ engine }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.message || (data.ok ? '安装成功' : '安装失败'),\n        },\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '安装请求失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleTestMineru = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, mineru: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, mineru: '' }))\n    try {\n      const res = await fetch('/api/v1/check-mineru', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).mineru_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, mineru: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n  }, [form, mountedRef])\n\n  const handleTestPaddleocrOnline = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, paddleocr: '' }))\n    try {\n      const res = await fetch('/api/v1/check-paddleocr-online', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).paddleocr_online_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, paddleocr: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n  }, [form, mountedRef])\n\n  // Auto-detect OCR engine statuses\n  const autoOcrRef = useRef(false)\n  useEffect(() => {\n    if (autoOcrRef.current) return\n    autoOcrRef.current = true\n    const engines = ['tesseract', 'paddleocr']\n    engines.forEach((eng) => {\n      fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n        .then((r) => r.json())\n        .then((data) => {\n          if (!mountedRef.current) return\n          setOcrEngines((prev) => ({\n            ...prev,\n            [eng]: {\n              installed: data.ok || false,\n              installing: false,\n              msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n              has_chi_sim: data.has_chi_sim,\n              languages: data.languages,\n              venv: data.venv,\n            } as any,\n          }))\n        })\n        .catch(() => {})\n    })\n    const defaultEngine = form.ocr_engine || 'tesseract'\n    fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(defaultEngine)}`)\n      .then((r) => r.json())\n      .then((data) => {\n        if (!mountedRef.current) return\n        setOcrStatus(data.ok ? 'green' : 'red')\n        setOcrMsg(data.version || data.message || (data.ok ? '已安装' : '未检测到'))\n      })\n      .catch(() => {})\n  }, [form.ocr_engine, mountedRef])\n\n  // Auto-detect PaddleOCR availability on mount\n  // PaddleOCR already covered by B1's forEach loop\n  useEffect(() => {\n    fetch(`${API_BASE}/check-ocr?engine=paddleocr`)\n      .then((r) => r.json())\n      .then((data) => {\n        if (!mountedRef.current) return\n        setOcrEngines((prev) => ({\n          ...prev,\n          paddleocr: {\n            installed: data.ok || false,\n            installing: false,\n            msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n            has_chi_sim: data.has_chi_sim,\n            languages: data.languages,\n            venv: data.venv,\n          } as any,\n        }))\n      })\n      .catch(() => {})\n  }, [form.ocr_engine, mountedRef])\n\n  // Update OCR header status when engine selection changes\n  useEffect(() => {\n    const eng = form.ocr_engine || 'tesseract'\n    const info = ocrEngines[eng]\n    if (info) {\n      setOcrStatus(info.installed ? 'green' : 'red')\n      setOcrMsg(info.msg || (info.installed ? '已安装' : '未检测到'))\n    }\n  }, [form.ocr_engine, ocrEngines])\n\n  // Auto-detect online API connectivity\n  const autoOnlineRef = useRef(false)\n  useEffect(() => {\n    if (autoOnlineRef.current) return\n    autoOnlineRef.current = true\n    const check = async () => {\n      if ((form as any).mineru_token) {\n        setOnlineTesting(prev => ({ ...prev, mineru: true }))\n        try {\n          const r = await fetch('/api/v1/check-mineru', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).mineru_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n      }\n      if ((form as any).paddleocr_online_token) {\n        setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n        try {\n          const r = await fetch('/api/v1/check-paddleocr-online', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).paddleocr_online_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n      }\n    }\n    check()\n  }, [mountedRef])\n\n  // --- Save / Update ---\n  const handleSave = useCallback(async () => {\n    setSaving(true)\n    setSaveMsg('')\n    try {\n      const body = JSON.stringify(form)\n      const res = await fetch('/api/v1/config', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body,\n      })\n      if (!res.ok) {\n        setSaveMsg('保存失败: HTTP ' + res.status)\n        setSaving(false)\n        return\n      }\n      setSaveMsg('保存成功')\n      setTimeout(() => setSaveMsg(''), 2000)\n    } catch (e: any) {\n      setSaveMsg('保存失败: ' + (e.message || '未知错误'))\n    }\n    setSaving(false)\n  }, [form, mountedRef])\n\n  const handleCheckUpdate = useCallback(async () => {\n    setUpdateChecking(true)\n    setUpdateResult('')\n    try {\n      const res = await fetch('/api/v1/check-update')\n      const data = await res.json()\n      if (!mountedRef.current) return\n      if (data.has_update) {\n        setUpdateResult(`新版本 v${data.latest} 可用 (当前 v${data.current})`)\n      } else {\n        setUpdateResult(`已是最新版本 v${data.current}`)\n      }\n    } catch (e) {\n      if (mountedRef.current) setUpdateResult('检查失败')\n    } finally {\n      if (mountedRef.current) setUpdateChecking(false)\n    }\n  }, [mountedRef])\n\n  return (\n    <div className=\"space-y-3\">\n      {/* OCRmyPDF 独立状态区 */}\n      <div>\n        <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCRmyPDF 状态</label>\n        <div className=\"flex items-center gap-2\">\n          <StatusDot status={(ocrEngines['ocrmypdf'] as any)?.installed ? 'green' : (ocrEngines['ocrmypdf'] as any)?.msg ? 'red' : null} />\n          <span className=\"text-xs text-gray-500\">\n            {(ocrEngines['ocrmypdf'] as any)?.msg || '点击检测'}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => handleDetectOcrEngine('ocrmypdf')}\n            className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n          >\n            检测\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => handleInstallOcrEngine('ocrmypdf')}\n            disabled={(ocrEngines['ocrmypdf'] as any)?.installing}\n            className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n          >\n            {(ocrEngines['ocrmypdf'] as any)?.installing ? '安装中...' : '一键安装'}\n          </button>\n        </div>\n      </div>\n\n      {/* 引擎切换区 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">引擎切换</span>\n        <div className=\"grid grid-cols-2 gap-2\">\n          {OCR_ENGINES.filter(eng => eng.key !== 'llm_ocr' && eng.key !== 'mineru' && eng.key !== 'paddleocr_online').map((eng) => {\n            const info = (ocrEngines[eng.key] as any) || { installed: eng.key === 'llm_ocr', msg: '' }\n            const isSelected = form.ocr_engine === eng.key\n            return (\n              <div\n                key={eng.key}\n                className={`rounded border p-2.5 ${isSelected ? 'border-blue-400 bg-blue-50' : 'border-gray-200 bg-white'}`}\n              >\n                <div className=\"flex items-center justify-between mb-1\">\n                  <span className=\"text-xs font-medium text-gray-700\">{eng.name}</span>\n                  <div className=\"flex items-center gap-1\">\n                    <StatusDot status={info?.installed ? 'green' : info?.msg ? 'red' : null} />\n                  </div>\n                </div>\n                <p className=\"text-xs text-gray-400 mb-2\">{eng.desc}</p>\n                {eng.key !== 'llm_ocr' && info?.msg && (\n                  <p className={`text-xs mb-1.5 ${info.installed ? 'text-green-600' : 'text-red-500'}`}>\n                    {info.msg}\n                  </p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && !info?.installed && (\n                  <p className=\"text-xs text-gray-400 mb-1.5\">需要 Python 3.11 虚拟环境，点击安装自动搭建</p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && info?.installed && (info as any)?.venv && (\n                  <p className=\"text-xs text-green-600 mb-1.5\">运行环境: {(info as any).venv}</p>\n                )}\n                <div className=\"flex items-center gap-1.5\">\n                  {eng.key !== 'llm_ocr' && (\n                    <>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleDetectOcrEngine(eng.key)}\n                        className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n                      >\n                        检测\n                      </button>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleInstallOcrEngine(eng.key)}\n                        disabled={info?.installing}\n                        className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n                      >\n                        {info?.installing ? '安装中...' : '安装'}\n                      </button>\n                    </>\n                  )}\n                  {eng.key === form.ocr_engine ? null : (\n                    <button\n                      type=\"button\"\n                      onClick={() => updateForm({ ocr_engine: eng.key })}\n                      className=\"px-2 py-1 text-xs rounded text-blue-600 hover:bg-blue-50 ml-auto\"\n                    >\n                      选用\n                    </button>\n                  )}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n\n      {/* Tesseract 语言包状态 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <div className=\"border-t border-gray-200 pt-3\">\n          <span className=\"text-xs font-medium text-gray-600 mb-2 block\">Tesseract 语言包</span>\n          <div className=\"flex items-center gap-2\">\n            <StatusDot status={\n              form.ocr_engine === 'tesseract' && (ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'green'\n                : form.ocr_engine === 'tesseract'\n                  ? 'red'\n                  : null\n            } />\n            <span className=\"text-xs text-gray-500\">\n              {(ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'chi_sim 已安装'\n                : (ocrEngines['tesseract'] as any)?.languages\n                  ? 'chi_sim 未安装'\n                  : '请先检测 Tesseract'}\n            </span>\n            {!((ocrEngines['tesseract'] as any)?.has_chi_sim) && (\n              <button\n                type=\"button\"\n                onClick={async () => {\n                  try {\n                    await fetch('/api/v1/install-tesseract-lang?lang=chi_sim')\n                    handleDetectOcrEngine('tesseract')\n                  } catch (e) {\n                  }\n                }}\n                className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600\"\n              >\n                安装语言包\n              </button>\n            )}\n          </div>\n        </div>\n      )}\n\n      <div className=\"grid grid-cols-4 gap-3 pt-2\">\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">语言</label>\n          <select\n            value={form.ocr_languages || 'chi_sim+eng'}\n            onChange={(e) => updateForm({ ocr_languages: e.target.value })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value=\"chi_sim+eng\">chi_sim+eng</option>\n            <option value=\"chi_sim\">chi_sim</option>\n            <option value=\"eng\">eng</option>\n            <option value=\"chi_sim+eng+jpn\">chi_sim+eng+jpn</option>\n          </select>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">并行线程</label>\n          <select\n            value={form.ocr_jobs ?? 1}\n            onChange={(e) => updateForm({ ocr_jobs: parseInt(e.target.value) || 1 })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value={1}>1</option>\n            <option value={2}>2</option>\n            <option value={4}>4</option>\n          </select>\n          <p className=\"text-[10px] text-gray-400 mt-0.5 leading-tight\">Tesseract 支持多线程，PaddleOCR 仅单线程</p>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">超时 (秒)</label>\n          <input\n            type=\"number\"\n            value={form.ocr_timeout ?? 1800}\n            onChange={(e) => updateForm({ ocr_timeout: parseInt(e.target.value) || 3600 })}\n            min={60}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCR 采样 DPI</label>\n          <input\n            type=\"number\"\n            min={150}\n            max={400}\n            step={50}\n            value={(form as any).ocr_oversample || 200}\n            onChange={(e) => updateForm({ ocr_oversample: parseInt(e.target.value) } as any)}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n          <span className=\"text-xs text-gray-400\">越低越快，150-400，推荐 200</span>\n        </div>\n      </div>\n\n      {/* OCR 安装指引 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <details className=\"group\">\n          <summary className=\"text-xs font-medium text-gray-600 cursor-pointer list-none flex items-center gap-1 select-none hover:text-gray-800\">\n            <svg className=\"w-3 h-3 text-gray-400 transition-transform group-open:rotate-90\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n            </svg>\n            OCR 命令行安装指引\n          </summary>\n          <div className=\"mt-2 bg-blue-50 border border-blue-200 rounded p-3\">\n            <p className=\"text-xs text-blue-800 font-medium mb-2\">📋 将以下提示词复制并发送给 OpenCode：</p>\n            <pre className=\"text-xs text-blue-700 bg-blue-100 rounded p-2 overflow-x-auto whitespace-pre-wrap font-mono\">{OCR_INSTALL_GUIDE}</pre>\n            <p className=\"text-xs text-blue-600 mt-2\">安装后返回设置页点击\"检测\"按钮确认状态。</p>\n          </div>\n        </details>\n      )}\n\n      {/* LLM OCR */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'llm_ocr' ? (\n              <span className=\"text-blue-600\">LLM OCR 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">LLM OCR</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'llm_ocr' ? 'tesseract' : 'llm_ocr' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'llm_ocr'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'llm_ocr' ? '停用并回到 OCRmyPDF' : '启用 LLM OCR'}\n          </button>\n        </div>\n      </div>\n\n      {form.ocr_engine === 'llm_ocr' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用视觉大模型逐框识别文字层。需要运行 lmstudio / ollama 加载对应模型。\n            推荐模型已验证中文 PDF 可用。\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">接口地址</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_endpoint || 'http://127.0.0.1:1234/v1'}\n                onChange={(e) => updateForm({ llm_ocr_endpoint: e.target.value } as any)}\n                placeholder=\"http://127.0.0.1:1234/v1\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmTesting(true); setLlmTestMsg('');\n                try {\n                  const r = await fetch('/api/v1/check-llm-ocr', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint, model: (form as any).llm_ocr_model })\n                  });\n                  const d = await r.json();\n                  setLlmTestMsg(d.message || (d.ok ? 'OK' : 'Failed'));\n                } catch (e) { setLlmTestMsg(String(e)); }\n                setLlmTesting(false);\n              }} disabled={llmTesting}\n                className=\"px-3 py-1.5 text-xs rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 whitespace-nowrap\">\n                {llmTesting ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {llmTestMsg && <p className={`text-xs mt-1 ${llmTestMsg.includes('成功') || llmTestMsg.includes('OK') ? 'text-green-600' : 'text-red-500'}`}>{llmTestMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                placeholder=\"qwen3-vl-4b-instruct\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmFetching(true); setLlmFetchMsg('');\n                try {\n                  const r = await fetch('/api/v1/fetch-llm-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint })\n                  });\n                  const d = await r.json();\n                  if (d.ok && d.models.length > 0) {\n                    setLlmModels(d.models);\n                    setLlmFetchMsg(`${d.models.length} 个模型`);\n                  } else {\n                    setLlmFetchMsg(d.message || '无可用模型');\n                  }\n                } catch (e) { setLlmFetchMsg(String(e)); }\n                setLlmFetching(false);\n              }} disabled={llmFetching || !(form as any).llm_ocr_endpoint}\n                className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\">\n                {llmFetching ? '...' : '拉取模型'}\n              </button>\n            </div>\n            {llmModels.length > 0 && (\n              <select value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n                size={Math.min(llmModels.length + 1, 8)}>\n                <option value=\"\" disabled>-- 选择模型 --</option>\n                {llmModels.map((m: any) => (\n                  <option key={m.id} value={m.id}>{m.name}</option>\n                ))}\n              </select>\n            )}\n            {llmFetchMsg && <p className={`text-xs mt-1 ${llmFetchMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>{llmFetchMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              并发数: {(form as any).llm_ocr_concurrency || 1}\n            </label>\n            <input type=\"range\" min=\"1\" max=\"5\" step=\"1\"\n              value={(form as any).llm_ocr_concurrency || 1}\n              onChange={(e) => updateForm({ llm_ocr_concurrency: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>1 (默认)</span><span>5 (最快)</span>\n            </div>\n          </div>\n          <div className=\"mt-2\">\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              版面检测批次: {(form as any).llm_ocr_detect_batch || 20} 页/批\n            </label>\n            <input type=\"range\" min=\"5\" max=\"50\" step=\"5\"\n              value={(form as any).llm_ocr_detect_batch || 20}\n              onChange={(e) => updateForm({ llm_ocr_detect_batch: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>5 页 (低内存)</span><span>50 页 (更快)</span>\n            </div>\n            <p className=\"text-xs text-gray-400 mt-0.5\">Surya 版面检测每批处理页数。内存不足时降低。</p>\n          </div>\n          <details className=\"text-xs\">\n            <summary className=\"cursor-pointer text-blue-600 hover:text-blue-800\">\n              推荐模型 (已验证中文 PDF)\n            </summary>\n            <div className=\"mt-2 space-y-1\">\n              {LLM_OCR_RECOMMENDED.map(m => (\n                <button key={m.model}\n                  onClick={() => updateForm({ llm_ocr_model: m.model } as any)}\n                  title={m.note}\n                  className=\"block w-full text-left px-2 py-1 rounded hover:bg-blue-100 text-gray-700 text-xs\">\n                  <span className=\"font-mono\">{m.model}</span>\n                  <span className=\"text-gray-400 ml-2\">{m.note}</span>\n                </button>\n              ))}\n            </div>\n          </details>\n        </div>\n      )}\n\n      {/* MinerU */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'mineru' ? (\n              <span className=\"text-blue-600\">MinerU 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">MinerU 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'mineru' ? 'tesseract' : 'mineru' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'mineru'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'mineru' ? '停用 MinerU' : '启用 MinerU'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'mineru' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用 MinerU v4 精准解析 API 进行文档 OCR。PDF 将上传至 MinerU 服务器处理。\n            仅限中国大陆网络访问，单文件 ≤200MB / ≤200页。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Token</label>\n            <input value={(form as any).mineru_token || ''}\n              onChange={(e) => updateForm({ mineru_token: e.target.value } as any)}\n              placeholder=\"输入 MinerU API Token（Bearer 认证）\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <button\n              type=\"button\"\n              onClick={handleTestMineru}\n              disabled={onlineTesting.mineru || !(form as any).mineru_token}\n              className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed\">\n              {onlineTesting.mineru ? '测试中...' : '检测'}\n            </button>\n            {onlineEngineStatus.mineru === 'ok' && (\n              <span className=\"text-xs text-green-600\">连接正常</span>\n            )}\n            {onlineEngineStatus.mineru === 'fail' && (\n              <span className=\"text-xs text-red-500\">连接失败</span>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            需要先申请 Token：<a href=\"https://mineru.net/apiManage/docs\" target=\"_blank\" className=\"text-blue-500 hover:underline\">MinerU API 文档</a>\n          </p>\n        </div>\n      )}\n\n      {/* PaddleOCR-VL-1.5 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'paddleocr_online' ? (\n              <span className=\"text-blue-600\">PaddleOCR-VL-1.5 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">PaddleOCR-VL-1.5 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'paddleocr_online' ? 'tesseract' : 'paddleocr_online' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'paddleocr_online'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'paddleocr_online' ? '停用 PaddleOCR-VL-1.5' : '启用 PaddleOCR-VL-1.5'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'paddleocr_online' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用百度 PaddleOCR-VL-1.5 视觉大模型进行文档版面解析。\n            支持中英文文档，无需本地 GPU。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">识别模式 <span className=\"text-[11px] text-blue-500 ml-1\">推荐逐框识别，次选混合识别</span></label>\n            <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n              {[\n                { key: 'spatial', label: '空间分配（快）' },\n                { key: 'perbox', label: '逐框识别（慢）' },\n                { key: 'hybrid', label: '混合识别' },\n              ].map(({ key, label }) => (\n                <button\n                  key={key}\n                  type=\"button\"\n                  onClick={() => updateForm({ paddleocr_online_mode: key } as any)}\n                  className={`flex-1 py-1.5 text-center transition-colors ${\n                    ((form as any).paddleocr_online_mode || 'spatial') === key\n                      ? 'bg-blue-500 text-white'\n                      : 'bg-white text-gray-600 hover:bg-gray-50'\n                  }`}\n                >\n                  {label}\n                </button>\n              ))}\n            </div>\n            <p className=\"text-[11px] text-gray-400 mt-1\">\n              {((form as any).paddleocr_online_mode || 'spatial') === 'spatial' && '段落文字精准，行识别不精确'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'perbox' && '行识别精准，有乱码风险'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'hybrid' && '逐框为主、空间填补，可能产生识别重复'}\n            </p>\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">Access Token</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).paddleocr_online_token || ''}\n                onChange={(e) => updateForm({ paddleocr_online_token: e.target.value } as any)}\n                placeholder=\"输入 PaddleOCR access token\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button\n                type=\"button\"\n                onClick={handleTestPaddleocrOnline}\n                disabled={onlineTesting.paddleocr || !(form as any).paddleocr_online_token}\n                className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap\">\n                {onlineTesting.paddleocr ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {onlineEngineStatus.paddleocr === 'ok' && (\n              <p className=\"text-xs text-green-600 mt-1\">连接正常</p>\n            )}\n            {onlineEngineStatus.paddleocr === 'fail' && (\n              <p className=\"text-xs text-red-500 mt-1\">连接失败</p>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            从 <a href=\"https://aistudio.baidu.com/paddleocr/task\" target=\"_blank\" className=\"text-blue-500 hover:underline\">PaddleOCR 控制台</a> 获取 Access Token。\n            <a href=\"https://ai.baidu.com/ai-doc/AISTUDIO/Cmkz2m0ma\" target=\"_blank\" className=\"text-blue-500 hover:underline ml-2\">API 文档</a>\n          </p>\n        </div>\n      )}\n\n      <div className=\"flex items-center gap-2 pt-3\">\n        <input type=\"checkbox\" id=\"ocr_confirm_enabled\"\n          checked={(form as any).ocr_confirm_enabled ?? false}\n          onChange={(e) => updateForm({ ocr_confirm_enabled: e.target.checked } as any)}\n          className=\"rounded\" />\n        <label htmlFor=\"ocr_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n          管道执行到 OCR 步骤时弹出确认对话框\n        </label>\n      </div>\n\n      {/* ============ AI Vision / 书签 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">AI Vision 目录提取</span>\n        <div className=\"flex items-center gap-2\">\n          <input type=\"checkbox\" id=\"ai_vision_enabled\"\n            checked={(form as any).ai_vision_enabled ?? true}\n            onChange={(e) => updateForm({ ai_vision_enabled: e.target.checked } as any)} className=\"rounded\" />\n          <label htmlFor=\"ai_vision_enabled\" className=\"text-xs\">启用 AI Vision 目录提取</label>\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 端点</label>\n          <input type=\"text\" value={(form as any).ai_vision_endpoint || ''}\n            onChange={(e) => updateForm({ ai_vision_endpoint: e.target.value } as any)}\n            placeholder={\n              (form as any).ai_vision_provider === 'gemini' ? 'https://generativelanguage.googleapis.com/v1beta' :\n              (form as any).ai_vision_provider === 'azure' ? 'https://{resource}.openai.azure.com' :\n              (form as any).ai_vision_provider === 'anthropic' || (form as any).ai_vision_provider === 'minimax_anthropic' ? 'https://api.anthropic.com' :\n              (form as any).ai_vision_provider === 'minimax_openai' ? 'https://api.minimaxi.com/v1' :\n              'http://127.0.0.1:12345/v1'\n            }\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n          <div className=\"flex gap-1\">\n            <input type=\"text\" value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              placeholder=\"sabafallah/deepseek-ocr\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n            <button\n              type=\"button\"\n              onClick={async () => {\n                setFetchingModels(true)\n                setFetchModelsMsg('')\n                try {\n                  const res = await fetch('/api/v1/fetch-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({\n                      endpoint: (form as any).ai_vision_endpoint,\n                      api_key: (form as any).ai_vision_api_key,\n                      provider: (form as any).ai_vision_provider,\n                    }),\n                  })\n                  const data = await res.json()\n                  if (data.ok && data.models.length > 0) {\n                    setAiModels(data.models)\n                    setFetchModelsMsg(`${data.models.length} 个模型`)\n                  } else {\n                    setFetchModelsMsg(data.message || '无可用模型')\n                  }\n                } catch (e) {\n                  setFetchModelsMsg(String(e))\n                }\n                setFetchingModels(false)\n              }}\n              disabled={fetchingModels || !(form as any).ai_vision_endpoint}\n              className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\"\n              title=\"从提供商拉取可用模型列表\"\n            >\n              {fetchingModels ? '...' : '获取模型'}\n            </button>\n          </div>\n          {aiModels.length > 0 && (\n            <select\n              value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n              size={Math.min(aiModels.length + 1, 8)}\n            >\n              <option value=\"\" disabled>-- 选择模型 --</option>\n              {aiModels.map(m => (\n                <option key={m.id} value={m.id}>{m.name}</option>\n              ))}\n            </select>\n          )}\n          {fetchModelsMsg && (\n            <p className={`text-xs mt-1 ${fetchModelsMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>\n              {fetchModelsMsg}\n            </p>\n          )}\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Key</label>\n          <input type=\"password\" value={(form as any).ai_vision_api_key || ''}\n            onChange={(e) => updateForm({ ai_vision_api_key: e.target.value } as any)}\n            placeholder=\"sk-...  (支持 {env:VAR_NAME})\"\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 格式</label>\n          <select value={(form as any).ai_vision_provider || 'openai_compatible'}\n            onChange={(e) => {\n              const newProvider = e.target.value\n              const defaultEndpoint = AI_VISION_ENDPOINTS[newProvider] || ''\n              updateForm({\n                ai_vision_provider: newProvider,\n                ai_vision_endpoint: defaultEndpoint,\n              } as any)\n            }}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\">\n            <option value=\"openai_compatible\">OpenAI / DeepSeek / 智谱 / Qwen / Ollama / lmstudio</option>\n            <option value=\"openai_responses\">OpenAI Responses (新版 /v1/responses)</option>\n            <option value=\"azure\">Azure OpenAI</option>\n            <option value=\"anthropic\">Anthropic Claude</option>\n            <option value=\"gemini\">Google Gemini</option>\n            <option value=\"minimax_openai\">MiniMax (OpenAI 兼容 · 国内/国际通用)</option>\n            <option value=\"minimax_anthropic\">MiniMax (Anthropic 兼容 · Token Plan)</option>\n            <option value=\"custom\">自定义 (Custom)</option>\n          </select>\n        </div>\n        {(form as any).ai_vision_provider === 'custom' && (\n          <div className=\"flex items-center gap-2 mt-2\">\n            <input type=\"checkbox\" id=\"ai_vision_messages_api\"\n              checked={(form as any).ai_vision_messages_api ?? false}\n              onChange={(e) => updateForm({ ai_vision_messages_api: e.target.checked } as any)} className=\"rounded\" />\n            <label htmlFor=\"ai_vision_messages_api\" className=\"text-xs font-medium text-gray-600\">\n              使用 Anthropic Messages API 格式 (默认 OpenAI Chat Completions)\n            </label>\n          </div>\n        )}\n        <div className=\"grid grid-cols-2 gap-3 mt-2\">\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">DPI</label>\n            <input type=\"number\" value={(form as any).ai_vision_dpi ?? 150}\n              onChange={(e) => updateForm({ ai_vision_dpi: parseInt(e.target.value) || 150 } as any)}\n              min={72} max={300} className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\" />\n          </div>\n        </div>\n        <button\n          type=\"button\"\n          onClick={async () => {\n            setAiVisionTest('testing');\n            try {\n              const res = await fetch('/api/v1/check-ai-vision', {\n                method: 'POST',\n                headers: { 'Content-Type': 'application/json' },\n                body: JSON.stringify({\n                  endpoint: (form as any).ai_vision_endpoint,\n                  model: (form as any).ai_vision_model,\n                  api_key: (form as any).ai_vision_api_key,\n                  provider: (form as any).ai_vision_provider,\n                  messages_api: (form as any).ai_vision_messages_api,\n                }),\n              });\n              const data = await res.json();\n              setAiVisionTest(data.ok ? 'ok' : 'fail');\n              setAiVisionMsg(data.message || data.error || '');\n            } catch (e) {\n              setAiVisionTest('fail');\n              setAiVisionMsg(String(e));\n            }\n          }}\n          disabled={aiVisionTest === 'testing'}\n          className=\"px-3 py-1.5 mt-2 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50\"\n        >\n          {aiVisionTest === 'testing' ? '测试中...' : '检测'}\n        </button>\n        {aiVisionMsg && (\n          <p className={`text-xs mt-1 ${aiVisionTest === 'ok' ? 'text-green-600' : 'text-red-600'}`}>\n            {aiVisionMsg}\n          </p>\n        )}\n        <p className=\"text-xs text-gray-400 mt-1\">\n          阶段1 从 OCR 文字层提取目录（免费），阶段2 用 AI Vision 从目录页图片提取。\n          支持 OpenAI 兼容 / Gemini / MiniMax 格式。\n        </p>\n        <div className=\"flex items-center gap-2 mt-2\">\n          <input type=\"checkbox\" id=\"bookmark_confirm_enabled\"\n            checked={(form as any).bookmark_confirm_enabled ?? false}\n            onChange={(e) => updateForm({ bookmark_confirm_enabled: e.target.checked } as any)}\n            className=\"rounded\" />\n          <label htmlFor=\"bookmark_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n            管道执行到书签步骤时弹出确认对话框\n          </label>\n        </div>\n      </div>\n\n      {/* ============ 主题 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">主题</label>\n        <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n          {[\n            { key: 'auto', label: '自动' },\n            { key: 'light', label: '白昼' },\n            { key: 'dark', label: '黑夜' },\n          ].map(({ key, label }) => (\n            <button\n              key={key}\n              type=\"button\"\n              onClick={() => updateForm({ theme: key })}\n              className={`flex-1 py-1.5 text-center transition-colors ${\n                ((form as any).theme || 'auto') === key\n                  ? 'bg-blue-500 text-white'\n                  : 'bg-white text-gray-600 hover:bg-gray-50'\n              }`}\n            >\n              {label}\n            </button>\n          ))}\n        </div>\n      </div>\n\n      {/* ============ 保存按钮 ============ */}\n      <div className=\"flex items-center gap-3 pt-2\">\n        <button\n          type=\"button\"\n          onClick={handleSave}\n          disabled={saving}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {saving ? '保存中...' : '保存设置'}\n        </button>\n        <button\n          type=\"button\"\n          onClick={handleCheckUpdate}\n          disabled={updateChecking}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {updateChecking ? '检测中...' : '检查更新'}\n        </button>\n        {saveMsg && (\n          <span className={`text-xs ${saveMsg.includes('成功') ? 'text-green-600' : 'text-red-500'}`}>\n            {saveMsg}\n          </span>\n        )}\n        {updateResult && (\n          <span className={`text-xs px-2 py-1 rounded ${updateResult.includes('失败') ? 'text-red-600 bg-red-50' : updateResult.includes('新版本') ? 'text-blue-600 bg-blue-50 font-semibold' : 'text-green-600 bg-green-50'}`}>\n            {updateResult}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(OCRNetworkSection)\n"}, "82e44dcd228c35b00a7ff5d95587319cc6f55f04": {"t": 1785772781.3517742, "n": 49236, "h": "d1a56a20ffac91c5", "c": "import React, { useState, useEffect, useRef, useCallback } from 'react'\nimport { SectionProps } from './types'\nimport { LLM_OCR_RECOMMENDED, API_BASE } from '../../constants'\n\nfunction StatusDot({ status }: { status: 'green' | 'red' | 'yellow' | null }) {\n  const colors: Record<string, string> = {\n    green: 'bg-green-500',\n    red: 'bg-red-500',\n    yellow: 'bg-yellow-500',\n  }\n  return (\n    <span className={`inline-block w-2 h-2 rounded-full ${status ? colors[status] : 'bg-gray-300'}`} />\n  )\n}\n\nconst OCR_ENGINES = [\n  { key: 'tesseract', name: 'Tesseract OCR', desc: '内置引擎，需 chi_sim 语言包' },\n  { key: 'paddleocr', name: 'PaddleOCR', desc: '百度引擎，需 Python 3.11 虚拟环境' },\n  { key: 'llm_ocr', name: 'LLM OCR', desc: '大模型视觉识别，无需本地引擎' },\n  { key: 'mineru', name: 'MinerU', desc: '线上 API 精准解析，需 Token' },\n  { key: 'paddleocr_online', name: 'PaddleOCR-VL-1.5', desc: '线上 API，需 Token' },\n]\n\nconst OCR_INSTALL_GUIDE = `## 安装 OCR 引擎\n\n**注意**：Python 3.14 与 \\`paddlepaddle\\` 不兼容。建议使用 Python 3.11 创建虚拟环境。\n\n---\n\n### 1. 创建/重建虚拟环境（Python 3.11）\n\n\\`\\`\\`powershell\n# 如果原 venv 不支持 Python 3.11，先删除\nRemove-Item -Recurse -Force backend\\\\venv\n\n# 使用 Python 3.11 创建新 venv\nC:\\\\Python311\\\\python.exe -m venv backend\\\\venv\n\\`\\`\\`\n\n### 2. 激活虚拟环境（PowerShell）\n\n\\`\\`\\`powershell\n# 方法一：PowerShell 执行策略问题\npowershell -ExecutionPolicy Bypass -Command \"backend\\\\venv\\\\Scripts\\\\Activate.ps1\"\n\n# 方法二：直接用 python 运行（无需激活）\nC:\\\\Python311\\\\python.exe -m pip install ...\n\\`\\`\\`\n\n### 3. 安装 OCRmyPDF 核心\n\n\\`\\`\\`powershell\npython -m pip install ocrmypdf\n\\`\\`\\`\n\n### 4. 安装引擎插件\n\n\\`\\`\\`powershell\n# 安装所有 OCR 引擎（推荐，一步到位）\npython -m pip install ocrmypdf-paddleocr paddleocr\n\n# 或分开安装\npython -m pip install paddleocr\npython -m pip install ocrmypdf-paddleocr  # 需要先装好 paddleocr\n\\`\\`\\`\n\n### 5. 安装 Tesseract OCR 系统依赖\n\n\\`\\`\\`powershell\nwinget install --id UB-Mannheim.TesseractOCR --accept-package-agreements --accept-source-agreements\n\\`\\`\\`\n\n### 6. 将 Tesseract 添加到 PATH\n\n\\`\\`\\`powershell\n[Environment]::SetEnvironmentVariable(\"Path\", [Environment]::GetEnvironmentVariable(\"Path\", \"User\") + \";C:\\\\Program Files\\\\Tesseract-OCR\", \"User\")\n\\`\\`\\`\n\n> ⚠️ 添加后需**重启终端或IDE**使 PATH 生效，或使用完整路径验证：\n> \\`\\`\\`powershell\n> & \"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n> \\`\\`\\`\n\n### 7. 验证安装\n\n\\`\\`\\`powershell\npython -c \"import ocrmypdf; print('ocrmypdf:', ocrmypdf.__version__)\"\npython -c \"from paddle import paddle; print('paddle:', paddle.__version__)\"\n\"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n\\`\\`\\`\n\n### 常见问题\n\n| 问题 | 解决 |\n|------|------|\n| \\`ModuleNotFoundError: No module named 'paddlepaddle'\\` | \\`import paddle\\` 而非 \\`import paddlepaddle\\` |\n| \\`ocrmypdf-paddleocr\\` 依赖冲突 | 先装 \\`paddleocr\\`，再装 \\`ocrmypdf-paddleocr\\` |\n| Tesseract 找不到 | 重启终端，或使用完整路径 \\`C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\\` |`\n\nconst AI_VISION_ENDPOINTS: Record<string, string> = {\n  openai_compatible: 'https://api.openai.com/v1',\n  openai_responses: 'https://api.openai.com/v1',\n  azure: 'https://RESOURCE_NAME.openai.azure.com',\n  anthropic: 'https://api.anthropic.com',\n  gemini: 'https://generativelanguage.googleapis.com/v1beta',\n  minimax_openai: 'https://api.minimaxi.com/v1',\n  minimax_anthropic: 'https://api.minimaxi.com',\n  custom: '',\n}\n\nfunction OCRNetworkSection({ form, updateForm, mountedRef }: SectionProps) {\n  const [ocrChecking, setOcrChecking] = useState(false)\n  const [ocrStatus, setOcrStatus] = useState<'green' | 'red' | 'yellow' | null>(null)\n  const [ocrMsg, setOcrMsg] = useState('')\n  const [ocrEngines, setOcrEngines] = useState<Record<string, { installed: boolean; installing: boolean; msg: string }>>({})\n  const [llmModels, setLlmModels] = useState<any[]>([])\n  const [llmFetchMsg, setLlmFetchMsg] = useState('')\n  const [onlineEngineStatus, setOnlineEngineStatus] = useState<Record<string, 'ok' | 'fail' | ''>>({ mineru: '', paddleocr: '' })\n  const [onlineTesting, setOnlineTesting] = useState<Record<string, boolean>>({ mineru: false, paddleocr: false })\n  const [llmFetching, setLlmFetching] = useState(false)\n  const [llmTestMsg, setLlmTestMsg] = useState('')\n  const [llmTesting, setLlmTesting] = useState(false)\n  const [aiModels, setAiModels] = useState<{ id: string; name: string }[]>([])\n  const [fetchingModels, setFetchingModels] = useState(false)\n  const [fetchModelsMsg, setFetchModelsMsg] = useState('')\n  const [aiVisionTest, setAiVisionTest] = useState<'testing' | 'ok' | 'fail' | null>(null)\n  const [aiVisionMsg, setAiVisionMsg] = useState('')\n  const [saving, setSaving] = useState(false)\n  const [saveMsg, setSaveMsg] = useState('')\n  const [updateChecking, setUpdateChecking] = useState(false)\n  const [updateResult, setUpdateResult] = useState('')\n\n  // --- OCR logic ---\n  const checkOcr = useCallback(async (engine?: string) => {\n    setOcrChecking(true)\n    try {\n      const eng = engine || form.ocr_engine || 'tesseract'\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrStatus(data.ok ? 'green' : 'red')\n      setOcrMsg(data.message || (data.ok ? data.version || '已安装' : '未检测到'))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrStatus('red')\n        setOcrMsg('检测失败')\n      }\n    } finally {\n      if (mountedRef.current) setOcrChecking(false)\n    }\n  }, [form.ocr_engine, mountedRef])\n\n  const handleDetectOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: false, msg: '检测中...' } }))\n    try {\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(engine)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n          has_chi_sim: data.has_chi_sim,\n          languages: data.languages,\n          venv: data.venv,\n        } as any,\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '检测失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleInstallOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: true, msg: '安装中...' } }))\n    try {\n      const res = await fetch('/api/v1/install-ocr', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ engine }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.message || (data.ok ? '安装成功' : '安装失败'),\n        },\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '安装请求失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleTestMineru = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, mineru: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, mineru: '' }))\n    try {\n      const res = await fetch('/api/v1/check-mineru', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).mineru_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, mineru: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n  }, [form, mountedRef])\n\n  const handleTestPaddleocrOnline = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, paddleocr: '' }))\n    try {\n      const res = await fetch('/api/v1/check-paddleocr-online', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).paddleocr_online_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, paddleocr: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n  }, [form, mountedRef])\n\n  // Auto-detect OCR engine statuses\n  const autoOcrRef = useRef(false)\n  useEffect(() => {\n    if (autoOcrRef.current) return\n    autoOcrRef.current = true\n    const engines = ['tesseract', 'paddleocr']\n    engines.forEach((eng) => {\n      fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n        .then((r) => r.json())\n        .then((data) => {\n          if (!mountedRef.current) return\n          setOcrEngines((prev) => ({\n            ...prev,\n            [eng]: {\n              installed: data.ok || false,\n              installing: false,\n              msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n              has_chi_sim: data.has_chi_sim,\n              languages: data.languages,\n              venv: data.venv,\n            } as any,\n          }))\n        })\n        .catch(() => {})\n    })\n    const defaultEngine = form.ocr_engine || 'tesseract'\n    fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(defaultEngine)}`)\n      .then((r) => r.json())\n      .then((data) => {\n        if (!mountedRef.current) return\n        setOcrStatus(data.ok ? 'green' : 'red')\n        setOcrMsg(data.version || data.message || (data.ok ? '已安装' : '未检测到'))\n      })\n      .catch(() => {})\n  }, [form.ocr_engine, mountedRef])\n\n  // Auto-detect PaddleOCR availability on mount\n  useEffect(() => {\n    fetch(`${API_BASE}/check-ocr?engine=paddleocr`)\n      .then((r) => r.json())\n      .then((data) => {\n        if (!mountedRef.current) return\n        setOcrEngines((prev) => ({\n          ...prev,\n          paddleocr: {\n            installed: data.ok || false,\n            installing: false,\n            msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n            has_chi_sim: data.has_chi_sim,\n            languages: data.languages,\n            venv: data.venv,\n          } as any,\n        }))\n      })\n      .catch(() => {})\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  // Update OCR header status when engine selection changes\n  useEffect(() => {\n    const eng = form.ocr_engine || 'tesseract'\n    const info = ocrEngines[eng]\n    if (info) {\n      setOcrStatus(info.installed ? 'green' : 'red')\n      setOcrMsg(info.msg || (info.installed ? '已安装' : '未检测到'))\n    }\n  }, [form.ocr_engine, ocrEngines])\n\n  // Auto-detect online API connectivity\n  const autoOnlineRef = useRef(false)\n  useEffect(() => {\n    if (autoOnlineRef.current) return\n    autoOnlineRef.current = true\n    const check = async () => {\n      if ((form as any).mineru_token) {\n        setOnlineTesting(prev => ({ ...prev, mineru: true }))\n        try {\n          const r = await fetch('/api/v1/check-mineru', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).mineru_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n      }\n      if ((form as any).paddleocr_online_token) {\n        setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n        try {\n          const r = await fetch('/api/v1/check-paddleocr-online', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).paddleocr_online_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n      }\n    }\n    check()\n  }, [mountedRef])\n\n  // --- Save / Update ---\n  const handleSave = useCallback(async () => {\n    setSaving(true)\n    setSaveMsg('')\n    try {\n      const body = JSON.stringify(form)\n      const res = await fetch('/api/v1/config', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body,\n      })\n      if (!res.ok) {\n        setSaveMsg('保存失败: HTTP ' + res.status)\n        setSaving(false)\n        return\n      }\n      setSaveMsg('保存成功')\n      setTimeout(() => setSaveMsg(''), 2000)\n    } catch (e: any) {\n      setSaveMsg('保存失败: ' + (e.message || '未知错误'))\n    }\n    setSaving(false)\n  }, [form, mountedRef])\n\n  const handleCheckUpdate = useCallback(async () => {\n    setUpdateChecking(true)\n    setUpdateResult('')\n    try {\n      const res = await fetch('/api/v1/check-update')\n      const data = await res.json()\n      if (!mountedRef.current) return\n      if (data.has_update) {\n        setUpdateResult(`新版本 v${data.latest} 可用 (当前 v${data.current})`)\n      } else {\n        setUpdateResult(`已是最新版本 v${data.current}`)\n      }\n    } catch (e) {\n      if (mountedRef.current) setUpdateResult('检查失败')\n    } finally {\n      if (mountedRef.current) setUpdateChecking(false)\n    }\n  }, [mountedRef])\n\n  return (\n    <div className=\"space-y-3\">\n      {/* OCRmyPDF 独立状态区 */}\n      <div>\n        <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCRmyPDF 状态</label>\n        <div className=\"flex items-center gap-2\">\n          <StatusDot status={(ocrEngines['ocrmypdf'] as any)?.installed ? 'green' : (ocrEngines['ocrmypdf'] as any)?.msg ? 'red' : null} />\n          <span className=\"text-xs text-gray-500\">\n            {(ocrEngines['ocrmypdf'] as any)?.msg || '点击检测'}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => handleDetectOcrEngine('ocrmypdf')}\n            className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n          >\n            检测\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => handleInstallOcrEngine('ocrmypdf')}\n            disabled={(ocrEngines['ocrmypdf'] as any)?.installing}\n            className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n          >\n            {(ocrEngines['ocrmypdf'] as any)?.installing ? '安装中...' : '一键安装'}\n          </button>\n        </div>\n      </div>\n\n      {/* 引擎切换区 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">引擎切换</span>\n        <div className=\"grid grid-cols-2 gap-2\">\n          {OCR_ENGINES.filter(eng => eng.key !== 'llm_ocr' && eng.key !== 'mineru' && eng.key !== 'paddleocr_online').map((eng) => {\n            const info = (ocrEngines[eng.key] as any) || { installed: eng.key === 'llm_ocr', msg: '' }\n            const isSelected = form.ocr_engine === eng.key\n            return (\n              <div\n                key={eng.key}\n                className={`rounded border p-2.5 ${isSelected ? 'border-blue-400 bg-blue-50' : 'border-gray-200 bg-white'}`}\n              >\n                <div className=\"flex items-center justify-between mb-1\">\n                  <span className=\"text-xs font-medium text-gray-700\">{eng.name}</span>\n                  <div className=\"flex items-center gap-1\">\n                    <StatusDot status={info?.installed ? 'green' : info?.msg ? 'red' : null} />\n                  </div>\n                </div>\n                <p className=\"text-xs text-gray-400 mb-2\">{eng.desc}</p>\n                {eng.key !== 'llm_ocr' && info?.msg && (\n                  <p className={`text-xs mb-1.5 ${info.installed ? 'text-green-600' : 'text-red-500'}`}>\n                    {info.msg}\n                  </p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && !info?.installed && (\n                  <p className=\"text-xs text-gray-400 mb-1.5\">需要 Python 3.11 虚拟环境，点击安装自动搭建</p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && info?.installed && (info as any)?.venv && (\n                  <p className=\"text-xs text-green-600 mb-1.5\">运行环境: {(info as any).venv}</p>\n                )}\n                <div className=\"flex items-center gap-1.5\">\n                  {eng.key !== 'llm_ocr' && (\n                    <>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleDetectOcrEngine(eng.key)}\n                        className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n                      >\n                        检测\n                      </button>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleInstallOcrEngine(eng.key)}\n                        disabled={info?.installing}\n                        className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n                      >\n                        {info?.installing ? '安装中...' : '安装'}\n                      </button>\n                    </>\n                  )}\n                  {eng.key === form.ocr_engine ? null : (\n                    <button\n                      type=\"button\"\n                      onClick={() => updateForm({ ocr_engine: eng.key })}\n                      className=\"px-2 py-1 text-xs rounded text-blue-600 hover:bg-blue-50 ml-auto\"\n                    >\n                      选用\n                    </button>\n                  )}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n\n      {/* Tesseract 语言包状态 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <div className=\"border-t border-gray-200 pt-3\">\n          <span className=\"text-xs font-medium text-gray-600 mb-2 block\">Tesseract 语言包</span>\n          <div className=\"flex items-center gap-2\">\n            <StatusDot status={\n              form.ocr_engine === 'tesseract' && (ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'green'\n                : form.ocr_engine === 'tesseract'\n                  ? 'red'\n                  : null\n            } />\n            <span className=\"text-xs text-gray-500\">\n              {(ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'chi_sim 已安装'\n                : (ocrEngines['tesseract'] as any)?.languages\n                  ? 'chi_sim 未安装'\n                  : '请先检测 Tesseract'}\n            </span>\n            {!((ocrEngines['tesseract'] as any)?.has_chi_sim) && (\n              <button\n                type=\"button\"\n                onClick={async () => {\n                  try {\n                    await fetch('/api/v1/install-tesseract-lang?lang=chi_sim')\n                    handleDetectOcrEngine('tesseract')\n                  } catch (e) {\n                  }\n                }}\n                className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600\"\n              >\n                安装语言包\n              </button>\n            )}\n          </div>\n        </div>\n      )}\n\n      <div className=\"grid grid-cols-4 gap-3 pt-2\">\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">语言</label>\n          <select\n            value={form.ocr_languages || 'chi_sim+eng'}\n            onChange={(e) => updateForm({ ocr_languages: e.target.value })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value=\"chi_sim+eng\">chi_sim+eng</option>\n            <option value=\"chi_sim\">chi_sim</option>\n            <option value=\"eng\">eng</option>\n            <option value=\"chi_sim+eng+jpn\">chi_sim+eng+jpn</option>\n          </select>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">并行线程</label>\n          <select\n            value={form.ocr_jobs ?? 1}\n            onChange={(e) => updateForm({ ocr_jobs: parseInt(e.target.value) || 1 })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value={1}>1</option>\n            <option value={2}>2</option>\n            <option value={4}>4</option>\n          </select>\n          <p className=\"text-[10px] text-gray-400 mt-0.5 leading-tight\">Tesseract 支持多线程，PaddleOCR 仅单线程</p>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">超时 (秒)</label>\n          <input\n            type=\"number\"\n            value={form.ocr_timeout ?? 1800}\n            onChange={(e) => updateForm({ ocr_timeout: parseInt(e.target.value) || 3600 })}\n            min={60}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCR 采样 DPI</label>\n          <input\n            type=\"number\"\n            min={150}\n            max={400}\n            step={50}\n            value={(form as any).ocr_oversample || 200}\n            onChange={(e) => updateForm({ ocr_oversample: parseInt(e.target.value) } as any)}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n          <span className=\"text-xs text-gray-400\">越低越快，150-400，推荐 200</span>\n        </div>\n      </div>\n\n      {/* OCR 安装指引 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <details className=\"group\">\n          <summary className=\"text-xs font-medium text-gray-600 cursor-pointer list-none flex items-center gap-1 select-none hover:text-gray-800\">\n            <svg className=\"w-3 h-3 text-gray-400 transition-transform group-open:rotate-90\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n            </svg>\n            OCR 命令行安装指引\n          </summary>\n          <div className=\"mt-2 bg-blue-50 border border-blue-200 rounded p-3\">\n            <p className=\"text-xs text-blue-800 font-medium mb-2\">📋 将以下提示词复制并发送给 OpenCode：</p>\n            <pre className=\"text-xs text-blue-700 bg-blue-100 rounded p-2 overflow-x-auto whitespace-pre-wrap font-mono\">{OCR_INSTALL_GUIDE}</pre>\n            <p className=\"text-xs text-blue-600 mt-2\">安装后返回设置页点击\"检测\"按钮确认状态。</p>\n          </div>\n        </details>\n      )}\n\n      {/* LLM OCR */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'llm_ocr' ? (\n              <span className=\"text-blue-600\">LLM OCR 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">LLM OCR</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'llm_ocr' ? 'tesseract' : 'llm_ocr' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'llm_ocr'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'llm_ocr' ? '停用并回到 OCRmyPDF' : '启用 LLM OCR'}\n          </button>\n        </div>\n      </div>\n\n      {form.ocr_engine === 'llm_ocr' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用视觉大模型逐框识别文字层。需要运行 lmstudio / ollama 加载对应模型。\n            推荐模型已验证中文 PDF 可用。\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">接口地址</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_endpoint || 'http://127.0.0.1:1234/v1'}\n                onChange={(e) => updateForm({ llm_ocr_endpoint: e.target.value } as any)}\n                placeholder=\"http://127.0.0.1:1234/v1\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmTesting(true); setLlmTestMsg('');\n                try {\n                  const r = await fetch('/api/v1/check-llm-ocr', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint, model: (form as any).llm_ocr_model })\n                  });\n                  const d = await r.json();\n                  setLlmTestMsg(d.message || (d.ok ? 'OK' : 'Failed'));\n                } catch (e) { setLlmTestMsg(String(e)); }\n                setLlmTesting(false);\n              }} disabled={llmTesting}\n                className=\"px-3 py-1.5 text-xs rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 whitespace-nowrap\">\n                {llmTesting ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {llmTestMsg && <p className={`text-xs mt-1 ${llmTestMsg.includes('成功') || llmTestMsg.includes('OK') ? 'text-green-600' : 'text-red-500'}`}>{llmTestMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                placeholder=\"qwen3-vl-4b-instruct\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmFetching(true); setLlmFetchMsg('');\n                try {\n                  const r = await fetch('/api/v1/fetch-llm-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint })\n                  });\n                  const d = await r.json();\n                  if (d.ok && d.models.length > 0) {\n                    setLlmModels(d.models);\n                    setLlmFetchMsg(`${d.models.length} 个模型`);\n                  } else {\n                    setLlmFetchMsg(d.message || '无可用模型');\n                  }\n                } catch (e) { setLlmFetchMsg(String(e)); }\n                setLlmFetching(false);\n              }} disabled={llmFetching || !(form as any).llm_ocr_endpoint}\n                className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\">\n                {llmFetching ? '...' : '拉取模型'}\n              </button>\n            </div>\n            {llmModels.length > 0 && (\n              <select value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n                size={Math.min(llmModels.length + 1, 8)}>\n                <option value=\"\" disabled>-- 选择模型 --</option>\n                {llmModels.map((m: any) => (\n                  <option key={m.id} value={m.id}>{m.name}</option>\n                ))}\n              </select>\n            )}\n            {llmFetchMsg && <p className={`text-xs mt-1 ${llmFetchMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>{llmFetchMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              并发数: {(form as any).llm_ocr_concurrency || 1}\n            </label>\n            <input type=\"range\" min=\"1\" max=\"5\" step=\"1\"\n              value={(form as any).llm_ocr_concurrency || 1}\n              onChange={(e) => updateForm({ llm_ocr_concurrency: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>1 (默认)</span><span>5 (最快)</span>\n            </div>\n          </div>\n          <div className=\"mt-2\">\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              版面检测批次: {(form as any).llm_ocr_detect_batch || 20} 页/批\n            </label>\n            <input type=\"range\" min=\"5\" max=\"50\" step=\"5\"\n              value={(form as any).llm_ocr_detect_batch || 20}\n              onChange={(e) => updateForm({ llm_ocr_detect_batch: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>5 页 (低内存)</span><span>50 页 (更快)</span>\n            </div>\n            <p className=\"text-xs text-gray-400 mt-0.5\">Surya 版面检测每批处理页数。内存不足时降低。</p>\n          </div>\n          <details className=\"text-xs\">\n            <summary className=\"cursor-pointer text-blue-600 hover:text-blue-800\">\n              推荐模型 (已验证中文 PDF)\n            </summary>\n            <div className=\"mt-2 space-y-1\">\n              {LLM_OCR_RECOMMENDED.map(m => (\n                <button key={m.model}\n                  onClick={() => updateForm({ llm_ocr_model: m.model } as any)}\n                  title={m.note}\n                  className=\"block w-full text-left px-2 py-1 rounded hover:bg-blue-100 text-gray-700 text-xs\">\n                  <span className=\"font-mono\">{m.model}</span>\n                  <span className=\"text-gray-400 ml-2\">{m.note}</span>\n                </button>\n              ))}\n            </div>\n          </details>\n        </div>\n      )}\n\n      {/* MinerU */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'mineru' ? (\n              <span className=\"text-blue-600\">MinerU 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">MinerU 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'mineru' ? 'tesseract' : 'mineru' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'mineru'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'mineru' ? '停用 MinerU' : '启用 MinerU'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'mineru' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用 MinerU v4 精准解析 API 进行文档 OCR。PDF 将上传至 MinerU 服务器处理。\n            仅限中国大陆网络访问，单文件 ≤200MB / ≤200页。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Token</label>\n            <input value={(form as any).mineru_token || ''}\n              onChange={(e) => updateForm({ mineru_token: e.target.value } as any)}\n              placeholder=\"输入 MinerU API Token（Bearer 认证）\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <button\n              type=\"button\"\n              onClick={handleTestMineru}\n              disabled={onlineTesting.mineru || !(form as any).mineru_token}\n              className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed\">\n              {onlineTesting.mineru ? '测试中...' : '检测'}\n            </button>\n            {onlineEngineStatus.mineru === 'ok' && (\n              <span className=\"text-xs text-green-600\">连接正常</span>\n            )}\n            {onlineEngineStatus.mineru === 'fail' && (\n              <span className=\"text-xs text-red-500\">连接失败</span>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            需要先申请 Token：<a href=\"https://mineru.net/apiManage/docs\" target=\"_blank\" className=\"text-blue-500 hover:underline\">MinerU API 文档</a>\n          </p>\n        </div>\n      )}\n\n      {/* PaddleOCR-VL-1.5 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'paddleocr_online' ? (\n              <span className=\"text-blue-600\">PaddleOCR-VL-1.5 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">PaddleOCR-VL-1.5 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'paddleocr_online' ? 'tesseract' : 'paddleocr_online' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'paddleocr_online'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'paddleocr_online' ? '停用 PaddleOCR-VL-1.5' : '启用 PaddleOCR-VL-1.5'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'paddleocr_online' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用百度 PaddleOCR-VL-1.5 视觉大模型进行文档版面解析。\n            支持中英文文档，无需本地 GPU。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">识别模式 <span className=\"text-[11px] text-blue-500 ml-1\">推荐逐框识别，次选混合识别</span></label>\n            <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n              {[\n                { key: 'spatial', label: '空间分配（快）' },\n                { key: 'perbox', label: '逐框识别（慢）' },\n                { key: 'hybrid', label: '混合识别' },\n              ].map(({ key, label }) => (\n                <button\n                  key={key}\n                  type=\"button\"\n                  onClick={() => updateForm({ paddleocr_online_mode: key } as any)}\n                  className={`flex-1 py-1.5 text-center transition-colors ${\n                    ((form as any).paddleocr_online_mode || 'spatial') === key\n                      ? 'bg-blue-500 text-white'\n                      : 'bg-white text-gray-600 hover:bg-gray-50'\n                  }`}\n                >\n                  {label}\n                </button>\n              ))}\n            </div>\n            <p className=\"text-[11px] text-gray-400 mt-1\">\n              {((form as any).paddleocr_online_mode || 'spatial') === 'spatial' && '段落文字精准，行识别不精确'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'perbox' && '行识别精准，有乱码风险'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'hybrid' && '逐框为主、空间填补，可能产生识别重复'}\n            </p>\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">Access Token</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).paddleocr_online_token || ''}\n                onChange={(e) => updateForm({ paddleocr_online_token: e.target.value } as any)}\n                placeholder=\"输入 PaddleOCR access token\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button\n                type=\"button\"\n                onClick={handleTestPaddleocrOnline}\n                disabled={onlineTesting.paddleocr || !(form as any).paddleocr_online_token}\n                className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap\">\n                {onlineTesting.paddleocr ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {onlineEngineStatus.paddleocr === 'ok' && (\n              <p className=\"text-xs text-green-600 mt-1\">连接正常</p>\n            )}\n            {onlineEngineStatus.paddleocr === 'fail' && (\n              <p className=\"text-xs text-red-500 mt-1\">连接失败</p>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            从 <a href=\"https://aistudio.baidu.com/paddleocr/task\" target=\"_blank\" className=\"text-blue-500 hover:underline\">PaddleOCR 控制台</a> 获取 Access Token。\n            <a href=\"https://ai.baidu.com/ai-doc/AISTUDIO/Cmkz2m0ma\" target=\"_blank\" className=\"text-blue-500 hover:underline ml-2\">API 文档</a>\n          </p>\n        </div>\n      )}\n\n      <div className=\"flex items-center gap-2 pt-3\">\n        <input type=\"checkbox\" id=\"ocr_confirm_enabled\"\n          checked={(form as any).ocr_confirm_enabled ?? false}\n          onChange={(e) => updateForm({ ocr_confirm_enabled: e.target.checked } as any)}\n          className=\"rounded\" />\n        <label htmlFor=\"ocr_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n          管道执行到 OCR 步骤时弹出确认对话框\n        </label>\n      </div>\n\n      {/* ============ AI Vision / 书签 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">AI Vision 目录提取</span>\n        <div className=\"flex items-center gap-2\">\n          <input type=\"checkbox\" id=\"ai_vision_enabled\"\n            checked={(form as any).ai_vision_enabled ?? true}\n            onChange={(e) => updateForm({ ai_vision_enabled: e.target.checked } as any)} className=\"rounded\" />\n          <label htmlFor=\"ai_vision_enabled\" className=\"text-xs\">启用 AI Vision 目录提取</label>\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 端点</label>\n          <input type=\"text\" value={(form as any).ai_vision_endpoint || ''}\n            onChange={(e) => updateForm({ ai_vision_endpoint: e.target.value } as any)}\n            placeholder={\n              (form as any).ai_vision_provider === 'gemini' ? 'https://generativelanguage.googleapis.com/v1beta' :\n              (form as any).ai_vision_provider === 'azure' ? 'https://{resource}.openai.azure.com' :\n              (form as any).ai_vision_provider === 'anthropic' || (form as any).ai_vision_provider === 'minimax_anthropic' ? 'https://api.anthropic.com' :\n              (form as any).ai_vision_provider === 'minimax_openai' ? 'https://api.minimaxi.com/v1' :\n              'http://127.0.0.1:12345/v1'\n            }\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n          <div className=\"flex gap-1\">\n            <input type=\"text\" value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              placeholder=\"sabafallah/deepseek-ocr\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n            <button\n              type=\"button\"\n              onClick={async () => {\n                setFetchingModels(true)\n                setFetchModelsMsg('')\n                try {\n                  const res = await fetch('/api/v1/fetch-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({\n                      endpoint: (form as any).ai_vision_endpoint,\n                      api_key: (form as any).ai_vision_api_key,\n                      provider: (form as any).ai_vision_provider,\n                    }),\n                  })\n                  const data = await res.json()\n                  if (data.ok && data.models.length > 0) {\n                    setAiModels(data.models)\n                    setFetchModelsMsg(`${data.models.length} 个模型`)\n                  } else {\n                    setFetchModelsMsg(data.message || '无可用模型')\n                  }\n                } catch (e) {\n                  setFetchModelsMsg(String(e))\n                }\n                setFetchingModels(false)\n              }}\n              disabled={fetchingModels || !(form as any).ai_vision_endpoint}\n              className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\"\n              title=\"从提供商拉取可用模型列表\"\n            >\n              {fetchingModels ? '...' : '获取模型'}\n            </button>\n          </div>\n          {aiModels.length > 0 && (\n            <select\n              value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n              size={Math.min(aiModels.length + 1, 8)}\n            >\n              <option value=\"\" disabled>-- 选择模型 --</option>\n              {aiModels.map(m => (\n                <option key={m.id} value={m.id}>{m.name}</option>\n              ))}\n            </select>\n          )}\n          {fetchModelsMsg && (\n            <p className={`text-xs mt-1 ${fetchModelsMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>\n              {fetchModelsMsg}\n            </p>\n          )}\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Key</label>\n          <input type=\"password\" value={(form as any).ai_vision_api_key || ''}\n            onChange={(e) => updateForm({ ai_vision_api_key: e.target.value } as any)}\n            placeholder=\"sk-...  (支持 {env:VAR_NAME})\"\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 格式</label>\n          <select value={(form as any).ai_vision_provider || 'openai_compatible'}\n            onChange={(e) => {\n              const newProvider = e.target.value\n              const defaultEndpoint = AI_VISION_ENDPOINTS[newProvider] || ''\n              updateForm({\n                ai_vision_provider: newProvider,\n                ai_vision_endpoint: defaultEndpoint,\n              } as any)\n            }}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\">\n            <option value=\"openai_compatible\">OpenAI / DeepSeek / 智谱 / Qwen / Ollama / lmstudio</option>\n            <option value=\"openai_responses\">OpenAI Responses (新版 /v1/responses)</option>\n            <option value=\"azure\">Azure OpenAI</option>\n            <option value=\"anthropic\">Anthropic Claude</option>\n            <option value=\"gemini\">Google Gemini</option>\n            <option value=\"minimax_openai\">MiniMax (OpenAI 兼容 · 国内/国际通用)</option>\n            <option value=\"minimax_anthropic\">MiniMax (Anthropic 兼容 · Token Plan)</option>\n            <option value=\"custom\">自定义 (Custom)</option>\n          </select>\n        </div>\n        {(form as any).ai_vision_provider === 'custom' && (\n          <div className=\"flex items-center gap-2 mt-2\">\n            <input type=\"checkbox\" id=\"ai_vision_messages_api\"\n              checked={(form as any).ai_vision_messages_api ?? false}\n              onChange={(e) => updateForm({ ai_vision_messages_api: e.target.checked } as any)} className=\"rounded\" />\n            <label htmlFor=\"ai_vision_messages_api\" className=\"text-xs font-medium text-gray-600\">\n              使用 Anthropic Messages API 格式 (默认 OpenAI Chat Completions)\n            </label>\n          </div>\n        )}\n        <div className=\"grid grid-cols-2 gap-3 mt-2\">\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">DPI</label>\n            <input type=\"number\" value={(form as any).ai_vision_dpi ?? 150}\n              onChange={(e) => updateForm({ ai_vision_dpi: parseInt(e.target.value) || 150 } as any)}\n              min={72} max={300} className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\" />\n          </div>\n        </div>\n        <button\n          type=\"button\"\n          onClick={async () => {\n            setAiVisionTest('testing');\n            try {\n              const res = await fetch('/api/v1/check-ai-vision', {\n                method: 'POST',\n                headers: { 'Content-Type': 'application/json' },\n                body: JSON.stringify({\n                  endpoint: (form as any).ai_vision_endpoint,\n                  model: (form as any).ai_vision_model,\n                  api_key: (form as any).ai_vision_api_key,\n                  provider: (form as any).ai_vision_provider,\n                  messages_api: (form as any).ai_vision_messages_api,\n                }),\n              });\n              const data = await res.json();\n              setAiVisionTest(data.ok ? 'ok' : 'fail');\n              setAiVisionMsg(data.message || data.error || '');\n            } catch (e) {\n              setAiVisionTest('fail');\n              setAiVisionMsg(String(e));\n            }\n          }}\n          disabled={aiVisionTest === 'testing'}\n          className=\"px-3 py-1.5 mt-2 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50\"\n        >\n          {aiVisionTest === 'testing' ? '测试中...' : '检测'}\n        </button>\n        {aiVisionMsg && (\n          <p className={`text-xs mt-1 ${aiVisionTest === 'ok' ? 'text-green-600' : 'text-red-600'}`}>\n            {aiVisionMsg}\n          </p>\n        )}\n        <p className=\"text-xs text-gray-400 mt-1\">\n          阶段1 从 OCR 文字层提取目录（免费），阶段2 用 AI Vision 从目录页图片提取。\n          支持 OpenAI 兼容 / Gemini / MiniMax 格式。\n        </p>\n        <div className=\"flex items-center gap-2 mt-2\">\n          <input type=\"checkbox\" id=\"bookmark_confirm_enabled\"\n            checked={(form as any).bookmark_confirm_enabled ?? false}\n            onChange={(e) => updateForm({ bookmark_confirm_enabled: e.target.checked } as any)}\n            className=\"rounded\" />\n          <label htmlFor=\"bookmark_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n            管道执行到书签步骤时弹出确认对话框\n          </label>\n        </div>\n      </div>\n\n      {/* ============ 主题 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">主题</label>\n        <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n          {[\n            { key: 'auto', label: '自动' },\n            { key: 'light', label: '白昼' },\n            { key: 'dark', label: '黑夜' },\n          ].map(({ key, label }) => (\n            <button\n              key={key}\n              type=\"button\"\n              onClick={() => updateForm({ theme: key })}\n              className={`flex-1 py-1.5 text-center transition-colors ${\n                ((form as any).theme || 'auto') === key\n                  ? 'bg-blue-500 text-white'\n                  : 'bg-white text-gray-600 hover:bg-gray-50'\n              }`}\n            >\n              {label}\n            </button>\n          ))}\n        </div>\n      </div>\n\n      {/* ============ 保存按钮 ============ */}\n      <div className=\"flex items-center gap-3 pt-2\">\n        <button\n          type=\"button\"\n          onClick={handleSave}\n          disabled={saving}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {saving ? '保存中...' : '保存设置'}\n        </button>\n        <button\n          type=\"button\"\n          onClick={handleCheckUpdate}\n          disabled={updateChecking}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {updateChecking ? '检测中...' : '检查更新'}\n        </button>\n        {saveMsg && (\n          <span className={`text-xs ${saveMsg.includes('成功') ? 'text-green-600' : 'text-red-500'}`}>\n            {saveMsg}\n          </span>\n        )}\n        {updateResult && (\n          <span className={`text-xs px-2 py-1 rounded ${updateResult.includes('失败') ? 'text-red-600 bg-red-50' : updateResult.includes('新版本') ? 'text-blue-600 bg-blue-50 font-semibold' : 'text-green-600 bg-green-50'}`}>\n            {updateResult}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(OCRNetworkSection)\n"}, "f52fa61576070eef83250d867ac8ce14ab5406c2": {"t": 1785772783.7645154, "n": 48543, "h": "3e5e5070f2570bc2", "c": "import React, { useState, useEffect, useRef, useCallback } from 'react'\nimport { SectionProps } from './types'\nimport { LLM_OCR_RECOMMENDED } from '../../constants'\n\nfunction StatusDot({ status }: { status: 'green' | 'red' | 'yellow' | null }) {\n  const colors: Record<string, string> = {\n    green: 'bg-green-500',\n    red: 'bg-red-500',\n    yellow: 'bg-yellow-500',\n  }\n  return (\n    <span className={`inline-block w-2 h-2 rounded-full ${status ? colors[status] : 'bg-gray-300'}`} />\n  )\n}\n\nconst OCR_ENGINES = [\n  { key: 'tesseract', name: 'Tesseract OCR', desc: '内置引擎，需 chi_sim 语言包' },\n  { key: 'paddleocr', name: 'PaddleOCR', desc: '百度引擎，需 Python 3.11 虚拟环境' },\n  { key: 'llm_ocr', name: 'LLM OCR', desc: '大模型视觉识别，无需本地引擎' },\n  { key: 'mineru', name: 'MinerU', desc: '线上 API 精准解析，需 Token' },\n  { key: 'paddleocr_online', name: 'PaddleOCR-VL-1.5', desc: '线上 API，需 Token' },\n]\n\nconst OCR_INSTALL_GUIDE = `## 安装 OCR 引擎\n\n**注意**：Python 3.14 与 \\`paddlepaddle\\` 不兼容。建议使用 Python 3.11 创建虚拟环境。\n\n---\n\n### 1. 创建/重建虚拟环境（Python 3.11）\n\n\\`\\`\\`powershell\n# 如果原 venv 不支持 Python 3.11，先删除\nRemove-Item -Recurse -Force backend\\\\venv\n\n# 使用 Python 3.11 创建新 venv\nC:\\\\Python311\\\\python.exe -m venv backend\\\\venv\n\\`\\`\\`\n\n### 2. 激活虚拟环境（PowerShell）\n\n\\`\\`\\`powershell\n# 方法一：PowerShell 执行策略问题\npowershell -ExecutionPolicy Bypass -Command \"backend\\\\venv\\\\Scripts\\\\Activate.ps1\"\n\n# 方法二：直接用 python 运行（无需激活）\nC:\\\\Python311\\\\python.exe -m pip install ...\n\\`\\`\\`\n\n### 3. 安装 OCRmyPDF 核心\n\n\\`\\`\\`powershell\npython -m pip install ocrmypdf\n\\`\\`\\`\n\n### 4. 安装引擎插件\n\n\\`\\`\\`powershell\n# 安装所有 OCR 引擎（推荐，一步到位）\npython -m pip install ocrmypdf-paddleocr paddleocr\n\n# 或分开安装\npython -m pip install paddleocr\npython -m pip install ocrmypdf-paddleocr  # 需要先装好 paddleocr\n\\`\\`\\`\n\n### 5. 安装 Tesseract OCR 系统依赖\n\n\\`\\`\\`powershell\nwinget install --id UB-Mannheim.TesseractOCR --accept-package-agreements --accept-source-agreements\n\\`\\`\\`\n\n### 6. 将 Tesseract 添加到 PATH\n\n\\`\\`\\`powershell\n[Environment]::SetEnvironmentVariable(\"Path\", [Environment]::GetEnvironmentVariable(\"Path\", \"User\") + \";C:\\\\Program Files\\\\Tesseract-OCR\", \"User\")\n\\`\\`\\`\n\n> ⚠️ 添加后需**重启终端或IDE**使 PATH 生效，或使用完整路径验证：\n> \\`\\`\\`powershell\n> & \"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n> \\`\\`\\`\n\n### 7. 验证安装\n\n\\`\\`\\`powershell\npython -c \"import ocrmypdf; print('ocrmypdf:', ocrmypdf.__version__)\"\npython -c \"from paddle import paddle; print('paddle:', paddle.__version__)\"\n\"C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\" --version\n\\`\\`\\`\n\n### 常见问题\n\n| 问题 | 解决 |\n|------|------|\n| \\`ModuleNotFoundError: No module named 'paddlepaddle'\\` | \\`import paddle\\` 而非 \\`import paddlepaddle\\` |\n| \\`ocrmypdf-paddleocr\\` 依赖冲突 | 先装 \\`paddleocr\\`，再装 \\`ocrmypdf-paddleocr\\` |\n| Tesseract 找不到 | 重启终端，或使用完整路径 \\`C:\\\\Program Files\\\\Tesseract-OCR\\\\tesseract.exe\\` |`\n\nconst AI_VISION_ENDPOINTS: Record<string, string> = {\n  openai_compatible: 'https://api.openai.com/v1',\n  openai_responses: 'https://api.openai.com/v1',\n  azure: 'https://RESOURCE_NAME.openai.azure.com',\n  anthropic: 'https://api.anthropic.com',\n  gemini: 'https://generativelanguage.googleapis.com/v1beta',\n  minimax_openai: 'https://api.minimaxi.com/v1',\n  minimax_anthropic: 'https://api.minimaxi.com',\n  custom: '',\n}\n\nfunction OCRNetworkSection({ form, updateForm, mountedRef }: SectionProps) {\n  const [ocrChecking, setOcrChecking] = useState(false)\n  const [ocrStatus, setOcrStatus] = useState<'green' | 'red' | 'yellow' | null>(null)\n  const [ocrMsg, setOcrMsg] = useState('')\n  const [ocrEngines, setOcrEngines] = useState<Record<string, { installed: boolean; installing: boolean; msg: string }>>({})\n  const [llmModels, setLlmModels] = useState<any[]>([])\n  const [llmFetchMsg, setLlmFetchMsg] = useState('')\n  const [onlineEngineStatus, setOnlineEngineStatus] = useState<Record<string, 'ok' | 'fail' | ''>>({ mineru: '', paddleocr: '' })\n  const [onlineTesting, setOnlineTesting] = useState<Record<string, boolean>>({ mineru: false, paddleocr: false })\n  const [llmFetching, setLlmFetching] = useState(false)\n  const [llmTestMsg, setLlmTestMsg] = useState('')\n  const [llmTesting, setLlmTesting] = useState(false)\n  const [aiModels, setAiModels] = useState<{ id: string; name: string }[]>([])\n  const [fetchingModels, setFetchingModels] = useState(false)\n  const [fetchModelsMsg, setFetchModelsMsg] = useState('')\n  const [aiVisionTest, setAiVisionTest] = useState<'testing' | 'ok' | 'fail' | null>(null)\n  const [aiVisionMsg, setAiVisionMsg] = useState('')\n  const [saving, setSaving] = useState(false)\n  const [saveMsg, setSaveMsg] = useState('')\n  const [updateChecking, setUpdateChecking] = useState(false)\n  const [updateResult, setUpdateResult] = useState('')\n\n  // --- OCR logic ---\n  const checkOcr = useCallback(async (engine?: string) => {\n    setOcrChecking(true)\n    try {\n      const eng = engine || form.ocr_engine || 'tesseract'\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrStatus(data.ok ? 'green' : 'red')\n      setOcrMsg(data.message || (data.ok ? data.version || '已安装' : '未检测到'))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrStatus('red')\n        setOcrMsg('检测失败')\n      }\n    } finally {\n      if (mountedRef.current) setOcrChecking(false)\n    }\n  }, [form.ocr_engine, mountedRef])\n\n  const handleDetectOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: false, msg: '检测中...' } }))\n    try {\n      const res = await fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(engine)}`)\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n          has_chi_sim: data.has_chi_sim,\n          languages: data.languages,\n          venv: data.venv,\n        } as any,\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '检测失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleInstallOcrEngine = useCallback(async (engine: string) => {\n    setOcrEngines(prev => ({ ...prev, [engine]: { ...prev[engine], installing: true, msg: '安装中...' } }))\n    try {\n      const res = await fetch('/api/v1/install-ocr', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ engine }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOcrEngines(prev => ({\n        ...prev,\n        [engine]: {\n          installed: data.ok || false,\n          installing: false,\n          msg: data.message || (data.ok ? '安装成功' : '安装失败'),\n        },\n      }))\n    } catch (e) {\n      if (mountedRef.current) {\n        setOcrEngines(prev => ({\n          ...prev,\n          [engine]: { installed: false, installing: false, msg: '安装请求失败' },\n        }))\n      }\n    }\n  }, [mountedRef])\n\n  const handleTestMineru = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, mineru: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, mineru: '' }))\n    try {\n      const res = await fetch('/api/v1/check-mineru', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).mineru_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, mineru: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n  }, [form, mountedRef])\n\n  const handleTestPaddleocrOnline = useCallback(async () => {\n    setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n    setOnlineEngineStatus(prev => ({ ...prev, paddleocr: '' }))\n    try {\n      const res = await fetch('/api/v1/check-paddleocr-online', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ token: (form as any).paddleocr_online_token || '' }),\n      })\n      const data = await res.json()\n      if (!mountedRef.current) return\n      setOnlineEngineStatus(prev => ({ ...prev, paddleocr: data.ok ? 'ok' : 'fail' }))\n    } catch {\n      if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' }))\n    }\n    if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n  }, [form, mountedRef])\n\n  // Auto-detect OCR engine statuses\n  const autoOcrRef = useRef(false)\n  useEffect(() => {\n    if (autoOcrRef.current) return\n    autoOcrRef.current = true\n    const engines = ['tesseract', 'paddleocr']\n    engines.forEach((eng) => {\n      fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(eng)}`)\n        .then((r) => r.json())\n        .then((data) => {\n          if (!mountedRef.current) return\n          setOcrEngines((prev) => ({\n            ...prev,\n            [eng]: {\n              installed: data.ok || false,\n              installing: false,\n              msg: data.version || data.message || (data.ok ? '已安装' : '未检测到'),\n              has_chi_sim: data.has_chi_sim,\n              languages: data.languages,\n              venv: data.venv,\n            } as any,\n          }))\n        })\n        .catch(() => {})\n    })\n    const defaultEngine = form.ocr_engine || 'tesseract'\n    fetch(`/api/v1/check-ocr?engine=${encodeURIComponent(defaultEngine)}`)\n      .then((r) => r.json())\n      .then((data) => {\n        if (!mountedRef.current) return\n        setOcrStatus(data.ok ? 'green' : 'red')\n        setOcrMsg(data.version || data.message || (data.ok ? '已安装' : '未检测到'))\n      })\n      .catch(() => {})\n  }, [form.ocr_engine, mountedRef])\n\n  // Update OCR header status when engine selection changes\n  useEffect(() => {\n    const eng = form.ocr_engine || 'tesseract'\n    const info = ocrEngines[eng]\n    if (info) {\n      setOcrStatus(info.installed ? 'green' : 'red')\n      setOcrMsg(info.msg || (info.installed ? '已安装' : '未检测到'))\n    }\n  }, [form.ocr_engine, ocrEngines])\n\n  // Auto-detect online API connectivity\n  const autoOnlineRef = useRef(false)\n  useEffect(() => {\n    if (autoOnlineRef.current) return\n    autoOnlineRef.current = true\n    const check = async () => {\n      if ((form as any).mineru_token) {\n        setOnlineTesting(prev => ({ ...prev, mineru: true }))\n        try {\n          const r = await fetch('/api/v1/check-mineru', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).mineru_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, mineru: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, mineru: false }))\n      }\n      if ((form as any).paddleocr_online_token) {\n        setOnlineTesting(prev => ({ ...prev, paddleocr: true }))\n        try {\n          const r = await fetch('/api/v1/check-paddleocr-online', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: (form as any).paddleocr_online_token }) })\n          const d = await r.json()\n          if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: d.ok ? 'ok' : 'fail' }))\n        } catch { if (mountedRef.current) setOnlineEngineStatus(prev => ({ ...prev, paddleocr: 'fail' })) }\n        if (mountedRef.current) setOnlineTesting(prev => ({ ...prev, paddleocr: false }))\n      }\n    }\n    check()\n  }, [mountedRef])\n\n  // --- Save / Update ---\n  const handleSave = useCallback(async () => {\n    setSaving(true)\n    setSaveMsg('')\n    try {\n      const body = JSON.stringify(form)\n      const res = await fetch('/api/v1/config', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body,\n      })\n      if (!res.ok) {\n        setSaveMsg('保存失败: HTTP ' + res.status)\n        setSaving(false)\n        return\n      }\n      setSaveMsg('保存成功')\n      setTimeout(() => setSaveMsg(''), 2000)\n    } catch (e: any) {\n      setSaveMsg('保存失败: ' + (e.message || '未知错误'))\n    }\n    setSaving(false)\n  }, [form, mountedRef])\n\n  const handleCheckUpdate = useCallback(async () => {\n    setUpdateChecking(true)\n    setUpdateResult('')\n    try {\n      const res = await fetch('/api/v1/check-update')\n      const data = await res.json()\n      if (!mountedRef.current) return\n      if (data.has_update) {\n        setUpdateResult(`新版本 v${data.latest} 可用 (当前 v${data.current})`)\n      } else {\n        setUpdateResult(`已是最新版本 v${data.current}`)\n      }\n    } catch (e) {\n      if (mountedRef.current) setUpdateResult('检查失败')\n    } finally {\n      if (mountedRef.current) setUpdateChecking(false)\n    }\n  }, [mountedRef])\n\n  return (\n    <div className=\"space-y-3\">\n      {/* OCRmyPDF 独立状态区 */}\n      <div>\n        <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCRmyPDF 状态</label>\n        <div className=\"flex items-center gap-2\">\n          <StatusDot status={(ocrEngines['ocrmypdf'] as any)?.installed ? 'green' : (ocrEngines['ocrmypdf'] as any)?.msg ? 'red' : null} />\n          <span className=\"text-xs text-gray-500\">\n            {(ocrEngines['ocrmypdf'] as any)?.msg || '点击检测'}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => handleDetectOcrEngine('ocrmypdf')}\n            className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n          >\n            检测\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => handleInstallOcrEngine('ocrmypdf')}\n            disabled={(ocrEngines['ocrmypdf'] as any)?.installing}\n            className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n          >\n            {(ocrEngines['ocrmypdf'] as any)?.installing ? '安装中...' : '一键安装'}\n          </button>\n        </div>\n      </div>\n\n      {/* 引擎切换区 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">引擎切换</span>\n        <div className=\"grid grid-cols-2 gap-2\">\n          {OCR_ENGINES.filter(eng => eng.key !== 'llm_ocr' && eng.key !== 'mineru' && eng.key !== 'paddleocr_online').map((eng) => {\n            const info = (ocrEngines[eng.key] as any) || { installed: eng.key === 'llm_ocr', msg: '' }\n            const isSelected = form.ocr_engine === eng.key\n            return (\n              <div\n                key={eng.key}\n                className={`rounded border p-2.5 ${isSelected ? 'border-blue-400 bg-blue-50' : 'border-gray-200 bg-white'}`}\n              >\n                <div className=\"flex items-center justify-between mb-1\">\n                  <span className=\"text-xs font-medium text-gray-700\">{eng.name}</span>\n                  <div className=\"flex items-center gap-1\">\n                    <StatusDot status={info?.installed ? 'green' : info?.msg ? 'red' : null} />\n                  </div>\n                </div>\n                <p className=\"text-xs text-gray-400 mb-2\">{eng.desc}</p>\n                {eng.key !== 'llm_ocr' && info?.msg && (\n                  <p className={`text-xs mb-1.5 ${info.installed ? 'text-green-600' : 'text-red-500'}`}>\n                    {info.msg}\n                  </p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && !info?.installed && (\n                  <p className=\"text-xs text-gray-400 mb-1.5\">需要 Python 3.11 虚拟环境，点击安装自动搭建</p>\n                )}\n                {eng.key !== 'llm_ocr' && eng.key === 'paddleocr' && info?.installed && (info as any)?.venv && (\n                  <p className=\"text-xs text-green-600 mb-1.5\">运行环境: {(info as any).venv}</p>\n                )}\n                <div className=\"flex items-center gap-1.5\">\n                  {eng.key !== 'llm_ocr' && (\n                    <>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleDetectOcrEngine(eng.key)}\n                        className=\"px-2 py-1 text-xs rounded border border-gray-300 bg-white hover:bg-gray-100 text-gray-500\"\n                      >\n                        检测\n                      </button>\n                      <button\n                        type=\"button\"\n                        onClick={() => handleInstallOcrEngine(eng.key)}\n                        disabled={info?.installing}\n                        className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600 disabled:opacity-50\"\n                      >\n                        {info?.installing ? '安装中...' : '安装'}\n                      </button>\n                    </>\n                  )}\n                  {eng.key === form.ocr_engine ? null : (\n                    <button\n                      type=\"button\"\n                      onClick={() => updateForm({ ocr_engine: eng.key })}\n                      className=\"px-2 py-1 text-xs rounded text-blue-600 hover:bg-blue-50 ml-auto\"\n                    >\n                      选用\n                    </button>\n                  )}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n\n      {/* Tesseract 语言包状态 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <div className=\"border-t border-gray-200 pt-3\">\n          <span className=\"text-xs font-medium text-gray-600 mb-2 block\">Tesseract 语言包</span>\n          <div className=\"flex items-center gap-2\">\n            <StatusDot status={\n              form.ocr_engine === 'tesseract' && (ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'green'\n                : form.ocr_engine === 'tesseract'\n                  ? 'red'\n                  : null\n            } />\n            <span className=\"text-xs text-gray-500\">\n              {(ocrEngines['tesseract'] as any)?.has_chi_sim\n                ? 'chi_sim 已安装'\n                : (ocrEngines['tesseract'] as any)?.languages\n                  ? 'chi_sim 未安装'\n                  : '请先检测 Tesseract'}\n            </span>\n            {!((ocrEngines['tesseract'] as any)?.has_chi_sim) && (\n              <button\n                type=\"button\"\n                onClick={async () => {\n                  try {\n                    await fetch('/api/v1/install-tesseract-lang?lang=chi_sim')\n                    handleDetectOcrEngine('tesseract')\n                  } catch (e) {\n                  }\n                }}\n                className=\"px-2 py-1 text-xs rounded bg-orange-500 text-white hover:bg-orange-600\"\n              >\n                安装语言包\n              </button>\n            )}\n          </div>\n        </div>\n      )}\n\n      <div className=\"grid grid-cols-4 gap-3 pt-2\">\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">语言</label>\n          <select\n            value={form.ocr_languages || 'chi_sim+eng'}\n            onChange={(e) => updateForm({ ocr_languages: e.target.value })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value=\"chi_sim+eng\">chi_sim+eng</option>\n            <option value=\"chi_sim\">chi_sim</option>\n            <option value=\"eng\">eng</option>\n            <option value=\"chi_sim+eng+jpn\">chi_sim+eng+jpn</option>\n          </select>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">并行线程</label>\n          <select\n            value={form.ocr_jobs ?? 1}\n            onChange={(e) => updateForm({ ocr_jobs: parseInt(e.target.value) || 1 })}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          >\n            <option value={1}>1</option>\n            <option value={2}>2</option>\n            <option value={4}>4</option>\n          </select>\n          <p className=\"text-[10px] text-gray-400 mt-0.5 leading-tight\">Tesseract 支持多线程，PaddleOCR 仅单线程</p>\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">超时 (秒)</label>\n          <input\n            type=\"number\"\n            value={form.ocr_timeout ?? 1800}\n            onChange={(e) => updateForm({ ocr_timeout: parseInt(e.target.value) || 3600 })}\n            min={60}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n        </div>\n        <div>\n          <label className=\"block text-xs font-medium text-gray-600 mb-1\">OCR 采样 DPI</label>\n          <input\n            type=\"number\"\n            min={150}\n            max={400}\n            step={50}\n            value={(form as any).ocr_oversample || 200}\n            onChange={(e) => updateForm({ ocr_oversample: parseInt(e.target.value) } as any)}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500\"\n          />\n          <span className=\"text-xs text-gray-400\">越低越快，150-400，推荐 200</span>\n        </div>\n      </div>\n\n      {/* OCR 安装指引 */}\n      {form.ocr_engine !== 'llm_ocr' && (\n        <details className=\"group\">\n          <summary className=\"text-xs font-medium text-gray-600 cursor-pointer list-none flex items-center gap-1 select-none hover:text-gray-800\">\n            <svg className=\"w-3 h-3 text-gray-400 transition-transform group-open:rotate-90\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n            </svg>\n            OCR 命令行安装指引\n          </summary>\n          <div className=\"mt-2 bg-blue-50 border border-blue-200 rounded p-3\">\n            <p className=\"text-xs text-blue-800 font-medium mb-2\">📋 将以下提示词复制并发送给 OpenCode：</p>\n            <pre className=\"text-xs text-blue-700 bg-blue-100 rounded p-2 overflow-x-auto whitespace-pre-wrap font-mono\">{OCR_INSTALL_GUIDE}</pre>\n            <p className=\"text-xs text-blue-600 mt-2\">安装后返回设置页点击\"检测\"按钮确认状态。</p>\n          </div>\n        </details>\n      )}\n\n      {/* LLM OCR */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'llm_ocr' ? (\n              <span className=\"text-blue-600\">LLM OCR 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">LLM OCR</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'llm_ocr' ? 'tesseract' : 'llm_ocr' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'llm_ocr'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'llm_ocr' ? '停用并回到 OCRmyPDF' : '启用 LLM OCR'}\n          </button>\n        </div>\n      </div>\n\n      {form.ocr_engine === 'llm_ocr' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用视觉大模型逐框识别文字层。需要运行 lmstudio / ollama 加载对应模型。\n            推荐模型已验证中文 PDF 可用。\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">接口地址</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_endpoint || 'http://127.0.0.1:1234/v1'}\n                onChange={(e) => updateForm({ llm_ocr_endpoint: e.target.value } as any)}\n                placeholder=\"http://127.0.0.1:1234/v1\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmTesting(true); setLlmTestMsg('');\n                try {\n                  const r = await fetch('/api/v1/check-llm-ocr', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint, model: (form as any).llm_ocr_model })\n                  });\n                  const d = await r.json();\n                  setLlmTestMsg(d.message || (d.ok ? 'OK' : 'Failed'));\n                } catch (e) { setLlmTestMsg(String(e)); }\n                setLlmTesting(false);\n              }} disabled={llmTesting}\n                className=\"px-3 py-1.5 text-xs rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 whitespace-nowrap\">\n                {llmTesting ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {llmTestMsg && <p className={`text-xs mt-1 ${llmTestMsg.includes('成功') || llmTestMsg.includes('OK') ? 'text-green-600' : 'text-red-500'}`}>{llmTestMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                placeholder=\"qwen3-vl-4b-instruct\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button onClick={async () => {\n                setLlmFetching(true); setLlmFetchMsg('');\n                try {\n                  const r = await fetch('/api/v1/fetch-llm-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({ endpoint: (form as any).llm_ocr_endpoint })\n                  });\n                  const d = await r.json();\n                  if (d.ok && d.models.length > 0) {\n                    setLlmModels(d.models);\n                    setLlmFetchMsg(`${d.models.length} 个模型`);\n                  } else {\n                    setLlmFetchMsg(d.message || '无可用模型');\n                  }\n                } catch (e) { setLlmFetchMsg(String(e)); }\n                setLlmFetching(false);\n              }} disabled={llmFetching || !(form as any).llm_ocr_endpoint}\n                className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\">\n                {llmFetching ? '...' : '拉取模型'}\n              </button>\n            </div>\n            {llmModels.length > 0 && (\n              <select value={(form as any).llm_ocr_model || ''}\n                onChange={(e) => updateForm({ llm_ocr_model: e.target.value } as any)}\n                className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n                size={Math.min(llmModels.length + 1, 8)}>\n                <option value=\"\" disabled>-- 选择模型 --</option>\n                {llmModels.map((m: any) => (\n                  <option key={m.id} value={m.id}>{m.name}</option>\n                ))}\n              </select>\n            )}\n            {llmFetchMsg && <p className={`text-xs mt-1 ${llmFetchMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>{llmFetchMsg}</p>}\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              并发数: {(form as any).llm_ocr_concurrency || 1}\n            </label>\n            <input type=\"range\" min=\"1\" max=\"5\" step=\"1\"\n              value={(form as any).llm_ocr_concurrency || 1}\n              onChange={(e) => updateForm({ llm_ocr_concurrency: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>1 (默认)</span><span>5 (最快)</span>\n            </div>\n          </div>\n          <div className=\"mt-2\">\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">\n              版面检测批次: {(form as any).llm_ocr_detect_batch || 20} 页/批\n            </label>\n            <input type=\"range\" min=\"5\" max=\"50\" step=\"5\"\n              value={(form as any).llm_ocr_detect_batch || 20}\n              onChange={(e) => updateForm({ llm_ocr_detect_batch: parseInt(e.target.value) } as any)}\n              className=\"w-full\" />\n            <div className=\"flex justify-between text-xs text-gray-400\">\n              <span>5 页 (低内存)</span><span>50 页 (更快)</span>\n            </div>\n            <p className=\"text-xs text-gray-400 mt-0.5\">Surya 版面检测每批处理页数。内存不足时降低。</p>\n          </div>\n          <details className=\"text-xs\">\n            <summary className=\"cursor-pointer text-blue-600 hover:text-blue-800\">\n              推荐模型 (已验证中文 PDF)\n            </summary>\n            <div className=\"mt-2 space-y-1\">\n              {LLM_OCR_RECOMMENDED.map(m => (\n                <button key={m.model}\n                  onClick={() => updateForm({ llm_ocr_model: m.model } as any)}\n                  title={m.note}\n                  className=\"block w-full text-left px-2 py-1 rounded hover:bg-blue-100 text-gray-700 text-xs\">\n                  <span className=\"font-mono\">{m.model}</span>\n                  <span className=\"text-gray-400 ml-2\">{m.note}</span>\n                </button>\n              ))}\n            </div>\n          </details>\n        </div>\n      )}\n\n      {/* MinerU */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'mineru' ? (\n              <span className=\"text-blue-600\">MinerU 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">MinerU 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'mineru' ? 'tesseract' : 'mineru' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'mineru'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'mineru' ? '停用 MinerU' : '启用 MinerU'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'mineru' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用 MinerU v4 精准解析 API 进行文档 OCR。PDF 将上传至 MinerU 服务器处理。\n            仅限中国大陆网络访问，单文件 ≤200MB / ≤200页。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Token</label>\n            <input value={(form as any).mineru_token || ''}\n              onChange={(e) => updateForm({ mineru_token: e.target.value } as any)}\n              placeholder=\"输入 MinerU API Token（Bearer 认证）\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <button\n              type=\"button\"\n              onClick={handleTestMineru}\n              disabled={onlineTesting.mineru || !(form as any).mineru_token}\n              className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed\">\n              {onlineTesting.mineru ? '测试中...' : '检测'}\n            </button>\n            {onlineEngineStatus.mineru === 'ok' && (\n              <span className=\"text-xs text-green-600\">连接正常</span>\n            )}\n            {onlineEngineStatus.mineru === 'fail' && (\n              <span className=\"text-xs text-red-500\">连接失败</span>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            需要先申请 Token：<a href=\"https://mineru.net/apiManage/docs\" target=\"_blank\" className=\"text-blue-500 hover:underline\">MinerU API 文档</a>\n          </p>\n        </div>\n      )}\n\n      {/* PaddleOCR-VL-1.5 */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-xs font-medium text-gray-700\">\n            {form.ocr_engine === 'paddleocr_online' ? (\n              <span className=\"text-blue-600\">PaddleOCR-VL-1.5 线上 API 已启用</span>\n            ) : (\n              <span className=\"text-gray-500\">PaddleOCR-VL-1.5 线上 API</span>\n            )}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => updateForm({ ocr_engine: form.ocr_engine === 'paddleocr_online' ? 'tesseract' : 'paddleocr_online' })}\n            className={`px-3 py-1 text-xs rounded ${\n              form.ocr_engine === 'paddleocr_online'\n                ? 'bg-gray-200 text-gray-600 hover:bg-gray-300'\n                : 'bg-blue-500 text-white hover:bg-blue-600'\n            }`}\n          >\n            {form.ocr_engine === 'paddleocr_online' ? '停用 PaddleOCR-VL-1.5' : '启用 PaddleOCR-VL-1.5'}\n          </button>\n        </div>\n      </div>\n      {form.ocr_engine === 'paddleocr_online' && (\n        <div className=\"space-y-3 pt-2\">\n          <p className=\"text-xs text-gray-500\">\n            使用百度 PaddleOCR-VL-1.5 视觉大模型进行文档版面解析。\n            支持中英文文档，无需本地 GPU。\n            <span className=\"text-orange-500 ml-1\">实验功能，识别可能会有重复</span>\n          </p>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">识别模式 <span className=\"text-[11px] text-blue-500 ml-1\">推荐逐框识别，次选混合识别</span></label>\n            <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n              {[\n                { key: 'spatial', label: '空间分配（快）' },\n                { key: 'perbox', label: '逐框识别（慢）' },\n                { key: 'hybrid', label: '混合识别' },\n              ].map(({ key, label }) => (\n                <button\n                  key={key}\n                  type=\"button\"\n                  onClick={() => updateForm({ paddleocr_online_mode: key } as any)}\n                  className={`flex-1 py-1.5 text-center transition-colors ${\n                    ((form as any).paddleocr_online_mode || 'spatial') === key\n                      ? 'bg-blue-500 text-white'\n                      : 'bg-white text-gray-600 hover:bg-gray-50'\n                  }`}\n                >\n                  {label}\n                </button>\n              ))}\n            </div>\n            <p className=\"text-[11px] text-gray-400 mt-1\">\n              {((form as any).paddleocr_online_mode || 'spatial') === 'spatial' && '段落文字精准，行识别不精确'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'perbox' && '行识别精准，有乱码风险'}\n              {((form as any).paddleocr_online_mode || 'spatial') === 'hybrid' && '逐框为主、空间填补，可能产生识别重复'}\n            </p>\n          </div>\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">Access Token</label>\n            <div className=\"flex gap-2\">\n              <input value={(form as any).paddleocr_online_token || ''}\n                onChange={(e) => updateForm({ paddleocr_online_token: e.target.value } as any)}\n                placeholder=\"输入 PaddleOCR access token\"\n                className=\"flex-1 rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n              <button\n                type=\"button\"\n                onClick={handleTestPaddleocrOnline}\n                disabled={onlineTesting.paddleocr || !(form as any).paddleocr_online_token}\n                className=\"px-3 py-1 text-xs rounded bg-green-600 text-white hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap\">\n                {onlineTesting.paddleocr ? '测试中...' : '检测'}\n              </button>\n            </div>\n            {onlineEngineStatus.paddleocr === 'ok' && (\n              <p className=\"text-xs text-green-600 mt-1\">连接正常</p>\n            )}\n            {onlineEngineStatus.paddleocr === 'fail' && (\n              <p className=\"text-xs text-red-500 mt-1\">连接失败</p>\n            )}\n          </div>\n          <p className=\"text-xs text-gray-400\">\n            从 <a href=\"https://aistudio.baidu.com/paddleocr/task\" target=\"_blank\" className=\"text-blue-500 hover:underline\">PaddleOCR 控制台</a> 获取 Access Token。\n            <a href=\"https://ai.baidu.com/ai-doc/AISTUDIO/Cmkz2m0ma\" target=\"_blank\" className=\"text-blue-500 hover:underline ml-2\">API 文档</a>\n          </p>\n        </div>\n      )}\n\n      <div className=\"flex items-center gap-2 pt-3\">\n        <input type=\"checkbox\" id=\"ocr_confirm_enabled\"\n          checked={(form as any).ocr_confirm_enabled ?? false}\n          onChange={(e) => updateForm({ ocr_confirm_enabled: e.target.checked } as any)}\n          className=\"rounded\" />\n        <label htmlFor=\"ocr_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n          管道执行到 OCR 步骤时弹出确认对话框\n        </label>\n      </div>\n\n      {/* ============ AI Vision / 书签 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <span className=\"text-xs font-medium text-gray-600 mb-2 block\">AI Vision 目录提取</span>\n        <div className=\"flex items-center gap-2\">\n          <input type=\"checkbox\" id=\"ai_vision_enabled\"\n            checked={(form as any).ai_vision_enabled ?? true}\n            onChange={(e) => updateForm({ ai_vision_enabled: e.target.checked } as any)} className=\"rounded\" />\n          <label htmlFor=\"ai_vision_enabled\" className=\"text-xs\">启用 AI Vision 目录提取</label>\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 端点</label>\n          <input type=\"text\" value={(form as any).ai_vision_endpoint || ''}\n            onChange={(e) => updateForm({ ai_vision_endpoint: e.target.value } as any)}\n            placeholder={\n              (form as any).ai_vision_provider === 'gemini' ? 'https://generativelanguage.googleapis.com/v1beta' :\n              (form as any).ai_vision_provider === 'azure' ? 'https://{resource}.openai.azure.com' :\n              (form as any).ai_vision_provider === 'anthropic' || (form as any).ai_vision_provider === 'minimax_anthropic' ? 'https://api.anthropic.com' :\n              (form as any).ai_vision_provider === 'minimax_openai' ? 'https://api.minimaxi.com/v1' :\n              'http://127.0.0.1:12345/v1'\n            }\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">模型名称</label>\n          <div className=\"flex gap-1\">\n            <input type=\"text\" value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              placeholder=\"sabafallah/deepseek-ocr\"\n              className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n            <button\n              type=\"button\"\n              onClick={async () => {\n                setFetchingModels(true)\n                setFetchModelsMsg('')\n                try {\n                  const res = await fetch('/api/v1/fetch-models', {\n                    method: 'POST',\n                    headers: { 'Content-Type': 'application/json' },\n                    body: JSON.stringify({\n                      endpoint: (form as any).ai_vision_endpoint,\n                      api_key: (form as any).ai_vision_api_key,\n                      provider: (form as any).ai_vision_provider,\n                    }),\n                  })\n                  const data = await res.json()\n                  if (data.ok && data.models.length > 0) {\n                    setAiModels(data.models)\n                    setFetchModelsMsg(`${data.models.length} 个模型`)\n                  } else {\n                    setFetchModelsMsg(data.message || '无可用模型')\n                  }\n                } catch (e) {\n                  setFetchModelsMsg(String(e))\n                }\n                setFetchingModels(false)\n              }}\n              disabled={fetchingModels || !(form as any).ai_vision_endpoint}\n              className=\"px-2 py-1.5 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50 whitespace-nowrap\"\n              title=\"从提供商拉取可用模型列表\"\n            >\n              {fetchingModels ? '...' : '获取模型'}\n            </button>\n          </div>\n          {aiModels.length > 0 && (\n            <select\n              value={(form as any).ai_vision_model || ''}\n              onChange={(e) => updateForm({ ai_vision_model: e.target.value } as any)}\n              className=\"w-full mt-1 rounded border border-blue-300 px-2 py-1 text-xs font-mono\"\n              size={Math.min(aiModels.length + 1, 8)}\n            >\n              <option value=\"\" disabled>-- 选择模型 --</option>\n              {aiModels.map(m => (\n                <option key={m.id} value={m.id}>{m.name}</option>\n              ))}\n            </select>\n          )}\n          {fetchModelsMsg && (\n            <p className={`text-xs mt-1 ${fetchModelsMsg.includes('个模型') ? 'text-green-600' : 'text-red-500'}`}>\n              {fetchModelsMsg}\n            </p>\n          )}\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API Key</label>\n          <input type=\"password\" value={(form as any).ai_vision_api_key || ''}\n            onChange={(e) => updateForm({ ai_vision_api_key: e.target.value } as any)}\n            placeholder=\"sk-...  (支持 {env:VAR_NAME})\"\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs font-mono\" />\n        </div>\n        <div className=\"mt-2\">\n          <label className=\"text-xs font-medium text-gray-600 block mb-1\">API 格式</label>\n          <select value={(form as any).ai_vision_provider || 'openai_compatible'}\n            onChange={(e) => {\n              const newProvider = e.target.value\n              const defaultEndpoint = AI_VISION_ENDPOINTS[newProvider] || ''\n              updateForm({\n                ai_vision_provider: newProvider,\n                ai_vision_endpoint: defaultEndpoint,\n              } as any)\n            }}\n            className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\">\n            <option value=\"openai_compatible\">OpenAI / DeepSeek / 智谱 / Qwen / Ollama / lmstudio</option>\n            <option value=\"openai_responses\">OpenAI Responses (新版 /v1/responses)</option>\n            <option value=\"azure\">Azure OpenAI</option>\n            <option value=\"anthropic\">Anthropic Claude</option>\n            <option value=\"gemini\">Google Gemini</option>\n            <option value=\"minimax_openai\">MiniMax (OpenAI 兼容 · 国内/国际通用)</option>\n            <option value=\"minimax_anthropic\">MiniMax (Anthropic 兼容 · Token Plan)</option>\n            <option value=\"custom\">自定义 (Custom)</option>\n          </select>\n        </div>\n        {(form as any).ai_vision_provider === 'custom' && (\n          <div className=\"flex items-center gap-2 mt-2\">\n            <input type=\"checkbox\" id=\"ai_vision_messages_api\"\n              checked={(form as any).ai_vision_messages_api ?? false}\n              onChange={(e) => updateForm({ ai_vision_messages_api: e.target.checked } as any)} className=\"rounded\" />\n            <label htmlFor=\"ai_vision_messages_api\" className=\"text-xs font-medium text-gray-600\">\n              使用 Anthropic Messages API 格式 (默认 OpenAI Chat Completions)\n            </label>\n          </div>\n        )}\n        <div className=\"grid grid-cols-2 gap-3 mt-2\">\n          <div>\n            <label className=\"text-xs font-medium text-gray-600 block mb-1\">DPI</label>\n            <input type=\"number\" value={(form as any).ai_vision_dpi ?? 150}\n              onChange={(e) => updateForm({ ai_vision_dpi: parseInt(e.target.value) || 150 } as any)}\n              min={72} max={300} className=\"w-full rounded border border-gray-300 px-2 py-1.5 text-xs\" />\n          </div>\n        </div>\n        <button\n          type=\"button\"\n          onClick={async () => {\n            setAiVisionTest('testing');\n            try {\n              const res = await fetch('/api/v1/check-ai-vision', {\n                method: 'POST',\n                headers: { 'Content-Type': 'application/json' },\n                body: JSON.stringify({\n                  endpoint: (form as any).ai_vision_endpoint,\n                  model: (form as any).ai_vision_model,\n                  api_key: (form as any).ai_vision_api_key,\n                  provider: (form as any).ai_vision_provider,\n                  messages_api: (form as any).ai_vision_messages_api,\n                }),\n              });\n              const data = await res.json();\n              setAiVisionTest(data.ok ? 'ok' : 'fail');\n              setAiVisionMsg(data.message || data.error || '');\n            } catch (e) {\n              setAiVisionTest('fail');\n              setAiVisionMsg(String(e));\n            }\n          }}\n          disabled={aiVisionTest === 'testing'}\n          className=\"px-3 py-1.5 mt-2 text-xs rounded border border-gray-300 bg-white hover:bg-gray-50 disabled:opacity-50\"\n        >\n          {aiVisionTest === 'testing' ? '测试中...' : '检测'}\n        </button>\n        {aiVisionMsg && (\n          <p className={`text-xs mt-1 ${aiVisionTest === 'ok' ? 'text-green-600' : 'text-red-600'}`}>\n            {aiVisionMsg}\n          </p>\n        )}\n        <p className=\"text-xs text-gray-400 mt-1\">\n          阶段1 从 OCR 文字层提取目录（免费），阶段2 用 AI Vision 从目录页图片提取。\n          支持 OpenAI 兼容 / Gemini / MiniMax 格式。\n        </p>\n        <div className=\"flex items-center gap-2 mt-2\">\n          <input type=\"checkbox\" id=\"bookmark_confirm_enabled\"\n            checked={(form as any).bookmark_confirm_enabled ?? false}\n            onChange={(e) => updateForm({ bookmark_confirm_enabled: e.target.checked } as any)}\n            className=\"rounded\" />\n          <label htmlFor=\"bookmark_confirm_enabled\" className=\"text-xs font-medium text-gray-600\">\n            管道执行到书签步骤时弹出确认对话框\n          </label>\n        </div>\n      </div>\n\n      {/* ============ 主题 ============ */}\n      <div className=\"border-t border-gray-200 pt-3\">\n        <label className=\"text-xs font-medium text-gray-600 block mb-1.5\">主题</label>\n        <div className=\"flex rounded border border-gray-300 overflow-hidden text-xs\">\n          {[\n            { key: 'auto', label: '自动' },\n            { key: 'light', label: '白昼' },\n            { key: 'dark', label: '黑夜' },\n          ].map(({ key, label }) => (\n            <button\n              key={key}\n              type=\"button\"\n              onClick={() => updateForm({ theme: key })}\n              className={`flex-1 py-1.5 text-center transition-colors ${\n                ((form as any).theme || 'auto') === key\n                  ? 'bg-blue-500 text-white'\n                  : 'bg-white text-gray-600 hover:bg-gray-50'\n              }`}\n            >\n              {label}\n            </button>\n          ))}\n        </div>\n      </div>\n\n      {/* ============ 保存按钮 ============ */}\n      <div className=\"flex items-center gap-3 pt-2\">\n        <button\n          type=\"button\"\n          onClick={handleSave}\n          disabled={saving}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {saving ? '保存中...' : '保存设置'}\n        </button>\n        <button\n          type=\"button\"\n          onClick={handleCheckUpdate}\n          disabled={updateChecking}\n          className=\"px-5 py-2 text-sm rounded bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 font-medium\"\n        >\n          {updateChecking ? '检测中...' : '检查更新'}\n        </button>\n        {saveMsg && (\n          <span className={`text-xs ${saveMsg.includes('成功') ? 'text-green-600' : 'text-red-500'}`}>\n            {saveMsg}\n          </span>\n        )}\n        {updateResult && (\n          <span className={`text-xs px-2 py-1 rounded ${updateResult.includes('失败') ? 'text-red-600 bg-red-50' : updateResult.includes('新版本') ? 'text-blue-600 bg-blue-50 font-semibold' : 'text-green-600 bg-green-50'}`}>\n            {updateResult}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(OCRNetworkSection)\n"}}}}