diff --git a/web/app/components/app/configuration/index.tsx b/web/app/components/app/configuration/index.tsx
index 7b219f992222de..9b155cd543cdbf 100644
--- a/web/app/components/app/configuration/index.tsx
+++ b/web/app/components/app/configuration/index.tsx
@@ -318,6 +318,7 @@ const Configuration: FC = () => {
       ...visionConfig,
       enabled: supportVision,
     }, true)
+    setCompletionParams({})
   }
 
   const isShowVisionConfig = !!currModel?.features?.includes(ModelFeatureEnum.vision)
diff --git a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx
index 9ee60a6df3fed3..7631f1abfc7deb 100644
--- a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx
@@ -1,5 +1,5 @@
 import type { FC } from 'react'
-import { useEffect, useState } from 'react'
+import { useMemo, useState } from 'react'
 import useSWR from 'swr'
 import { useTranslation } from 'react-i18next'
 import type {
@@ -72,7 +72,9 @@ const ModelParameterModal: FC<ModelParameterModalProps> = ({
     { provider, model: modelId },
   )
 
-  const parameterRules = parameterRulesData?.data || []
+  const parameterRules = useMemo(() => {
+    return parameterRulesData?.data || []
+  }, [parameterRulesData])
 
   const handleParamChange = (key: string, value: ParameterValue) => {
     onCompletionParamsChange({
@@ -92,24 +94,6 @@ const ModelParameterModal: FC<ModelParameterModalProps> = ({
     })
   }
 
-  const handleChangeParams = () => {
-    const newCompletionParams = parameterRules.reduce((acc, parameter) => {
-      if (parameter.default !== undefined && completionParams[parameter.name] === undefined)
-        acc[parameter.name] = parameter.default
-
-      return acc
-    }, {} as Record<string, any>)
-
-    onCompletionParamsChange({
-      ...completionParams,
-      ...newCompletionParams,
-    })
-  }
-
-  useEffect(() => {
-    handleChangeParams()
-  }, [parameterRules])
-
   const handleSwitch = (key: string, value: boolean, assignValue: ParameterValue) => {
     if (!value) {
       const newCompletionParams = { ...completionParams }
diff --git a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/parameter-item.tsx b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/parameter-item.tsx
index 804c723194e195..14a991c33f5cd7 100644
--- a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/parameter-item.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/parameter-item.tsx
@@ -29,7 +29,37 @@ const ParameterItem: FC<ParameterItemProps> = ({
   const language = useLanguage()
   const [localValue, setLocalValue] = useState(value)
   const mergedValue = isNullOrUndefined(value) ? localValue : value
-  const renderValue = mergedValue === undefined ? parameterRule.default : mergedValue
+
+  const getDefaultValue = () => {
+    let defaultValue: ParameterValue
+
+    if (parameterRule.type === 'int' || parameterRule.type === 'float') {
+      if (isNullOrUndefined(parameterRule.default)) {
+        if (parameterRule.min)
+          defaultValue = parameterRule.min
+        else
+          defaultValue = 0
+      }
+      else {
+        defaultValue = parameterRule.default
+      }
+    }
+
+    if (parameterRule.type === 'string' && !parameterRule.options?.length)
+      defaultValue = parameterRule.default || ''
+
+    if (parameterRule.type === 'string' && parameterRule.options?.length)
+      defaultValue = parameterRule.default || ''
+
+    if (parameterRule.type === 'boolean')
+      defaultValue = !isNullOrUndefined(parameterRule.default) ? parameterRule.default : false
+
+    if (parameterRule.type === 'tag')
+      defaultValue = !isNullOrUndefined(parameterRule.default) ? parameterRule.default : []
+
+    return defaultValue
+  }
+  const renderValue = isNullOrUndefined(mergedValue) ? getDefaultValue() : mergedValue
 
   const handleChange = (v: ParameterValue) => {
     setLocalValue(v)
@@ -73,22 +103,8 @@ const ParameterItem: FC<ParameterItemProps> = ({
     if (onSwitch) {
       let assignValue: ParameterValue = localValue
 
-      if (isNullOrUndefined(localValue)) {
-        if (parameterRule.type === 'int' || parameterRule.type === 'float')
-          assignValue = !isNullOrUndefined(parameterRule.default) ? parameterRule.default : 0
-
-        if (parameterRule.type === 'string' && !parameterRule.options?.length)
-          assignValue = parameterRule.default || ''
-
-        if (parameterRule.type === 'string' && parameterRule.options?.length)
-          assignValue = parameterRule.options[0]
-
-        if (parameterRule.type === 'boolean')
-          assignValue = !isNullOrUndefined(parameterRule.default) ? parameterRule.default : false
-
-        if (parameterRule.type === 'tag')
-          assignValue = !isNullOrUndefined(parameterRule.default) ? parameterRule.default : []
-      }
+      if (isNullOrUndefined(localValue))
+        assignValue = getDefaultValue()
 
       onSwitch(checked, assignValue)
     }
@@ -145,7 +161,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
           <div className='flex items-center'>
             <Slider
               className='w-[120px]'
-              value={isNullOrUndefined(renderValue) ? 0 : +renderValue!}
+              value={renderValue as number}
               min={parameterRule.min}
               max={parameterRule.max}
               step={+`0.${parameterRule.precision || 0}`}
@@ -157,7 +173,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
               max={parameterRule.max}
               min={parameterRule.min}
               step={+`0.${parameterRule.precision || 0}`}
-              value={isNullOrUndefined(renderValue) ? 0 : +renderValue!}
+              value={renderValue as string}
               onChange={handleNumberInputChange}
             />
           </div>
@@ -180,7 +196,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
           <input
             type='number'
             className='flex items-center px-3 w-[200px] h-8 appearance-none outline-none rounded-lg bg-gray-100 text-[13px] text-gra-900'
-            value={(isNullOrUndefined(renderValue) ? '' : renderValue) as string}
+            value={renderValue as string}
             onChange={handleNumberInputChange}
           />
         )
@@ -189,7 +205,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
         parameterRule.type === 'string' && !parameterRule.options?.length && (
           <input
             className='flex items-center px-3 w-[200px] h-8 appearance-none outline-none rounded-lg bg-gray-100 text-[13px] text-gra-900'
-            value={(isNullOrUndefined(renderValue) ? '' : renderValue) as string}
+            value={renderValue as string}
             onChange={handleStringInputChange}
           />
         )
@@ -209,7 +225,7 @@ const ParameterItem: FC<ParameterItemProps> = ({
         parameterRule.type === 'tag' && (
           <div className='w-[200px]'>
             <TagInput
-              items={isNullOrUndefined(renderValue) ? [] : (renderValue as string[])}
+              items={renderValue as string[]}
               onChange={handleTagChange}
               customizedConfirmKey='Tab'
             />