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

fix: sub varibale select trigger

Browse Source
This commit is contained in:
Joel 2024-08-19 16:49:43 +08:00
parent cf61ca24e3
commit 9a23cd08d8
2 changed files with 38 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
web/app/components/base/select/index.tsx
View File

@ -29,6 +29,7 @@ export type Item = {
export type ISelectProps = {
className?: string
wrapperClassName?: string
renderTrigger?: (value: Item | null) => JSX.Element | null
items?: Item[]
defaultValue?: number | string
disabled?: boolean
@ -168,6 +169,7 @@ const Select: FC<ISelectProps> = ({
const SimpleSelect: FC<ISelectProps> = ({
className,
wrapperClassName = '',
renderTrigger,
items = defaultItems,
defaultValue = 1,
disabled = false,
@ -203,27 +205,29 @@ const SimpleSelect: FC<ISelectProps> = ({
>
<div className={classNames('relative h-9', wrapperClassName)}>
<Listbox.Button className={classNames(`flex items-center w-full h-full rounded-lg border-0 bg-gray-100 pl-3 pr-10 sm:text-sm sm:leading-6 focus-visible:outline-none focus-visible:bg-gray-200 group-hover:bg-gray-200 ${disabled ? 'cursor-not-allowed' : 'cursor-pointer'}`, className)}>
<span className={classNames('block truncate text-left', !selectedItem?.name && 'text-gray-400')}>{selectedItem?.name ?? localPlaceholder}</span>
<span className="absolute inset-y-0 right-0 flex items-center pr-2">
{selectedItem
? (
<XMarkIcon
onClick={(e) => {
e.stopPropagation()
setSelectedItem(null)
onSelect({ name: '', value: '' })
}}
className="h-5 w-5 text-gray-400 cursor-pointer"
aria-hidden="false"
/>
)
: (
<ChevronDownIcon
className="h-5 w-5 text-gray-400"
aria-hidden="true"
/>
)}
</span>
{renderTrigger ? renderTrigger(selectedItem) : <span className={classNames('block truncate text-left', !selectedItem?.name && 'text-gray-400')}>{selectedItem?.name ?? localPlaceholder}</span>}
{!renderTrigger && (
<span className="absolute inset-y-0 right-0 flex items-center pr-2">
{selectedItem
? (
<XMarkIcon
onClick={(e) => {
e.stopPropagation()
setSelectedItem(null)
onSelect({ name: '', value: '' })
}}
className="h-5 w-5 text-gray-400 cursor-pointer"
aria-hidden="false"
/>
)
: (
<ChevronDownIcon
className="h-5 w-5 text-gray-400"
aria-hidden="true"
/>
)}
</span>
)}
</Listbox.Button>
{!disabled && (
<Transition

13
web/app/components/workflow/nodes/if-else/components/condition-list/condition-item.tsx
View File

@ -6,6 +6,7 @@ import {
import { useTranslation } from 'react-i18next'
import { RiDeleteBinLine } from '@remixicon/react'
import produce from 'immer'
import { XMarkIcon } from '@heroicons/react/20/solid'
import type { VarType as NumberVarType } from '../../../tool/types'
import type {
Condition,
@ -33,6 +34,7 @@ import type {
import { VarType } from '@/app/components/workflow/types'
import cn from '@/utils/classnames'
import { SimpleSelect as Select } from '@/app/components/base/select'
import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
const optionNameI18NPrefix = 'workflow.nodes.ifElse.optionName'
type ConditionItemProps = {
@ -166,6 +168,17 @@ const ConditionItem = ({
defaultValue={condition.key}
items={subVarOptions}
onSelect={item => handleSubVarKeyChange(item.value as string)}
renderTrigger={item => (
item
? <div className='flex items-center'>
<div className='flex px-1.5 items-center h-6 rounded-md border-[0.5px] border-components-panel-border-subtle bg-components-badge-white-to-dark shadow-xs text-text-accent'>
<Variable02 className='w-3.5 h-3.5 text-text-accent' />
<div className='ml-0.5 system-xs-medium'>{item?.name}</div>
</div>
<XMarkIcon className='ml-0.5 w-3.5 h-3.5 text-gray-400' onClick={() => handleSubVarKeyChange('')} />
</div>
: <div className='text-gray-300 system-xs-medium'>{t('common.placeholder.select')}</div>
)}
/>
)
: (