feat: add roundtable chain rail scroll
This commit is contained in:
董宏凯 committed
1 parent
2215ec3c49
commit
3e51208024
1 file changed
+51
-27
@@ -2729,7 +2729,8 @@ function LeftSidebar({
|
||||
ref={dzRef}
|
||||
id="left-sidebar"
|
||||
className={cn(
|
||||
"shrink-0 flex flex-col gap-3 overflow-y-auto pr-1 transition-[width] duration-200 ease-out",
|
||||
"min-h-0 shrink-0 flex flex-col gap-3 pr-1 transition-[width] duration-200 ease-out",
|
||||
isStep2 ? "overflow-y-auto" : "overflow-hidden",
|
||||
isStep2 && !sidebarExpanded ? "w-[56px]" : "w-[280px]",
|
||||
)}
|
||||
>
|
||||
@@ -2911,6 +2912,7 @@ function RoundtableEntryRail({
|
||||
businessCode?: string | null;
|
||||
}) {
|
||||
const [chains, setChains] = useState<BusinessChain[]>([]);
|
||||
const [chainSectionExpanded, setChainSectionExpanded] = useState(true);
|
||||
const [expandedChainId, setExpandedChainId] = useState<string | null>(null);
|
||||
const { drafts: records, refresh } = useRoundtableDrafts(taskId);
|
||||
// 分析记录「按业务链筛选」—— 选项从已加载草稿的 chainTitle 去重得到，
|
||||
@@ -2961,7 +2963,7 @@ function RoundtableEntryRail({
|
||||
let cancelled = false;
|
||||
void listChains("public")
|
||||
.then((all) => {
|
||||
if (!cancelled) setChains(all.slice(0, 3));
|
||||
if (!cancelled) setChains(all);
|
||||
})
|
||||
.catch(() => {
|
||||
/* 业务链非关键，静默忽略 */
|
||||
@@ -2985,7 +2987,7 @@ function RoundtableEntryRail({
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex min-h-0 flex-1 flex-col gap-3">
|
||||
{/* 深链接（taskId）模式：左上角展示「当前任务」（rwfx/3qfx）或「当前行动」（xdfx），替代业务链选择。 */}
|
||||
{deeplink ? (
|
||||
isXdfx ? (
|
||||
@@ -3028,33 +3030,50 @@ function RoundtableEntryRail({
|
||||
</div>
|
||||
)
|
||||
) : (
|
||||
/* 业务链（公共，前 3 个） */
|
||||
/* 业务链（公共列表，内部滚动） */
|
||||
<div className="bg-white border border-[#ECE7E4] rounded-2xl p-4 shadow-[0_4px_20px_rgba(0,0,0,0.02)] transition-shadow duration-300 hover:shadow-[0_4px_24px_rgba(45,37,34,0.04)]">
|
||||
<div className="flex items-center gap-2 mb-3">
|
||||
<div className={cn("flex items-center gap-2", chainSectionExpanded && "mb-3")}>
|
||||
<span className="flex items-center justify-center w-5 h-5 rounded-md bg-primary text-primary-foreground">
|
||||
<Layers className="w-3 h-3" strokeWidth={2.5} />
|
||||
</span>
|
||||
<h2 className="text-sm font-semibold tracking-wide text-slate-900">业务链</h2>
|
||||
<span className="ml-auto shrink-0 rounded-full bg-neutral-100 px-1.5 py-0.5 text-[10px] font-semibold text-neutral-500">
|
||||
{chains.length}
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setChainSectionExpanded((v) => !v)}
|
||||
title={chainSectionExpanded ? "收起业务链" : "展开业务链"}
|
||||
aria-expanded={chainSectionExpanded}
|
||||
className="flex h-6 w-6 shrink-0 items-center justify-center rounded-md border border-[#ECE7E4] text-neutral-400 transition-colors hover:border-primary/30 hover:text-primary"
|
||||
>
|
||||
{chainSectionExpanded ? (
|
||||
<ChevronUp className="h-3.5 w-3.5" />
|
||||
) : (
|
||||
<ChevronDown className="h-3.5 w-3.5" />
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
{chains.length === 0 ? (
|
||||
{chainSectionExpanded && chains.length === 0 ? (
|
||||
<p className="text-xs text-slate-400 py-1.5">暂无公共业务链</p>
|
||||
) : (
|
||||
<div className="flex flex-col gap-2.5">
|
||||
{chains.map((chain) => {
|
||||
const selected = selectedChainId === chain.id;
|
||||
const graphOpen = expandedChainId === chain.id;
|
||||
const stageGroups = getChainStageGroups(chain);
|
||||
let seatColorIndex = 0;
|
||||
return (
|
||||
<div
|
||||
key={chain.id}
|
||||
className={cn(
|
||||
"rounded-xl border transition-all duration-200",
|
||||
selected
|
||||
? "border-primary/25 bg-primary/5 ring-1 ring-primary/20 shadow-sm"
|
||||
: "border-[#ECE7E4] bg-neutral-50/50 hover:border-neutral-300 hover:bg-neutral-50",
|
||||
)}
|
||||
>
|
||||
) : chainSectionExpanded ? (
|
||||
<div className="max-h-[360px] overflow-y-auto pr-1 -mr-1 custom-scrollbar">
|
||||
<div className="flex flex-col gap-2.5 py-0.5">
|
||||
{chains.map((chain) => {
|
||||
const selected = selectedChainId === chain.id;
|
||||
const graphOpen = expandedChainId === chain.id;
|
||||
const stageGroups = getChainStageGroups(chain);
|
||||
let seatColorIndex = 0;
|
||||
return (
|
||||
<div
|
||||
key={chain.id}
|
||||
className={cn(
|
||||
"rounded-xl border transition-all duration-200",
|
||||
selected
|
||||
? "border-primary/25 bg-primary/5 ring-1 ring-primary/20 shadow-sm"
|
||||
: "border-[#ECE7E4] bg-neutral-50/50 hover:border-neutral-300 hover:bg-neutral-50",
|
||||
)}
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => onSelectChain(chain)}
|
||||
@@ -3203,10 +3222,15 @@ function RoundtableEntryRail({
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<p className="pt-2 text-[10px] font-medium text-neutral-400">
|
||||
已收起，可展开查看全部公共业务链。
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@@ -3342,7 +3366,7 @@ function RoundtableEntryRail({
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in new issue
Block a user