youngkingdom/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-05-02 08:28:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

header

Browse Source
This commit is contained in:
StyleZhang
2024-02-18 17:56:00 +08:00
parent da84ba06c7
commit dce01cf002
6 changed files with 150 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
web/app/components/workflow/header.tsx
View File

@ -1,12 +1,31 @@
import { Edit03 } from '@/app/components/base/icons/src/vender/solid/general'
import Button from '@/app/components/base/button'
const Header = () => {
return (
<div
className='absolute top-0 left-0 w-full h-14 z-10'
className='absolute top-0 left-0 flex items-center justify-between px-3 w-full h-14 z-10'
style={{
background: 'linear-gradient(180deg, #F9FAFB 0%, rgba(249, 250, 251, 0.00) 100%)',
}}
>
<div>
<div className='text-xs font-medium text-gray-700'>Fitness and Nutrition Expert</div>
<div className='flex items-center'>
<div className='flex items-center text-xs text-gray-500'>
<Edit03 className='mr-1 w-3 h-3 text-gray-400' />
Editing
</div>
</div>
</div>
<div>
<Button
type='primary'
className='px-3 py-0 h-8 text-[13px] font-medium'
>
publish
</Button>
</div>
</div>
)
}

92
web/app/components/workflow/nodes/_base/panel.tsx
View File

@ -31,54 +31,56 @@ const BasePanel: FC<BasePanelProps> = ({
} = useWorkflowContext()
return (
<div className='absolute top-2 right-2 bottom-2 w-[420px] bg-white shadow-lg border-[0.5px] border-gray-200 rounded-2xl z-20'>
<div className='flex items-center px-4 pt-3'>
<BlockIcon
className='shrink-0 mr-2'
type={selectedNode!.data.type}
size='md'
/>
<div className='grow py-1 text-base text-gray-900 font-semibold '>LLM</div>
<div className='shrink-0 flex items-center'>
<div
className='w-6 h-6 cursor-pointer'
onClick={() => handleSelectedNodeIdChange('')}
>
<XClose className='w-4 h-4 text-gray-500' />
<div className='absolute top-2 right-2 bottom-2 w-[420px] bg-white shadow-lg border-[0.5px] border-gray-200 rounded-2xl z-20 overflow-y-auto'>
<div className='sticky top-0 bg-white'>
<div className='flex items-center px-4 pt-3'>
<BlockIcon
className='shrink-0 mr-2'
type={selectedNode!.data.type}
size='md'
/>
<div className='grow py-1 text-base text-gray-900 font-semibold '>LLM</div>
<div className='shrink-0 flex items-center'>
<div
className='w-6 h-6 cursor-pointer'
onClick={() => handleSelectedNodeIdChange('')}
>
<XClose className='w-4 h-4 text-gray-500' />
</div>
</div>
</div>
</div>
<div className='p-2'>
<div className='py-[5px] pl-1.5 pr-2 text-xs text-gray-400'>
Add description...
</div>
</div>
{
(inputsElement || outputsElement) && (
<div className='flex items-center px-4 h-[42px]'>
{
inputsElement && (
<div
className='cursor-pointer'
onClick={() => setActiveTab(TabEnum.Inputs)}
>
inputs
</div>
)
}
{
outputsElement && (
<div
className='ml-4 cursor-pointer'
onClick={() => setActiveTab(TabEnum.Outputs)}
>
outpus
</div>
)
}
<div className='p-2'>
<div className='py-[5px] pl-1.5 pr-2 text-xs text-gray-400'>
Add description...
</div>
)
}
</div>
{
(inputsElement || outputsElement) && (
<div className='flex items-center px-4 h-[42px]'>
{
inputsElement && (
<div
className='cursor-pointer'
onClick={() => setActiveTab(TabEnum.Inputs)}
>
inputs
</div>
)
}
{
outputsElement && (
<div
className='ml-4 cursor-pointer'
onClick={() => setActiveTab(TabEnum.Outputs)}
>
outpus
</div>
)
}
</div>
)
}
</div>
<div className='py-2 border-t-[0.5px] border-b-[0.5px] border-black/5'>
{defaultElement}
{activeTab === TabEnum.Inputs && inputsElement}