diff --git a/frontend/packages/core/src/pages/aiSetting/AiSettingList.tsx b/frontend/packages/core/src/pages/aiSetting/AiSettingList.tsx index a4c8591d..b09ce4c5 100644 --- a/frontend/packages/core/src/pages/aiSetting/AiSettingList.tsx +++ b/frontend/packages/core/src/pages/aiSetting/AiSettingList.tsx @@ -4,12 +4,11 @@ import { BasicResponse, STATUS_CODE, RESPONSE_TIPS } from "@common/const/const"; import { useFetch } from "@common/hooks/http"; import { $t } from "@common/locales"; import { Icon } from "@iconify/react/dist/iconify.js"; -import { App, Spin, Card, Tag, Select, Button, Empty, Divider } from "antd"; +import { App, Spin, Card, Tag, Button, Empty, Divider } from "antd"; import { memo, useEffect, useRef, useState } from "react"; import AiSettingModalContent, { AiSettingModalContentHandle } from "./AiSettingModal"; import WithPermission from "@common/components/aoplatform/WithPermission"; import { useGlobalContext } from "@common/contexts/GlobalStateContext"; -import { DefaultOptionType } from "antd/es/select"; import { checkAccess } from "@common/utils/permission"; export type AiSettingListItem = { @@ -90,7 +89,7 @@ const AiSettingList = ()=>{ } modal.confirm({ title:$t('模型配置'), - content:, + content:, onOk:()=>{ return modalRef.current?.save().then((res)=>{if(res === true) setAiConfigFlushed(true) @@ -125,48 +124,12 @@ const AiSettingList = ()=>{ }, []); const CardBox = memo(({provider}:{provider:AiSettingListItem})=>{ - const [options, setOptions] = useState([]) - const [loading, setLoading] = useState(false) - const [defaultLlm, setDefaultLlm] = useState(provider.defaultLlm) - - const getLlmList = ()=>{ - if(options.length > 0) return - setLoading(true) - fetchData>(`ai/provider/llms`,{method:'GET',eoParams:{provider:provider.id}}).then(response=>{ - const {code,data,msg} = response - if(code === STATUS_CODE.SUCCESS){ - setOptions(data.llms?.map((x:AiProviderLlmsItems)=>({ - label:{x.id}, - value:x.id}))) - }else{ - message.error(msg || $t(RESPONSE_TIPS.error)) - } - }).finally(()=>{ - setLoading(false) - }) - } - - - const changeDefaultModel = (value: string, entity:AiSettingListItem) => { - setLoading(true) - return fetchData>(`ai/provider/default-llm`,{method:'PUT', eoBody:{llm:value}, eoParams:{provider:entity.id}}).then(response=>{ - const {code,msg} = response - if(code === STATUS_CODE.SUCCESS){ - setDefaultLlm(value) - message.success(msg || $t(RESPONSE_TIPS.success)) - }else{ - message.error(msg || $t(RESPONSE_TIPS.error)) - } - }).finally(()=>setLoading(false)) - }; - - return ( - + + - {provider.name} + {provider.name} {provider.configured ? $t('已配置') : $t('未配置')} @@ -178,18 +141,7 @@ const AiSettingList = ()=>{ { provider.configured && <>{$t('默认')}: - - changeDefaultModel(value, provider)} - options={options} - onFocus={()=> getLlmList()} - loading={loading } - /> - + {provider.defaultLlm} > } @@ -248,8 +200,8 @@ const AiSettingList = ()=>{ aiSettingList.filter((item)=>!item.configured).length > 0 && <> {$t('未配置')} - !item.configured) || [] }/> - > + !item.configured) || [] }/> + > } :} diff --git a/frontend/packages/core/src/pages/aiSetting/AiSettingModal.tsx b/frontend/packages/core/src/pages/aiSetting/AiSettingModal.tsx index bb0d923b..159360fe 100644 --- a/frontend/packages/core/src/pages/aiSetting/AiSettingModal.tsx +++ b/frontend/packages/core/src/pages/aiSetting/AiSettingModal.tsx @@ -1,15 +1,14 @@ -import WithPermission from "@common/components/aoplatform/WithPermission"; -import { BasicResponse, STATUS_CODE, RESPONSE_TIPS } from "@common/const/const"; +import { BasicResponse, STATUS_CODE, RESPONSE_TIPS, PLACEHOLDER } from "@common/const/const"; import { useFetch } from "@common/hooks/http"; import { $t } from "@common/locales"; -import { App } from "antd"; +import { App, Form, Select, Tag } from "antd"; import { forwardRef, useEffect, useImperativeHandle, useState } from "react"; -import { AiProviderConfig } from "./AiSettingList"; +import { AiProviderConfig, AiProviderLlmsItems } from "./AiSettingList"; import { Codebox } from "@common/components/postcat/api/Codebox"; export type AiSettingModalContentProps = { - entity:AiProviderConfig + entity:AiProviderConfig & {defaultLlm:string} readOnly:boolean } @@ -17,31 +16,65 @@ export type AiSettingModalContentHandle = { save:()=>Promise } +type AiSettingModalContentField = { + config:string + defaultLlm:string +} + const AiSettingModalContent = forwardRef((props,ref)=>{ + const [form] = Form.useForm(); const { message } = App.useApp() const {entity,readOnly} = props const {fetchData} = useFetch() - const [code, setCode] = useState() + const [llmList, setLlmList] = useState() + const [loading, setLoading] = useState(false) + + + const getLlmList = ()=>{ + setLoading(true) + fetchData>(`ai/provider/llms`,{method:'GET',eoParams:{provider:entity.id}}).then(response=>{ + const {code,data,msg} = response + if(code === STATUS_CODE.SUCCESS){ + setLlmList(data.llms) + }else{ + message.error(msg || $t(RESPONSE_TIPS.error)) + } + }).finally(()=>{ + setLoading(false) + }) + } + useEffect(() => { + getLlmList() try{ - entity!.config && setCode(JSON.stringify(JSON.parse(entity!.config),null,2)) + form.setFieldsValue({ + defaultLlm:entity.defaultLlm, + config:entity!.config ? JSON.stringify(JSON.parse(entity!.config),null,2) : '' + }) }catch(e){ - setCode('') + form.setFieldsValue({ + defaultLlm:entity.defaultLlm, + config: '' + }) } }, []); const save: ()=>Promise = ()=>{ - return fetchData>('ai/provider/config',{method:'PUT',eoParams:{provider:entity?.id}, eoBody:({config:code})}).then(response=>{ - const {code,msg} = response - if(code === STATUS_CODE.SUCCESS){ - message.success(msg || $t(RESPONSE_TIPS.success)) - return Promise.resolve(true) - }else{ - message.error(msg || $t(RESPONSE_TIPS.error)) - return Promise.reject(msg || $t(RESPONSE_TIPS.error)) - } - }).catch((errorInfo)=> Promise.reject(errorInfo)) + return new Promise((resolve, reject)=>{ + form.validateFields().then((value)=>{ + fetchData>('ai/provider/config',{method:'PUT',eoParams:{provider:entity?.id}, eoBody:value, eoTransformKeys:['defaultLlm']}).then(response=>{ + const {code,msg} = response + if(code === STATUS_CODE.SUCCESS){ + message.success(msg || $t(RESPONSE_TIPS.success)) + resolve(true) + }else{ + message.error(msg || $t(RESPONSE_TIPS.error)) + reject(msg || $t(RESPONSE_TIPS.error)) + } + }).catch((errorInfo)=> reject(errorInfo)) + }).catch((errorInfo)=> reject(errorInfo)) + }) } useImperativeHandle(ref, ()=>({ @@ -50,8 +83,44 @@ const AiSettingModalContent = forwardRef + + + + label={$t("模型")} + name="defaultLlm" + rules={[{ required: true }]} + > + ({ + value:x.id, + label: + {x.id} + {x?.scopes?.map(s=>{s?.toLocaleUpperCase()})} + }))} + onChange={(e)=>{ + form.setFieldValue('config',llmList?.find(x=>x.id===e)?.config) + }}> + + + + + label={$t("参数")} + name="config" + > + + + ) })
{$t('未配置')}