diff --git a/config/routes.ts b/config/routes.ts index de65274b..c26a047f 100644 --- a/config/routes.ts +++ b/config/routes.ts @@ -104,17 +104,6 @@ export default [ defaultIcon: 'icon-models', access: 'canSeeUser', component: './llmodels/user-models' - }, - { - name: 'backendsList', - path: '/models/backends/list', - key: 'backendsList', - icon: 'icon-backend', - selectedIcon: 'icon-backend-filled', - defaultIcon: 'icon-backend', - access: 'canSeeAdmin', - subMenu: ['/models/backends/create'], - component: './backends/index' } ] }, @@ -154,6 +143,16 @@ export default [ selectedIcon: 'icon-files-filled', defaultIcon: 'icon-files', component: './resources/components/model-files' + }, + { + name: 'backendsList', + path: '/resources/backends', + key: 'backendsList', + icon: 'icon-backend', + selectedIcon: 'icon-backend-filled', + defaultIcon: 'icon-backend', + access: 'canSeeAdmin', + component: './backends/index' } ] }, diff --git a/src/components/icon-font/icons.ts b/src/components/icon-font/icons.ts index 51af4dd3..9e4e2a1a 100644 --- a/src/components/icon-font/icons.ts +++ b/src/components/icon-font/icons.ts @@ -50,7 +50,8 @@ const icons = { Yaml: React.createElement(IconFont, { type: 'icon-code_block' }), Version: React.createElement(IconFont, { type: 'icon-version' }), Parameter: React.createElement(IconFont, { type: 'icon-parameters' }), - Private: React.createElement(IconFont, { type: 'icon-private' }) + Private: React.createElement(IconFont, { type: 'icon-private' }), + AWS: React.createElement(IconFont, { type: 'icon-aws' }) }; export default icons; diff --git a/src/components/icon-font/index.tsx b/src/components/icon-font/index.tsx index 3c50209d..a202c05f 100644 --- a/src/components/icon-font/index.tsx +++ b/src/components/icon-font/index.tsx @@ -2,7 +2,7 @@ import { createFromIconfontCN } from '@ant-design/icons'; // import './iconfont/iconfont.js'; const IconFont = createFromIconfontCN({ - scriptUrl: '//at.alicdn.com/t/c/font_4613488_lg2z989p7f.js' + scriptUrl: '//at.alicdn.com/t/c/font_4613488_ab78o2vlum.js' }); export default IconFont; diff --git a/src/components/templates/card-skelton.tsx b/src/components/templates/card-skelton.tsx index 293d0b90..6f02f34d 100644 --- a/src/components/templates/card-skelton.tsx +++ b/src/components/templates/card-skelton.tsx @@ -3,6 +3,8 @@ import React from 'react'; interface CatalogSkeltonProps { span: number; + skeletonProps?: any; + skeletonStyle?: React.CSSProperties; } const CardSkelton: React.FC = (props) => { @@ -21,8 +23,10 @@ const CardSkelton: React.FC = (props) => { style={{ border: '1px solid var(--ant-color-border)', borderRadius: 'var(--border-radius-base)', - padding: '16px 16px' + padding: '16px 16px', + ...props.skeletonStyle }} + {...(props.skeletonProps || {})} > ); diff --git a/src/hooks/use-table-fetch.ts b/src/hooks/use-table-fetch.ts index 664268e0..6497bc54 100644 --- a/src/hooks/use-table-fetch.ts +++ b/src/hooks/use-table-fetch.ts @@ -22,6 +22,7 @@ export default function useTableFetch( defaultData?: any[]; events?: EventsType[]; defaultQueryParams?: Record; + isInfiniteScroll?: boolean; } & WatchConfig ) { const { @@ -33,7 +34,8 @@ export default function useTableFetch( watch, defaultData = [], events = ['UPDATE', 'DELETE'], - defaultQueryParams = {} + defaultQueryParams = {}, + isInfiniteScroll = false } = options; const pollingRef = useRef(null); const chunkRequedtRef = useRef(null); @@ -141,6 +143,9 @@ export default function useTableFetch( total: newRes.pagination.total, totalPage: newRes.pagination.totalPage }); + if (isInfiniteScroll) { + setQueryParams(newParams); + } return; } @@ -151,6 +156,12 @@ export default function useTableFetch( total: res.pagination.total, totalPage: res.pagination.totalPage }); + if (isInfiniteScroll && query?.page) { + setQueryParams({ + ...queryParams, + ...query + }); + } } catch (error) { console.log('error', error); setDataSource({ diff --git a/src/locales/en-US/menu.ts b/src/locales/en-US/menu.ts index fa603a8f..f1a2af52 100644 --- a/src/locales/en-US/menu.ts +++ b/src/locales/en-US/menu.ts @@ -32,5 +32,5 @@ export default { 'menu.clusterManagement.credentials': 'Cloud Credentials', 'menu.clusterManagement.clusterDetail': 'Cluster Detail', 'menu.clusterManagement.clusterCreate': 'Create Cluster', - 'menu.models.backendsList': 'Inference Backends' + 'menu.resources.backendsList': 'Inference Backends' }; diff --git a/src/locales/ja-JP/menu.ts b/src/locales/ja-JP/menu.ts index a5510231..3aa0e3f7 100644 --- a/src/locales/ja-JP/menu.ts +++ b/src/locales/ja-JP/menu.ts @@ -32,7 +32,7 @@ export default { 'menu.models.userModels': 'My Models', 'menu.clusterManagement.clusterDetail': 'Cluster Detail', 'menu.clusterManagement.clusterCreate': 'Create Cluster', - 'menu.models.backendsList': 'Inference Backends' + 'menu.resources.backendsList': 'Inference Backends' }; // ========== To-Do: Translate Keys (Remove After Translation) ========== @@ -49,5 +49,5 @@ export default { // 11. 'menu.models.userModels': 'My Models' // 12. 'menu.clusterManagement.clusterDetail': 'Cluster Detail', // 13. 'menu.clusterManagement.clusterCreate': 'Create Cluster', -// 14. 'menu.models.backendsList': 'Inference Backends' +// 14. 'menu.resources.backendsList': 'Inference Backends' // ========== End of To-Do List ========== diff --git a/src/locales/ru-RU/menu.ts b/src/locales/ru-RU/menu.ts index 47571bc0..5950335c 100644 --- a/src/locales/ru-RU/menu.ts +++ b/src/locales/ru-RU/menu.ts @@ -32,9 +32,9 @@ export default { 'menu.models.userModels': 'Мои модели', 'menu.clusterManagement.clusterDetail': 'Детали кластера', 'menu.clusterManagement.clusterCreate': 'Создать кластер', - 'menu.models.backendsList': 'Inference Backends' + 'menu.resources.backendsList': 'Inference Backends' }; // ========== To-Do: Translate Keys (Remove After Translation) ========== -// 14. 'menu.models.backendsList': 'Inference Backends' +// 14. 'menu.resources.backendsList': 'Inference Backends' // ========== End of To-Do List ========== diff --git a/src/locales/zh-CN/menu.ts b/src/locales/zh-CN/menu.ts index 73257288..b8699fb3 100644 --- a/src/locales/zh-CN/menu.ts +++ b/src/locales/zh-CN/menu.ts @@ -32,5 +32,5 @@ export default { 'menu.clusterManagement.credentials': '云凭证', 'menu.clusterManagement.clusterDetail': '集群详情', 'menu.clusterManagement.clusterCreate': '创建集群', - 'menu.models.backendsList': '推理后端' + 'menu.resources.backendsList': '推理后端' }; diff --git a/src/pages/backends/components/backend-card.tsx b/src/pages/backends/components/backend-card.tsx index 98c1fdeb..619ee73e 100644 --- a/src/pages/backends/components/backend-card.tsx +++ b/src/pages/backends/components/backend-card.tsx @@ -227,7 +227,7 @@ const BackendCard: React.FC = ({ data, onSelect }) => { color="geekblue" className="font-400" bordered={false} - style={{ borderRadius: 'var(--ant-border-radius)' }} + style={{ borderRadius: 'var(--ant-border-radius)', margin: 0 }} > {intl.formatMessage({ id: 'backend.builtin' })} diff --git a/src/pages/backends/components/backend-list.tsx b/src/pages/backends/components/backend-list.tsx index 7e02d698..547d3c8c 100644 --- a/src/pages/backends/components/backend-list.tsx +++ b/src/pages/backends/components/backend-list.tsx @@ -24,6 +24,20 @@ const SpinWrapper = styled.div` } `; +const SkeletonWrapper = styled.div` + .ant-skeleton-content { + .ant-skeleton-paragraph { + display: flex; + flex-direction: column; + gap: 16px; + margin-bottom: 0; + li { + margin-top: 0 !important; + } + } + } +`; + interface BackendListProps { defaultSpan?: number; resizable?: boolean; @@ -34,12 +48,6 @@ interface BackendListProps { onSelect?: (item: any) => void; } -const InnerSkeleton: React.FC<{ - span: number; -}> = (props) => { - return ; -}; - const ListSkeleton: React.FC<{ span: number; loading: boolean; @@ -56,7 +64,21 @@ const ListSkeleton: React.FC<{ }} wrapperClassName="skelton-wrapper" > - {isFirst && } + {isFirst && ( + + + + )} )} diff --git a/src/pages/backends/forms/versions-config.tsx b/src/pages/backends/forms/versions-config.tsx index 791293c8..5c26b048 100644 --- a/src/pages/backends/forms/versions-config.tsx +++ b/src/pages/backends/forms/versions-config.tsx @@ -1,11 +1,12 @@ import CollapsibleContainer from '@/components/collapse-container'; +import BaseSelect from '@/components/seal-form/base/select'; import SealInput from '@/components/seal-form/seal-input'; import SealSelect from '@/components/seal-form/seal-select'; import { PageActionType } from '@/config/types'; import useAppUtils from '@/hooks/use-app-utils'; import { MinusOutlined, PlusOutlined } from '@ant-design/icons'; import { useIntl } from '@umijs/max'; -import { Button, Empty, Form, Select, Tag } from 'antd'; +import { Button, Empty, Form, Tag } from 'antd'; import React, { useEffect, useMemo } from 'react'; import styled from 'styled-components'; import { frameworks } from '../config'; @@ -163,7 +164,7 @@ const VersionsForm: React.FC = ({ {!currentData?.is_built_in && ( -