feat(web): add segmented asset topology paths

2026-10-28 17:13:50 +08:00 · 2026-10-28 15:48:58 +08:00
5 changed files with 267 additions and 131 deletions
@@ -24,6 +24,16 @@ const autoDefaultTmpl = `你是 **Auto**，这个渗透测试平台的「操作
 - 用人话简洁汇报你做了什么、结果如何；只根据工具真实返回作答，不臆造。
 - 只在授权范围内操作。`

+// assetMapperDefaultTmpl is the read-only assistant behind the topology canvas.
+const assetMapperDefaultTmpl = `你是授权渗透测试平台的「资产梳理」Agent。你的职责是根据资产库中的真实数据，整理公网、边界服务和内网业务资产之间的关系，并解释用户指定的入站路径。
+
+工作规则：
+- 先使用 list_assets 和 list_companies 获取事实，再给出结论；没有证据的关系标记为“待验证”，不要臆造。
+- 识别域名、子域名、IP、服务、应用和端点之间的关联，说明数据来源和最近更新时间。
+- 用户询问“从哪里进入内网”时，按“公网入口 → 边界服务 → 目标资产”的顺序回答；当前资产库没有网络流量或防火墙证据时，明确说明这是资产关系推导，不把它描述成已验证的网络通路。
+- 用简洁中文输出，优先给出资产清单、关系链、可信度和下一步验证建议。
+- 只读分析，不主动修改资产库，不执行探测。`
+
 // pentestDefaultTmpl is the built-in "渗透测试" (solo pentest) agent's prompt. Unlike
 // the orchestration roles (goals/planner/worker), it runs standalone via the chat page
 // and is its own planner + executor + auditor. Default tools: list_assets / insert_assets
