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

refactor: merge child workflow steps into top navigation
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-25 19:41:18 +08:00
parent cb0c9ebf95
commit 23933cfb41
1 changed files with 28 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
components/agents/AgentWorkflowPanelDarkV2.tsx
View File

@ -634,6 +634,24 @@ export function AgentWorkflowPanelDarkV2({
});
const active = step.key === activeEmbeddedStepEntry.step.key;
const stepSummary = stepSelectionSummaryMap[step.key] || "";
const stepOptionLevels = getWorkflowStepOptionLevels({
step,
selectionValue: selections[step.key],
});
const deepestSelectedLevel = Math.max(
0,
...stepOptionLevels.map((level) => (level.selectedKey ? level.depth : 0))
);
const activeStepChildLabel =
active && stepOptionLevels.length > 1
? `${
activeEmbeddedOptionLevel?.depth === 1
? "主卡片"
: `${activeEmbeddedOptionLevel?.depth || 1}级子卡片`
}`
: deepestSelectedLevel > 1
? `已到 ${deepestSelectedLevel} 级`
: "";
return (
<Fragment key={step.key}>
@ -683,6 +701,16 @@ export function AgentWorkflowPanelDarkV2({
>
{stepSummary || "待选择"}
</span>
{activeStepChildLabel ? (
<span
className={cn(
"mt-1 pl-10 text-[10px] leading-4",
active ? "text-emerald-200/72" : "text-white/28"
)}
>
{activeStepChildLabel}
</span>
) : null}
{stepIndex < flattenedResolvedSteps.length - 1 ? (
<div
className={cn(
@ -700,74 +728,6 @@ export function AgentWorkflowPanelDarkV2({
</div>
</div>
{activeEmbeddedOptionLevels.length > 1 ? (
<div className="rounded-2xl border border-white/10 bg-black/20 p-3">
<div className="mb-3 flex items-center justify-between gap-3">
<div>
<div className="text-xs font-medium text-white/78">子节点流程</div>
<div className="text-[11px] text-white/38">
当前步骤的子节点会在这里逐级展开，减少单屏内容堆积。
</div>
</div>
<div className="rounded-full border border-white/10 bg-white/[0.03] px-3 py-1 text-[11px] text-white/55">
共 {activeEmbeddedOptionLevels.length} 级
</div>
</div>
<div className="flex flex-wrap items-center gap-2">
{activeEmbeddedOptionLevels.map((level, levelIndex) => {
const isActive = level.depth === activeEmbeddedOptionDepth;
const summaryText =
level.selectedOption?.buttonName || "待选择";
return (
<Fragment key={`${activeEmbeddedStepEntry.step.key}-level-${level.depth}`}>
<button
type="button"
onClick={() => setActiveEmbeddedOptionDepth(level.depth)}
className={cn(
"group min-w-0 rounded-2xl border px-3 py-2 text-left transition-all",
isActive
? "border-emerald-300/35 bg-emerald-500/[0.12] shadow-[0_0_18px_rgba(52,211,153,0.12)]"
: "border-white/10 bg-white/[0.03] hover:border-white/18 hover:bg-white/[0.05]"
)}
>
<div className="flex items-center gap-2">
<span
className={cn(
"flex h-5 w-5 items-center justify-center rounded-full text-[10px] font-semibold",
isActive
? "bg-emerald-300 text-black"
: "bg-white/[0.06] text-white/55"
)}
>
{level.depth}
</span>
<span
className={cn(
"text-[12px] font-medium",
isActive ? "text-white" : "text-white/68"
)}
>
{level.depth === 1 ? "主卡片" : `${level.depth}级子卡片`}
</span>
</div>
<div
className={cn(
"mt-1 pl-7 text-[11px]",
isActive ? "text-emerald-100/76" : "text-white/36"
)}
>
{summaryText}
</div>
</button>
{levelIndex < activeEmbeddedOptionLevels.length - 1 ? (
<div className="h-px w-4 bg-white/10" />
) : null}
</Fragment>
);
})}
</div>
</div>
) : null}
</div>
{activeEmbeddedOptionLevel ? (