This commit is contained in:
StyleZhang
2024-02-28 20:11:04 +08:00
parent d2d6904c9b
commit e8921787b3
6 changed files with 103 additions and 26 deletions

View File

@ -33,9 +33,7 @@ const NextStep = ({
{
!branches && !!outgoers.length && (
<Item
parentNodeId={selectedNode!.id}
nodeId={outgoers[0].id}
sourceHandle='source'
data={outgoers[0].data}
/>
)
@ -63,7 +61,6 @@ const NextStep = ({
connected && (
<Item
data={target!.data!}
parentNodeId={selectedNode!.id}
nodeId={target!.id}
sourceHandle={branch.id}
branchName={branch.name}

View File

@ -12,14 +12,12 @@ import { useWorkflow } from '../../../../hooks'
import Button from '@/app/components/base/button'
type ItemProps = {
parentNodeId: string
nodeId: string
sourceHandle: string
sourceHandle?: string
branchName?: string
data: CommonNodeType
}
const Item = ({
parentNodeId,
nodeId,
sourceHandle,
branchName,
@ -27,8 +25,8 @@ const Item = ({
}: ItemProps) => {
const { handleChangeCurrentNode } = useWorkflow()
const handleSelect = useCallback((type: BlockEnum) => {
handleChangeCurrentNode(parentNodeId, nodeId, type, sourceHandle)
}, [parentNodeId, nodeId, sourceHandle, handleChangeCurrentNode])
handleChangeCurrentNode(nodeId, type, sourceHandle)
}, [nodeId, sourceHandle, handleChangeCurrentNode])
const renderTrigger = useCallback((open: boolean) => {
return (
<Button

View File

@ -0,0 +1,42 @@
import {
memo,
useCallback,
} from 'react'
import BlockSelector from '../../../../block-selector'
import { useWorkflow } from '../../../../hooks'
import type { BlockEnum } from '../../../../types'
type ChangeBlockProps = {
nodeId: string
}
const ChangeBlock = ({
nodeId,
}: ChangeBlockProps) => {
const { handleChangeCurrentNode } = useWorkflow()
const handleSelect = useCallback((type: BlockEnum) => {
handleChangeCurrentNode(nodeId, type)
}, [handleChangeCurrentNode, nodeId])
const renderTrigger = useCallback(() => {
return (
<div className='flex items-center px-3 w-[232px] h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'>
Change Block
</div>
)
}, [])
return (
<BlockSelector
placement='bottom-end'
offset={{
mainAxis: -36,
crossAxis: 4,
}}
onSelect={handleSelect}
trigger={renderTrigger}
/>
)
}
export default memo(ChangeBlock)

View File

@ -2,7 +2,8 @@ import {
memo,
useState,
} from 'react'
import { useWorkflow } from '../../../hooks'
import { useWorkflow } from '../../../../hooks'
import ChangeBlock from './change-block'
import { DotsHorizontal } from '@/app/components/base/icons/src/vender/line/general'
import {
PortalToFollowElem,
@ -43,7 +44,7 @@ const PanelOperator = ({
<PortalToFollowElemContent className='z-[11]'>
<div className='w-[240px] border-[0.5px] border-gray-200 rounded-2xl shadow-xl bg-white'>
<div className='p-1'>
<div className='flex items-center px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'>Change Block</div>
<ChangeBlock nodeId={nodeId} />
<div className='flex items-center px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'>Help Link</div>
</div>
<div className='h-[1px] bg-gray-100'></div>