@@ -112,11 +122,12 @@ const ReporterDefaultPrompt = `你是一个授权渗透测试系统里的**漏
 // source while the same string stays as the in-code render fallback.
 func BuiltinPromptSeeds() map[string]string {
 	return map[string]string{
-		"goals":     goalsDefaultTmpl,
-		"planner":   plannerDefaultTmpl,
-		"mainagent": mainAgentDefaultTmpl,
-		"worker":    workerDefaultTmpl,
-		"auto":      autoDefaultTmpl,
-		"pentest":   pentestDefaultTmpl,
+		"goals":        goalsDefaultTmpl,
+		"planner":      plannerDefaultTmpl,
+		"mainagent":    mainAgentDefaultTmpl,
+		"worker":       workerDefaultTmpl,
+		"auto":         autoDefaultTmpl,
+		"asset_mapper": assetMapperDefaultTmpl,
+		"pentest":      pentestDefaultTmpl,
 	}
 }
@@ -43,6 +43,8 @@ func builtinToolsByAgent() map[string][]actool.CoreTool {
 		// auto 默认绑漏洞上报 + 资产管理工具，其他域工具可在 UI 按需勾选。
 		// 新库由此 seed 写入；老库由 seedAutoDefaultBindings 迁移。
 		"auto": {ts.addFinding(), ts.insertAssets(), ts.addCompanyScope(), ts.listAssets(), ts.listCompanies()},
+		// asset_mapper 只读资产库，供资产梳理和拓扑解释使用。
+		"asset_mapper": {ts.listAssets(), ts.listCompanies()},
 		// pentest（独立渗透 agent）默认绑：查资产 / 插资产 / 报漏洞 / 查漏洞 / 查企业。
 		// 新库由此 seed 写入；老库由 seedPentestDefaultBindings 迁移。
 		"pentest": {ts.listAssets(), ts.insertAssets(), ts.addFinding(), ts.listFindings(), ts.listCompanies()},
@@ -62,7 +64,7 @@ var defaultUnbound = map[string]bool{"goal_met": true}
 // 多个 agent 都有）合成一条，Agents 取并集；defaultUnbound 里的工具则强制绑定为空。
 func BuiltinToolSeeds() []ToolSeed {
 	byAgent := builtinToolsByAgent()
-	order := []string{"mainagent", "goals", "planner", "worker", "auto", "pentest"}
+	order := []string{"mainagent", "goals", "planner", "worker", "auto", "asset_mapper", "pentest"}

 	type acc struct {
 		tool   actool.CoreTool
@@ -209,6 +209,8 @@ var builtinAgents = []builtinAgent{
 	}, false, nil},
 	// Auto:内置「平台操作」agent。不参与渗透编排循环,经对话页驱动,用工具操作平台。
 	{"auto", "Auto", "assistant", "平台操作助手：用工具管理任务(建/看/暂停/给提示)与资产，并可创建/修改 skill、自定义工具、MCP。", nil, false, nil},
+	// Asset mapper: read-only assistant used by the topology canvas and asset views.
+	{"asset_mapper", "资产梳理", "assistant", "资产梳理助手：汇总公网、边界与内网资产关系，基于真实资产数据解释入站路径，不凭空推断连接。", nil, false, nil},
 	// 渗透测试:内置「独立渗透」agent。经对话页驱动,一人从侦察到收尾走完整条渗透链,自己规划自己执行自己验证。默认开启交互式 shell。
 	{"pentest", "渗透测试", "assistant", "独立渗透 agent：一人从侦察→找攻击面→深入利用→验证→收尾走完整条链，自己规划、自己执行、自己对抗式验证。", nil, true, intp(0)},
 }
@@ -182,6 +182,7 @@ function FindingDetailInner() {
                  <p className="text-sm leading-relaxed whitespace-pre-wrap">{finding.summary || "（无摘要）"}</p>
                </CardContent>
              </Card>
+              <FindingRetestPanel key={`retest:${id}`} findingId={id} readOnly={finding.inherited} onCompleted={load} />
              <Card>
                <CardHeader>
                  <CardTitle className="text-sm">证据 / PoC</CardTitle>
@@ -225,120 +226,112 @@ function FindingDetailInner() {
            </div>

            {/* 右栏：状态区 */}
-            <div className="flex min-w-0 flex-col gap-4 lg:sticky lg:top-24 lg:self-start">
-              <Card className="h-fit">
-                <CardHeader>
-                  <CardTitle className="text-sm">状态</CardTitle>
-                </CardHeader>
-                <CardContent className="divide-y">
-                  {/* 漏洞 ID */}
-                  <FieldRow label="漏洞 ID">
-                    <code className="rounded bg-muted px-1.5 py-0.5 font-mono text-xs text-muted-foreground">
-                      #{finding.id}
-                    </code>
-                  </FieldRow>
+            <Card className="h-fit lg:sticky lg:top-24">
+              <CardHeader>
+                <CardTitle className="text-sm">状态</CardTitle>
+              </CardHeader>
+              <CardContent className="divide-y">
+                {/* 漏洞 ID */}
+                <FieldRow label="漏洞 ID">
+                  <code className="rounded bg-muted px-1.5 py-0.5 font-mono text-xs text-muted-foreground">
+                    #{finding.id}
+                  </code>
+                </FieldRow>

-                  {/* 严重等级 */}
-                  <FieldRow label="严重等级">
-                    {finding.inherited ? (
-                      <StatusBadge domain="severity" value={finding.severity} dot />
-                    ) : (
-                      <Select value={finding.severity} onValueChange={(v) => changeSeverity(v as Severity)}>
-                        <SelectTrigger size="sm" className="h-7 w-auto border-none px-1 shadow-none focus-visible:ring-0">
-                          <StatusBadge domain="severity" value={finding.severity} dot />
-                        </SelectTrigger>
-                        <SelectContent position="popper" align="end">
-                          <SelectGroup>
-                            {SEVERITIES.map((sv) => (
-                              <SelectItem key={sv} value={sv}>
-                                {statusMeta("severity", sv).label}
-                              </SelectItem>
-                            ))}
-                          </SelectGroup>
-                        </SelectContent>
-                      </Select>
-                    )}
-                  </FieldRow>
+                {/* 严重等级 */}
+                <FieldRow label="严重等级">
+                  {finding.inherited ? (
+                    <StatusBadge domain="severity" value={finding.severity} dot />
+                  ) : (
+                    <Select value={finding.severity} onValueChange={(v) => changeSeverity(v as Severity)}>
+                      <SelectTrigger size="sm" className="h-7 w-auto border-none px-1 shadow-none focus-visible:ring-0">
+                        <StatusBadge domain="severity" value={finding.severity} dot />
+                      </SelectTrigger>
+                      <SelectContent position="popper" align="end">
+                        <SelectGroup>
+                          {SEVERITIES.map((sv) => (
+                            <SelectItem key={sv} value={sv}>
+                              {statusMeta("severity", sv).label}
+                            </SelectItem>
+                          ))}
+                        </SelectGroup>
+                      </SelectContent>
+                    </Select>
+                  )}
+                </FieldRow>

-                  {/* 处理状态 */}
-                  <FieldRow label="处理状态">
-                    {finding.inherited ? (
-                      <StatusBadge domain="finding" value={finding.status} dot />
-                    ) : (
-                      <Select value={finding.status} onValueChange={(v) => changeStatus(v as FindingStatus)}>
-                        <SelectTrigger size="sm" className="h-7 w-auto border-none px-1 shadow-none focus-visible:ring-0">
-                          <StatusBadge domain="finding" value={finding.status} dot />
-                        </SelectTrigger>
-                        <SelectContent position="popper" align="end">
-                          <SelectGroup>
-                            {FINDING_STATUSES.map((st) => (
-                              <SelectItem key={st} value={st}>
-                                {statusMeta("finding", st).label}
-                              </SelectItem>
-                            ))}
-                          </SelectGroup>
-                        </SelectContent>
-                      </Select>
-                    )}
-                  </FieldRow>
+                {/* 处理状态 */}
+                <FieldRow label="处理状态">
+                  {finding.inherited ? (
+                    <StatusBadge domain="finding" value={finding.status} dot />
+                  ) : (
+                    <Select value={finding.status} onValueChange={(v) => changeStatus(v as FindingStatus)}>
+                      <SelectTrigger size="sm" className="h-7 w-auto border-none px-1 shadow-none focus-visible:ring-0">
+                        <StatusBadge domain="finding" value={finding.status} dot />
+                      </SelectTrigger>
+                      <SelectContent position="popper" align="end">
+                        <SelectGroup>
+                          {FINDING_STATUSES.map((st) => (
+                            <SelectItem key={st} value={st}>
+                              {statusMeta("finding", st).label}
+                            </SelectItem>
+                          ))}
+                        </SelectGroup>
+                      </SelectContent>
+                    </Select>
+                  )}
+                </FieldRow>

-                  {/* 漏洞类型 */}
-                  <FieldRow label="漏洞类型">
-                    {finding.vulnclass ? (
-                      <code className="rounded bg-muted px-1.5 py-0.5 font-mono text-xs">{finding.vulnclass}</code>
-                    ) : (
-                      <span className="text-muted-foreground">—</span>
-                    )}
-                  </FieldRow>
+                {/* 漏洞类型 */}
+                <FieldRow label="漏洞类型">
+                  {finding.vulnclass ? (
+                    <code className="rounded bg-muted px-1.5 py-0.5 font-mono text-xs">{finding.vulnclass}</code>
+                  ) : (
+                    <span className="text-muted-foreground">—</span>
+                  )}
+                </FieldRow>

-                  {/* 涉及资产 */}
-                  <FieldRow label="涉及资产">
-                    {finding.assets && finding.assets.length > 0 ? (
-                      <div className="flex flex-wrap justify-end gap-1">
-                        {finding.assets.map((a) => (
-                          <code
-                            key={a.id}
-                            className="max-w-[16rem] truncate rounded bg-muted px-1.5 py-0.5 font-mono text-xs"
-                            title={`${a.type} · ${a.label}`}
-                          >
-                            {a.label}
-                          </code>
-                        ))}
-                      </div>
-                    ) : (
-                      <span className="text-muted-foreground">—</span>
-                    )}
-                  </FieldRow>
+                {/* 涉及资产 */}
+                <FieldRow label="涉及资产">
+                  {finding.assets && finding.assets.length > 0 ? (
+                    <div className="flex flex-wrap justify-end gap-1">
+                      {finding.assets.map((a) => (
+                        <code
+                          key={a.id}
+                          className="max-w-[16rem] truncate rounded bg-muted px-1.5 py-0.5 font-mono text-xs"
+                          title={`${a.type} · ${a.label}`}
+                        >
+                          {a.label}
+                        </code>
+                      ))}
+                    </div>
+                  ) : (
+                    <span className="text-muted-foreground">—</span>
+                  )}
+                </FieldRow>

-                  {/* 所属任务 */}
-                  <FieldRow label="所属任务">
-                    {finding.task_id ? (
-                      <Link
-                        href={`/function/tasks/detail?id=${finding.task_id}`}
-                        className="inline-flex max-w-[16rem] items-center gap-1 text-primary hover:underline"
-                        title={finding.task_description}
-                      >
-                        <span className="truncate">{finding.task_description || `#${finding.task_id}`}</span>
-                        <ArrowUpRightIcon className="size-3 shrink-0" />
-                      </Link>
-                    ) : (
-                      <span className="text-muted-foreground">—（任务已删除）</span>
-                    )}
-                  </FieldRow>
+                {/* 所属任务 */}
+                <FieldRow label="所属任务">
+                  {finding.task_id ? (
+                    <Link
+                      href={`/function/tasks/detail?id=${finding.task_id}`}
+                      className="inline-flex max-w-[16rem] items-center gap-1 text-primary hover:underline"
+                      title={finding.task_description}
+                    >
+                      <span className="truncate">{finding.task_description || `#${finding.task_id}`}</span>
+                      <ArrowUpRightIcon className="size-3 shrink-0" />
+                    </Link>
+                  ) : (
+                    <span className="text-muted-foreground">—（任务已删除）</span>
+                  )}
+                </FieldRow>

