mirror of
https://git.mirrors.martin98.com/https://github.com/infiniflow/ragflow.git
synced 2025-08-12 20:29:06 +08:00
### What problem does this PR solve? Feat: Modify the Preset configurations item style to distinguish it from other fields #4844 ### Type of change - [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu
GitHub
parent
78982d88e0
commit
e4bd879686
@ -3,11 +3,12 @@ import {
|
|||||||
ModelVariableType,
|
ModelVariableType,
|
||||||
settledModelVariableMap,
|
settledModelVariableMap,
|
||||||
} from '@/constants/knowledge';
|
} from '@/constants/knowledge';
|
||||||
import { Divider, Flex, Form, InputNumber, Select, Slider, Switch } from 'antd';
|
import { Flex, Form, InputNumber, Select, Slider, Switch, Tooltip } from 'antd';
|
||||||
import camelCase from 'lodash/camelCase';
|
import camelCase from 'lodash/camelCase';
|
||||||
|
|
||||||
import { useTranslate } from '@/hooks/common-hooks';
|
import { useTranslate } from '@/hooks/common-hooks';
|
||||||
import { useComposeLlmOptionsByModelTypes } from '@/hooks/llm-hooks';
|
import { useComposeLlmOptionsByModelTypes } from '@/hooks/llm-hooks';
|
||||||
|
import { QuestionCircleOutlined } from '@ant-design/icons';
|
||||||
import { useCallback, useMemo } from 'react';
|
import { useCallback, useMemo } from 'react';
|
||||||
import styles from './index.less';
|
import styles from './index.less';
|
||||||
|
|
||||||
@ -55,239 +56,269 @@ const LlmSettingItems = ({ prefix, formItemLayout = {} }: IProps) => {
|
|||||||
>
|
>
|
||||||
<Select options={modelOptions} showSearch />
|
<Select options={modelOptions} showSearch />
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Divider></Divider>
|
<div className="border rounded-md">
|
||||||
<Form.Item
|
<div className="flex justify-between bg-slate-100 p-2 mb-2">
|
||||||
label={t('freedom')}
|
<div className="space-x-1 items-center">
|
||||||
name="parameter"
|
<span className="text-lg font-semibold">{t('freedom')}</span>
|
||||||
tooltip={t('freedomTip')}
|
<Tooltip title={t('freedomTip')}>
|
||||||
{...formItemLayout}
|
<QuestionCircleOutlined></QuestionCircleOutlined>
|
||||||
initialValue={ModelVariableType.Precise}
|
</Tooltip>
|
||||||
>
|
</div>
|
||||||
<Select<ModelVariableType>
|
<div className="w-1/4 min-w-32">
|
||||||
options={parameterOptions}
|
<Form.Item
|
||||||
onChange={handleParametersChange}
|
label={t('freedom')}
|
||||||
/>
|
name="parameter"
|
||||||
</Form.Item>
|
tooltip={t('freedomTip')}
|
||||||
<Form.Item
|
initialValue={ModelVariableType.Precise}
|
||||||
label={t('temperature')}
|
labelCol={{ span: 0 }}
|
||||||
tooltip={t('temperatureTip')}
|
wrapperCol={{ span: 24 }}
|
||||||
{...formItemLayout}
|
className="m-0"
|
||||||
>
|
>
|
||||||
<Flex gap={20} align="center">
|
<Select<ModelVariableType>
|
||||||
<Form.Item
|
options={parameterOptions}
|
||||||
name={'temperatureEnabled'}
|
onChange={handleParametersChange}
|
||||||
valuePropName="checked"
|
/>
|
||||||
noStyle
|
</Form.Item>
|
||||||
>
|
</div>
|
||||||
<Switch size="small" />
|
</div>
|
||||||
</Form.Item>
|
|
||||||
<Form.Item noStyle dependencies={['temperatureEnabled']}>
|
|
||||||
{({ getFieldValue }) => {
|
|
||||||
const disabled = !getFieldValue('temperatureEnabled');
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Flex flex={1}>
|
|
||||||
<Form.Item
|
|
||||||
name={[...memorizedPrefix, 'temperature']}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<Slider
|
|
||||||
className={styles.variableSlider}
|
|
||||||
max={1}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
<Form.Item name={[...memorizedPrefix, 'temperature']} noStyle>
|
|
||||||
<InputNumber
|
|
||||||
className={styles.sliderInputNumber}
|
|
||||||
max={1}
|
|
||||||
min={0}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item label={t('topP')} tooltip={t('topPTip')} {...formItemLayout}>
|
|
||||||
<Flex gap={20} align="center">
|
|
||||||
<Form.Item name={'topPEnabled'} valuePropName="checked" noStyle>
|
|
||||||
<Switch size="small" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item noStyle dependencies={['topPEnabled']}>
|
|
||||||
{({ getFieldValue }) => {
|
|
||||||
const disabled = !getFieldValue('topPEnabled');
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Flex flex={1}>
|
|
||||||
<Form.Item name={[...memorizedPrefix, 'top_p']} noStyle>
|
|
||||||
<Slider
|
|
||||||
className={styles.variableSlider}
|
|
||||||
max={1}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
<Form.Item name={[...memorizedPrefix, 'top_p']} noStyle>
|
|
||||||
<InputNumber
|
|
||||||
className={styles.sliderInputNumber}
|
|
||||||
max={1}
|
|
||||||
min={0}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('presencePenalty')}
|
|
||||||
tooltip={t('presencePenaltyTip')}
|
|
||||||
{...formItemLayout}
|
|
||||||
>
|
|
||||||
<Flex gap={20} align="center">
|
|
||||||
<Form.Item
|
|
||||||
name={'presencePenaltyEnabled'}
|
|
||||||
valuePropName="checked"
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<Switch size="small" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item noStyle dependencies={['presencePenaltyEnabled']}>
|
|
||||||
{({ getFieldValue }) => {
|
|
||||||
const disabled = !getFieldValue('presencePenaltyEnabled');
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Flex flex={1}>
|
|
||||||
<Form.Item
|
|
||||||
name={[...memorizedPrefix, 'presence_penalty']}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<Slider
|
|
||||||
className={styles.variableSlider}
|
|
||||||
max={1}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
<Form.Item
|
|
||||||
name={[...memorizedPrefix, 'presence_penalty']}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<InputNumber
|
|
||||||
className={styles.sliderInputNumber}
|
|
||||||
max={1}
|
|
||||||
min={0}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('frequencyPenalty')}
|
|
||||||
tooltip={t('frequencyPenaltyTip')}
|
|
||||||
{...formItemLayout}
|
|
||||||
>
|
|
||||||
<Flex gap={20} align="center">
|
|
||||||
<Form.Item
|
|
||||||
name={'frequencyPenaltyEnabled'}
|
|
||||||
valuePropName="checked"
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<Switch size="small" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item noStyle dependencies={['frequencyPenaltyEnabled']}>
|
|
||||||
{({ getFieldValue }) => {
|
|
||||||
const disabled = !getFieldValue('frequencyPenaltyEnabled');
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Flex flex={1}>
|
|
||||||
<Form.Item
|
|
||||||
name={[...memorizedPrefix, 'frequency_penalty']}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<Slider
|
|
||||||
className={styles.variableSlider}
|
|
||||||
max={1}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
<Form.Item
|
|
||||||
name={[...memorizedPrefix, 'frequency_penalty']}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<InputNumber
|
|
||||||
className={styles.sliderInputNumber}
|
|
||||||
max={1}
|
|
||||||
min={0}
|
|
||||||
step={0.01}
|
|
||||||
disabled={disabled}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
</Form.Item>
|
|
||||||
</Flex>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('maxTokens')}
|
|
||||||
tooltip={t('maxTokensTip')}
|
|
||||||
{...formItemLayout}
|
|
||||||
>
|
|
||||||
<Flex gap={20} align="center">
|
|
||||||
<Form.Item name={'maxTokensEnabled'} valuePropName="checked" noStyle>
|
|
||||||
<Switch size="small" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item noStyle dependencies={['maxTokensEnabled']}>
|
|
||||||
{({ getFieldValue }) => {
|
|
||||||
const disabled = !getFieldValue('maxTokensEnabled');
|
|
||||||
|
|
||||||
return (
|
<div className="pr-2">
|
||||||
<>
|
<Form.Item
|
||||||
<Flex flex={1}>
|
label={t('temperature')}
|
||||||
<Form.Item
|
tooltip={t('temperatureTip')}
|
||||||
name={[...memorizedPrefix, 'max_tokens']}
|
{...formItemLayout}
|
||||||
noStyle
|
>
|
||||||
>
|
<Flex gap={20} align="center">
|
||||||
<Slider
|
<Form.Item
|
||||||
className={styles.variableSlider}
|
name={'temperatureEnabled'}
|
||||||
max={128000}
|
valuePropName="checked"
|
||||||
disabled={disabled}
|
noStyle
|
||||||
/>
|
>
|
||||||
</Form.Item>
|
<Switch size="small" />
|
||||||
</Flex>
|
</Form.Item>
|
||||||
<Form.Item name={[...memorizedPrefix, 'max_tokens']} noStyle>
|
<Form.Item noStyle dependencies={['temperatureEnabled']}>
|
||||||
<InputNumber
|
{({ getFieldValue }) => {
|
||||||
disabled={disabled}
|
const disabled = !getFieldValue('temperatureEnabled');
|
||||||
className={styles.sliderInputNumber}
|
return (
|
||||||
max={128000}
|
<>
|
||||||
min={0}
|
<Flex flex={1}>
|
||||||
/>
|
<Form.Item
|
||||||
</Form.Item>
|
name={[...memorizedPrefix, 'temperature']}
|
||||||
</>
|
noStyle
|
||||||
);
|
>
|
||||||
}}
|
<Slider
|
||||||
|
className={styles.variableSlider}
|
||||||
|
max={1}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
<Form.Item
|
||||||
|
name={[...memorizedPrefix, 'temperature']}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber
|
||||||
|
className={styles.sliderInputNumber}
|
||||||
|
max={1}
|
||||||
|
min={0}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Flex>
|
<Form.Item
|
||||||
</Form.Item>
|
label={t('topP')}
|
||||||
|
tooltip={t('topPTip')}
|
||||||
|
{...formItemLayout}
|
||||||
|
>
|
||||||
|
<Flex gap={20} align="center">
|
||||||
|
<Form.Item name={'topPEnabled'} valuePropName="checked" noStyle>
|
||||||
|
<Switch size="small" />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item noStyle dependencies={['topPEnabled']}>
|
||||||
|
{({ getFieldValue }) => {
|
||||||
|
const disabled = !getFieldValue('topPEnabled');
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Flex flex={1}>
|
||||||
|
<Form.Item name={[...memorizedPrefix, 'top_p']} noStyle>
|
||||||
|
<Slider
|
||||||
|
className={styles.variableSlider}
|
||||||
|
max={1}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
<Form.Item name={[...memorizedPrefix, 'top_p']} noStyle>
|
||||||
|
<InputNumber
|
||||||
|
className={styles.sliderInputNumber}
|
||||||
|
max={1}
|
||||||
|
min={0}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('presencePenalty')}
|
||||||
|
tooltip={t('presencePenaltyTip')}
|
||||||
|
{...formItemLayout}
|
||||||
|
>
|
||||||
|
<Flex gap={20} align="center">
|
||||||
|
<Form.Item
|
||||||
|
name={'presencePenaltyEnabled'}
|
||||||
|
valuePropName="checked"
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<Switch size="small" />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item noStyle dependencies={['presencePenaltyEnabled']}>
|
||||||
|
{({ getFieldValue }) => {
|
||||||
|
const disabled = !getFieldValue('presencePenaltyEnabled');
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Flex flex={1}>
|
||||||
|
<Form.Item
|
||||||
|
name={[...memorizedPrefix, 'presence_penalty']}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<Slider
|
||||||
|
className={styles.variableSlider}
|
||||||
|
max={1}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
<Form.Item
|
||||||
|
name={[...memorizedPrefix, 'presence_penalty']}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber
|
||||||
|
className={styles.sliderInputNumber}
|
||||||
|
max={1}
|
||||||
|
min={0}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('frequencyPenalty')}
|
||||||
|
tooltip={t('frequencyPenaltyTip')}
|
||||||
|
{...formItemLayout}
|
||||||
|
>
|
||||||
|
<Flex gap={20} align="center">
|
||||||
|
<Form.Item
|
||||||
|
name={'frequencyPenaltyEnabled'}
|
||||||
|
valuePropName="checked"
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<Switch size="small" />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item noStyle dependencies={['frequencyPenaltyEnabled']}>
|
||||||
|
{({ getFieldValue }) => {
|
||||||
|
const disabled = !getFieldValue('frequencyPenaltyEnabled');
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Flex flex={1}>
|
||||||
|
<Form.Item
|
||||||
|
name={[...memorizedPrefix, 'frequency_penalty']}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<Slider
|
||||||
|
className={styles.variableSlider}
|
||||||
|
max={1}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
<Form.Item
|
||||||
|
name={[...memorizedPrefix, 'frequency_penalty']}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber
|
||||||
|
className={styles.sliderInputNumber}
|
||||||
|
max={1}
|
||||||
|
min={0}
|
||||||
|
step={0.01}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('maxTokens')}
|
||||||
|
tooltip={t('maxTokensTip')}
|
||||||
|
{...formItemLayout}
|
||||||
|
>
|
||||||
|
<Flex gap={20} align="center">
|
||||||
|
<Form.Item
|
||||||
|
name={'maxTokensEnabled'}
|
||||||
|
valuePropName="checked"
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<Switch size="small" />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item noStyle dependencies={['maxTokensEnabled']}>
|
||||||
|
{({ getFieldValue }) => {
|
||||||
|
const disabled = !getFieldValue('maxTokensEnabled');
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Flex flex={1}>
|
||||||
|
<Form.Item
|
||||||
|
name={[...memorizedPrefix, 'max_tokens']}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<Slider
|
||||||
|
className={styles.variableSlider}
|
||||||
|
max={128000}
|
||||||
|
disabled={disabled}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
<Form.Item
|
||||||
|
name={[...memorizedPrefix, 'max_tokens']}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber
|
||||||
|
disabled={disabled}
|
||||||
|
className={styles.sliderInputNumber}
|
||||||
|
max={128000}
|
||||||
|
min={0}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</Form.Item>
|
||||||
|
</Flex>
|
||||||
|
</Form.Item>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user