diff --git a/web/app/components/header/account-setting/model-provider-page/declarations.ts b/web/app/components/header/account-setting/model-provider-page/declarations.ts
index 12dd9b3b5b..4f2f9fc1f0 100644
--- a/web/app/components/header/account-setting/model-provider-page/declarations.ts
+++ b/web/app/components/header/account-setting/model-provider-page/declarations.ts
@@ -19,6 +19,7 @@ export enum FormTypeEnum {
   toolSelector = 'tool-selector',
   multiToolSelector = 'array[tools]',
   appSelector = 'app-selector',
+  varSelector = 'var-selector',
 }
 
 export type FormOption = {
diff --git a/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx b/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx
index c5af4ed8a1..85f04013ec 100644
--- a/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx
@@ -21,6 +21,7 @@ import ModelParameterModal from '@/app/components/plugins/plugin-detail-panel/mo
 import ToolSelector from '@/app/components/plugins/plugin-detail-panel/tool-selector'
 import MultipleToolSelector from '@/app/components/plugins/plugin-detail-panel/multiple-tool-selector'
 import AppSelector from '@/app/components/plugins/plugin-detail-panel/app-selector'
+import VarReferencePicker from '@/app/components/workflow/nodes/_base/components/variable/var-reference-picker'
 import RadioE from '@/app/components/base/radio/ui'
 import type {
   NodeOutPutVar,
@@ -409,6 +410,38 @@ function Form<
       )
     }
 
+    if (formSchema.type === FormTypeEnum.varSelector) {
+      const {
+        variable, label, required, scope,
+      } = formSchema as (CredentialFormSchemaTextInput | CredentialFormSchemaSecretInput)
+
+      return (
+        <div key={variable} className={cn(itemClassName, 'py-3')}>
+          <div className={cn(fieldLabelClassName, 'system-sm-semibold flex items-center py-2 text-text-secondary')}>
+            {label[language] || label.en_US}
+            {required && (
+              <span className='ml-1 text-red-500'>*</span>
+            )}
+            {tooltipContent}
+          </div>
+          <VarReferencePicker
+            zIndex={1001}
+            readonly={false}
+            isShowNodeName
+            nodeId={nodeId || ''}
+            value={value[variable] || []}
+            onChange={item => handleFormChange(variable, item as any)}
+            filterVar={(varPayload) => {
+              if (!scope) return true
+              return scope.split('&').includes(varPayload.type)
+            }}
+          />
+          {fieldMoreInfo?.(formSchema)}
+          {validating && changeKey === variable && <ValidatingTip />}
+        </div>
+      )
+    }
+
     // @ts-expect-error it work
     if (!Object.values(FormTypeEnum).includes(formSchema.type))
       return customRenderField?.(formSchema as CustomFormSchema, filteredProps)
diff --git a/web/app/components/workflow/nodes/agent/use-config.ts b/web/app/components/workflow/nodes/agent/use-config.ts
index 8196caa3f5..8026b0e1d0 100644
--- a/web/app/components/workflow/nodes/agent/use-config.ts
+++ b/web/app/components/workflow/nodes/agent/use-config.ts
@@ -14,6 +14,7 @@ import type { Memory, Var } from '../../types'
 import { VarType as VarKindType } from '../../types'
 import useAvailableVarList from '../_base/hooks/use-available-var-list'
 import produce from 'immer'
+import { FormTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
 
 export type StrategyStatus = {
   plugin: {
@@ -92,11 +93,20 @@ const useConfig = (id: string, payload: AgentNodeType) => {
       }),
     )
   }, [inputs.agent_parameters, currentStrategy?.parameters])
+
+  const getParamVarType = useCallback((paramName: string) => {
+    const isVariable = currentStrategy?.parameters.some(
+      param => param.name === paramName && param.type === FormTypeEnum.varSelector,
+    )
+    if (isVariable) return VarType.variable
+    return VarType.constant
+  }, [currentStrategy?.parameters])
+
   const onFormChange = (value: Record<string, any>) => {
     const res: ToolVarInputs = {}
     Object.entries(value).forEach(([key, val]) => {
       res[key] = {
-        type: VarType.constant,
+        type: getParamVarType(key),
         value: val,
       }
     })