-                  {/* 发现时间 */}
-                  <FieldRow label="发现时间">
-                    <span className="tabular-nums">{fmtTime(finding.ts)}</span>
-                  </FieldRow>
-                </CardContent>
-              </Card>
-              <FindingRetestPanel
-                key={`retest:${id}`}
-                findingId={id}
-                readOnly={finding.inherited}
-                onCompleted={load}
-              />
-            </div>
+                {/* 发现时间 */}
+                <FieldRow label="发现时间">
+                  <span className="tabular-nums">{fmtTime(finding.ts)}</span>
+                </FieldRow>
+              </CardContent>
+            </Card>
          </div>
        </TabsContent>

@@ -34,6 +34,34 @@ const FOLD_STEP = 20;

 type Kind = CoverageGraphNode["kind"];

+type Zone = "internet" | "boundary" | "internal";
+
+const zoneMeta: Record<Zone, { label: string; description: string; className: string }> = {
+  internet: {
+    label: "互联网区",
+    description: "公网域名 / 外部入口",
+    className: "bg-sky-50/70 dark:bg-sky-950/20",
+  },
+  boundary: {
+    label: "边界区",
+    description: "服务 / 网关 / 暴露面",
+    className: "bg-amber-50/70 dark:bg-amber-950/15",
+  },
+  internal: {
+    label: "内网区",
+    description: "业务资产 / 应用 / 端点",
+    className: "bg-emerald-50/65 dark:bg-emerald-950/15",
+  },
+};
+
+// 当前后端资产关系以域名、服务和业务资产为主，先用类型推导可视化分区。
+// 后续接入 VPC/网段/防火墙数据后，可以直接由 API 返回 zone 覆盖这里的推导结果。
+function zoneOf(node: CoverageGraphNode): Zone {
+  if (node.kind === "root_domain" || node.kind === "subdomain") return "internet";
+  if (node.kind === "service") return "boundary";
+  return "internal";
+}
+
 type KindMeta = { label: string; icon: LucideIcon; iconBg: string; hex: string; size: number };

 const kindMeta: Record<Kind, KindMeta> = {
@@ -185,8 +213,11 @@ type G6NodeDatum = {
  inScope: boolean;
  lbl: string;
  size: number;
+  active: boolean;
 };

+type G6EdgeDatum = { source: string; target: string; active: boolean };
+
 function trunc(s: string, n = 26): string {
  return s.length > n ? `${s.slice(0, n - 1)}…` : s;
 }
@@ -211,7 +242,7 @@ function graphLabel(n: CoverageGraphNode): string {
  return n.label;
 }

-function toG6Nodes(renderNodes: RenderNode[]): G6NodeDatum[] {
+function toG6Nodes(renderNodes: RenderNode[], activeKeys: Set<string>): G6NodeDatum[] {
  return renderNodes.map((rn) => {
    if (rn.fold) {
      return {
@@ -222,6 +253,7 @@ function toG6Nodes(renderNodes: RenderNode[]): G6NodeDatum[] {
        inScope: false,
        lbl: `还有 ${rn.hidden.length} 个${kindMeta[rn.kind].label}`,
        size: 24,
+        active: activeKeys.has(rn.key),
      };
    }
    return {
@@ -232,6 +264,7 @@ function toG6Nodes(renderNodes: RenderNode[]): G6NodeDatum[] {
      inScope: rn.node.in_scope,
      lbl: trunc(graphLabel(rn.node) || kindMeta[rn.kind].label),
      size: kindMeta[rn.kind].size,
+      active: activeKeys.has(rn.key),
    };
  });
 }
@@ -248,6 +281,7 @@ function nodeFill(d: G6NodeDatum): string {
  return "#94a3b8";
 }
 function nodeStroke(d: G6NodeDatum): string {
+  if (d.active) return "#0f766e";
  if (d.fold || !d.inScope) return "#94a3b8";
  if (d.tested) return "#0f766e";
  return "#64748b";
@@ -464,16 +498,19 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
  const [expanded, setExpanded] = React.useState<Map<string, number>>(new Map());
  const [selectedAsset, setSelectedAsset] = React.useState<CoverageGraphNode | null>(null);
  const [selectedFoldId, setSelectedFoldId] = React.useState<string | null>(null);
+  const [activePath, setActivePath] = React.useState<string[]>([]);
  const [loading, setLoading] = React.useState(true);
+  const [lastSyncedAt, setLastSyncedAt] = React.useState<Date | null>(null);

  const containerRef = React.useRef<HTMLDivElement>(null);
  const graphRef = React.useRef<G6Graph | null>(null);
  // click 处理需要最新的 key→RenderNode 映射（G6 事件回调闭包外读 ref）。
  const renderMapRef = React.useRef<Map<string, RenderNode>>(new Map());
-  const gDataRef = React.useRef<{ nodes: G6NodeDatum[]; edges: { source: string; target: string }[] }>({
+  const gDataRef = React.useRef<{ nodes: G6NodeDatum[]; edges: G6EdgeDatum[] }>({
    nodes: [],
    edges: [],
  });
+  const graphDataRef = React.useRef<typeof data>(null);

  const fetchGraph = React.useCallback(() => {
    setLoading(true);
@@ -484,6 +521,8 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
        // tested 状态——不显示测试进度、不做已测高亮。
        const nodes = coverageEnabled ? (g.nodes ?? []) : (g.nodes ?? []).map((n) => ({ ...n, tested: false }));
        setData({ nodes, edges: g.edges ?? [] });
+        graphDataRef.current = { nodes, edges: g.edges ?? [] };
+        setLastSyncedAt(new Date());
      })
      .catch(() => {
        /* 保留上一次数据 */
@@ -506,14 +545,18 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
  // 结构签名：只在可见节点/边集合变化时重建图 + 重跑布局，避免无谓抖动。
  const sig = React.useMemo(
    () =>
-      `${renderNodes.map((n) => `${n.key}:${n.fold ? "f" : n.node.tested ? "t" : "u"}`).sort().join(",")}|${renderEdges.length}`,
-    [renderNodes, renderEdges],
+      `${renderNodes.map((n) => `${n.key}:${n.fold ? "f" : n.node.tested ? "t" : "u"}`).sort().join(",")}|${renderEdges.length}|${activePath.join(",")}`,
+    [activePath, renderNodes, renderEdges],
  );

  // 维护 gDataRef + renderMapRef（供事件与图数据应用读取）。
  gDataRef.current = {
-    nodes: toG6Nodes(renderNodes),
-    edges: renderEdges.map((e) => ({ source: e.src, target: e.dst })),
+    nodes: toG6Nodes(renderNodes, new Set(activePath)),
+    edges: renderEdges.map((e) => ({
+      source: e.src,
+      target: e.dst,
+      active: activePath.includes(e.src) && activePath.includes(e.dst),
+    })),
  };
  const rmap = new Map<string, RenderNode>();
  for (const rn of renderNodes) rmap.set(rn.key, rn);
@@ -542,7 +585,7 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
        container: containerRef.current,
        autoResize: true,
        autoFit: "view",
-        background: "#f0f2f7",
+        background: "transparent",
        node: {
          style: {
            size: (d: unknown) => nd(d).size,
@@ -561,10 +604,18 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
            labelBackgroundFill: "rgba(255,255,255,0.75)",
            labelBackgroundRadius: 3,
            labelPadding: [1, 3],
+            opacity: (d: unknown) =>
+              gDataRef.current.nodes.some((node) => node.active) && !nd(d).active ? 0.28 : 1,
          },
        },
        edge: {
-          style: { stroke: "#cbd5e1", lineWidth: 1, endArrow: false },
+          style: {
+            stroke: (d: unknown) => ((d as G6EdgeDatum).active ? "#0f766e" : "#cbd5e1"),
+            lineWidth: (d: unknown) => ((d as G6EdgeDatum).active ? 2.5 : 1),
+            opacity: (d: unknown) =>
+              gDataRef.current.edges.some((edge) => edge.active) && !(d as G6EdgeDatum).active ? 0.18 : 1,
+            endArrow: true,
+          },
        },
        layout: {
          type: "d3-force",
@@ -590,8 +641,22 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
        if (!id) return;
        const rn = renderMapRef.current.get(id);
        if (!rn) return;
-        if (rn.fold) setSelectedFoldId(rn.key);
-        else setSelectedAsset(rn.node);
+        if (rn.fold) {
+          setSelectedFoldId(rn.key);
+          return;
+        }
+        setSelectedAsset(rn.node);
+        const parents = new Map<string, string>();
+        for (const edge of graphDataRef.current?.edges ?? []) {
+          if (!parents.has(edge.src)) parents.set(edge.src, edge.dst);
+        }
+        const lineage: string[] = [];
+        let cursor: string | undefined = rn.node.key;
+        while (cursor && !lineage.includes(cursor)) {
+          lineage.push(cursor);
+          cursor = parents.get(cursor);
+        }
+        setActivePath(lineage);
      });
      graphRef.current = graph;
      applyData();
@@ -636,14 +701,38 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
  const inScope = data?.nodes.filter((n) => n.in_scope).length ?? 0;

  return (
-    <div className="relative h-full w-full">
-      <div ref={containerRef} className="h-full w-full" />
+    <div className="relative h-full w-full overflow-hidden bg-slate-100/80 dark:bg-slate-950/30">
+      <div className="pointer-events-none absolute inset-0 z-0 grid grid-cols-3">
+        {(Object.keys(zoneMeta) as Zone[]).map((zone, index) => (
+          <div
+            key={zone}
+            className={cn("relative border-r border-slate-200/80 dark:border-slate-800/80", zoneMeta[zone].className, index === 2 && "border-r-0")}
+          >
+            <div className="absolute top-3 left-4">
+              <div className="text-foreground/80 text-sm font-semibold">{zoneMeta[zone].label}</div>
+              <div className="text-muted-foreground mt-0.5 text-[11px]">{zoneMeta[zone].description}</div>
+            </div>
+          </div>
+        ))}
+      </div>
+      <div ref={containerRef} className="relative z-10 h-full w-full pt-12" />

      {/* 图例 + 统计 + 刷新（叠加层） */}
-      <div className="bg-card/95 pointer-events-auto absolute top-3 left-3 flex max-w-[340px] flex-col gap-2.5 rounded-lg border p-3 text-xs shadow-sm backdrop-blur">
+      <div className="bg-card/95 pointer-events-auto absolute top-3 left-3 z-20 flex max-w-[360px] flex-col gap-2.5 rounded-lg border p-3 text-xs shadow-sm backdrop-blur">
        <div className="flex items-center justify-between gap-3">
+          <div className="flex min-w-0 items-center gap-2">
+            <span className="flex size-7 shrink-0 items-center justify-center rounded-md bg-violet-100 text-violet-700 dark:bg-violet-950/60 dark:text-violet-300">
+              <Waypoints className="size-4" />
+            </span>
+            <div className="min-w-0">
+              <div className="text-foreground font-medium">资产梳理 Agent</div>
+              <div className="text-muted-foreground truncate text-[11px]">
+                {loading ? "正在更新资产关系…" : lastSyncedAt ? `最近更新 ${lastSyncedAt.toLocaleTimeString("zh-CN", { hour: "2-digit", minute: "2-digit" })}` : "等待首次梳理"}
+              </div>
+            </div>
+          </div>
          {total > 0 ? (
-            <span className="text-muted-foreground">
+            <span className="text-muted-foreground whitespace-nowrap">
              范围内 <span className="text-foreground font-semibold tabular-nums">{inScope}</span>
              {coverageEnabled && (
                <>
@@ -656,8 +745,9 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
          ) : (
            <span className="text-muted-foreground">{loading ? "加载中…" : "暂无范围内资产（先锚定任务范围）"}</span>
          )}
-          <Button variant="ghost" size="icon" className="size-6" onClick={fetchGraph} title="刷新">
+          <Button variant="outline" size="sm" className="h-7 gap-1.5 px-2" onClick={fetchGraph} title="重新梳理资产">
            <RefreshCw className={cn("size-3.5", loading && "animate-spin")} />
+            <span className="hidden sm:inline">重新梳理</span>
          </Button>
        </div>
        <div className="flex flex-wrap gap-x-3 gap-y-1.5">
@@ -689,11 +779,49 @@ function GraphInner({ taskId, coverageEnabled = true }: { taskId: string; covera
            <span className="size-3 rounded-full border border-dashed border-neutral-400 bg-neutral-200" /> 范围外
          </span>
        </div>
+        <div className="border-border/60 flex flex-wrap gap-x-3 gap-y-1.5 border-t pt-2">
+          {(Object.keys(zoneMeta) as Zone[]).map((zone) => (
+            <span key={zone} className="text-muted-foreground inline-flex items-center gap-1.5">
+              <span className={cn("size-2.5 rounded-full", zone === "internet" && "bg-sky-400", zone === "boundary" && "bg-amber-400", zone === "internal" && "bg-emerald-400")} />
+              {zoneMeta[zone].label}
+            </span>
+          ))}
+        </div>
        <p className="text-muted-foreground/80 border-border/60 border-t pt-2 leading-relaxed">
-          力导向布局，可拖拽节点、滚轮缩放；灰色「⋯」是折叠节点，点开可展开更多。
+          点击节点查看详情并高亮关系链；拖拽节点、滚轮缩放。灰色「⋯」是折叠节点，可展开更多资产。
        </p>
      </div>

+      {selectedAsset && activePath.length > 0 && data && (
+        <div className="bg-card/95 pointer-events-auto absolute top-3 right-3 z-20 w-[min(310px,calc(100%-2rem))] rounded-lg border p-3 shadow-sm backdrop-blur">
+          <div className="flex items-start justify-between gap-3">
+            <div>
+              <div className="text-foreground text-sm font-semibold">关系路径</div>
+              <div className="text-muted-foreground mt-0.5 text-[11px]">从当前资产向上追溯关联关系</div>
+            </div>
+            <Button variant="ghost" size="sm" className="h-7 px-2 text-xs" onClick={() => setActivePath([])}>
+              清除高亮
+            </Button>
+          </div>
+          <div className="mt-3 flex flex-col gap-1.5">
+            {[...activePath].reverse().map((key, index, path) => {
+              const node = data.nodes.find((item) => item.key === key);
+              if (!node) return null;
+              return (
+                <React.Fragment key={key}>
+                  <div className="flex min-w-0 items-center gap-2 rounded-md bg-muted/60 px-2 py-1.5 text-xs">
+                    <span className={cn("size-2 shrink-0 rounded-full", zoneOf(node) === "internet" && "bg-sky-500", zoneOf(node) === "boundary" && "bg-amber-500", zoneOf(node) === "internal" && "bg-emerald-500")} />
+                    <span className="text-muted-foreground shrink-0">{zoneMeta[zoneOf(node)].label}</span>
+                    <span className="min-w-0 flex-1 truncate font-mono" title={node.label}>{node.label}</span>
+                  </div>
+                  {index < path.length - 1 && <div className="text-muted-foreground pl-3 text-[10px]">↓</div>}
+                </React.Fragment>
+              );
+            })}
+          </div>
+        </div>
+      )}
+
      <AssetSheet node={selectedAsset} taskId={taskId} onOpenChange={(o) => !o && setSelectedAsset(null)} />
      <FoldSheet
        fold={selectedFold}