lunanting/ai-chatbot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: align workflow timeline labels inline
Some checks failed
Lint / build (20) (push) Has been cancelled
Details
Playwright Tests / test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Your Name 2026-03-28 17:15:47 +08:00
parent 2b2b2bd228
commit d393b5f138
1 changed files with 45 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
components/agents/AgentWorkflowPanelDarkV2.tsx
View File

@ -728,7 +728,7 @@ export function AgentWorkflowPanelDarkV2({
return (
<Fragment key={step.key}>
<div className="group relative flex min-w-0 flex-col items-start pr-2 text-left">
<div className="group relative flex min-w-0 items-center pr-2 text-left">
<button
type="button"
onClick={() => {
@ -737,52 +737,53 @@ export function AgentWorkflowPanelDarkV2({
setActiveEmbeddedStepKey(step.key);
setActiveEmbeddedOptionDepth(1);
}}
className="flex w-full flex-col items-start text-left transition-transform duration-200 hover:-translate-y-[1px]"
className="flex min-w-0 shrink-0 items-center gap-3 text-left transition-transform duration-200 hover:-translate-y-[1px]"
>
<div className="flex w-full items-center gap-3">
<span
className={cn(
"flex h-7 w-7 shrink-0 items-center justify-center rounded-full border text-[11px] font-semibold transition-colors",
active
? "border-emerald-300 bg-emerald-300 text-black shadow-[0_0_18px_rgba(52,211,153,0.28)]"
: completed
? "border-white/30 bg-white text-black"
: "border-white/12 bg-white/[0.04] text-white/62 group-hover:border-white/24 group-hover:text-white/82"
)}
>
{stepIndex + 1}
<span
className={cn(
"flex h-7 w-7 shrink-0 items-center justify-center rounded-full border text-[11px] font-semibold transition-colors",
active
? "border-emerald-300 bg-emerald-300 text-black shadow-[0_0_18px_rgba(52,211,153,0.28)]"
: completed
? "border-white/30 bg-white text-black"
: "border-white/12 bg-white/[0.04] text-white/62 group-hover:border-white/24 group-hover:text-white/82"
)}
>
{stepIndex + 1}
</span>
<span
className={cn(
"truncate text-[13px] font-semibold transition-colors",
active
? "text-white"
: completed
? "text-white/82"
: "text-white/52 group-hover:text-white/76"
)}
>
{step.title}
</span>
{active ? (
<span className="shrink-0 rounded-full border border-emerald-300/30 bg-emerald-400/10 px-2 py-0.5 text-[10px] font-medium text-emerald-200">
当前步骤
</span>
<span
className={cn(
"truncate text-[13px] font-semibold transition-colors",
active
? "text-white"
: completed
? "text-white/82"
: "text-white/52 group-hover:text-white/76"
)}
>
{step.title}
</span>
{active ? (
<span className="rounded-full border border-emerald-300/30 bg-emerald-400/10 px-2 py-0.5 text-[10px] font-medium text-emerald-200">
当前步骤
</span>
) : null}
</div>
) : null}
</button>
<div className="ml-3 flex min-w-0 flex-1 items-center gap-2 overflow-hidden">
{activeStepChildLabel ? (
<span
className={cn(
"mt-1.5 pl-10 text-[10px] leading-4",
active ? "text-emerald-100/78" : "text-white/28"
"shrink-0 rounded-full border px-2 py-0.5 text-[10px] leading-none",
active
? "border-emerald-300/24 bg-emerald-400/10 text-emerald-100/82"
: "border-white/10 bg-white/[0.04] text-white/38"
)}
>
{activeStepChildLabel}
</span>
) : null}
</button>
{stepSelectedPath.length > 0 ? (
<div className="mt-2 flex flex-wrap gap-1.5 pl-10">
{stepSelectedPath.length > 0 ? (
<div className="agent-dark-scrollbar flex min-w-0 flex-1 items-center gap-1.5 overflow-x-auto pb-1">
{stepSelectedPath.map((option, optionIndex) => {
const optionDepth = optionIndex + 1;
const optionLevelActive =
@ -818,12 +819,13 @@ export function AgentWorkflowPanelDarkV2({
</button>
);
})}
</div>
) : (
<span className="mt-1.5 pl-10 text-[10px] leading-4 text-white/32">
待选择
</span>
)}
</div>
) : (
<span className="truncate text-[10px] leading-4 text-white/32">
待选择
</span>
)}
</div>
{stepIndex < flattenedResolvedSteps.length - 1 ? (
<div
className={cn(