Feat: Add mineru as a model manufacturer to the system. #10621 (#11903)

### What problem does this PR solve? Feat: Add mineru as a model manufacturer to the system. #10621 ### Type of change - [x] New Feature (non-breaking change which adds functionality) --------- Co-authored-by: balibabu <assassin_cike@163.com>
2025-12-26 17:16:52 +08:00 · 2025-12-11 17:37:10 +08:00
parent e9710b7aa9
commit 22a51a3868
15 changed files with 296 additions and 8 deletions
--- a/web/src/pages/user-setting/setting-model/components/modal-card.tsx
+++ b/web/src/pages/user-setting/setting-model/components/modal-card.tsx
@ -73,7 +73,7 @@ export const ModelProviderCard: FC<IModelCardProps> = ({
      {/* Header */}
      <div className="flex h-16  items-center justify-between p-4 cursor-pointer transition-colors text-text-secondary">
        <div className="flex items-center space-x-3">
-          <LlmIcon name={item.name} />
+          <LlmIcon name={item.name} width={32} />
          <div>
            <div className="font-medium text-xl text-text-primary">
              {item.name}
--- a/web/src/pages/user-setting/setting-model/components/used-model.tsx
+++ b/web/src/pages/user-setting/setting-model/components/used-model.tsx
@ -9,7 +9,7 @@ export const UsedModel = ({
  handleAddModel: (factory: string) => void;
  handleEditModel: (model: any, factory: LlmItem) => void;
 }) => {
-  const { factoryList, myLlmList: llmList, loading } = useSelectLlmList();
+  const { myLlmList: llmList } = useSelectLlmList();
  return (
    <div className="flex flex-col w-full gap-5 mb-4">
      <div className="text-text-primary text-2xl font-medium mb-2 mt-4">
--- a/web/src/pages/user-setting/setting-model/hooks.tsx
+++ b/web/src/pages/user-setting/setting-model/hooks.tsx
@ -1,3 +1,4 @@
+import { LLMFactory } from '@/constants/llm';
 import { useSetModalState, useShowDeleteConfirm } from '@/hooks/common-hooks';
 import {
  IApiKeySavingParams,
@ -16,6 +17,7 @@ import { getRealModelName } from '@/utils/llm-util';
 import { useQueryClient } from '@tanstack/react-query';
 import { useCallback, useState } from 'react';
 import { ApiKeyPostBody } from '../interface';
+import { MinerUFormValues } from './modal/mineru-modal';

 type SavingParamsState = Omit<IApiKeySavingParams, 'api_key'>;

@ -459,3 +461,42 @@ export const useHandleDeleteFactory = (llmFactory: string) => {

  return { handleDeleteFactory, deleteFactory };
 };
+
+export const useSubmitMinerU = () => {
+  const { addLlm, loading } = useAddLlm();
+  const {
+    visible: mineruVisible,
+    hideModal: hideMineruModal,
+    showModal: showMineruModal,
+  } = useSetModalState();
+
+  const onMineruOk = useCallback(
+    async (payload: MinerUFormValues) => {
+      const cfg = {
+        ...payload,
+        mineru_delete_output: payload.mineru_delete_output ?? true ? '1' : '0',
+      };
+      const req: IAddLlmRequestBody = {
+        llm_factory: LLMFactory.MinerU,
+        llm_name: payload.llm_name,
+        model_type: 'ocr',
+        api_key: cfg,
+        api_base: '',
+        max_tokens: 0,
+      };
+      const ret = await addLlm(req);
+      if (ret === 0) {
+        hideMineruModal();
+      }
+    },
+    [addLlm, hideMineruModal],
+  );
+
+  return {
+    mineruVisible,
+    hideMineruModal,
+    showMineruModal,
+    onMineruOk,
+    mineruLoading: loading,
+  };
+};
--- a/web/src/pages/user-setting/setting-model/index.tsx
+++ b/web/src/pages/user-setting/setting-model/index.tsx
@ -13,6 +13,7 @@ import {
  useSubmitFishAudio,
  useSubmitGoogle,
  useSubmitHunyuan,
+  useSubmitMinerU,
  useSubmitOllama,
  useSubmitSpark,
  useSubmitSystemModelSetting,
@ -26,6 +27,7 @@ import BedrockModal from './modal/bedrock-modal';
 import FishAudioModal from './modal/fish-audio-modal';
 import GoogleModal from './modal/google-modal';
 import HunyuanModal from './modal/hunyuan-modal';
+import MinerUModal from './modal/mineru-modal';
 import TencentCloudModal from './modal/next-tencent-modal';
 import OllamaModal from './modal/ollama-modal';
 import SparkModal from './modal/spark-modal';
@ -128,6 +130,14 @@ const ModelProviders = () => {
    AzureAddingLoading,
  } = useSubmitAzure();

+  const {
+    mineruVisible,
+    hideMineruModal,
+    showMineruModal,
+    onMineruOk,
+    mineruLoading,
+  } = useSubmitMinerU();
+
  const ModalMap = useMemo(
    () => ({
      [LLMFactory.Bedrock]: showBedrockAddingModal,
@ -139,17 +149,19 @@ const ModelProviders = () => {
      [LLMFactory.TencentCloud]: showTencentCloudAddingModal,
      [LLMFactory.GoogleCloud]: showGoogleAddingModal,
      [LLMFactory.AzureOpenAI]: showAzureAddingModal,
+      [LLMFactory.MinerU]: showMineruModal,
    }),
    [
      showBedrockAddingModal,
      showVolcAddingModal,
      showHunyuanAddingModal,
-      showTencentCloudAddingModal,
      showSparkAddingModal,
      showyiyanAddingModal,
      showFishAudioAddingModal,
+      showTencentCloudAddingModal,
      showGoogleAddingModal,
      showAzureAddingModal,
+      showMineruModal,
    ],
  );

@ -289,6 +301,12 @@ const ModelProviders = () => {
        loading={AzureAddingLoading}
        llmFactory={LLMFactory.AzureOpenAI}
      ></AzureOpenAIModal>
+      <MinerUModal
+        visible={mineruVisible}
+        hideModal={hideMineruModal}
+        onOk={onMineruOk}
+        loading={mineruLoading}
+      ></MinerUModal>
    </div>
  );
 };
--- a/web/src/pages/user-setting/setting-model/modal/mineru-modal/index.tsx
+++ b/web/src/pages/user-setting/setting-model/modal/mineru-modal/index.tsx
@ -0,0 +1,148 @@
+import { RAGFlowFormItem } from '@/components/ragflow-form';
+import { ButtonLoading } from '@/components/ui/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
+import { Form } from '@/components/ui/form';
+import { Input } from '@/components/ui/input';
+import { RAGFlowSelect } from '@/components/ui/select';
+import { Switch } from '@/components/ui/switch';
+import { LLMFactory } from '@/constants/llm';
+import { IModalProps } from '@/interfaces/common';
+import { buildOptions } from '@/utils/form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { t } from 'i18next';
+import { useForm } from 'react-hook-form';
+import { useTranslation } from 'react-i18next';
+import { z } from 'zod';
+import { LLMHeader } from '../../components/llm-header';
+
+const FormSchema = z.object({
+  llm_name: z.string().min(1, {
+    message: t('setting.mineru.modelNameRequired'),
+  }),
+  mineru_apiserver: z.string().optional(),
+  mineru_output_dir: z.string().optional(),
+  mineru_backend: z.enum([
+    'pipeline',
+    'vlm-transformers',
+    'vlm-vllm-engine',
+    'vlm-http-client',
+  ]),
+  mineru_server_url: z.string().optional(),
+  mineru_delete_output: z.boolean(),
+});
+
+export type MinerUFormValues = z.infer<typeof FormSchema>;
+
+const MinerUModal = ({
+  visible,
+  hideModal,
+  onOk,
+  loading,
+}: IModalProps<MinerUFormValues>) => {
+  const { t } = useTranslation();
+
+  const backendOptions = buildOptions([
+    'pipeline',
+    'vlm-transformers',
+    'vlm-vllm-engine',
+    'vlm-http-client',
+  ]);
+
+  const form = useForm<MinerUFormValues>({
+    resolver: zodResolver(FormSchema),
+    defaultValues: {
+      mineru_backend: 'pipeline',
+      mineru_delete_output: true,
+    },
+  });
+
+  const handleOk = async (values: MinerUFormValues) => {
+    const ret = await onOk?.(values as any);
+    if (ret) {
+      hideModal?.();
+    }
+  };
+
+  return (
+    <Dialog open={visible} onOpenChange={hideModal}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>
+            <LLMHeader name={LLMFactory.MinerU} />
+          </DialogTitle>
+        </DialogHeader>
+        <Form {...form}>
+          <form
+            onSubmit={form.handleSubmit(handleOk)}
+            className="space-y-6"
+            id="mineru-form"
+          >
+            <RAGFlowFormItem
+              name="llm_name"
+              label={t('setting.modelName')}
+              required
+            >
+              <Input placeholder="mineru-from-env-1" />
+            </RAGFlowFormItem>
+            <RAGFlowFormItem
+              name="mineru_apiserver"
+              label={t('setting.mineru.apiserver')}
+            >
+              <Input placeholder="http://host.docker.internal:9987" />
+            </RAGFlowFormItem>
+            <RAGFlowFormItem
+              name="mineru_output_dir"
+              label={t('setting.mineru.outputDir')}
+            >
+              <Input placeholder="/tmp/mineru" />
+            </RAGFlowFormItem>
+            <RAGFlowFormItem
+              name="mineru_backend"
+              label={t('setting.mineru.backend')}
+            >
+              {(field) => (
+                <RAGFlowSelect
+                  value={field.value}
+                  onChange={field.onChange}
+                  options={backendOptions}
+                  placeholder={t('setting.mineru.selectBackend')}
+                />
+              )}
+            </RAGFlowFormItem>
+            <RAGFlowFormItem
+              name="mineru_server_url"
+              label={t('setting.mineru.serverUrl')}
+            >
+              <Input placeholder="http://your-vllm-server:30000" />
+            </RAGFlowFormItem>
+            <RAGFlowFormItem
+              name="mineru_delete_output"
+              label={t('setting.mineru.deleteOutput')}
+              labelClassName="!mb-0"
+            >
+              {(field) => (
+                <Switch
+                  checked={field.value}
+                  onCheckedChange={field.onChange}
+                />
+              )}
+            </RAGFlowFormItem>
+          </form>
+        </Form>
+        <DialogFooter>
+          <ButtonLoading type="submit" form="mineru-form" loading={loading}>
+            {t('common.save', 'Save')}
+          </ButtonLoading>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+export default MinerUModal;