chore: add models and gpus in cluster detail page

src/pages/llmodels/components/instance-item.tsx

@@ -526,6 +526,8 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
         is_main: false,
         vram: calcTotalVram(item.computed_resource_claim?.vram || {}),
         gpu_index: _.keys(item.computed_resource_claim?.vram)
+          .map((i: string) => Number(i))
+          .sort((a: number, b: number) => a - b)
       };
     });
 

src/pages/llmodels/components/table-list.tsx

@@ -17,7 +17,7 @@ import PageBox from '@/pages/_components/page-box';
 import useNoResourceResult from '@/pages/llmodels/hooks/use-no-resource-result';
 import { handleBatchRequest } from '@/utils';
 import { DownOutlined, SearchOutlined, SyncOutlined } from '@ant-design/icons';
-import { useIntl, useNavigate } from '@umijs/max';
+import { useIntl, useNavigate, useSearchParams } from '@umijs/max';
 import { useMemoizedFn } from 'ahooks';
 import { Button, Input, Space, message } from 'antd';
 import { useAtom } from 'jotai';
@@ -139,6 +139,8 @@ const Models: React.FC<ModelsProps> = ({
     getWorkerList,
     workerList
   } = useFormInitialValues();
+  const [searchParams] = useSearchParams();
+  const page = searchParams.get('page');
   const { saveScrollHeight, restoreScrollHeight } = useBodyScroll();
   const [updateFormInitials, setUpdateFormInitials] = useState<{
     data: any;
@@ -656,18 +658,20 @@ const Models: React.FC<ModelsProps> = ({
                 onChange={handleCategoryChange}
                 options={modelCategories.filter((item) => item.value)}
               ></BaseSelect>
-              <BaseSelect
-                allowClear
-                showSearch={false}
-                placeholder={intl.formatMessage({
-                  id: 'clusters.filterBy.cluster'
-                })}
-                style={{ width: 160 }}
-                size="large"
-                maxTagCount={1}
-                onChange={handleClusterChange}
-                options={clusterList}
-              ></BaseSelect>
+              {page !== 'clusters' && (
+                <BaseSelect
+                  allowClear
+                  showSearch={false}
+                  placeholder={intl.formatMessage({
+                    id: 'clusters.filterBy.cluster'
+                  })}
+                  style={{ width: 160 }}
+                  size="large"
+                  maxTagCount={1}
+                  onChange={handleClusterChange}
+                  options={clusterList}
+                ></BaseSelect>
+              )}
               <BaseSelect
                 allowClear
                 showSearch={false}
@@ -690,21 +694,23 @@ const Models: React.FC<ModelsProps> = ({
           }
           right={
             <Space size={20}>
-              <DropDownActions
-                menu={{
-                  items: sourceOptions,
-                  onClick: handleClickDropdown
-                }}
-                placement="bottomRight"
-              >
-                <Button
-                  icon={<DownOutlined></DownOutlined>}
-                  type="primary"
-                  iconPlacement="end"
+              {page !== 'clusters' && (
+                <DropDownActions
+                  menu={{
+                    items: sourceOptions,
+                    onClick: handleClickDropdown
+                  }}
+                  placement="bottomRight"
                 >
-                  {intl?.formatMessage?.({ id: 'models.button.deploy' })}
-                </Button>
-              </DropDownActions>
+                  <Button
+                    icon={<DownOutlined></DownOutlined>}
+                    type="primary"
+                    iconPlacement="end"
+                  >
+                    {intl?.formatMessage?.({ id: 'models.button.deploy' })}
+                  </Button>
+                </DropDownActions>
+              )}
               <DropdownButtons
                 items={ButtonList}
                 extra={

src/pages/llmodels/index.tsx

@@ -16,7 +16,7 @@ import {
 import TableList from './components/table-list';
 import { ListItem } from './config/types';
 
-const Models: React.FC = () => {
+const Models: React.FC<{ clusterId?: number }> = ({ clusterId }) => {
   const { sortOrder, handleMultiSortChange } = useTableMultiSort();
   const { setChunkRequest, createAxiosToken } = useSetChunkRequest();
   const { setChunkRequest: setModelInstanceChunkRequest } =
@@ -45,7 +45,7 @@ const Models: React.FC = () => {
     page: 1,
     perPage: 10,
     search: '',
-    cluster_id: 0,
+    cluster_id: clusterId || 0,
     categories: [],
     state: '',
     sort_by: ''