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

style update of log

Browse Source
This commit is contained in:
JzoNg
2024-08-13 17:11:17 +08:00
parent 74333db4c8
commit bea4ec5998
10 changed files with 46 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/app/components/workflow/panel/record.tsx
View File

@ -18,8 +18,8 @@ const Record = () => {
}, [handleUpdateWorkflowCanvas])
return (
<div className='flex flex-col w-[400px] h-full rounded-l-2xl border-[0.5px] border-gray-200 shadow-xl bg-white'>
<div className='flex items-center justify-between p-4 pb-1 text-base font-semibold text-gray-900'>
<div className='flex flex-col w-[400px] h-full rounded-l-2xl border-[0.5px] border-components-panel-border shadow-xl bg-components-panel-bg'>
<div className='flex items-center justify-between p-4 pb-1 text-text-primary system-xl-semibold'>
{`Test Run#${historyWorkflowData?.sequence_number}`}
</div>
<Run

21
web/app/components/workflow/run/index.tsx
View File

@ -22,10 +22,9 @@ export type RunProps = {
activeTab?: 'RESULT' | 'DETAIL' | 'TRACING'
runID: string
getResultCallback?: (result: WorkflowRunDetailResponse) => void
onShowIterationDetail: (detail: NodeTracing[][]) => void
}
const RunPanel: FC<RunProps> = ({ hideResult, activeTab = 'RESULT', runID, getResultCallback, onShowIterationDetail }) => {
const RunPanel: FC<RunProps> = ({ hideResult, activeTab = 'RESULT', runID, getResultCallback }) => {
const { t } = useTranslation()
const { notify } = useContext(ToastContext)
const [currentTab, setCurrentTab] = useState<string>(activeTab)
@ -197,35 +196,35 @@ const RunPanel: FC<RunProps> = ({ hideResult, activeTab = 'RESULT', runID, getRe
return (
<div className='grow relative flex flex-col'>
{/* tab */}
<div className='shrink-0 flex items-center px-4 border-b-[0.5px] border-[rgba(0,0,0,0.05)]'>
<div className='shrink-0 flex items-center px-4 border-b-[0.5px] border-divider-subtle'>
{!hideResult && (
<div
className={cn(
'mr-6 py-3 border-b-2 border-transparent text-[13px] font-semibold leading-[18px] text-gray-400 cursor-pointer',
currentTab === 'RESULT' && '!border-[rgb(21,94,239)] text-gray-700',
'mr-6 py-3 border-b-2 border-transparent system-sm-semibold-uppercase text-text-tertiary cursor-pointer',
currentTab === 'RESULT' && '!border-util-colors-blue-brand-blue-brand-600 text-text-primary',
)}
onClick={() => switchTab('RESULT')}
>{t('runLog.result')}</div>
)}
<div
className={cn(
'mr-6 py-3 border-b-2 border-transparent text-[13px] font-semibold leading-[18px] text-gray-400 cursor-pointer',
currentTab === 'DETAIL' && '!border-[rgb(21,94,239)] text-gray-700',
'mr-6 py-3 border-b-2 border-transparent system-sm-semibold-uppercase text-text-tertiary cursor-pointer',
currentTab === 'DETAIL' && '!border-util-colors-blue-brand-blue-brand-600 text-text-primary',
)}
onClick={() => switchTab('DETAIL')}
>{t('runLog.detail')}</div>
<div
className={cn(
'mr-6 py-3 border-b-2 border-transparent text-[13px] font-semibold leading-[18px] text-gray-400 cursor-pointer',
currentTab === 'TRACING' && '!border-[rgb(21,94,239)] text-gray-700',
'mr-6 py-3 border-b-2 border-transparent system-sm-semibold-uppercase text-text-tertiary cursor-pointer',
currentTab === 'TRACING' && '!border-util-colors-blue-brand-blue-brand-600 text-text-primary',
)}
onClick={() => switchTab('TRACING')}
>{t('runLog.tracing')}</div>
</div>
{/* panel detal */}
<div ref={ref} className={cn('grow bg-white h-0 overflow-y-auto rounded-b-2xl', currentTab !== 'DETAIL' && '!bg-gray-50')}>
<div ref={ref} className={cn('grow bg-components-panel-bg h-0 overflow-y-auto rounded-b-2xl', currentTab !== 'DETAIL' && '!bg-background-section-burn')}>
{loading && (
<div className='flex h-full items-center justify-center bg-white'>
<div className='flex h-full items-center justify-center bg-components-panel-bg'>
<Loading />
</div>
)}

14
web/app/components/workflow/run/iteration-result-panel.tsx
View File

@ -28,24 +28,24 @@ const IterationResultPanel: FC<Props> = ({
<>
<div className={cn(!noWrap && 'shrink-0 ', 'pl-4 pr-3 pt-3')}>
<div className='shrink-0 flex justify-between items-center h-8'>
<div className='text-base font-semibold text-gray-900 truncate'>
<div className='system-xl-semibold text-text-primary truncate'>
{t(`${i18nPrefix}.testRunIteration`)}
</div>
<div className='ml-2 shrink-0 p-1 cursor-pointer' onClick={onHide}>
<RiCloseLine className='w-4 h-4 text-gray-500 ' />
<RiCloseLine className='w-4 h-4 text-text-tertiary' />
</div>
</div>
<div className='flex items-center py-2 space-x-1 text-primary-600 cursor-pointer' onClick={onBack}>
<div className='flex items-center py-2 space-x-1 text-util-colors-blue-brand-blue-brand-600 cursor-pointer' onClick={onBack}>
<ArrowNarrowLeft className='w-4 h-4' />
<div className='leading-[18px] text-[13px] font-medium'>{t(`${i18nPrefix}.back`)}</div>
<div className='system-sm-medium'>{t(`${i18nPrefix}.back`)}</div>
</div>
</div>
{/* List */}
<div className={cn(!noWrap ? 'h-0 grow' : 'max-h-full', 'overflow-y-auto px-4 pb-4 bg-gray-50')}>
<div className={cn(!noWrap ? 'h-0 grow' : 'max-h-full', 'overflow-y-auto px-4 pb-4 bg-background-section-burn')}>
{list.map((iteration, index) => (
<div key={index} className={cn('my-4', index === 0 && 'mt-2')}>
<div className='flex items-center'>
<div className='shrink-0 leading-[18px] text-xs font-semibold text-gray-500 uppercase'>{t(`${i18nPrefix}.iteration`)} {index + 1}</div>
<div className='shrink-0 system-xs-semibold-uppercase text-text-tertiary'>{t(`${i18nPrefix}.iteration`)} {index + 1}</div>
<div
className='ml-3 grow w-0 h-px'
style={{ background: 'linear-gradient(to right, #F3F4F6, rgba(243, 244, 246, 0))' }}
@ -83,7 +83,7 @@ const IterationResultPanel: FC<Props> = ({
}}
onClick={handleNotBubble}
>
<div className='h-full rounded-2xl bg-white flex flex-col'>
<div className='h-full rounded-2xl bg-components-panel-bg flex flex-col'>
{main}
</div>
</div >

2
web/app/components/workflow/run/output-panel.tsx
View File

@ -19,7 +19,7 @@ const OutputPanel: FC<OutputPanelProps> = ({
height,
}) => {
return (
<div className='bg-gray-50 py-2'>
<div className='bg-background-section-burn py-2'>
{isRunning && (
<div className='pt-4 pl-[26px]'>
<LoadingAnim type='text' />

4
web/app/components/workflow/run/result-panel.tsx
View File

@ -36,7 +36,7 @@ const ResultPanel: FC<ResultPanelProps> = ({
}) => {
const { t } = useTranslation()
return (
<div className='bg-white py-2'>
<div className='bg-components-panel-bg py-2'>
<div className='px-4 py-2'>
<StatusPanel
status={status}
@ -73,7 +73,7 @@ const ResultPanel: FC<ResultPanelProps> = ({
)}
</div>
<div className='px-4 py-2'>
<div className='h-[0.5px] bg-black opacity-5' />
<div className='h-[0.5px] divider-subtle' />
</div>
<div className='px-4 py-2'>
<MetaData

4
web/app/components/workflow/run/result-text.tsx
View File

@ -20,7 +20,7 @@ const ResultText: FC<ResultTextProps> = ({
}) => {
const { t } = useTranslation()
return (
<div className='bg-gray-50 py-2'>
<div className='bg-background-section-burn py-2'>
{isRunning && !outputs && (
<div className='pt-4 pl-[26px]'>
<LoadingAnim type='text' />
@ -28,7 +28,7 @@ const ResultText: FC<ResultTextProps> = ({
)}
{!isRunning && error && (
<div className='px-4'>
<div className='px-3 py-[10px] rounded-lg !bg-[#fef3f2] border-[0.5px] border-[rbga(0,0,0,0.05)] shadow-xs'>
<div className='px-3 py-[10px] rounded-lg !bg-[#fef3f2] border-[0.5px] border-[rgba(0,0,0,0.05)] shadow-xs'>
<div className='text-xs leading-[18px] text-[#d92d20]'>{error}</div>
</div>
</div>

2
web/app/components/workflow/run/tracing-panel.tsx
View File

@ -10,7 +10,7 @@ type TracingPanelProps = {
const TracingPanel: FC<TracingPanelProps> = ({ list, onShowIterationDetail }) => {
return (
<div className='bg-gray-50 py-2'>
<div className='bg-background-section-burn py-2'>
{list.map(node => (
<NodePanel
key={node.id}