duxingchen/track
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 箭头语义方向修正—永远背离主干指向分支(左翼◀+右翼▶)

Browse Source
This commit is contained in:
duxingchen
2026-08-10 13:29:35 +08:00
parent fba3589d0d
commit 4d93844637
1 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/components/TaskTree/TaskFlowView.tsx
View File

@ -18,6 +18,10 @@ function active(s: string) { return s === "WIP" || s === "PENDING"; }
function ArrowRight({ color = "#9ca3af" }: { color?: string }) {
return <svg className="h-3 w-3 shrink-0" viewBox="0 0 8 8"><polygon points="0,0 8,4 0,8" fill={color} /></svg>;
}
/** 微型左箭头 SVG */
function ArrowLeft({ color = "#9ca3af" }: { color?: string }) {
return <svg className="h-3 w-3 shrink-0" viewBox="0 0 8 8"><polygon points="8,0 0,4 8,8" fill={color} /></svg>;
}
function parseImages(s: string | null | undefined): string[] { if (!s) return []; try { return JSON.parse(s); } catch { return []; } }
function imageUrl(u: string) { if (!u) return ""; return u.startsWith("http") ? u : import.meta.env.VITE_API_BASE_URL + (u.startsWith("/") ? u : "/" + u); }
@ -144,10 +148,10 @@ export const TaskFlowView = memo(function TaskFlowView({ tasks, onAction, curren
return (
<div key={t.id} className="flex items-center">
<SlimCard task={t} active legacy={isLegacy} assigneeName={assigneeNames?.[t.assignee_id || ""]} onAction={onAction} currentUser={currentUser} onViewRecords={setRecordsTask} />
{/* 连线+箭头 → 右侧指向中央 */}
{/* 左翼：箭头 ◀ 指向分支卡片（背离中央主干） */}
<div className="flex items-center">
<ArrowLeft color={isLegacy ? "#fdba74" : "#9ca3af"} />
<div className={`w-5 border-t-2 ${isLegacy ? "border-dashed border-orange-300" : "border-solid border-gray-400"}`} />
<ArrowRight color={isLegacy ? "#fdba74" : "#9ca3af"} />
</div>
</div>
);
@ -163,10 +167,10 @@ export const TaskFlowView = memo(function TaskFlowView({ tasks, onAction, curren
const isLegacy = legacySubs.includes(t);
return (
<div key={t.id} className="flex items-center">
{/* 连线+箭头 → 右侧指向外侧 */}
{/* 右翼：箭头 ▶ 指向分支卡片（背离中央主干） */}
<div className="flex items-center">
<ArrowRight color={isLegacy ? "#fdba74" : "#9ca3af"} />
<div className={`w-5 border-t-2 ${isLegacy ? "border-dashed border-orange-300" : "border-solid border-gray-400"}`} />
<ArrowRight color={isLegacy ? "#fdba74" : "#9ca3af"} />
</div>
<SlimCard task={t} active legacy={isLegacy} assigneeName={assigneeNames?.[t.assignee_id || ""]} onAction={onAction} currentUser={currentUser} onViewRecords={setRecordsTask} />
</div>
@ -203,8 +207,8 @@ export const TaskFlowView = memo(function TaskFlowView({ tasks, onAction, curren
<SlimCard task={c} active={active(c.status)} legacy={lineStyle}
assigneeName={assigneeNames?.[c.assignee_id || ""]} onAction={onAction} currentUser={currentUser} onViewRecords={setRecordsTask} />
<div className="flex items-center">
<ArrowLeft color={lineStyle ? "#fdba74" : "#9ca3af"} />
<div className={`w-5 border-t-2 ${lineStyle ? "border-dashed border-orange-300" : "border-solid border-gray-400"}`} />
<ArrowRight color={lineStyle ? "#fdba74" : "#9ca3af"} />
</div>
</div>
))}
@ -222,8 +226,8 @@ export const TaskFlowView = memo(function TaskFlowView({ tasks, onAction, curren
{rightChildren.map(c => (
<div key={c.id} className="flex items-center">
<div className="flex items-center">
<ArrowRight color={lineStyle ? "#fdba74" : "#9ca3af"} />
<div className={`w-5 border-t-2 ${lineStyle ? "border-dashed border-orange-300" : "border-solid border-gray-400"}`} />
<ArrowRight color={lineStyle ? "#fdba74" : "#9ca3af"} />
</div>
<SlimCard task={c} active={active(c.status)} legacy={lineStyle}
assigneeName={assigneeNames?.[c.assignee_id || ""]} onAction={onAction} currentUser={currentUser} onViewRecords={setRecordsTask} />