pucmnw7fs
/
gpustack
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 表格展开项字段对接完成

Browse Source
main
陈博文 8 months ago
parent 45850ac8eb
commit 0dcfc2776c
6 changed files with 126 additions and 120 deletions
Show Stats Download Patch File Download Diff File

2
.env
Unescape View File

@ -1,4 +1,4 @@
PORT=9000
UMI_DEV_SERVER_COMPRESS=none
DID_YOU_KNOW=none
PROXY_HOST=http://39.104.50.181:59998
PROXY_HOST=http://172.16.100.14:24036

60
src/pages/dashboard/components/active-table.tsx
Unescape View File

@ -8,21 +8,6 @@ import { Button, Col, Flex, Row, Table } from 'antd';
import { memo, useContext } from 'react';
import { DashboardContext } from '../config/dashboard-context';
const nodes = [
{
ip: '192.168.2.14',
gpus: ['NVIDIA GeForce RTX 4090 D', 'NVIDIA GeForce RTX 4060 D'],
cpu: '2核',
memory: '15.0GB / 0'
},
{
ip: '192.168.2.15',
gpus: ['NVIDIA GeForce RTX 4080 D'],
cpu: '2核',
memory: '16.6GB / 0'
}
];
const NACategories = [
modelCategoriesMap.llm,
modelCategoriesMap.embedding,
@ -108,45 +93,48 @@ const ActiveTable = () => {
rowKey="id"
expandable={{
defaultExpandAllRows: true,
rowExpandable: (record) => record?.instance_infos?.length > 0,
expandedRowRender: (record) => (
<Flex style={{ padding: '8px 0' }} vertical={true} gap={10}>
{nodes.map((node, index) => (
{record?.instance_infos?.map((node: any, index: number) => (
<Row key={index}>
<Col flex="1">节点：{node.ip}</Col>
<Col flex="1">节点：{node.worker_ip}</Col>
<Col flex="2">
<Row wrap={false}>
<div style={{ whiteSpace: 'nowrap' }}>使用显卡：</div>
<div>
{' '}
{node.gpus.map((gpu, i) => (
{node?.gpu_names?.map((gpu: any, i: number) => (
<div key={i}>
{' '}
{gpu}
{i < node.gpus.length - 1 && '、'}{' '}
{i < node.gpu_names.length - 1 && '、'}
</div>
))}
</div>
</Row>
</Col>
<Col flex="1">分配CPU：{node.cpu}</Col>
<Col flex="1">分配显存/内存：{node.memory}</Col>
<Col flex="1">
分配显存/内存：
{convertFileSize(node?.vram || 0)} /{' '}
{convertFileSize(node?.ram || 0)}
</Col>
</Row>
))}
</Flex>
),
expandIcon: ({ expanded, onExpand, record }) => (
<Button
type="text"
size="small"
onClick={(e) => onExpand(record, e)}
>
<IconFont
type="icon-down"
rotate={expanded ? 0 : -90}
style={{ fontSize: '12px' }}
></IconFont>
</Button>
)
expandIcon: ({ expanded, onExpand, record }) =>
record?.instance_infos?.length > 0 ? (
<Button
type="text"
size="small"
onClick={(e) => onExpand(record, e)}
>
<IconFont
type="icon-down"
rotate={expanded ? 0 : -90}
style={{ fontSize: '12px' }}
/>
</Button>
) : null
}}
/>
</div>

30
src/pages/llmodels/components/instance-item.tsx
Unescape View File

@ -648,25 +648,35 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
</span>
</Col> */}
<Col span={13}>
<Row align={'middle'}>
<Col flex="1">节点：{node.ip}</Col>
<Col flex="2">
<Row align={'middle'} wrap={false}>
<Row>
<Col flex="1">节点：{instanceData.worker_ip}</Col>
<Col flex="1.5">
<Row wrap={false}>
<div style={{ whiteSpace: 'nowrap' }}>使用显卡：</div>
<div>
{' '}
{node.gpus.map((gpu, i) => (
{instanceData?.gpu_names?.map((gpu: any, i: number) => (
<div key={i}>
{' '}
{gpu}
{i < node.gpus.length - 1 && '、'}{' '}
{i < instanceData?.gpu_names?.length - 1 && '、'}
</div>
))}
</div>
</Row>
</Col>
<Col flex="1">分配CPU：{node.cpu}</Col>
<Col flex="1">分配显存/内存：{node.memory}</Col>
<Col flex="1">
分配显存/内存：
{convertFileSize(
instanceData?.computed_resource_claim?.ram || 0
)}{' '}
/{' '}
{convertFileSize(
(
Object.values(
instanceData?.computed_resource_claim?.vram || {}
) as number[]
).reduce((acc, curr) => acc + curr, 0)
)}
</Col>
</Row>
</Col>
<Col span={4}>

1
src/pages/llmodels/config/types.ts
Unescape View File

@ -98,6 +98,7 @@ export interface ModelInstanceListItem {
s3_address: string;
worker_id: number;
gpu_indexes?: number[];
gpu_names: string[];
worker_ip: string;
gpu_index: number;
pid: number;

71
src/pages/resources/components/gpus.tsx
Unescape View File

@ -12,24 +12,8 @@ import _ from 'lodash';
import React from 'react';
import { GPU_DEVICES_API, queryGpuDevicesList } from '../apis';
import { GPUDeviceItem } from '../config/types';
const { Column } = Table;
const nodes = [
{
taskName: 'qwen3-0.6b-hhf',
cpu: 2,
memory: 0,
gpuMemory: '12GB',
createdAt: '2025-08-12 15:24:54'
},
{
taskName: 'qwen2.5-vl-7b-instruct-test-uds',
cpu: 2,
memory: 10,
gpuMemory: '24GB',
createdAt: '2025-08-12 15:24:54'
}
];
const { Column } = Table;
const fieldList = [
{
@ -128,14 +112,28 @@ const GPUList: React.FC = () => {
key={dataSource.dataList?.map((e) => e.id)?.join('、') || 0}
expandable={{
defaultExpandAllRows: true,
expandedRowRender: (record) => (
rowExpandable: (record) => record?.model_instances?.length > 0,
expandedRowRender: (record: any) => (
<Flex style={{ padding: '8px 0' }} vertical={true} gap={10}>
{nodes.map((node, index) => (
{record?.model_instances?.map((node: any, index: number) => (
<Row key={index}>
<Col flex="1">运行模型：{node.taskName}</Col>
<Col flex="1">分配CPU：{node.cpu}核</Col>
<Col flex="1">分配内存：{node.memory}</Col>
<Col flex="1">分配显存：{node.gpuMemory}</Col>
<Col flex="1">运行模型：{node.model_name}</Col>
<Col flex="1">
分配内存：
{convertFileSize(
node?.computed_resource_claim?.ram || 0
)}
</Col>
<Col flex="1">
分配显存:{' '}
{convertFileSize(
(
Object.values(
node?.computed_resource_claim?.vram || {}
) as number[]
).reduce((acc, curr) => acc + curr, 0)
)}
</Col>
<Col flex="61px">
<Button type="link" href="#/models/deployments">
管理
@ -145,19 +143,20 @@ const GPUList: React.FC = () => {
))}
</Flex>
),
expandIcon: ({ expanded, onExpand, record }) => (
<Button
type="text"
size="small"
onClick={(e) => onExpand(record, e)}
>
<IconFont
type="icon-down"
rotate={expanded ? 0 : -90}
style={{ fontSize: '12px' }}
></IconFont>
</Button>
)
expandIcon: ({ expanded, onExpand, record }) =>
record?.model_instances?.length > 0 ? (
<Button
type="text"
size="small"
onClick={(e) => onExpand(record, e)}
>
<IconFont
type="icon-down"
rotate={expanded ? 0 : -90}
style={{ fontSize: '12px' }}
/>
</Button>
) : null
}}
>
<Column

82
src/pages/resources/components/workers.tsx
Unescape View File

@ -28,6 +28,7 @@ import {
message
} from 'antd';
import _ from 'lodash';
import moment from 'moment';
import React, { useCallback, useState } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import {
@ -41,23 +42,6 @@ import { Filesystem, GPUDeviceItem, ListItem } from '../config/types';
import AddWorker from './add-worker';
import UpdateLabels from './update-labels';
const nodes = [
{
taskName: 'qwen3-0.6b-hhf',
cpu: 2,
memory: 0,
gpuMemory: '12GB',
createdAt: '2025-08-12 15:24:54'
},
{
taskName: 'qwen2.5-vl-7b-instruct-test-uds',
cpu: 2,
memory: 10,
gpuMemory: '24GB',
createdAt: '2025-08-12 15:24:54'
}
];
const { Column } = Table;
const fieldList = [
@ -230,6 +214,8 @@ const Workers: React.FC = () => {
enabled: !open
});
console.log(dataSource.dataList, 'data');
return (
<>
<PageContainer
@ -274,15 +260,36 @@ const Workers: React.FC = () => {
key={dataSource.dataList?.map((e) => e.id)?.join('、') || 0}
expandable={{
defaultExpandAllRows: true,
expandedRowRender: (record) => (
rowExpandable: (record) => record?.model_instances?.length > 0,
expandedRowRender: (record: any) => (
<Flex style={{ padding: '8px 0' }} vertical={true} gap={10}>
{nodes.map((node, index) => (
{record?.model_instances?.map((node: any, index: number) => (
<Row key={index}>
<Col flex="1">任务名称：{node.taskName}</Col>
<Col flex="1">分配CPU：{node.cpu}核</Col>
<Col flex="1">分配内存：{node.memory}</Col>
<Col flex="1">分配显存：{node.gpuMemory}</Col>
<Col flex="1">创建时间：{node.createdAt}</Col>
<Col flex="1">任务名称：{node.name}</Col>
<Col flex="1">
分配内存：
{convertFileSize(
node?.computed_resource_claim?.ram || 0
)}
</Col>
<Col flex="1">
分配显存:{' '}
{convertFileSize(
(
Object.values(
node?.computed_resource_claim?.vram || {}
) as number[]
).reduce((acc, curr) => acc + curr, 0)
)}
</Col>
<Col flex="1">
创建时间：
{node?.last_restart_time
? moment(node?.last_restart_time).format(
'YYYY-MM-DD HH:mm:ss'
)
: '--'}
</Col>
<Col flex="61px">
<Button type="link" href="#/models/deployments">
管理
@ -292,19 +299,20 @@ const Workers: React.FC = () => {
))}
</Flex>
),
expandIcon: ({ expanded, onExpand, record }) => (
<Button
type="text"
size="small"
onClick={(e) => onExpand(record, e)}
>
<IconFont
type="icon-down"
rotate={expanded ? 0 : -90}
style={{ fontSize: '12px' }}
></IconFont>
</Button>
)
expandIcon: ({ expanded, onExpand, record }) =>
record?.model_instances?.length > 0 ? (
<Button
type="text"
size="small"
onClick={(e) => onExpand(record, e)}
>
<IconFont
type="icon-down"
rotate={expanded ? 0 : -90}
style={{ fontSize: '12px' }}
/>
</Button>
) : null
}}
>
<Column

Write Preview
Loading…
Cancel
Save