From 6a467ceca4d64fb6a4f964e4b327c802d5b6a9ed Mon Sep 17 00:00:00 2001
From: icarus <eurfelux@gmail.com>
Date: Fri, 22 Aug 2025 16:41:16 +0800
Subject: [PATCH] =?UTF-8?q?feat(ocr):=20=E6=B7=BB=E5=8A=A0OCR=E6=9C=8D?=
 =?UTF-8?q?=E5=8A=A1=E8=AE=BE=E7=BD=AE=E7=95=8C=E9=9D=A2=E5=8F=8A=E6=8F=90?=
 =?UTF-8?q?=E4=BE=9B=E5=95=86=E9=80=89=E6=8B=A9=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

实现OCR服务设置界面，包含图片OCR提供商的选择功能
修复ocr.ts中imageProvider的类型定义
添加相关国际化文本
---
 src/renderer/src/i18n/locales/zh-cn.json      | 10 ++++
 .../OcrImageProviderSettings.tsx              | 51 +++++++++++++++++++
 .../DocProcessSettings/OcrSettings.tsx        | 33 ++++++++++++
 .../settings/DocProcessSettings/index.tsx     |  2 +
 src/renderer/src/store/ocr.ts                 |  2 +-
 5 files changed, 97 insertions(+), 1 deletion(-)
 create mode 100644 src/renderer/src/pages/settings/DocProcessSettings/OcrImageProviderSettings.tsx
 create mode 100644 src/renderer/src/pages/settings/DocProcessSettings/OcrSettings.tsx

diff --git a/src/renderer/src/i18n/locales/zh-cn.json b/src/renderer/src/i18n/locales/zh-cn.json
index 1abf83fe76..dbb83cb29d 100644
--- a/src/renderer/src/i18n/locales/zh-cn.json
+++ b/src/renderer/src/i18n/locales/zh-cn.json
@@ -3483,6 +3483,16 @@
     },
     "title": "设置",
     "tool": {
+      "ocr": {
+        "image": {
+          "error": {
+            "provider_not_found": "该提供商不存在"
+          },
+          "title": "图片"
+        },
+        "image_provider": "OCR 服务提供商",
+        "title": "OCR 服务"
+      },
       "preprocess": {
         "provider": "文档处理服务商",
         "provider_placeholder": "选择一个文档处理服务商",
diff --git a/src/renderer/src/pages/settings/DocProcessSettings/OcrImageProviderSettings.tsx b/src/renderer/src/pages/settings/DocProcessSettings/OcrImageProviderSettings.tsx
new file mode 100644
index 0000000000..ad150cc666
--- /dev/null
+++ b/src/renderer/src/pages/settings/DocProcessSettings/OcrImageProviderSettings.tsx
@@ -0,0 +1,51 @@
+import { loggerService } from '@logger'
+import { useAppSelector } from '@renderer/store'
+import { setImageOcrProvider } from '@renderer/store/ocr'
+import { isImageOcrProvider } from '@renderer/types'
+import { Select } from 'antd'
+import { useTranslation } from 'react-i18next'
+import { useDispatch } from 'react-redux'
+
+import { SettingRow, SettingRowTitle } from '..'
+
+const logger = loggerService.withContext('OcrImageProviderSettings')
+
+const OcrImageProviderSettings = () => {
+  const { t } = useTranslation()
+  const providers = useAppSelector((state) => state.ocr.providers)
+  const imageProvider = useAppSelector((state) => state.ocr.imageProvider)
+  const imageProviders = providers.filter((p) => isImageOcrProvider(p))
+  const dispatch = useDispatch()
+
+  const updateImageProvider = (id: string) => {
+    const provider = imageProviders.find((p) => p.id === id)
+    if (!provider) {
+      logger.error(`Failed to find image provider by id: ${id}`)
+      window.message.error(t('settings.tool.ocr.image.error.provider_not_found'))
+      return
+    }
+
+    dispatch(setImageOcrProvider(provider))
+  }
+
+  return (
+    <>
+      <SettingRow>
+        <SettingRowTitle>{t('settings.tool.ocr.image_provider')}</SettingRowTitle>
+        <div style={{ display: 'flex', gap: '8px' }}>
+          <Select
+            value={imageProvider.id}
+            style={{ width: '200px' }}
+            onChange={(id: string) => updateImageProvider(id)}
+            options={imageProviders.map((p) => ({
+              value: p.id,
+              label: p.name
+            }))}
+          />
+        </div>
+      </SettingRow>
+    </>
+  )
+}
+
+export default OcrImageProviderSettings
diff --git a/src/renderer/src/pages/settings/DocProcessSettings/OcrSettings.tsx b/src/renderer/src/pages/settings/DocProcessSettings/OcrSettings.tsx
new file mode 100644
index 0000000000..d8763f0e2f
--- /dev/null
+++ b/src/renderer/src/pages/settings/DocProcessSettings/OcrSettings.tsx
@@ -0,0 +1,33 @@
+import { PictureOutlined } from '@ant-design/icons'
+import { useTheme } from '@renderer/context/ThemeProvider'
+import { Tabs, TabsProps } from 'antd'
+import { FC } from 'react'
+import { useTranslation } from 'react-i18next'
+
+import { SettingDivider, SettingGroup, SettingTitle } from '..'
+import OcrImageProviderSettings from './OcrImageProviderSettings'
+
+const OcrSettings: FC = () => {
+  const { t } = useTranslation()
+  const { theme: themeMode } = useTheme()
+
+  const tabs: TabsProps['items'] = [
+    {
+      key: 'image',
+      label: t('settings.tool.ocr.image.title'),
+      icon: <PictureOutlined />,
+      children: <OcrImageProviderSettings />
+    }
+  ]
+
+  return (
+    <>
+      <SettingGroup theme={themeMode}>
+        <SettingTitle>{t('settings.tool.ocr.title')}</SettingTitle>
+        <SettingDivider />
+        <Tabs defaultActiveKey="image" items={tabs} />
+      </SettingGroup>
+    </>
+  )
+}
+export default OcrSettings
diff --git a/src/renderer/src/pages/settings/DocProcessSettings/index.tsx b/src/renderer/src/pages/settings/DocProcessSettings/index.tsx
index f8384ae97a..526f507fff 100644
--- a/src/renderer/src/pages/settings/DocProcessSettings/index.tsx
+++ b/src/renderer/src/pages/settings/DocProcessSettings/index.tsx
@@ -2,6 +2,7 @@ import { useTheme } from '@renderer/context/ThemeProvider'
 import { FC } from 'react'
 
 import { SettingContainer } from '..'
+import OcrSettings from './OcrSettings'
 import PreprocessSettings from './PreprocessSettings'
 
 const DocProcessSettings: FC = () => {
@@ -9,6 +10,7 @@ const DocProcessSettings: FC = () => {
 
   return (
     <SettingContainer theme={themeMode}>
+      <OcrSettings />
       <PreprocessSettings />
     </SettingContainer>
   )
diff --git a/src/renderer/src/store/ocr.ts b/src/renderer/src/store/ocr.ts
index fdee17479c..87d9b790bf 100644
--- a/src/renderer/src/store/ocr.ts
+++ b/src/renderer/src/store/ocr.ts
@@ -4,7 +4,7 @@ import { ImageOcrProvider, OcrProvider } from '@renderer/types'
 
 export interface OcrState {
   providers: OcrProvider[]
-  imageProvider: OcrProvider
+  imageProvider: ImageOcrProvider
 }
 
 const initialState: OcrState = {