fix: gpu selector height
This commit is contained in:
+7
-2
@@ -638,10 +638,15 @@ body {
|
|||||||
inset: 53px auto auto 0 !important;
|
inset: 53px auto auto 0 !important;
|
||||||
border-radius: 0 0 var(--border-radius-base) var(--border-radius-base);
|
border-radius: 0 0 var(--border-radius-base) var(--border-radius-base);
|
||||||
border-top: none;
|
border-top: none;
|
||||||
max-height: 240px;
|
.ant-cascader-menus {
|
||||||
min-height: 100px;
|
align-items: stretch;
|
||||||
|
}
|
||||||
|
|
||||||
&.gpu-selector {
|
&.gpu-selector {
|
||||||
|
.ant-cascader-menu {
|
||||||
|
max-height: 400px;
|
||||||
|
height: unset;
|
||||||
|
}
|
||||||
.ant-cascader-menu:last-child {
|
.ant-cascader-menu:last-child {
|
||||||
flex: auto;
|
flex: auto;
|
||||||
|
|
||||||
|
|||||||
@@ -124,6 +124,23 @@ const Instance: React.FC = () => {
|
|||||||
</Flex>
|
</Flex>
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
label: intl.formatMessage({ id: 'models.form.env' }),
|
||||||
|
children: (
|
||||||
|
<Flex gap={8} wrap="wrap">
|
||||||
|
{instanceData?.env
|
||||||
|
? Object.entries(instanceData?.env || {}).map(
|
||||||
|
([key, value], index: number) => (
|
||||||
|
<Tag key={index} style={{ margin: 0 }}>
|
||||||
|
{`${key}=${value}`}
|
||||||
|
</Tag>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
: '-'}
|
||||||
|
</Flex>
|
||||||
|
)
|
||||||
|
},
|
||||||
{
|
{
|
||||||
key: '4',
|
key: '4',
|
||||||
label: intl.formatMessage({
|
label: intl.formatMessage({
|
||||||
@@ -159,23 +176,6 @@ const Instance: React.FC = () => {
|
|||||||
)}
|
)}
|
||||||
</Flex>
|
</Flex>
|
||||||
)
|
)
|
||||||
},
|
|
||||||
{
|
|
||||||
key: '2',
|
|
||||||
label: intl.formatMessage({ id: 'models.form.env' }),
|
|
||||||
children: (
|
|
||||||
<Flex gap={8} wrap="wrap">
|
|
||||||
{instanceData?.env
|
|
||||||
? Object.entries(instanceData?.env || {}).map(
|
|
||||||
([key, value], index: number) => (
|
|
||||||
<Tag key={index} style={{ margin: 0 }}>
|
|
||||||
{`${key}=${value}`}
|
|
||||||
</Tag>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
: '-'}
|
|
||||||
</Flex>
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
}, [detailData]);
|
}, [detailData]);
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import { convertFileSize } from '@/utils';
|
import { convertFileSize } from '@/utils';
|
||||||
import { AutoTooltip } from '@gpustack/core-ui';
|
import { AutoTooltip } from '@gpustack/core-ui';
|
||||||
import { useIntl } from '@umijs/max';
|
import { useIntl } from '@umijs/max';
|
||||||
import _ from 'lodash';
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
import '../style/gpu-card.less';
|
import '../style/gpu-card.less';
|
||||||
@@ -24,6 +23,7 @@ const ItemInfo = styled.div`
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
white-space: break-spaces;
|
white-space: break-spaces;
|
||||||
|
font-size: 13px;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const Description = styled.div`
|
const Description = styled.div`
|
||||||
@@ -76,7 +76,7 @@ const GPUCard: React.FC<{
|
|||||||
/ {convertFileSize(data?.memory?.total || 0)}
|
/ {convertFileSize(data?.memory?.total || 0)}
|
||||||
</span>
|
</span>
|
||||||
</ItemInfo>
|
</ItemInfo>
|
||||||
<ItemInfo>
|
{/* <ItemInfo>
|
||||||
<span>
|
<span>
|
||||||
{intl.formatMessage({ id: 'resources.table.gpuutilization' })}
|
{intl.formatMessage({ id: 'resources.table.gpuutilization' })}
|
||||||
:{' '}
|
:{' '}
|
||||||
@@ -85,7 +85,7 @@ const GPUCard: React.FC<{
|
|||||||
? _.round(data?.memory?.utilization_rate || 0, 2)
|
? _.round(data?.memory?.utilization_rate || 0, 2)
|
||||||
: _.round(data.memory?.allocated / data.memory?.total, 2) * 100}
|
: _.round(data.memory?.allocated / data.memory?.total, 2) * 100}
|
||||||
%
|
%
|
||||||
</ItemInfo>
|
</ItemInfo> */}
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -175,7 +175,7 @@ const ScheduleTypeForm: React.FC = () => {
|
|||||||
<SealCascader
|
<SealCascader
|
||||||
required
|
required
|
||||||
showSearch
|
showSearch
|
||||||
expandTrigger="hover"
|
expandTrigger="click"
|
||||||
multiple={
|
multiple={
|
||||||
form.getFieldValue('backend') !== backendOptionsMap.voxBox
|
form.getFieldValue('backend') !== backendOptionsMap.voxBox
|
||||||
}
|
}
|
||||||
@@ -184,6 +184,13 @@ const ScheduleTypeForm: React.FC = () => {
|
|||||||
root: 'cascader-popup-wrapper gpu-selector'
|
root: 'cascader-popup-wrapper gpu-selector'
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
styles={{
|
||||||
|
popup: {
|
||||||
|
listItem: {
|
||||||
|
maxWidth: 'unset'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}}
|
||||||
maxTagCount={1}
|
maxTagCount={1}
|
||||||
label={intl.formatMessage({ id: 'models.form.gpuselector' })}
|
label={intl.formatMessage({ id: 'models.form.gpuselector' })}
|
||||||
options={gpuOptions}
|
options={gpuOptions}
|
||||||
|
|||||||
@@ -59,7 +59,7 @@ const Organizations: React.FC = () => {
|
|||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
<div style={{ textAlign: 'center' }}>
|
<div style={{ textAlign: 'center', marginTop: 56 }}>
|
||||||
<Button
|
<Button
|
||||||
type="primary"
|
type="primary"
|
||||||
href="https://gpustack.ai/enterprise"
|
href="https://gpustack.ai/enterprise"
|
||||||
|
|||||||
Reference in New Issue
Block a user