diff --git a/web/src/components/Upload/UploadImages.tsx b/web/src/components/Upload/UploadImages.tsx index 77291e92..0875707a 100644 --- a/web/src/components/Upload/UploadImages.tsx +++ b/web/src/components/Upload/UploadImages.tsx @@ -7,14 +7,15 @@ import { useTranslation } from 'react-i18next'; import PlusIcon from '@/assets/images/plus.svg' import { cookieUtils } from '@/utils/request' import { fileUploadUrl } from '@/api/fileStorage' +import styles from './index.module.less' -interface UploadImagesProps extends Omit { +interface UploadImagesProps extends Omit { /** 上传接口地址 */ action?: string; /** 是否支持多选 */ multiple?: boolean; /** 已上传的文件列表 */ - fileList?: UploadFile[]; + fileList?: UploadFile[] | UploadFile; /** 文件列表变化回调 */ onChange?: (fileList?: UploadFile[] | UploadFile) => void; /** 禁用上传 */ @@ -73,12 +74,18 @@ const UploadImages = forwardRef(({ }, ref) => { const { t } = useTranslation(); const { message, modal } = App.useApp() - const [fileList, setFileList] = useState(propFileList); + const [fileList, setFileList] = useState([]); const [accept, setAccept] = useState(); // const [loading, setLoading] = useState(false); const [previewOpen, setPreviewOpen] = useState(false); const [previewImage, setPreviewImage] = useState(''); + useEffect(() => { + if (!Array.isArray(propFileList) && typeof propFileList === 'object') { + setFileList([propFileList]); + } + }, [propFileList]) + const updateValue = (list: UploadFile[]) => { if (maxCount === 1) { onChange?.(list[0]) @@ -185,6 +192,7 @@ const UploadImages = forwardRef(({ showRemoveIcon: true, showDownloadIcon: false, }, + className: `${styles.imageUpload} ${className}`, ...props, }; diff --git a/web/src/components/Upload/index.module.less b/web/src/components/Upload/index.module.less new file mode 100644 index 00000000..a263d743 --- /dev/null +++ b/web/src/components/Upload/index.module.less @@ -0,0 +1,7 @@ +.image-upload:global(.ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-container), +.image-upload:global(.ant-upload-wrapper.ant-upload-picture-circle-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-container), +.image-upload:global(.ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-circle .ant-upload-list-item-container), +.image-upload:global(.ant-upload-wrapper.ant-upload-picture-circle-wrapper .ant-upload-list.ant-upload-list-picture-circle .ant-upload-list-item-container) { + width: 96px; + height: 96px; +} \ No newline at end of file diff --git a/web/src/views/ApplicationConfig/Agent.tsx b/web/src/views/ApplicationConfig/Agent.tsx index 279ac18c..4c9a4695 100644 --- a/web/src/views/ApplicationConfig/Agent.tsx +++ b/web/src/views/ApplicationConfig/Agent.tsx @@ -20,7 +20,7 @@ import type { } from './types' import type { Variable } from './components/VariableList/types' import type { KnowledgeConfig } from './components/Knowledge/types' -import type { Model } from '@/views/ModelManagement/types' +import type { ModelListItem } from '@/views/ModelManagement/types' import { getModelList } from '@/api/models'; import { saveAgentConfig } from '@/api/application' import Knowledge from './components/Knowledge/Knowledge' @@ -96,8 +96,8 @@ const Agent = forwardRef((_props, ref) => { const [loading, setLoading] = useState(false) const [data, setData] = useState(null); const modelConfigModalRef = useRef(null) - const [modelList, setModelList] = useState([]) - const [defaultModel, setDefaultModel] = useState(null) + const [modelList, setModelList] = useState([]) + const [defaultModel, setDefaultModel] = useState(null) const [chatList, setChatList] = useState([]) const values = Form.useWatch([], form) const [isSave, setIsSave] = useState(false) @@ -239,7 +239,7 @@ const Agent = forwardRef((_props, ref) => { const getModels = () => { getModelList({ type: 'llm,chat', pagesize: 100, page: 1, is_active: true }) .then(res => { - const response = res as { items: Model[] } + const response = res as { items: ModelListItem[] } setModelList(response.items) }) } @@ -249,7 +249,7 @@ const Agent = forwardRef((_props, ref) => { useEffect(() => { if (values?.default_model_config_id && modelList.length > 0) { const filterValue = modelList.find(item => item.id === values.default_model_config_id) - setDefaultModel(filterValue as Model | null) + setDefaultModel(filterValue as ModelListItem | null) setChatList([{ label: filterValue?.name || '', model_config_id: filterValue?.id || '', diff --git a/web/src/views/ModelManagement/Square.tsx b/web/src/views/ModelManagement/Square.tsx index 8b69140b..7ecd838c 100644 --- a/web/src/views/ModelManagement/Square.tsx +++ b/web/src/views/ModelManagement/Square.tsx @@ -86,6 +86,7 @@ const ModelSquare = forwardRef ) diff --git a/web/src/views/ModelManagement/components/CustomModelModal.tsx b/web/src/views/ModelManagement/components/CustomModelModal.tsx index ebc5a5ce..edeb732f 100644 --- a/web/src/views/ModelManagement/components/CustomModelModal.tsx +++ b/web/src/views/ModelManagement/components/CustomModelModal.tsx @@ -34,6 +34,7 @@ const CustomModelModal = forwardRef( setModel(model); form.setFieldsValue({ ...model, + logo: model.logo ? { url: model.logo, uid: model.logo, status: 'done', name: 'logo' } : undefined }); } else { setIsEdit(false); @@ -48,7 +49,7 @@ const CustomModelModal = forwardRef( setLoading(true) values.is_official = false; const logo = values.logo as any; - if (typeof logo === 'object') { + if (typeof logo === 'object' && logo?.response?.data.file_id) { getFileLink(logo?.response?.data.file_id).then(res => { const logoRes = res as { url: string } values.logo = logoRes.url @@ -64,6 +65,7 @@ const CustomModelModal = forwardRef( }); }) } else { + values.logo = typeof logo === 'string' ? logo : logo.url updateCustomModel(model.id, values).then(() => { if (refresh) { refresh(); @@ -111,7 +113,7 @@ const CustomModelModal = forwardRef( diff --git a/web/src/views/ModelManagement/components/GroupModelModal.tsx b/web/src/views/ModelManagement/components/GroupModelModal.tsx index 9d8132d9..53a80c61 100644 --- a/web/src/views/ModelManagement/components/GroupModelModal.tsx +++ b/web/src/views/ModelManagement/components/GroupModelModal.tsx @@ -36,7 +36,7 @@ const GroupModelModal = forwardRef(({ form.setFieldsValue({ ...model, api_key_ids: model.api_keys, - logo: model.logo ? [{url: model.logo, uid: model.logo, status: 'done', name: 'logo'}] : undefined + logo: model.logo ? { url: model.logo, uid: model.logo, status: 'done', name: 'logo' } : undefined }) } else { setIsEdit(false); @@ -48,7 +48,7 @@ const GroupModelModal = forwardRef(({ form .validateFields() .then((values) => { - const { api_key_ids, logo, ...rest } = values + const { api_key_ids = [], logo, ...rest } = values const formData: CompositeModelForm = { ...rest, @@ -62,6 +62,7 @@ const GroupModelModal = forwardRef(({ handleUpdate(formData) }) } else { + formData.logo = typeof logo === 'string' ? logo : logo.url handleUpdate(formData) } }) diff --git a/web/src/views/ModelManagement/components/ModelSquareDetail.tsx b/web/src/views/ModelManagement/components/ModelSquareDetail.tsx index 6d437729..d7a5f807 100644 --- a/web/src/views/ModelManagement/components/ModelSquareDetail.tsx +++ b/web/src/views/ModelManagement/components/ModelSquareDetail.tsx @@ -1,6 +1,7 @@ import { useState, useImperativeHandle, forwardRef } from 'react'; import { useTranslation } from 'react-i18next'; -import { Button, Space, App } from 'antd' +import { Button, Space, App, Flex } from 'antd' +import { UsergroupAddOutlined } from '@ant-design/icons'; import type { ModelPlaza, ModelPlazaItem, ModelSquareDetailRef } from '../types'; import RbDrawer from '@/components/RbDrawer'; @@ -11,8 +12,9 @@ import PageEmpty from '@/components/Empty/PageEmpty'; interface ModelSquareDetailProps { refresh: () => void; + handleEdit: (vo: ModelPlazaItem) => void; } -const ModelSquareDetail = forwardRef(({ refresh }, ref) => { +const ModelSquareDetail = forwardRef(({ refresh, handleEdit }, ref) => { const { t } = useTranslation(); const { message } = App.useApp() const [model, setModel] = useState({} as ModelPlaza) @@ -71,10 +73,17 @@ const ModelSquareDetail = forwardRef{t(`modelNew.${item.type}`)}
{item.description}
{item.tags.map((tag, tagIndex) => {tag})} - {item.is_added - ? - : - } + + + {item.add_count} + + {!item.is_official && } + {item.is_added + ? + : + } + + ))} diff --git a/web/src/views/ModelManagement/types.ts b/web/src/views/ModelManagement/types.ts index ad0dca26..1967f393 100644 --- a/web/src/views/ModelManagement/types.ts +++ b/web/src/views/ModelManagement/types.ts @@ -27,16 +27,6 @@ export interface GroupModelModalRef { export interface GroupModelModalProps { refresh?: () => void; } -export interface SubModelModalForm { - provider: string; - model_ids: string[] -} -export interface SubModelModalRef { - handleOpen: (model?: SubModelModalForm) => void; -} -export interface SubModelModalProps { - refresh?: () => void; -} export interface ModelListDetailRef { handleOpen: (vo: ProviderModelItem) => void; } @@ -131,7 +121,7 @@ export interface CustomModelForm { name: string; type: string; provider: string; - logo: string; + logo?: any; description: string; is_official: boolean; tags: string[];