fix: update form values when switching model、size, #2191

src/pages/llmodels/components/deploy-builtin-modal.tsx

@@ -11,6 +11,7 @@ import styled from 'styled-components';
 import { queryCatalogItemSpec } from '../apis';
 import {
   backendOptionsMap,
+  defaultFormValues,
   modelCategoriesMap,
   sourceOptions
 } from '../config';
@@ -130,22 +131,10 @@ const AddModal: React.FC<AddModalProps> = (props) => {
   // use for size change and quantization change
   const pickSomeFieldsValue = (defaultSpec: CatalogSpec) => {
     const formData = form.current?.getFieldsValue();
-    const currentData = _.pick(formData, [
+    const currentData = _.pick(formData, Object.keys(defaultFormValues));
-      'worker_selector',
-      'gpu_selector',
-      'env',
-      'backend_version',
-      'backend_parameters'
-    ]);
 
     // if the backend_parameters is empty, use the defaultSpec.backend_parameters
-    return {
+    return currentData;
-      ...currentData,
-      backend_parameters:
-        currentData.backend_parameters?.length > 0
-          ? currentData.backend_parameters
-          : defaultSpec.backend_parameters || []
-    };
   };
 
   const generateSubmitData = (formData: FormData) => {
@@ -365,6 +354,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
     });
 
     form.current.setFieldsValue({
+      ...defaultFormValues,
       ...data
     });
     handleCheckFormData();
@@ -449,6 +439,8 @@ const AddModal: React.FC<AddModalProps> = (props) => {
   };
 
   const handleOnSizeChange = (val: number) => {
+    // TODO
+    form.current.setFieldValue(defaultFormValues);
     const list = handleSetQuantizationOptions({
       backend: form.current.getFieldValue('backend'),
       size: val
@@ -464,8 +456,8 @@ const AddModal: React.FC<AddModalProps> = (props) => {
 
     // set form data
     form.current.setFieldsValue({
-      ...data,
+      ...defaultFormValues,
-      ...pickSomeFieldsValue(data)
+      ...data
     });
     handleCheckFormData();
   };

src/pages/llmodels/components/deploy-modal.tsx

@@ -11,6 +11,7 @@ import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
 import {
   backendOptionsMap,
+  defaultFormValues,
   getSourceRepoConfigValue,
   modelSourceMap
 } from '../config';
@@ -310,7 +311,8 @@ const AddModal: FC<AddModalProps> = (props) => {
     });
     updateSelectedModel(item);
 
-    form.current?.form?.resetFields(resetFieldsByModel);
+    // TODO
+    form.current?.form?.setFieldsValue(defaultFormValues);
     const modelInfo = onSelectModel(item, props.source);
     form.current?.setFieldsValue?.({
       ...modelInfo,

src/pages/llmodels/config/index.ts

@@ -491,6 +491,20 @@ export const formFields = [
   'restart_on_error'
 ];
 
+export const defaultFormValues = {
+  replicas: 1,
+  description: '',
+  categories: null,
+  env: {},
+  scheduleType: 'auto',
+  placement_strategy: 'spread',
+  gpu_ids: null,
+  gpu_selector: {},
+  worker_selector: {},
+  backend_parameters: [],
+  backend_version: ''
+};
+
 export const getBackendParamsTips = (backend: string) => {
   if (backend === backendOptionsMap.llamaBox) {
     return {