fix: remove input box for gpus_per_replica

Author: hibig

src/pages/llmodels/config/index.ts

@@ -326,12 +326,13 @@ export const modelLabels = [
   { label: 'Embedding', value: 'embedding_only' }
 ];
 
-// do not trigger form check compatibility when these fields change
+// do not trigger form check compatibility when these fields change, maybe triggered manually
 export const DO_NOT_TRIGGER_CHECK_COMPATIBILITY = [
   'model_scope_model_id',
   'huggingface_repo_id',
   'huggingface_filename',
   'model_scope_file_path',
+  'replicas',
   'name',
   'description',
   'env',
@@ -356,27 +357,6 @@ export const DO_NOT_TRIGGER_CHECK_COMPATIBILITY = [
 // ignore to compare old and new data when these fields change in updating model
 export const DO_NOT_NOTIFY_RECREATE = ['categories', 'replicas', 'description'];
 
-// if some fields need to trigger manual check, add them here
-export const TRIGGER_CHECK_MANUAL = [
-  'model_scope_model_id',
-  'huggingface_repo_id',
-  'huggingface_filename',
-  'model_scope_file_path',
-  'description',
-  'source',
-  'worker_selector',
-  'backend_parameters',
-  'local_path',
-  'backend_version',
-  'ollama_library_model_name',
-  'backend',
-  'gpu_selector',
-  'categories',
-  'env',
-  'replicas',
-  'extended_kv_cache.enabled'
-];
-
 export const formFields = [
   'name',
   'model_scope_model_id',

src/pages/llmodels/forms/basic.tsx

@@ -9,6 +9,7 @@ import { useIntl } from '@umijs/max';
 import { Form } from 'antd';
 import { useMemo } from 'react';
 import { sourceOptions } from '../config';
+import { useFormContext } from '../config/form-context';
 import { FormData } from '../config/types';
 import CatalogFrom from './catalog';
 import LocalPathSource from './local-path-source';
@@ -34,12 +35,19 @@ const BasicForm: React.FC<BasicFormProps> = (props) => {
   } = props;
   const intl = useIntl();
   const { getRuleMessage } = useAppUtils();
+  const { onValuesChange } = useFormContext();
   const form = Form.useFormInstance();
 
   const handleOnSourceChange = (val: string) => {
     onSourceChange?.(val);
   };
 
+  const handleReplicasChange = (val: number) => {
+    if (val > 0) {
+      onValuesChange?.({}, form.getFieldsValue());
+    }
+  };
+
   const clusterOptions = useMemo(() => {
     return clusterList?.map((item) => {
       return {
@@ -126,6 +134,7 @@ const BasicForm: React.FC<BasicFormProps> = (props) => {
         ]}
       >
         <SealInput.Number
+          onChange={handleReplicasChange}
           style={{ width: '100%' }}
           label={intl.formatMessage({
             id: 'models.form.replicas'

src/pages/llmodels/forms/schedule-type.tsx

@@ -5,10 +5,9 @@ import SealSelect from '@/components/seal-form/seal-select';
 import TooltipList from '@/components/tooltip-list';
 import useAppUtils from '@/hooks/use-app-utils';
 import { useIntl } from '@umijs/max';
-import { Form, InputNumber } from 'antd';
+import { Form } from 'antd';
 import _ from 'lodash';
 import React from 'react';
-import styled from 'styled-components';
 import GPUCard from '../components/gpu-card';
 import {
   placementStrategyOptions,
@@ -19,10 +18,6 @@ import { backendOptionsMap } from '../config/backend-parameters';
 import { useFormContext } from '../config/form-context';
 import { FormData } from '../config/types';
 
-const InputWrapper = styled.div`
-  padding: 8px 4px;
-`;
-
 const placementStrategyTips = [
   {
     title: 'Spread',
@@ -75,10 +70,6 @@ const ScheduleTypeForm: React.FC = () => {
   const form = Form.useFormInstance();
   const scheduleType = Form.useWatch('scheduleType', form);
   const workerSelector = Form.useWatch('worker_selector', form);
-  const GPUsPerReplicas = Form.useWatch(
-    ['gpu_selector', 'gpus_per_replica'],
-    form
-  );
 
   const handleScheduleTypeChange = (value: string) => {
     if (value === ScheduleValueMap.Auto) {
@@ -224,29 +215,16 @@ const ScheduleTypeForm: React.FC = () => {
                   { label: '1', value: 1 },
                   { label: '2', value: 2 },
                   { label: '4', value: 4 },
-                  { label: '8', value: 8 }
+                  { label: '8', value: 8 },
+                  { label: '16', value: 16 },
+                  { label: '32', value: 32 },
+                  { label: '64', value: 64 },
+                  { label: '128', value: 128 },
+                  { label: '256', value: 256 }
                 ]}
                 description={
                   <TooltipList list={GPUsPerReplicaTips}></TooltipList>
                 }
-                popupRender={(originNode) => (
-                  <div>
-                    {originNode}
-                    <InputWrapper>
-                      <InputNumber
-                        min={1}
-                        step={1}
-                        style={{ width: '100%' }}
-                        defaultValue={
-                          GPUsPerReplicas === -1 ? null : GPUsPerReplicas
-                        }
-                        value={GPUsPerReplicas === -1 ? null : GPUsPerReplicas}
-                        onChange={handleGpusPerReplicasChange}
-                        onStep={handleOnStepReplicaStep}
-                      />
-                    </InputWrapper>
-                  </div>
-                )}
               />
             </Form.Item>
           </>