diff --git a/web_ui/src/app/home/models/component/llm-card/LLMCard.tsx b/web_ui/src/app/home/models/component/llm-card/LLMCard.tsx index 9a11e2b3..3cad394d 100644 --- a/web_ui/src/app/home/models/component/llm-card/LLMCard.tsx +++ b/web_ui/src/app/home/models/component/llm-card/LLMCard.tsx @@ -31,9 +31,6 @@ export default function LLMCard({
URL:{cardVO.URL}
-
- 更新时间:{cardVO.updateTime} -
); } \ No newline at end of file diff --git a/web_ui/src/app/home/models/component/llm-card/LLMCardVO.ts b/web_ui/src/app/home/models/component/llm-card/LLMCardVO.ts index 0a9ba785..6b0b07d3 100644 --- a/web_ui/src/app/home/models/component/llm-card/LLMCardVO.ts +++ b/web_ui/src/app/home/models/component/llm-card/LLMCardVO.ts @@ -4,7 +4,6 @@ export interface ILLMCardVO { model: string; company: string; URL: string; - updateTime: string; } export class LLMCardVO implements ILLMCardVO { @@ -13,7 +12,6 @@ export class LLMCardVO implements ILLMCardVO { model: string; company: string; URL: string; - updateTime: string; constructor(props: ILLMCardVO) { this.id = props.id; @@ -21,7 +19,6 @@ export class LLMCardVO implements ILLMCardVO { this.model = props.model; this.company = props.company; this.URL = props.URL; - this.updateTime = props.updateTime; } } \ No newline at end of file diff --git a/web_ui/src/app/home/models/component/llm-form/ChooseAdapterEntity.ts b/web_ui/src/app/home/models/component/llm-form/ChooseAdapterEntity.ts new file mode 100644 index 00000000..dd97d284 --- /dev/null +++ b/web_ui/src/app/home/models/component/llm-form/ChooseAdapterEntity.ts @@ -0,0 +1,4 @@ +export interface IChooseRequesterEntity { + label: string + value: string +} \ No newline at end of file diff --git a/web_ui/src/app/home/models/component/llm-form/LLMForm.tsx b/web_ui/src/app/home/models/component/llm-form/LLMForm.tsx index e0ca4b84..c580031e 100644 --- a/web_ui/src/app/home/models/component/llm-form/LLMForm.tsx +++ b/web_ui/src/app/home/models/component/llm-form/LLMForm.tsx @@ -2,6 +2,8 @@ import styles from "@/app/home/models/LLMConfig.module.css"; import {Button, Form, Input, Select, SelectProps, Space} from "antd"; import {ICreateLLMField} from "@/app/home/models/ICreateLLMField"; import {useEffect, useState} from "react"; +import {IChooseRequesterEntity} from "@/app/home/models/component/llm-form/ChooseAdapterEntity"; +import { httpClient } from "@/app/infra/http/HttpClient"; export default function LLMForm({ editMode, @@ -27,7 +29,10 @@ export default function LLMForm({ value: 'vision', }, ]; + const [requesterNameList, setRequesterNameList] = useState([]) + useEffect(() => { + initLLMModelFormComponent() if (editMode && initLLMId) { getLLMConfig(initLLMId).then(val => { form.setFieldsValue(val) @@ -35,7 +40,18 @@ export default function LLMForm({ } else { form.resetFields() } - }) + }, []) + + async function initLLMModelFormComponent() { + const requesterNameList = await httpClient.getProviderRequesters() + setRequesterNameList(requesterNameList.requesters.map(item => { + return { + label: item.label.zh_CN, + value: item.name + } + })) + // TODO 拉取初始化表单信息 + } async function getLLMConfig(id: string): Promise { return { @@ -102,11 +118,7 @@ export default function LLMForm({ style={{width: 120}} onChange={() => { }} - options={[ - {value: 'OpenAI', label: 'OpenAI'}, - {value: 'OLAMA', label: 'OLAMA'}, - {value: 'DeepSeek', label: 'DeepSeek'}, - ]} + options={requesterNameList} /> diff --git a/web_ui/src/app/home/models/page.tsx b/web_ui/src/app/home/models/page.tsx index a0ed8fd0..24536fd3 100644 --- a/web_ui/src/app/home/models/page.tsx +++ b/web_ui/src/app/home/models/page.tsx @@ -1,6 +1,6 @@ "use client" -import {useState} from "react"; +import {useState, useEffect} from "react"; import {LLMCardVO} from "@/app/home/models/component/llm-card/LLMCardVO"; import styles from "./LLMConfig.module.css" import EmptyAndCreateComponent from "@/app/home/components/empty-and-create-component/EmptyAndCreateComponent"; @@ -8,54 +8,43 @@ import {Modal} from "antd"; import LLMCard from "@/app/home/models/component/llm-card/LLMCard"; import LLMForm from "@/app/home/models/component/llm-form/LLMForm"; import CreateCardComponent from "@/app/infra/basic-component/create-card-component/CreateCardComponent"; +import { httpClient } from "@/app/infra/http/HttpClient"; +import { LLMModel } from "@/app/infra/api/api-types"; export default function LLMConfigPage() { - const [cardList, setCardList] = useState([ - new LLMCardVO({ - id: "1", - name: "测试模型", - model: "GPT-4o", - URL: "www.openai.com", - company: "OpenAI", - updateTime: "2025.1.2" - }), - new LLMCardVO({ - id: "2", - name: "测试模型", - model: "GPT-4o", - URL: "www.openai.com", - company: "OpenAI", - updateTime: "2025.1.2" - }), - new LLMCardVO({ - id: "3", - name: "测试模型", - model: "GPT-4o", - URL: "www.openai.com", - company: "OpenAI", - updateTime: "2025.1.2" - }), - new LLMCardVO({ - id: "4", - name: "测试模型", - model: "GPT-4o", - URL: "www.openai.com", - company: "OpenAI", - updateTime: "2025.1.2" - }), - new LLMCardVO({ - id: "5", - name: "测试模型", - model: "GPT-4o", - URL: "www.openai.com", - company: "OpenAI", - updateTime: "2025.1.2" - }), - ]) + const [cardList, setCardList] = useState([]) const [modalOpen, setModalOpen] = useState(false); const [isEditForm, setIsEditForm] = useState(false) const [nowSelectedLLM, setNowSelectedLLM] = useState(null) + useEffect(() => { + getLLMModelList().then((llmModelList) => { + setCardList(llmModelList) + }) + }, []) + + function getLLMModelList(): Promise { + return new Promise((resolve) => { + httpClient.getProviderLLMModels().then((resp) => { + const llmModelList: LLMCardVO[] = resp.models.map((model: LLMModel) => { + console.log("model", model) + return new LLMCardVO({ + id: model.uuid, + name: model.name, + model: model.name, + company: model.requester, + URL: model.requester_config.base_url, + }) + }) + resolve(llmModelList) + }).catch((err) => { + // TODO error toast + console.error("get LLM model list error", err) + resolve([]) + }) + }) + } + function selectLLM(cardVO: LLMCardVO) { setIsEditForm(true) setNowSelectedLLM(cardVO)