AI/dify
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git synced 2025-08-19 13:09:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: input slider

Browse Source
This commit is contained in:
Joel 2024-08-06 15:33:38 +08:00
parent fca5af5073
commit 53a3c199ec
2 changed files with 19 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
web/app/components/workflow/nodes/_base/components/input-number-with-slider.tsx
View File

@ -21,9 +21,17 @@ const InputNumberWithSlider: FC<Props> = ({
onChange,
}) => {
const handleBlur = useCallback(() => {
if (value === undefined || value === null)
if (value === undefined || value === null) {
onChange(defaultValue)
}, [defaultValue, onChange, value])
return
}
if (max !== undefined && value > max) {
onChange(max)
return
}
if (min !== undefined && value < min)
onChange(min)
}, [defaultValue, max, min, onChange, value])
const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
onChange(parseFloat(e.target.value))
@ -33,7 +41,7 @@ const InputNumberWithSlider: FC<Props> = ({
<div className='flex justify-between items-center h-8 space-x-2'>
<input
value={value}
className='shrink-0 block pl-3 w-12 h-8 appearance-none outline-none rounded-lg bg-gray-100 text-[13px] text-gra-900'
className='shrink-0 block pl-3 w-12 h-8 appearance-none outline-none rounded-lg bg-components-input-bg-normal text-[13px] text-components-input-text-filled'
type='number'
min={min}
max={max}

40
web/app/components/workflow/nodes/list-filter/components/limit-config.tsx
View File

@ -3,10 +3,10 @@ import type { FC } from 'react'
import React, { useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import type { Limit } from '../types'
import InputNumberWithSlider from '../../_base/components/input-number-with-slider'
import cn from '@/utils/classnames'
import Field from '@/app/components/workflow/nodes/_base/components/field'
import Switch from '@/app/components/base/switch'
import Slider from '@/app/components/base/slider'
const i18nPrefix = 'workflow.nodes.listFilter'
const LIMIT_SIZE_MIN = 1
@ -49,15 +49,6 @@ const LimitConfig: FC<Props> = ({
})
}, [onChange, config])
const handleBlur = useCallback(() => {
const payload = config
if (!payload)
return
if (payload.size === undefined || payload.size === null)
handleLimitSizeChange(LIMIT_SIZE_DEFAULT)
}, [handleLimitSizeChange, config])
return (
<div className={cn(className)}>
<Field
@ -73,28 +64,13 @@ const LimitConfig: FC<Props> = ({
>
{payload?.enabled
? (
<div className='flex justify-between items-center h-8 space-x-2'>
<input
value={(payload?.size || LIMIT_SIZE_DEFAULT) as number}
className='shrink-0 block pl-3 w-12 h-8 appearance-none outline-none rounded-lg bg-gray-100 text-[13px] text-gra-900'
type='number'
min={LIMIT_SIZE_MIN}
max={LIMIT_SIZE_MAX}
step={1}
onChange={e => handleLimitSizeChange(e.target.value)}
onBlur={handleBlur}
disabled={readonly || !payload?.enabled}
/>
<Slider
className='grow'
value={(payload?.size || LIMIT_SIZE_DEFAULT) as number}
min={LIMIT_SIZE_MIN}
max={LIMIT_SIZE_MAX}
step={1}
onChange={handleLimitSizeChange}
disabled={readonly || !payload?.enabled}
/>
</div>
<InputNumberWithSlider
value={payload?.size || LIMIT_SIZE_DEFAULT}
min={LIMIT_SIZE_MIN}
max={LIMIT_SIZE_MAX}
onChange={handleLimitSizeChange}
readonly={readonly || !payload?.enabled}
/>
)
: null}
</Field>