| @@ -33,10 +33,11 @@ function AddVersionModal({ | |||
| ...rest | |||
| }: AddVersionModalProps) { | |||
| const [uuid] = useState(Date.now()); | |||
| const config = resourceConfig[resourceType]; | |||
| // 上传组件参数 | |||
| const uploadProps: UploadProps = { | |||
| action: resourceConfig[resourceType].uploadAction, | |||
| action: config.uploadAction, | |||
| headers: { | |||
| Authorization: getAccessToken() || '', | |||
| }, | |||
| @@ -45,7 +46,7 @@ function AddVersionModal({ | |||
| // 上传请求 | |||
| const createDatasetVersion = async (params: any) => { | |||
| const request = resourceConfig[resourceType].addVersion; | |||
| const request = config.addVersion; | |||
| const [res] = await to(request(params)); | |||
| if (res) { | |||
| message.success('创建成功'); | |||
| @@ -62,7 +63,7 @@ function AddVersionModal({ | |||
| const data = item.response?.data?.[0] ?? {}; | |||
| return { | |||
| ...otherParams, | |||
| [resourceConfig[resourceType].idParamKey]: resourceId, | |||
| [config.idParamKey]: resourceId, | |||
| file_name: data.fileName, | |||
| file_size: data.fileSize, | |||
| url: data.url, | |||
| @@ -72,8 +73,8 @@ function AddVersionModal({ | |||
| } | |||
| }; | |||
| const name = resourceConfig[resourceType].name; | |||
| const accept = resourceConfig[resourceType].uploadAccept; | |||
| const name = config.name; | |||
| const accept = config.uploadAccept; | |||
| return ( | |||
| <KFModal | |||
| {...rest} | |||
| @@ -10,6 +10,7 @@ type CategoryItemProps = { | |||
| }; | |||
| function CategoryItem({ resourceType, item, isSelected, onClick }: CategoryItemProps) { | |||
| const config = resourceConfig[resourceType]; | |||
| return ( | |||
| <div | |||
| className={classNames(styles['category-item'], { | |||
| @@ -20,13 +21,13 @@ function CategoryItem({ resourceType, item, isSelected, onClick }: CategoryItemP | |||
| <img | |||
| className={styles['category-item__icon']} | |||
| style={{ width: '22px' }} | |||
| src={`/assets/images/${resourceConfig[resourceType].prefix}/${item.path}.png`} | |||
| src={`/assets/images/${config.prefix}/${item.path}.png`} | |||
| alt="" | |||
| /> | |||
| <img | |||
| className={styles['category-item__active-icon']} | |||
| style={{ width: '22px' }} | |||
| src={`/assets/images/${resourceConfig[resourceType].prefix}/${item.path}-hover.png`} | |||
| src={`/assets/images/${config.prefix}/${item.path}-hover.png`} | |||
| alt="" | |||
| /> | |||
| <span className={styles['category-item__name']}>{item.name}</span> | |||
| @@ -29,15 +29,14 @@ function CategoryList({ | |||
| onTagSelect, | |||
| onSearch, | |||
| }: CategoryProps) { | |||
| const config = resourceConfig[resourceType]; | |||
| return ( | |||
| <div className={styles['category-list']}> | |||
| <div style={{ padding: '0 20px' }}> | |||
| <Input.Search placeholder="搜索" allowClear onSearch={onSearch} /> | |||
| </div> | |||
| <div className={styles['category-list__content']}> | |||
| <div className={styles['category-list__content__title']}> | |||
| {resourceConfig[resourceType].typeTitle} | |||
| </div> | |||
| <div className={styles['category-list__content__title']}>{config.typeTitle}</div> | |||
| <Flex wrap="wrap" gap="20px 12px"> | |||
| {typeList?.map((item) => ( | |||
| <CategoryItem | |||
| @@ -50,7 +49,7 @@ function CategoryList({ | |||
| ))} | |||
| </Flex> | |||
| <div className={styles['category-list__content__title']} style={{ marginTop: '25px' }}> | |||
| {resourceConfig[resourceType].tagTitle} | |||
| {config.tagTitle} | |||
| </div> | |||
| <Flex wrap="wrap" gap="20px 12px"> | |||
| {tagList?.map((item) => ( | |||
| @@ -28,7 +28,8 @@ const ResourceIntro = ({ resourceType }: ResourceIntroProps) => { | |||
| const [version, setVersion] = useState<string | undefined>(undefined); | |||
| const [activeTab, setActiveTab] = useState<string>(defaultTab); | |||
| const resourceId = Number(locationParams.id); | |||
| const typeName = resourceConfig[resourceType].name; // 数据集/模型 | |||
| const config = resourceConfig[resourceType]; | |||
| const typeName = config.name; // 数据集/模型 | |||
| useEffect(() => { | |||
| getModelByDetail(); | |||
| @@ -37,7 +38,7 @@ const ResourceIntro = ({ resourceType }: ResourceIntroProps) => { | |||
| // 获取详情 | |||
| const getModelByDetail = async () => { | |||
| const request = resourceConfig[resourceType].getInfo; | |||
| const request = config.getInfo; | |||
| const [res] = await to(request(resourceId)); | |||
| if (res) { | |||
| setInfo(res.data); | |||
| @@ -46,7 +47,7 @@ const ResourceIntro = ({ resourceType }: ResourceIntroProps) => { | |||
| // 获取版本列表 | |||
| const getVersionList = async () => { | |||
| const request = resourceConfig[resourceType].getVersions; | |||
| const request = config.getVersions; | |||
| const [res] = await to(request(resourceId)); | |||
| if (res && res.data && res.data.length > 0) { | |||
| setVersionList( | |||
| @@ -122,10 +123,8 @@ const ResourceIntro = ({ resourceType }: ResourceIntroProps) => { | |||
| }); | |||
| } | |||
| const infoTypePropertyName = resourceConfig[resourceType] | |||
| .infoTypePropertyName as keyof ResourceData; | |||
| const infoTagPropertyName = resourceConfig[resourceType] | |||
| .infoTagPropertyName as keyof ResourceData; | |||
| const infoTypePropertyName = config.infoTypePropertyName as keyof ResourceData; | |||
| const infoTagPropertyName = config.infoTagPropertyName as keyof ResourceData; | |||
| return ( | |||
| <div className={styles['resource-intro']}> | |||
| @@ -54,6 +54,7 @@ function ResourceList( | |||
| const [searchText, setSearchText] = useState(initialSearchText); | |||
| const [inputText, setInputText] = useState(initialSearchText); | |||
| const { message } = App.useApp(); | |||
| const config = resourceConfig[resourceType]; | |||
| useEffect(() => { | |||
| getDataList(); | |||
| @@ -82,12 +83,12 @@ function ResourceList( | |||
| const params = { | |||
| page: pagination.current! - 1, | |||
| size: pagination.pageSize, | |||
| [resourceConfig[resourceType].typeParamKey]: dataType, | |||
| [resourceConfig[resourceType].tagParamKey]: dataTag, | |||
| [config.typeParamKey]: dataType, | |||
| [config.tagParamKey]: dataTag, | |||
| available_range: isPublic ? 1 : 0, | |||
| name: searchText !== '' ? searchText : undefined, | |||
| }; | |||
| const request = resourceConfig[resourceType].getList; | |||
| const request = config.getList; | |||
| const [res] = await to(request(params)); | |||
| if (res && res.data && res.data.content) { | |||
| setDataList(res.data.content); | |||
| @@ -97,7 +98,7 @@ function ResourceList( | |||
| // 删除请求 | |||
| const deleteRecord = async (id: number) => { | |||
| const request = resourceConfig[resourceType].deleteRecord; | |||
| const request = config.deleteRecord; | |||
| const [res] = await to(request(id)); | |||
| if (res) { | |||
| getDataList(); | |||
| @@ -113,7 +114,7 @@ function ResourceList( | |||
| // 删除 | |||
| const handleRemove = (record: ResourceData) => { | |||
| modalConfirm({ | |||
| title: resourceConfig[resourceType].deleteModalTitle, | |||
| title: config.deleteModalTitle, | |||
| onOk: () => { | |||
| deleteRecord(record.id); | |||
| }, | |||
| @@ -129,7 +130,7 @@ function ResourceList( | |||
| activeType: dataType, | |||
| activeTag: dataTag, | |||
| }); | |||
| const prefix = resourceConfig[resourceType].prefix; | |||
| const prefix = config.prefix; | |||
| navigate(`/dataset/${prefix}/${record.id}`); | |||
| }; | |||
| @@ -176,7 +177,7 @@ function ResourceList( | |||
| onClick={showModal} | |||
| icon={<KFIcon type="icon-xinjian2" />} | |||
| > | |||
| {resourceConfig[resourceType].addBtnTitle} | |||
| {config.addBtnTitle} | |||
| </Button> | |||
| )} | |||
| </div> | |||
| @@ -21,6 +21,7 @@ function ResourcePage({ resourceType }: ResourcePageProps) { | |||
| const [activeType, setActiveType] = useState<number | undefined>(cacheState?.activeType); | |||
| const [activeTag, setActiveTag] = useState<number | undefined>(cacheState?.activeTag); | |||
| const dataListRef = useRef<ResourceListRef>(null); | |||
| const config = resourceConfig[resourceType]; | |||
| useEffect(() => { | |||
| getAssetIconList(); | |||
| @@ -52,16 +53,10 @@ function ResourcePage({ resourceType }: ResourcePageProps) { | |||
| if (res && res.data && res.data.content) { | |||
| const { content } = res.data; | |||
| setTypeList( | |||
| content.filter( | |||
| (item: CategoryData) => | |||
| Number(item.category_id) === resourceConfig[resourceType].typeValue, | |||
| ), | |||
| content.filter((item: CategoryData) => Number(item.category_id) === config.typeValue), | |||
| ); | |||
| setTagList( | |||
| content.filter( | |||
| (item: CategoryData) => | |||
| Number(item.category_id) === resourceConfig[resourceType].tagValue, | |||
| ), | |||
| content.filter((item: CategoryData) => Number(item.category_id) === config.tagValue), | |||
| ); | |||
| } | |||
| }; | |||
| @@ -76,11 +71,7 @@ function ResourcePage({ resourceType }: ResourcePageProps) { | |||
| return ( | |||
| <div className={styles['resource-page']}> | |||
| <div className={styles['resource-page__tabs-container']}> | |||
| <Tabs | |||
| activeKey={activeTab} | |||
| items={resourceConfig[resourceType].tabItems} | |||
| onChange={hanleTabChange} | |||
| /> | |||
| <Tabs activeKey={activeTab} items={config.tabItems} onChange={hanleTabChange} /> | |||
| </div> | |||
| <Flex style={{ marginTop: '10px', height: 'calc(100% - 59px)' }}> | |||
| <CategoryList | |||
| @@ -41,6 +41,7 @@ function ResourceVersion({ | |||
| }: ResourceVersionProps) { | |||
| const [fileList, setFileList] = useState<ResourceFileData[]>([]); | |||
| const { message } = App.useApp(); | |||
| const config = resourceConfig[resourceType]; | |||
| // 获取版本文件列表 | |||
| useEffectWhen( | |||
| @@ -59,9 +60,9 @@ function ResourceVersion({ | |||
| const getFileList = async (version: string) => { | |||
| const params = { | |||
| version, | |||
| [resourceConfig[resourceType].fileReqParamKey]: resourceId, | |||
| [config.fileReqParamKey]: resourceId, | |||
| }; | |||
| const request = resourceConfig[resourceType].getFiles; | |||
| const request = config.getFiles; | |||
| const [res] = await to(request(params)); | |||
| if (res) { | |||
| setFileList(res?.data?.content ?? []); | |||
| @@ -70,9 +71,9 @@ function ResourceVersion({ | |||
| // 删除版本 | |||
| const deleteVersion = async () => { | |||
| const request = resourceConfig[resourceType].deleteVersion; | |||
| const request = config.deleteVersion; | |||
| const params = { | |||
| [resourceConfig[resourceType].idParamKey]: resourceId, | |||
| [config.idParamKey]: resourceId, | |||
| version, | |||
| }; | |||
| const [res] = await to(request(params)); | |||
| @@ -111,13 +112,13 @@ function ResourceVersion({ | |||
| // 全部导出 | |||
| const handleExport = async () => { | |||
| const url = resourceConfig[resourceType].downloadAllAction; | |||
| const url = config.downloadAllAction; | |||
| downLoadZip(url, { models_id: resourceId, version }); | |||
| }; | |||
| // 单个导出 | |||
| const downloadAlone = (record: ResourceFileData) => { | |||
| const url = resourceConfig[resourceType].downloadSingleAction; | |||
| const url = config.downloadSingleAction; | |||
| downLoadZip(`${url}/${record.id}`); | |||
| }; | |||
| @@ -118,6 +118,7 @@ function ResourceSelectorModal({ | |||
| const [fisrtLoadList, setFisrtLoadList] = useState(false); | |||
| const [fisrtLoadVersions, setFisrtLoadVersions] = useState(false); | |||
| const treeRef = useRef<TreeRef>(null); | |||
| const config = selectorTypeConfig[type]; | |||
| useEffect(() => { | |||
| setExpandedKeys([]); | |||
| @@ -143,9 +144,9 @@ function ResourceSelectorModal({ | |||
| const params = { | |||
| page: 0, | |||
| size: 1000, | |||
| [selectorTypeConfig[type].litReqParamKey]: available_range, | |||
| [config.litReqParamKey]: available_range, | |||
| }; | |||
| const getListReq = selectorTypeConfig[type].getList; | |||
| const getListReq = config.getList; | |||
| const [res] = await to(getListReq(params)); | |||
| if (res) { | |||
| const list = res.data?.content || []; | |||
| @@ -161,10 +162,10 @@ function ResourceSelectorModal({ | |||
| // 获取数据集\模型\镜像版本列表 | |||
| const getVersions = async (parentId: number) => { | |||
| const getVersionsReq = selectorTypeConfig[type].getVersions; | |||
| const getVersionsReq = config.getVersions; | |||
| const [res, error] = await to(getVersionsReq(parentId)); | |||
| if (res) { | |||
| const list = selectorTypeConfig[type].handleVersionResponse(res); | |||
| const list = config.handleVersionResponse(res); | |||
| const children = list.map(convertVersionToTreeData(parentId)); | |||
| // 更新 treeData children | |||
| setOriginTreeData((prev) => prev.map(updateChildren(parentId, children))); | |||
| @@ -183,8 +184,8 @@ function ResourceSelectorModal({ | |||
| // 获取版本下的文件 | |||
| const getFiles = async (id: number, version: string) => { | |||
| const getFilesReq = selectorTypeConfig[type].getFiles; | |||
| const paramsKey = selectorTypeConfig[type].fileReqParamKey; | |||
| const getFilesReq = config.getFiles; | |||
| const paramsKey = config.fileReqParamKey; | |||
| const params = { version: version, [paramsKey]: id }; | |||
| const [res] = await to(getFilesReq(params)); | |||
| if (res) { | |||
| @@ -282,14 +283,12 @@ function ResourceSelectorModal({ | |||
| } | |||
| }; | |||
| const title = `选择${selectorTypeConfig[type].name}`; | |||
| const palceholder = `请输入${selectorTypeConfig[type].name}名称`; | |||
| const title = `选择${config.name}`; | |||
| const palceholder = `请输入${config.name}名称`; | |||
| const fileTitle = | |||
| type === ResourceSelectorType.Mirror | |||
| ? '已选镜像' | |||
| : `已选${selectorTypeConfig[type].name}文件(${files.length})`; | |||
| const tabItems = selectorTypeConfig[type].tabItems; | |||
| const titleImg = selectorTypeConfig[type].modalIcon; | |||
| type === ResourceSelectorType.Mirror ? '已选镜像' : `已选${config.name}文件(${files.length})`; | |||
| const tabItems = config.tabItems; | |||
| const titleImg = config.modalIcon; | |||
| return ( | |||
| <KFModal {...rest} title={title} image={titleImg} onOk={handleOk} width={920} destroyOnClose> | |||