mirror of
https://github.com/langgenius/dify.git
synced 2026-05-03 17:08:03 +08:00
feat: add condition placeholder to if-else node
This commit is contained in:
@ -15,32 +15,39 @@ const IfElseNode: FC<NodeProps<IfElseNodeType>> = (props) => {
|
||||
|
||||
return (
|
||||
<div className='px-3'>
|
||||
<div className='flex items-center h-6 relative px-1'>
|
||||
<div className='w-full text-right text-gray-700 text-xs font-semibold'>IF</div>
|
||||
<div className='relative flex items-center h-6 px-1'>
|
||||
<div className='w-full text-xs font-semibold text-right text-gray-700'>IF</div>
|
||||
<NodeSourceHandle
|
||||
{...props}
|
||||
handleId='true'
|
||||
handleClassName='!top-1/2 !-right-[21px] !-translate-y-1/2'
|
||||
/>
|
||||
</div>
|
||||
<div className='mb-0.5 leading-4 text-[10px] font-medium text-gray-500 uppercase'>{t(`${i18nPrefix}.conditions`)}</div>
|
||||
<div className='space-y-0.5'>
|
||||
{conditions.filter(item => (item.variable_selector && item.variable_selector.length > 0 && item.comparison_operator && (isEmptyRelatedOperator(item.comparison_operator!) ? true : !!item.value))).map((condition, i) => (
|
||||
{conditions.map((condition, i) => (
|
||||
<div key={condition.id} className='relative'>
|
||||
<div className='flex items-center h-6 bg-gray-100 rounded-md px-1 space-x-1 text-xs font-normal text-gray-700'>
|
||||
<Variable02 className='w-3.5 h-3.5 text-primary-500' />
|
||||
<span>{condition.variable_selector.slice(-1)[0]}</span>
|
||||
<span className='text-gray-500'>{isComparisonOperatorNeedTranslate(condition.comparison_operator) ? t(`${i18nPrefix}.comparisonOperator.${condition.comparison_operator}`) : condition.comparison_operator}</span>
|
||||
{!isEmptyRelatedOperator(condition.comparison_operator!) && <span>{condition.value}</span>}
|
||||
</div>
|
||||
{(condition.variable_selector?.length > 0 && condition.comparison_operator && (isEmptyRelatedOperator(condition.comparison_operator!) ? true : !!condition.value))
|
||||
? (
|
||||
<div className='flex items-center h-6 px-1 space-x-1 text-xs font-normal text-gray-700 bg-gray-100 rounded-md'>
|
||||
<Variable02 className='w-3.5 h-3.5 text-primary-500' />
|
||||
<span>{condition.variable_selector.slice(-1)[0]}</span>
|
||||
<span className='text-gray-500'>{isComparisonOperatorNeedTranslate(condition.comparison_operator) ? t(`${i18nPrefix}.comparisonOperator.${condition.comparison_operator}`) : condition.comparison_operator}</span>
|
||||
{!isEmptyRelatedOperator(condition.comparison_operator!) && <span>{condition.value}</span>}
|
||||
</div>
|
||||
)
|
||||
: (
|
||||
<div className='flex items-center h-6 px-1 space-x-1 text-xs font-normal text-gray-500 bg-gray-100 rounded-md'>
|
||||
{t(`${i18nPrefix}.conditionNotSetup`)}
|
||||
</div>
|
||||
)}
|
||||
{i !== conditions.length - 1 && (
|
||||
<div className='absolute z-10 right-0 bottom-[-10px] leading-4 text-[10px] font-medium text-primary-600 uppercase'>{t(`${i18nPrefix}.${logical_operator}`)}</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div className='flex items-center h-6 relative px-1'>
|
||||
<div className='w-full text-right text-gray-700 text-xs font-semibold'>ELSE</div>
|
||||
<div className='relative flex items-center h-6 px-1'>
|
||||
<div className='w-full text-xs font-semibold text-right text-gray-700'>ELSE</div>
|
||||
<NodeSourceHandle
|
||||
{...props}
|
||||
handleId='false'
|
||||
|
||||
Reference in New Issue
Block a user