diff --git a/src/pages/gpu-service/instances/hooks/use-instances-columns.tsx b/src/pages/gpu-service/instances/hooks/use-instances-columns.tsx index 21b37bd7..e0e2bd00 100644 --- a/src/pages/gpu-service/instances/hooks/use-instances-columns.tsx +++ b/src/pages/gpu-service/instances/hooks/use-instances-columns.tsx @@ -70,11 +70,13 @@ const getConnectEntries = (record: ListItem): ConnectEntry[] => { interface ColumnsHookProps { handleSelect: (val: string, record: ListItem) => void; + clusterList: Global.BaseOption[]; sortOrder: string[]; } const useInstancesColumns = ({ handleSelect, + clusterList, sortOrder }: ColumnsHookProps): ColumnsType => { const intl = useIntl(); @@ -242,6 +244,15 @@ const useInstancesColumns = ({ ) }, + { + title: intl.formatMessage({ id: 'clusters.title' }), + dataIndex: 'clusterId', + render: (id: number) => ( + + {_.find(clusterList, { value: id })?.label || id || '-'} + + ) + }, { title: intl.formatMessage({ id: 'common.table.createTime' }), dataIndex: 'created_at', @@ -271,7 +282,7 @@ const useInstancesColumns = ({ ) } ]; - }, [handleSelect, sortOrder, intl]); + }, [handleSelect, sortOrder, clusterList, intl]); }; export default useInstancesColumns; diff --git a/src/pages/gpu-service/instances/index.tsx b/src/pages/gpu-service/instances/index.tsx index b486be01..1d143c0c 100644 --- a/src/pages/gpu-service/instances/index.tsx +++ b/src/pages/gpu-service/instances/index.tsx @@ -1,11 +1,13 @@ import { PageAction } from '@/config'; import { PaginationKey, TABLE_SORT_DIRECTIONS } from '@/config/settings'; import useTableFetch from '@/hooks/use-table-fetch'; +import { useQueryClusterList } from '@/pages/cluster-management/services/use-query-cluster-list'; import { DeleteModal, FilterBar, IconFont, NoResult } from '@gpustack/core-ui'; import { useIntl } from '@umijs/max'; import { useMemoizedFn } from 'ahooks'; import { ConfigProvider, message, Modal, Table } from 'antd'; import _ from 'lodash'; +import { useEffect } from 'react'; import PageBox from '../../_components/page-box'; import { deleteGPUServiceInstance, @@ -66,6 +68,15 @@ const GPUService: React.FC = () => { closeViewEventsModal, openViewEventsModalStatus } = useViewEvents(); + const { + fetchClusterList, + cancelRequest: cancelClusterRequest, + clusterList + } = useQueryClusterList(); + + useEffect(() => { + fetchClusterList({ page: -1 }); + }, []); const handleModalOk = async (data: FormData) => { try { @@ -142,6 +153,7 @@ const GPUService: React.FC = () => { const columns = useInstancesColumns({ handleSelect, + clusterList, sortOrder });