diff --git a/src/components/seal-form/seal-cascader.tsx b/src/components/seal-form/seal-cascader.tsx
index 90c7cde3..5c1897f4 100644
--- a/src/components/seal-form/seal-cascader.tsx
+++ b/src/components/seal-form/seal-cascader.tsx
@@ -60,8 +60,7 @@ const OptionNodes = (props: {
);
}
let width: any = {
- maxWidth: 140,
- minWidth: 140
+ maxWidth: 140
};
if (!data.parent) {
width = undefined;
diff --git a/src/pages/llmodels/components/gpu-card.tsx b/src/pages/llmodels/components/gpu-card.tsx
index 8dc0ca9d..7e7f1d5b 100644
--- a/src/pages/llmodels/components/gpu-card.tsx
+++ b/src/pages/llmodels/components/gpu-card.tsx
@@ -21,6 +21,12 @@ const Header = styled.div`
width: 100%;
`;
+const ItemInfo = styled.div`
+ display: flex;
+ flex-wrap: wrap;
+ white-space: break-spaces;
+`;
+
const Description = styled.div`
display: flex;
flex-direction: column;
@@ -60,7 +66,7 @@ const GPUCard: React.FC<{
description={
info || (
<>
-
+
{intl.formatMessage({ id: 'resources.table.vram' })}(
{intl.formatMessage({ id: 'resources.table.used' })}/
{intl.formatMessage({ id: 'resources.table.total' })}):{' '}
@@ -70,8 +76,8 @@ const GPUCard: React.FC<{
)}{' '}
/ {convertFileSize(data?.memory?.total || 0)}
-
-
+
+
{intl.formatMessage({ id: 'resources.table.gpuutilization' })}
:{' '}
@@ -80,7 +86,7 @@ const GPUCard: React.FC<{
? _.round(data?.memory?.utilization_rate || 0, 2)
: _.round(data.memory?.allocated / data.memory?.total, 2) * 100}
%
-
+
>
)
}
diff --git a/src/pages/llmodels/config/form-context.ts b/src/pages/llmodels/config/form-context.ts
index eec5b058..b7cecb58 100644
--- a/src/pages/llmodels/config/form-context.ts
+++ b/src/pages/llmodels/config/form-context.ts
@@ -1,6 +1,6 @@
import { PageActionType } from '@/config/types';
import React from 'react';
-import { BackendOption, DeployFormKey } from './types';
+import { BackendOption, DeployFormKey, FormData } from './types';
type EmptyObject = Record;
@@ -17,10 +17,11 @@ interface FormContextProps {
isGGUF?: boolean;
formKey: DeployFormKey;
source: string;
- pageAction: PageActionType;
+ action: PageActionType;
gpuOptions: CascaderOption[];
workerLabelOptions: CascaderOption[];
backendOptions: BackendOption[];
+ initialValues?: FormData; // for editing model
onValuesChange?: (changedValues: any, allValues: any) => void;
onBackendChange: (backend: string, option: any) => void;
}
diff --git a/src/pages/llmodels/forms/backend.tsx b/src/pages/llmodels/forms/backend.tsx
index 4a75ccdc..a34f765f 100644
--- a/src/pages/llmodels/forms/backend.tsx
+++ b/src/pages/llmodels/forms/backend.tsx
@@ -23,7 +23,7 @@ const BackendFields: React.FC = () => {
const {
isGGUF,
formKey,
- pageAction: action,
+ action,
source,
gpuOptions,
onValuesChange,
diff --git a/src/pages/llmodels/forms/index.tsx b/src/pages/llmodels/forms/index.tsx
index 2b9acc60..0e155dbe 100644
--- a/src/pages/llmodels/forms/index.tsx
+++ b/src/pages/llmodels/forms/index.tsx
@@ -55,7 +55,7 @@ const SegmentedHeader = styled.div<{ $top?: number }>`
`;
interface DataFormProps {
- initialValues?: any;
+ initialValues?: FormData;
ref?: any;
source: SourceType;
action: PageActionType;
@@ -323,10 +323,11 @@ const DataForm: React.FC = forwardRef((props, ref) => {
isGGUF: isGGUF,
formKey: formKey,
source: props.source,
- pageAction: action,
+ action: action,
gpuOptions: gpuOptions,
backendOptions: backendOptions,
workerLabelOptions: workerLabelOptions,
+ initialValues: initialValues,
onValuesChange: onValuesChange,
onBackendChange: handleBackendChange
}}
diff --git a/src/pages/llmodels/forms/online-source.tsx b/src/pages/llmodels/forms/online-source.tsx
index 1f99f857..62560ddc 100644
--- a/src/pages/llmodels/forms/online-source.tsx
+++ b/src/pages/llmodels/forms/online-source.tsx
@@ -13,7 +13,7 @@ const HuggingFaceForm: React.FC = () => {
const formInstance = Form.useFormInstance();
const formCtx = useFormContext();
const { getRuleMessage } = useAppUtils();
- const { formKey, pageAction, isGGUF, onValuesChange } = formCtx;
+ const { formKey, action, isGGUF, onValuesChange } = formCtx;
const source = Form.useWatch('source');
if (
@@ -47,7 +47,7 @@ const HuggingFaceForm: React.FC = () => {
@@ -58,7 +58,7 @@ const HuggingFaceForm: React.FC = () => {
>
)}
@@ -78,7 +78,7 @@ const HuggingFaceForm: React.FC = () => {
@@ -89,7 +89,7 @@ const HuggingFaceForm: React.FC = () => {
>
)}
diff --git a/src/pages/llmodels/forms/schedule-type.tsx b/src/pages/llmodels/forms/schedule-type.tsx
index 8c7841dd..2a30413e 100644
--- a/src/pages/llmodels/forms/schedule-type.tsx
+++ b/src/pages/llmodels/forms/schedule-type.tsx
@@ -4,6 +4,7 @@ import SealInputNumber from '@/components/seal-form/input-number';
import SealCascader from '@/components/seal-form/seal-cascader';
import SealSelect from '@/components/seal-form/seal-select';
import TooltipList from '@/components/tooltip-list';
+import { PageAction } from '@/config';
import useAppUtils from '@/hooks/use-app-utils';
import { useIntl } from '@umijs/max';
import { Form } from 'antd';
@@ -67,7 +68,13 @@ const gpuAllocateTypeTips = [
const ScheduleTypeForm: React.FC = () => {
const intl = useIntl();
- const { onValuesChange, gpuOptions, workerLabelOptions } = useFormContext();
+ const {
+ onValuesChange,
+ action,
+ gpuOptions,
+ workerLabelOptions,
+ initialValues
+ } = useFormContext();
const { getRuleMessage } = useAppUtils();
const form = Form.useFormInstance();
const scheduleType = Form.useWatch('scheduleType', form);
@@ -88,39 +95,41 @@ const ScheduleTypeForm: React.FC = () => {
onValuesChange?.({}, form.getFieldsValue());
};
- const handleBeforeGpuSelectorChange = (gpuIds: any[]) => {};
-
const handleGpuSelectorChange = (value: any[]) => {
- handleBeforeGpuSelectorChange(value);
- onValuesChange?.({}, form.getFieldsValue());
+ if (value.length > 0) {
+ onValuesChange?.({}, form.getFieldsValue());
+ }
};
const handleOnStepReplicaStep = (
- value: number,
- info: { offset: number; type: 'up' | 'down' }
+ value: number | string | null,
+ info: { offset: number | string | null; type: 'up' | 'down' }
) => {
let newValue = value;
const isPowerOfTwo = (n: number) => (n & (n - 1)) === 0 && n !== 0; // check power of two
- if (!isPowerOfTwo(value)) {
+ if (!isPowerOfTwo(value as number)) {
if (info.type === 'up') {
- newValue = Math.pow(2, Math.ceil(Math.log2(value)));
+ newValue = Math.pow(2, Math.ceil(Math.log2(value as number)));
} else {
- newValue = Math.pow(2, Math.floor(Math.log2(value)));
+ newValue = Math.pow(2, Math.floor(Math.log2(value as number)));
}
}
form.setFieldValue(['gpu_selector', 'gpus_per_replica'], newValue);
onValuesChange?.({}, form.getFieldsValue());
};
- const handleOnStepReplica = (value: number | null) => {
+ const handleOnStepReplica = async (value: number | string | null) => {
if (value === null) {
+ await new Promise((resolve) => {
+ setTimeout(resolve, 200);
+ });
form.setFieldValue(['gpu_selector', 'gpus_per_replica'], 1);
return;
}
const isPowerOfTwo = (n: number) => (n & (n - 1)) === 0 && n !== 0; // check power of two
- if (!isPowerOfTwo(value)) {
- const newValue = Math.pow(2, Math.round(Math.log2(value)));
+ if (!isPowerOfTwo(value as number)) {
+ const newValue = Math.pow(2, Math.round(Math.log2(value as number)));
form.setFieldValue(['gpu_selector', 'gpus_per_replica'], newValue);
onValuesChange?.({}, form.getFieldsValue());
}
@@ -212,7 +221,13 @@ const ScheduleTypeForm: React.FC = () => {
onChange={handleGpuSelectorChange}
>
-
+