root/gpustack-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: backend list styles

Browse Source
This commit is contained in:
jialin
2025-10-13 14:40:26 +08:00
parent 0dfe77df37
commit eb509166ee
18 changed files with 209 additions and 360 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/seal-form/seal-input.tsx
-1
View File
@@ -67,7 +67,6 @@ const SealInput: React.FC<InputProps & SealFormItemProps> = (props) => {
if (!inputRef.current?.input?.value) {
setIsFocus(false);
}
props.onChange?.(e);
props.onBlur?.(e);
};
src/locales/en-US/clusters.ts
+2
View File
@@ -42,6 +42,8 @@ export default {
' Please make sure the prerequisites for <a href={link} target="_blank">{label}</a> are met before executing the following command.',
'clusters.create.addCommand.tips':
' On the Worker that needs to be added, run the following command to join it to the cluster.',
'clusters.create.register.tips':
' On the Kubernetes cluster that needs to be added, run the following command to join its nodes to the cluster.',
'cluster.create.checkEnv.tips':
'Use the following command to check if the environment is ready'
};
src/locales/ja-JP/clusters.ts
+5 -2
View File
@@ -43,7 +43,9 @@ export default {
'clusters.create.addCommand.tips':
' On the Worker that needs to be added, run the following command to join it to the cluster.',
'cluster.create.checkEnv.tips':
'Use the following command to check if the environment is ready'
'Use the following command to check if the environment is ready',
'clusters.create.register.tips':
' On the Kubernetes cluster that needs to be added, run the following command to join its nodes to the cluster.'
};
// ========== To-Do: Translate Keys (Remove After Translation) ==========
@@ -87,6 +89,7 @@ export default {
// 38. 'clusters.workerpool.batchSize.desc': 'Number of workers created simultaneously in the Worker pool',
// 39. 'clusters.create.addworker.tips': ' Please make sure the prerequisites for <a href={link} target="_blank">{label}</a> are met before executing the following command.',
// 40. 'clusters.create.addCommand.tips': ' On the Worker that needs to be added, run the following command to join it to the cluster.',
// 41. 'cluster.create.checkEnv.tips': 'Use the following command to check if the environment is ready'
// 41. 'cluster.create.checkEnv.tips': 'Use the following command to check if the environment is ready',
// 42. 'clusters.create.register.tips': ' On the Kubernetes cluster that needs to be added, run the following command to join its nodes to the cluster.'
// ========== End of To-Do List ==========
src/locales/ru-RU/clusters.ts
+4 -2
View File
@@ -43,9 +43,11 @@ export default {
'clusters.create.addCommand.tips':
'На воркере, который необходимо добавить, выполните следующую команду, чтобы присоединить его к кластеру.',
'cluster.create.checkEnv.tips':
'Используйте следующую команду для проверки готовности окружения'
'Используйте следующую команду для проверки готовности окружения',
'clusters.create.register.tips':
' On the Kubernetes cluster that needs to be added, run the following command to join its nodes to the cluster.'
};
// ========== To-Do: Translate Keys (Remove After Translation) ==========
// 1. 'clusters.create.register.tips': ' On the Kubernetes cluster that needs to be added, run the following command to join its nodes to the cluster.',
// ========== End of To-Do List ==========
src/locales/zh-CN/clusters.ts
+2
View File
@@ -41,5 +41,7 @@ export default {
'在执行以下命令之前，请确保已满足 <a href={link} target="_blank">{label}</a> 的先决条件。',
'clusters.create.addCommand.tips':
' 在需要添加的 Worker 上运行以下命令，将其加入到集群中',
'clusters.create.register.tips':
' 在需要添加的 Kubernetes 集群上运行以下命令，将其中的节点加入到集群中',
'cluster.create.checkEnv.tips': '使用以下命令检查环境是否准备妥当'
};
src/pages/backends/components/backend-card.tsx
+26 -17
View File
@@ -1,3 +1,4 @@
import AutoTooltip from '@/components/auto-tooltip';
import DropDownActions from '@/components/drop-down-actions';
import IconFont from '@/components/icon-font';
import ThemeTag from '@/components/tags-wrapper/theme-tag';
@@ -12,7 +13,7 @@ import {
builtInBackendLogos,
customColors,
customIcons,
gpuColorMap
getGpuColor
} from '../config';
import { ListItem } from '../config/types';
@@ -125,7 +126,7 @@ const BackendCard: React.FC<BackendCardProps> = ({ data, onSelect }) => {
if (data.is_build_in) {
return backendActions.filter((item) => item.key !== 'delete');
}
return backendActions;
return backendActions.filter((item) => item.key !== 'view_versions');
}, [data.is_build_in]);
const onClick = (e: React.MouseEvent) => {
@@ -146,19 +147,21 @@ const BackendCard: React.FC<BackendCardProps> = ({ data, onSelect }) => {
<IconFont className="icon" type="icon-gpu1" />
<span>Supported Frameworks: </span>
</span>
<BackendBox>
{backendList.map((item: string) => {
return (
<ThemeTag
key={item}
style={{ marginRight: 0 }}
color={gpuColorMap[item] || 'default'}
>
{item}
</ThemeTag>
);
})}
</BackendBox>
<AutoTooltip ghost maxWidth={'100%'}>
<BackendBox>
{_.take(backendList, 3).map((item: string) => {
return (
<ThemeTag
key={item}
style={{ marginRight: 0 }}
color={getGpuColor(item)}
>
{item}
</ThemeTag>
);
})}
</BackendBox>
</AutoTooltip>
</>
);
}
@@ -169,7 +172,13 @@ const BackendCard: React.FC<BackendCardProps> = ({ data, onSelect }) => {
<span>Default Image: </span>
</span>
<span className="text">
{_.get(data, ['version_configs', data.default_version, 'image_name'])}
<AutoTooltip ghost maxWidth={'100%'}>
{_.get(data, [
'version_configs',
data.default_version,
'image_name'
])}
</AutoTooltip>
</span>
</>
);
@@ -178,7 +187,7 @@ const BackendCard: React.FC<BackendCardProps> = ({ data, onSelect }) => {
return (
<Card
onClick={handleClick}
clickable={false}
clickable={true}
hoverable={true}
disabled={false}
height={160}
src/pages/backends/components/view-builtin-versions-modal.tsx
+76
View File
@@ -0,0 +1,76 @@
import ScrollerModal from '@/components/scroller-modal';
import { Form } from 'antd';
import { useEffect } from 'react';
import BuiltinVersions from '../forms/built-in-versions';
interface ViewBuiltinVersionsModalProps {
open?: boolean;
currentData?: any;
onClose?: () => void;
}
const ViewBuiltinVersionsModal: React.FC<ViewBuiltinVersionsModalProps> = ({
open,
currentData,
onClose
}) => {
const [form] = Form.useForm();
useEffect(() => {
if (open && currentData) {
const builtInVersions = Object.keys(
currentData.build_in_version_configs || {}
).map((key) => ({
version_no: key,
image_name: currentData.build_in_version_configs[key].image_name,
run_command: currentData.build_in_version_configs[key].run_command,
is_default: key === currentData.default_version,
backend_list:
currentData.build_in_version_configs[key].backend_list || [],
is_built_in: true
}));
form.setFieldsValue({
build_in_version_configs: builtInVersions
});
}
}, [open, currentData, form]);
return (
<ScrollerModal
open={open}
style={{
top: '20%'
}}
title="View Built-in Versions"
width={550}
destroyOnHidden
closable={true}
maskClosable={false}
onOk={onClose}
onCancel={onClose}
styles={{
content: {
padding: '0 0 16px 0'
},
header: {
padding: 'var(--ant-modal-content-padding)',
paddingBottom: '0'
},
body: {
padding: '16px 24px 32px'
},
footer: {
padding: '16px 24px',
margin: '0'
}
}}
footer={null}
>
<Form form={form}>
<BuiltinVersions />
</Form>
</ScrollerModal>
);
};
export default ViewBuiltinVersionsModal;
src/pages/backends/config/index.ts
+13
View File
@@ -101,6 +101,19 @@ export const gpuColorMap: Record<string, string> = {
corex: 'purple'
};
export const getGpuColor = (gpuType: string) => {
if (!gpuType) return 'default';
if (gpuType.includes('cann')) return gpuColorMap['cann'];
if (gpuType.includes('cuda')) return gpuColorMap['cuda'];
if (gpuType.includes('rocm')) return gpuColorMap['rocm'];
if (gpuType.includes('dtk')) return gpuColorMap['dtk'];
if (gpuType.includes('musa')) return gpuColorMap['musa'];
if (gpuType.includes('corex')) return gpuColorMap['corex'];
return 'default';
};
export const customIcons = ['∑', '∏', '∫', '∂', '∞', 'θ', '∆', '∇'];
export const backendFields = [
src/pages/backends/forms/built-in-versions.tsx
+2 -2
View File
@@ -1,7 +1,7 @@
import ThemeTag from '@/components/tags-wrapper/theme-tag';
import { Divider, Form } from 'antd';
import styled from 'styled-components';
import { gpuColorMap } from '../config';
import { getGpuColor } from '../config';
const ItemWrapper = styled.div`
display: flex;
@@ -62,7 +62,7 @@ const VersionItem: React.FC<VersionItemProps> = ({ data }) => {
<ThemeTag
key={item}
style={{ marginRight: 0 }}
color={gpuColorMap[item] || 'default'}
color={getGpuColor(item)}
>
{item}
</ThemeTag>
src/pages/backends/forms/versions-config.tsx
+30 -1
View File
@@ -2,6 +2,7 @@ import SealInput from '@/components/seal-form/seal-input';
import { PageActionType } from '@/config/types';
import { MinusOutlined, PlusOutlined } from '@ant-design/icons';
import { Button, Divider, Form, Radio } from 'antd';
import _ from 'lodash';
import React, { useEffect } from 'react';
import styled from 'styled-components';
import { ListItem } from '../config/types';
@@ -20,6 +21,13 @@ const ActionWrapper = styled.div`
margin-top: 24px;
`;
const Label = styled.div`
line-height: 1;
color: var(--ant-color-text-tertiary);
margin-bottom: 20px;
font-size: var(--font-size-base);
`;
const ItemWrapper = styled.div``;
type AddModalProps = {
@@ -28,6 +36,7 @@ type AddModalProps = {
};
const VersionsForm: React.FC<AddModalProps> = ({ action, currentData }) => {
const form = Form.useFormInstance();
const version_configs = Form.useWatch('version_configs', form);
const versionList = [
{
version_no: '',
@@ -47,6 +56,26 @@ const VersionsForm: React.FC<AddModalProps> = ({ action, currentData }) => {
form.setFieldValue('version_configs', updatedVersions);
};
const handleVersionOnBlur = (
e: React.FocusEvent<HTMLInputElement>,
index: number
) => {
const inputValue = e.target.value.trim() || '';
const versions = form.getFieldValue('version_configs') || [];
console.log('inputValue:', version_configs, currentData);
const isDuplicate =
_.get(currentData, ['build_in_version_configs', inputValue]) ||
versions.some(
(version: any, idx: number) =>
version?.version_no === inputValue && idx !== index
);
if (isDuplicate) {
const updatedVersions = [...versions];
updatedVersions[index].version_no = '';
form.setFieldValue('version_configs', updatedVersions);
}
};
useEffect(() => {
const versions = form.getFieldValue('version_configs') || [];
console.log('versions:', versions);
@@ -58,7 +87,6 @@ const VersionsForm: React.FC<AddModalProps> = ({ action, currentData }) => {
return (
<Form.List name="version_configs">
{(fields, { add, remove }) => {
console.log('fields:', fields);
return (
<div
style={{
@@ -67,6 +95,7 @@ const VersionsForm: React.FC<AddModalProps> = ({ action, currentData }) => {
padding: '14px'
}}
>
<Label>Custom Versions</Label>
{fields.map(({ key, name, ...restField }, index) => (
<ItemWrapper key={key}>
<Box>
src/pages/backends/list.tsx
+21
View File
@@ -17,6 +17,7 @@ import {
} from './apis';
import AddModal from './components/add-modal';
import BackendCardList from './components/backend-list';
import ViewBuiltinVersionsModal from './components/view-builtin-versions-modal';
import { json2Yaml, yaml2Json } from './config';
import { FormData, ListItem } from './config/types';
import useExportYAML from './hooks/use-export-yaml';
@@ -53,6 +54,11 @@ const BackendList = () => {
action: PageActionType;
currentData?: Partial<ListItem>;
}>({ open: false, action: 'create' });
const [openViewBuiltinVersionsModal, setOpenViewBuiltinVersionsModal] =
useState<{
open: boolean;
currentData?: Partial<ListItem>;
}>({ open: false });
// build_in_version_configs is read-only, but needs to be included when updating
const handleOnSubmit = async (values: FormData) => {
@@ -129,6 +135,11 @@ const BackendList = () => {
// Export YAML action
console.log('Export YAML for:', item.data);
exportYAML(item.data);
} else if (item.action === 'view_versions') {
setOpenViewBuiltinVersionsModal({
open: true,
currentData: item.data
});
}
};
@@ -180,6 +191,16 @@ const BackendList = () => {
: 'Edit Backend'
}
></AddModal>
<ViewBuiltinVersionsModal
open={openViewBuiltinVersionsModal.open}
currentData={openViewBuiltinVersionsModal.currentData as ListItem}
onClose={() =>
setOpenViewBuiltinVersionsModal({
open: false,
currentData: undefined
})
}
></ViewBuiltinVersionsModal>
<DeleteModal ref={modalRef}></DeleteModal>
</PageContainer>
);
src/pages/cluster-management/components/add-worker-step.tsx
+13 -5
View File
@@ -111,13 +111,21 @@ const AddWorkerStep: React.FC<AddModalProps> = ({
1. {intl.formatMessage({ id: 'cluster.create.checkEnv.tips' })}
</div>
<CheckEnvCommand provider={provider} currentGPU={currentGPU} />
<div className="command-info">
2. {intl.formatMessage({ id: 'clusters.create.addCommand.tips' })}
</div>
{provider === ProviderValueMap.Kubernetes ? (
<RegisterClusterInner registrationInfo={registrationInfo} />
<>
<div className="command-info">
2. {intl.formatMessage({ id: 'clusters.create.register.tips' })}
</div>
<RegisterClusterInner registrationInfo={registrationInfo} />
</>
) : (
<AddWorkerCommand registrationInfo={registrationInfo} />
<>
<div className="command-info">
2. {intl.formatMessage({ id: 'clusters.create.addCommand.tips' })}
</div>
<AddWorkerCommand registrationInfo={registrationInfo} />
</>
)}
</Container>
);
src/pages/llmodels/components/advance-config.tsx
-318
View File
@@ -1,318 +0,0 @@
import IconFont from '@/components/icon-font';
import LabelSelector from '@/components/label-selector';
import CheckboxField from '@/components/seal-form/checkbox-field';
import SealSelect from '@/components/seal-form/seal-select';
import TooltipList from '@/components/tooltip-list';
import { PageActionType } from '@/config/types';
import { useIntl } from '@umijs/max';
import { Collapse, Form, FormInstance } from 'antd';
import _ from 'lodash';
import { useCallback, useMemo } from 'react';
import {
getBackendParamsTips,
modelCategories,
placementStrategyOptions,
ScheduleValueMap
} from '../config';
import BackendParameters, {
backendOptionsMap
} from '../config/backend-parameters';
import { useFormContext } from '../config/form-context';
import { FormData } from '../config/types';
import Backend from '../forms/backend';
import BackendParametersList from '../forms/backend-parameters-list';
import Performance from '../forms/performance';
import dataformStyles from '../style/data-form.less';
interface AdvanceConfigProps {
isGGUF: boolean;
form: FormInstance;
gpuOptions: Array<any>;
action: PageActionType;
source: string;
}
const placementStrategyTips = [
{
title: 'Spread',
tips: 'resources.form.spread.tips'
},
{
title: 'Binpack',
tips: 'resources.form.binpack.tips'
}
];
const AdvanceConfig = () => {
const intl = useIntl();
const form = Form.useFormInstance();
const wokerSelector = Form.useWatch('worker_selector', form);
const EnviromentVars = Form.useWatch('env', form);
const scheduleType = Form.useWatch('scheduleType', form);
const backend = Form.useWatch('backend', form);
const backend_parameters = Form.useWatch('backend_parameters', form);
const categories = Form.useWatch('categories', form);
const backend_version = Form.useWatch('backend_version', form);
const placement_strategy = Form.useWatch('placement_strategy', form);
const gpuSelectorIds = Form.useWatch(['gpu_selector', 'gpu_ids'], form);
const worker_selector = Form.useWatch('worker_selector', form);
const { onValuesChange, gpuOptions, source, isGGUF } = useFormContext();
const paramsConfig = useMemo(() => {
return _.get(BackendParameters, backend, []);
}, [backend]);
const backendParamsTips = useMemo(() => {
return getBackendParamsTips(backend);
}, [backend]);
const handleWorkerLabelsChange = useCallback(
(labels: Record<string, any>) => {
form.setFieldValue('worker_selector', labels);
},
[]
);
const handleEnviromentVarsChange = useCallback(
(labels: Record<string, any>) => {
form.setFieldValue('env', labels);
},
[]
);
const handleBackendParametersChange = useCallback((list: string[]) => {
form.setFieldValue('backend_parameters', list);
}, []);
const handleBackendParametersOnBlur = () => {
onValuesChange?.({}, form.getFieldsValue());
};
const handleDeleteBackendParameters = (index: number) => {
onValuesChange?.({}, form.getFieldsValue());
};
const onSelectorChange = (field: string, allowEmpty?: boolean) => {
const workerSelector = form.getFieldValue(field);
// check if all keys have values
const hasEmptyValue = _.some(_.keys(workerSelector), (k: string) => {
return !workerSelector[k];
});
if (!hasEmptyValue || allowEmpty) {
onValuesChange?.({}, form.getFieldsValue());
}
};
const handleSelectorOnBlur = () => {
onSelectorChange('worker_selector');
};
const handleDeleteWorkerSelector = (index: number) => {
onValuesChange?.({}, form.getFieldsValue());
};
const handleEnvSelectorOnBlur = () => {
onSelectorChange('env', true);
};
const handleDeleteEnvSelector = (index: number) => {
onValuesChange?.({}, form.getFieldsValue());
};
const collapseItems = useMemo(() => {
const children = (
<>
<Form.Item<FormData> name="categories">
<SealSelect
allowNull
label={intl.formatMessage({
id: 'models.form.categories'
})}
options={modelCategories}
></SealSelect>
</Form.Item>
<Backend></Backend>
{scheduleType === ScheduleValueMap.Auto && (
<>
<Form.Item<FormData> name="placement_strategy">
<SealSelect
label={intl.formatMessage({
id: 'resources.form.placementStrategy'
})}
options={placementStrategyOptions}
description={
<TooltipList list={placementStrategyTips}></TooltipList>
}
></SealSelect>
</Form.Item>
<Form.Item<FormData>
name="worker_selector"
rules={[
({ getFieldValue }) => ({
validator(rule, value) {
if (
getFieldValue('scheduleType') === ScheduleValueMap.Auto &&
_.keys(value).length > 0
) {
if (_.some(_.keys(value), (k: string) => !value[k])) {
return Promise.reject(
intl.formatMessage(
{
id: 'common.validate.value'
},
{
name: intl.formatMessage({
id: 'models.form.selector'
})
}
)
);
}
}
return Promise.resolve();
}
})
]}
>
<LabelSelector
label={intl.formatMessage({
id: 'resources.form.workerSelector'
})}
labels={wokerSelector}
onChange={handleWorkerLabelsChange}
onBlur={handleSelectorOnBlur}
onDelete={handleDeleteWorkerSelector}
description={
<span>
{intl.formatMessage({
id: 'resources.form.workerSelector.description'
})}
</span>
}
></LabelSelector>
</Form.Item>
</>
)}
<BackendParametersList></BackendParametersList>
<Form.Item<FormData> name="env">
<LabelSelector
label={intl.formatMessage({
id: 'models.form.env'
})}
labels={EnviromentVars}
btnText={intl.formatMessage({ id: 'common.button.vars' })}
onBlur={handleEnvSelectorOnBlur}
onDelete={handleDeleteEnvSelector}
onChange={handleEnviromentVarsChange}
></LabelSelector>
</Form.Item>
{scheduleType === ScheduleValueMap.Auto &&
[backendOptionsMap.vllm, backendOptionsMap.ascendMindie].includes(
backend
) && (
<div style={{ paddingBottom: 22, paddingLeft: 10 }}>
<Form.Item<FormData>
name="distributed_inference_across_workers"
valuePropName="checked"
style={{ padding: '0 10px', marginBottom: 0 }}
noStyle
>
<CheckboxField
description={intl.formatMessage({
id: 'models.form.distribution.tips'
})}
label={intl.formatMessage({
id: 'resources.form.enableDistributedInferenceAcrossWorkers'
})}
></CheckboxField>
</Form.Item>
</div>
)}
<div style={{ paddingBottom: 22, paddingLeft: 10 }}>
<Form.Item<FormData>
name="restart_on_error"
valuePropName="checked"
style={{ padding: '0 10px', marginBottom: 0 }}
noStyle
>
<CheckboxField
description={intl.formatMessage({
id: 'models.form.restart.onerror.tips'
})}
label={intl.formatMessage({
id: 'models.form.restart.onerror'
})}
></CheckboxField>
</Form.Item>
</div>
</>
);
return [
{
key: '2',
label: (
<span
style={{ fontWeight: 'var(--font-weight-medium)' }}
className="font-size-14"
>
Performance
</span>
),
forceRender: true,
children: <Performance></Performance>
},
{
key: '1',
label: (
<span
style={{ fontWeight: 'var(--font-weight-medium)' }}
className="font-size-14"
>
{intl.formatMessage({ id: 'resources.form.advanced' })}
</span>
),
forceRender: true,
children
}
];
}, [
form,
source,
intl,
gpuOptions,
paramsConfig,
scheduleType,
wokerSelector,
backend,
backend_parameters,
isGGUF,
categories,
backend_version,
placement_strategy,
gpuSelectorIds,
EnviromentVars,
worker_selector
]);
return (
<Collapse
expandIconPosition="start"
bordered={false}
ghost
accordion
destroyOnHidden={false}
className={dataformStyles['advanced-collapse']}
expandIcon={({ isActive }) => (
<IconFont
type="icon-down"
rotate={isActive ? 0 : -90}
style={{ fontSize: '14px' }}
></IconFont>
)}
items={collapseItems}
></Collapse>
);
};
export default AdvanceConfig;
src/pages/llmodels/components/deploy-builtin-modal.tsx
+1 -1
View File
@@ -20,10 +20,10 @@ import { backendOptionsMap } from '../config/backend-parameters';
import { CatalogFormContext } from '../config/form-context';
import { CatalogSpec, FormData, ListItem, SourceType } from '../config/types';
import { generateGPUIds } from '../config/utils';
import DataForm from '../forms';
import { useCheckCompatibility } from '../hooks';
import useFormInitialValues from '../hooks/use-form-initial-values';
import CompatibilityAlert from './compatible-alert';
import DataForm from './data-form';
const pickFieldsFromSpec = [
'backend_version',
src/pages/llmodels/components/deploy-modal.tsx
+4 -1
View File
@@ -11,6 +11,7 @@ import ColumnWrapper from '../../_components/column-wrapper';
import { defaultFormValues, deployFormKeyMap, modelSourceMap } from '../config';
import { backendOptionsMap } from '../config/backend-parameters';
import { BackendOption, FormData, SourceType } from '../config/types';
import DataForm from '../forms';
import {
MessageStatus,
WarningStausOptions,
@@ -19,7 +20,6 @@ import {
} from '../hooks';
import useCheckBackend from '../hooks/use-check-backend';
import CompatibilityAlert from './compatible-alert';
import DataForm from './data-form';
import GGUFResult from './gguf-result';
import ModelCard from './model-card';
import SearchModel from './search-model';
@@ -488,6 +488,9 @@ const AddModal: FC<AddModalProps> = (props) => {
<FormWrapper>
<ColumnWrapper
paddingBottom={warningStatus.show ? 170 : 50}
styles={{
container: { paddingTop: 0 }
}}
footer={
<>
<CompatibilityAlert
src/pages/llmodels/components/update-modal.tsx
+1 -1
View File
@@ -14,9 +14,9 @@ import {
import { backendOptionsMap } from '../config/backend-parameters';
import { BackendOption, FormData } from '../config/types';
import { generateGPUSelector } from '../config/utils';
import DataForm from '../forms';
import { useCheckCompatibility } from '../hooks';
import CompatibilityAlert from './compatible-alert';
import DataForm from './data-form';
type AddModalProps = {
title: string;
src/pages/llmodels/components/data-form.tsx → src/pages/llmodels/forms/index.tsx
+6 -6
View File
@@ -17,13 +17,13 @@ import {
SourceType
} from '../config/types';
import { generateGPUIds } from '../config/utils';
import CatalogFrom from '../forms/catalog';
import LocalPathSource from '../forms/local-path-source';
import OnlineSource from '../forms/online-source';
import { useGenerateGPUOptions } from '../hooks/use-form-initial-values';
import CatalogFrom from './catalog';
import LocalPathSource from './local-path-source';
import OnlineSource from './online-source';
// import AdvanceConfig from './advance-config';
import AdvanceConfig from '../forms/advance-config';
import Performance from '../forms/performance';
import AdvanceConfig from './advance-config';
import Performance from './performance';
interface DataFormProps {
initialValues?: any;
@@ -266,7 +266,7 @@ const DataForm: React.FC<DataFormProps> = forwardRef((props, ref) => {
},
{
key: 'advance_config',
label: 'Advanced',
label: intl.formatMessage({ id: 'resources.form.advanced' }),
forceRender: true,
children: <AdvanceConfig></AdvanceConfig>
}
src/pages/llmodels/forms/performance.tsx
+3 -3
View File
@@ -33,6 +33,7 @@ const Performance: React.FC = () => {
const { onQuantizationChange } = useCatalogFormContext();
const { getRuleMessage } = useAppUtils();
const form = Form.useFormInstance();
const scheduleType = Form.useWatch('scheduleType', form);
const handleScheduleTypeChange = (value: string) => {
if (value === ScheduleValueMap.Auto) {
@@ -61,8 +62,7 @@ const Performance: React.FC = () => {
options={scheduleList}
></SealSelect>
</Form.Item>
{form.getFieldValue('scheduleType') ===
ScheduleValueMap.SpecificGPUType && (
{scheduleType === ScheduleValueMap.SpecificGPUType && (
<>
<Form.Item name={['gpu_selector', 'gpu_type']}>
<SealSelect
@@ -95,7 +95,7 @@ const Performance: React.FC = () => {
</Form.Item>
</>
)}
{form.getFieldValue('scheduleType') === ScheduleValueMap.Manual &&
{scheduleType === ScheduleValueMap.Manual &&
!form.getFieldValue('fix_gpu_type') && (
<>
<Form.Item