@yuku123/z-team-component 0.2.80 → 0.2.83

package/dist/index-Cvx6rrxD.js

@@ -0,0 +1,956 @@
+import { jsxs as r, jsx as n, Fragment as H } from "react/jsx-runtime";
+import { BookOutlined as V, ReloadOutlined as Ne, SearchOutlined as fe, CloseOutlined as ge, CaretDownOutlined as ve, CaretRightOutlined as Te } from "@ant-design/icons";
+import { message as Se, Spin as F } from "antd";
+import { useState as k, useRef as M, useEffect as G, useCallback as C } from "react";
+import { a as A, B as R, u as E } from "./api-CIhVblfa.js";
+function B(a) {
+  const l = new URLSearchParams();
+  Object.entries(a).forEach(([N, s]) => {
+    s !== void 0 && s !== "" && l.set(N, String(s));
+  });
+  const h = l.toString();
+  return h ? `?${h}` : "";
+}
+async function we(a = "") {
+  const l = await A(
+    `${R}/admin/biz-knowledge/graph/summary${B({ token: a })}`,
+    O
+  );
+  return E(l, "获取知识图谱概览失败");
+}
+async function Ce(a, l = "") {
+  const h = await A(
+    `${R}/admin/biz-knowledge/graph/entries${B({ type: a, token: l })}`,
+    O
+  );
+  return E(h, "获取入口清单失败");
+}
+async function Z(a, l = "") {
+  const h = await A(
+    `${R}/admin/biz-knowledge/graph/node-tree${B({ id: a, token: l })}`,
+    O
+  );
+  return E(h, "获取节点展开树失败");
+}
+async function $e(a, l = "", h = 60, N = "") {
+  const s = await A(
+    `${R}/admin/biz-knowledge/graph/search${B({
+      q: a,
+      type: l,
+      limit: h,
+      token: N
+    })}`,
+    O
+  );
+  return E(s, "知识图谱搜索失败");
+}
+async function Ie(a, l = "") {
+  const h = await A(
+    `${R}/admin/biz-knowledge/graph/node${B({ id: a, token: l })}`,
+    O
+  );
+  return E(h, "获取节点详情失败");
+}
+async function De(a = "") {
+  const l = await A(
+    `${R}/admin/biz-knowledge/graph/refresh${B({ token: a })}`,
+    { ...O, method: "POST" }
+  );
+  return E(l, "刷新知识图谱失败");
+}
+const O = { credentials: "include" }, ke = "_wrap_hble5_1", Le = "_header_hble5_10", xe = "_headerTitle_hble5_21", Ge = "_headerIcon_hble5_31", Ae = "_headerSub_hble5_36", Re = "_headerStats_hble5_42", Ee = "_statChip_hble5_49", Be = "_statChipWarn_hble5_58", Oe = "_refreshBtn_hble5_63", Pe = "_body_hble5_82", He = "_sidebar_hble5_89", We = "_searchBox_hble5_99", Ke = "_searchIcon_hble5_105", ze = "_searchInput_hble5_115", je = "_sidebarHead_hble5_131", Ve = "_sidebarList_hble5_137", Me = "_listTip_hble5_144", Fe = "_hitItem_hble5_171", qe = "_pageItem_hble5_172", Xe = "_pageItemRow_hble5_180", Ye = "_itemCount_hble5_188", Ue = "_pageItemActive_hble5_203", Je = "_hitName_hble5_207", Qe = "_pageName_hble5_208", Ze = "_hitSub_hble5_215", et = "_pageSub_hble5_216", tt = "_dbGroup_hble5_226", at = "_dbGroupHead_hble5_230", nt = "_dbGroupHeadActive_hble5_247", it = "_dbGroupName_hble5_251", rt = "_dbGroupCount_hble5_259", st = "_entryBar_hble5_269", lt = "_entryTab_hble5_280", ct = "_entryTabActive_hble5_300", ot = "_entryTabCount_hble5_306", dt = "_entryBarHint_hble5_320", mt = "_midArea_hble5_329", ht = "_midTabs_hble5_337", pt = "_midTab_hble5_337", bt = "_midTabActive_hble5_367", ut = "_midTabName_hble5_373", _t = "_midTabClose_hble5_379", yt = "_main_hble5_395", Nt = "_colDragger_hble5_403", ft = "_detailWrap_hble5_419", gt = "_treeArea_hble5_425", vt = "_emptyState_hble5_433", Tt = "_emptyIcon_hble5_445", St = "_emptyTitle_hble5_450", wt = "_emptyDesc_hble5_456", Ct = "_legend_hble5_463", $t = "_legendItem_hble5_471", It = "_treeNode_hble5_480", Dt = "_nodeRow_hble5_484", kt = "_nodeRowGroup_hble5_498", Lt = "_caret_hble5_502", xt = "_dot_hble5_511", Gt = "_groupLabel_hble5_520", At = "_nodeCount_hble5_526", Rt = "_nodeName_hble5_536", Et = "_nodeSub_hble5_542", Bt = "_badge_hble5_551", Ot = "_detailPanel_hble5_564", Pt = "_detailEmpty_hble5_574", Ht = "_detailHead_hble5_581", Wt = "_detailName_hble5_587", Kt = "_detailVid_hble5_594", zt = "_detailSection_hble5_602", jt = "_propRow_hble5_611", Vt = "_propKey_hble5_618", Mt = "_propVal_hble5_627", Ft = "_propList_hble5_635", qt = "_propListItem_hble5_641", Xt = "_propObj_hble5_646", Yt = "_relGroup_hble5_656", Ut = "_relTitle_hble5_660", Jt = "_relNode_hble5_667", Qt = "_relName_hble5_681", Zt = "_relSub_hble5_686", t = {
+  wrap: ke,
+  header: Le,
+  headerTitle: xe,
+  headerIcon: Ge,
+  headerSub: Ae,
+  headerStats: Re,
+  statChip: Ee,
+  statChipWarn: Be,
+  refreshBtn: Oe,
+  body: Pe,
+  sidebar: He,
+  searchBox: We,
+  searchIcon: Ke,
+  searchInput: ze,
+  sidebarHead: je,
+  sidebarList: Ve,
+  listTip: Me,
+  hitItem: Fe,
+  pageItem: qe,
+  pageItemRow: Xe,
+  itemCount: Ye,
+  pageItemActive: Ue,
+  hitName: Je,
+  pageName: Qe,
+  hitSub: Ze,
+  pageSub: et,
+  dbGroup: tt,
+  dbGroupHead: at,
+  dbGroupHeadActive: nt,
+  dbGroupName: it,
+  dbGroupCount: rt,
+  entryBar: st,
+  entryTab: lt,
+  entryTabActive: ct,
+  entryTabCount: ot,
+  entryBarHint: dt,
+  midArea: mt,
+  midTabs: ht,
+  midTab: pt,
+  midTabActive: bt,
+  midTabName: ut,
+  midTabClose: _t,
+  main: yt,
+  colDragger: Nt,
+  detailWrap: ft,
+  treeArea: gt,
+  emptyState: vt,
+  emptyIcon: Tt,
+  emptyTitle: St,
+  emptyDesc: wt,
+  legend: Ct,
+  legendItem: $t,
+  treeNode: It,
+  nodeRow: Dt,
+  nodeRowGroup: kt,
+  caret: Lt,
+  dot: xt,
+  groupLabel: Gt,
+  nodeCount: At,
+  nodeName: Rt,
+  nodeSub: Et,
+  badge: Bt,
+  detailPanel: Ot,
+  detailEmpty: Pt,
+  detailHead: Ht,
+  detailName: Wt,
+  detailVid: Kt,
+  detailSection: zt,
+  propRow: jt,
+  propKey: Vt,
+  propVal: Mt,
+  propList: Ft,
+  propListItem: qt,
+  propObj: Xt,
+  relGroup: Yt,
+  relTitle: Ut,
+  relNode: Jt,
+  relName: Qt,
+  relSub: Zt
+}, ea = {
+  Page: "#34a853",
+  Action: "#4285f4",
+  Chain: "#8b5cf6",
+  ChainStep: "#8c8c8c",
+  Symptom: "#eb2f96",
+  Fix: "#f5222d",
+  Rule: "#d48806",
+  Field: "#fa8c16",
+  Code: "#cf1322",
+  Vo: "13c2c2",
+  Db: "#0369a1",
+  DbTable: "#89620e",
+  DbColumn: "#89620e"
+}, ae = {
+  Page: "页面",
+  Action: "操作",
+  Chain: "因果链",
+  ChainStep: "步骤",
+  Symptom: "症状",
+  Fix: "止血",
+  Rule: "规矩",
+  Field: "数据字段",
+  Code: "代码",
+  Vo: "页面组件",
+  Db: "库",
+  DbTable: "库表",
+  DbColumn: "字段"
+}, ee = [
+  { type: "Page", label: "页面" },
+  { type: "Symptom", label: "症状" },
+  { type: "Chain", label: "因果链" },
+  { type: "DbTable", label: "库表" }
+], ta = {
+  Page: "左侧选择一个业务页面，看懂它的因果链",
+  Symptom: "左侧选择一个症状，看它的止血案例与相关因果链",
+  Chain: "左侧选择一条因果链，看它的步骤、症状与处置",
+  DbTable: "按库浏览：点库名看库下全表，点表中钻看字段与读写引用"
+}, pe = {
+  Page: "操作",
+  Symptom: "止血",
+  Chain: "步骤",
+  DbTable: "字段"
+};
+function X(a, l) {
+  return a.id ? `${l}::${a.id}` : `${l}::${a.label ?? ""}`;
+}
+function q(a, l, h, N) {
+  if (h > 2) return;
+  const s = X(a, l);
+  if (N.add(s), a.type === "Db" && h === 0) {
+    (a.children ?? []).forEach((f) => N.add(X(f, s)));
+    return;
+  }
+  (a.children ?? []).forEach(
+    (f) => q(f, s, h + 1, N)
+  );
+}
+function aa(a) {
+  const l = a.indexOf(":");
+  return l > 0 ? a.slice(0, l) : a;
+}
+function na(a) {
+  return !a || !Number.isFinite(a) ? "已加载" : `${new Date(a).toLocaleTimeString()} 加载`;
+}
+function ia() {
+  return {
+    loaded: !1,
+    listLoading: !1,
+    list: [],
+    query: "",
+    hits: null,
+    searching: !1,
+    primary: null,
+    extra: [],
+    activeKey: null
+  };
+}
+const te = ia();
+function pa() {
+  var oe, de, me;
+  const [a, l] = k(null), [h, N] = k({}), [s, f] = k("Page"), [b, T] = k(
+    null
+  ), [_, L] = k(!1), x = M(0), w = M(h);
+  G(() => {
+    w.current = h;
+  }, [h]);
+  const P = M(s);
+  G(() => {
+    P.current = s;
+  }, [s]);
+  const [$, Y] = k(() => {
+    const e = Number(localStorage.getItem("ktab_left_w"));
+    return Number.isFinite(e) && e >= 220 && e <= 520 ? e : 300;
+  }), [ne, ue] = k(() => {
+    const e = Number(localStorage.getItem("ktab_right_w"));
+    return Number.isFinite(e) && e >= 260 && e <= 640 ? e : 360;
+  }), K = M(null), ie = (e) => (i) => {
+    i.preventDefault(), K.current = {
+      side: e,
+      startX: i.clientX,
+      startW: e === "left" ? $ : ne
+    }, document.body.style.userSelect = "none";
+  };
+  G(() => {
+    const e = (c) => {
+      const d = K.current;
+      if (d)
+        if (d.side === "left") {
+          const o = Math.min(
+            520,
+            Math.max(220, d.startW + (c.clientX - d.startX))
+          );
+          Y(o), localStorage.setItem("ktab_left_w", String(o));
+        } else {
+          const o = Math.min(
+            640,
+            Math.max(260, d.startW - (c.clientX - d.startX))
+          );
+          ue(o), localStorage.setItem("ktab_right_w", String(o));
+        }
+    }, i = () => {
+      K.current && (K.current = null, document.body.style.userSelect = "");
+    };
+    return window.addEventListener("mousemove", e), window.addEventListener("mouseup", i), () => {
+      window.removeEventListener("mousemove", e), window.removeEventListener("mouseup", i);
+    };
+  }, []);
+  const g = C(
+    (e, i) => {
+      N((c) => {
+        const d = c[e] ?? te, o = typeof i == "function" ? i(d) : i;
+        return { ...c, [e]: { ...d, ...o } };
+      });
+    },
+    []
+  ), I = C(async (e) => {
+    L(!0);
+    try {
+      const i = await Ie(e);
+      T(i);
+    } catch {
+      T(null);
+    } finally {
+      L(!1);
+    }
+  }, []), D = C(
+    async (e, i) => {
+      const c = i.id;
+      if (!c) return;
+      const d = {
+        key: c,
+        vid: c,
+        name: i.name ?? c,
+        type: i.type ?? e,
+        tree: null,
+        loading: !0,
+        failed: !1,
+        expanded: /* @__PURE__ */ new Set()
+      };
+      g(e, { primary: d, activeKey: d.key }), I(c);
+      try {
+        const o = await Z(c), m = /* @__PURE__ */ new Set();
+        q(o, "root", 0, m), N((u) => {
+          const y = u[e];
+          return !y || !y.primary || y.primary.key !== c ? u : {
+            ...u,
+            [e]: {
+              ...y,
+              primary: {
+                ...y.primary,
+                tree: o,
+                loading: !1,
+                failed: !1,
+                expanded: m
+              }
+            }
+          };
+        });
+      } catch {
+        N((o) => {
+          const m = o[e];
+          return !m || !m.primary || m.primary.key !== c ? o : {
+            ...o,
+            [e]: {
+              ...m,
+              primary: { ...m.primary, loading: !1, failed: !0 }
+            }
+          };
+        });
+      }
+    },
+    [I, g]
+  ), z = C(
+    async (e, i) => {
+      var c, d, o;
+      if (!((c = w.current[e]) != null && c.listLoading)) {
+        g(e, { listLoading: !0 });
+        try {
+          const m = await Ce(e);
+          if (g(e, { list: m, listLoading: !1, loaded: !0 }), i && m.length > 0 && !((d = w.current[e]) != null && d.primary)) {
+            const u = e === "DbTable" ? (o = m.find((y) => y.db)) == null ? void 0 : o.db : void 0;
+            u ? await D(e, {
+              id: `Db:${u}`,
+              type: "Db",
+              name: u,
+              subtitle: ""
+            }) : await D(e, m[0]);
+          }
+        } catch {
+          g(e, { listLoading: !1, loaded: !0 });
+        }
+      }
+    },
+    [D, g]
+  ), j = C(async () => {
+    try {
+      l(await we());
+    } catch {
+      l({ space: "-", hosts: "-", ttl_minutes: 0, loaded: !1 });
+    }
+  }, []), re = C(async (e, i) => {
+    try {
+      const c = await Z(i), d = /* @__PURE__ */ new Set();
+      q(c, "root", 0, d), N((o) => {
+        const m = o[e];
+        if (!m) return o;
+        const u = (y) => y.vid === i ? { ...y, tree: c, loading: !1, failed: !1, expanded: d } : y;
+        return {
+          ...o,
+          [e]: {
+            ...m,
+            primary: m.primary ? u(m.primary) : null,
+            extra: m.extra.map(u)
+          }
+        };
+      });
+    } catch {
+    }
+  }, []), se = C(
+    async (e, i, c) => {
+      if (!e) return;
+      I(e);
+      const d = P.current, o = w.current[d] ?? te;
+      if (o.primary && o.primary.vid === e || o.extra.some((u) => u.vid === e)) {
+        g(d, { activeKey: e });
+        return;
+      }
+      const m = {
+        key: e,
+        vid: e,
+        name: i ?? e,
+        type: c ?? aa(e),
+        tree: null,
+        loading: !0,
+        failed: !1,
+        expanded: /* @__PURE__ */ new Set()
+      };
+      g(d, (u) => ({ extra: [...u.extra, m], activeKey: m.key }));
+      try {
+        const u = await Z(e), y = /* @__PURE__ */ new Set();
+        q(u, "root", 0, y), N((v) => {
+          const J = v[d];
+          return J ? {
+            ...v,
+            [d]: {
+              ...J,
+              extra: J.extra.map(
+                (Q) => Q.key === e ? {
+                  ...Q,
+                  tree: u,
+                  loading: !1,
+                  failed: !1,
+                  expanded: y
+                } : Q
+              )
+            }
+          } : v;
+        });
+      } catch {
+        N((u) => {
+          const y = u[d];
+          return y ? {
+            ...u,
+            [d]: {
+              ...y,
+              extra: y.extra.map(
+                (v) => v.key === e ? { ...v, loading: !1, failed: !0 } : v
+              )
+            }
+          } : u;
+        });
+      }
+    },
+    [I, g]
+  ), _e = C(
+    (e, i, c, d) => {
+      N((o) => {
+        const m = o[e];
+        if (!m) return o;
+        const u = (y) => {
+          if (y.key !== i) return y;
+          const v = new Set(y.expanded);
+          return v.has(c) ? v.delete(c) : v.add(c), { ...y, expanded: v };
+        };
+        return {
+          ...o,
+          [e]: {
+            ...m,
+            primary: m.primary ? u(m.primary) : null,
+            extra: m.extra.map(u)
+          }
+        };
+      }), d.id && I(d.id);
+    },
+    [I]
+  ), le = C(
+    (e, i) => {
+      g(e, (c) => {
+        var y;
+        const o = ((y = c.primary) == null ? void 0 : y.key) === i ? null : c.primary, m = c.extra.filter((v) => v.key !== i);
+        let u = c.activeKey;
+        return u === i && (u = (o == null ? void 0 : o.key) ?? (m.length > 0 ? m[m.length - 1].key : null)), { primary: o, extra: m, activeKey: u };
+      });
+    },
+    [g]
+  ), ye = C(async () => {
+    try {
+      const e = await De();
+      Se.success(
+        `图快照已刷新：${e.node_count ?? 0} 节点 / ${e.edge_count ?? 0} 边`
+      ), j();
+      const i = w.current;
+      Object.entries(i).forEach(([c, d]) => {
+        d.loaded && z(c, !1), [...d.primary ? [d.primary] : [], ...d.extra].forEach(
+          (o) => void re(c, o.vid)
+        );
+      });
+    } catch {
+    }
+  }, [z, j, re]);
+  G(() => {
+    j();
+  }, [j]), G(() => {
+    const e = w.current[s];
+    !(e != null && e.loaded) && !(e != null && e.listLoading) && z(s, !0);
+  }, [s, z]);
+  const p = h[s] ?? te, S = p.primary && p.activeKey === p.primary.key ? p.primary : p.extra.find((e) => e.key === p.activeKey) ?? p.primary, U = ((oe = ee.find((e) => e.type === s)) == null ? void 0 : oe.label) ?? s, ce = p.query;
+  return G(() => {
+    const e = ce.trim(), i = s;
+    if (!e) {
+      g(i, { hits: null, searching: !1 });
+      return;
+    }
+    g(i, { searching: !0 });
+    const c = ++x.current, d = setTimeout(async () => {
+      try {
+        const o = await $e(e, i);
+        x.current === c && g(i, { hits: o, searching: !1 });
+      } catch {
+        x.current === c && g(i, { hits: [], searching: !1 });
+      }
+    }, 300);
+    return () => clearTimeout(d);
+  }, [ce, s, g]), /* @__PURE__ */ r("div", { className: t.wrap, children: [
+    /* @__PURE__ */ r("header", { className: t.header, children: [
+      /* @__PURE__ */ r("div", { className: t.headerTitle, children: [
+        /* @__PURE__ */ n(V, { className: t.headerIcon }),
+        /* @__PURE__ */ n("span", { children: "业务知识图谱" }),
+        /* @__PURE__ */ n("span", { className: t.headerSub, children: "业务因果链 · 图数据库直查（面向会写代码的你，讲清业务为什么这样跑）" })
+      ] }),
+      /* @__PURE__ */ r("div", { className: t.headerStats, children: [
+        a != null && a.loaded ? /* @__PURE__ */ r(H, { children: [
+          /* @__PURE__ */ r("span", { className: t.statChip, children: [
+            "节点 ",
+            a.node_count ?? 0
+          ] }),
+          /* @__PURE__ */ r("span", { className: t.statChip, children: [
+            "边 ",
+            a.edge_count ?? 0
+          ] }),
+          ee.map((e) => {
+            var i;
+            return /* @__PURE__ */ r("span", { className: t.statChip, children: [
+              e.label,
+              " ",
+              ((i = a.nodes_by_type) == null ? void 0 : i[e.type]) ?? 0
+            ] }, e.type);
+          }),
+          /* @__PURE__ */ n(
+            "span",
+            {
+              className: t.statChip,
+              title: `图空间 ${a.space} · ${a.hosts}`,
+              children: na(a.loaded_at)
+            }
+          )
+        ] }) : /* @__PURE__ */ n("span", { className: t.statChipWarn, children: p.listLoading ? "图数据加载中…" : "图数据未就绪" }),
+        /* @__PURE__ */ n(
+          "button",
+          {
+            type: "button",
+            className: t.refreshBtn,
+            onClick: ye,
+            title: "重新从图数据库加载快照",
+            children: /* @__PURE__ */ n(Ne, {})
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ r("div", { className: t.entryBar, children: [
+      ee.map((e) => {
+        var i;
+        return /* @__PURE__ */ r(
+          "button",
+          {
+            type: "button",
+            className: `${t.entryTab} ${s === e.type ? t.entryTabActive : ""}`,
+            onClick: () => f(e.type),
+            title: `${e.label}入口（各入口的清单 / 展开视图相互隔离）`,
+            children: [
+              /* @__PURE__ */ n("span", { children: e.label }),
+              /* @__PURE__ */ n("span", { className: t.entryTabCount, children: ((i = a == null ? void 0 : a.nodes_by_type) == null ? void 0 : i[e.type]) ?? 0 })
+            ]
+          },
+          e.type
+        );
+      }),
+      /* @__PURE__ */ n("span", { className: t.entryBarHint, children: "入口即查询起点：左侧清单点选换主视图，右侧「图上关联」点选在中部新开 Tab 下钻" })
+    ] }),
+    /* @__PURE__ */ r("div", { className: t.body, children: [
+      /* @__PURE__ */ r("aside", { className: t.sidebar, style: { width: $ }, children: [
+        /* @__PURE__ */ r("div", { className: t.searchBox, children: [
+          /* @__PURE__ */ n(fe, { className: t.searchIcon }),
+          /* @__PURE__ */ n(
+            "input",
+            {
+              className: t.searchInput,
+              placeholder: `在本入口内搜索${U}…`,
+              value: p.query,
+              onChange: (e) => g(s, { query: e.target.value })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ n("div", { className: t.sidebarList, children: p.query.trim() ? p.searching ? /* @__PURE__ */ n("div", { className: t.listTip, children: "搜索中…" }) : p.hits && p.hits.length > 0 ? p.hits.map((e) => /* @__PURE__ */ r(
+          "div",
+          {
+            className: t.hitItem,
+            onClick: () => e.id && void D(s, {
+              id: e.id,
+              type: e.type ?? s,
+              name: e.name ?? e.id,
+              subtitle: e.subtitle ?? ""
+            }),
+            children: [
+              /* @__PURE__ */ n("div", { className: t.hitName, children: e.name }),
+              e.subtitle && /* @__PURE__ */ n("div", { className: t.hitSub, children: e.subtitle })
+            ]
+          },
+          e.id
+        )) : /* @__PURE__ */ n("div", { className: t.listTip, children: "无匹配节点" }) : p.listLoading ? /* @__PURE__ */ r("div", { className: t.listTip, children: [
+          /* @__PURE__ */ n(F, { size: "small" }),
+          " 加载中…"
+        ] }) : /* @__PURE__ */ r(H, { children: [
+          /* @__PURE__ */ r("div", { className: t.sidebarHead, children: [
+            U,
+            "清单（点击查看展开视图）"
+          ] }),
+          s === "DbTable" ? /* @__PURE__ */ n(
+            ra,
+            {
+              list: p.list,
+              activeVid: ((de = p.primary) == null ? void 0 : de.vid) ?? null,
+              onOpenTable: (e) => void D("DbTable", e),
+              onOpenDb: (e, i) => void D("DbTable", {
+                id: `Db:${e}`,
+                type: "Db",
+                name: e,
+                subtitle: `${i} 张表`
+              })
+            }
+          ) : p.list.map((e) => {
+            var i;
+            return /* @__PURE__ */ r(
+              "div",
+              {
+                className: `${t.pageItem} ${((i = p.primary) == null ? void 0 : i.vid) === e.id ? t.pageItemActive : ""}`,
+                onClick: () => void D(s, e),
+                title: `${e.name}（${e.id}）`,
+                children: [
+                  /* @__PURE__ */ r("div", { className: t.pageItemRow, children: [
+                    /* @__PURE__ */ n("div", { className: t.pageName, children: e.name }),
+                    e.count != null && /* @__PURE__ */ r("span", { className: t.itemCount, children: [
+                      e.count,
+                      " ",
+                      pe[e.type] ?? "关联"
+                    ] })
+                  ] }),
+                  e.subtitle && /* @__PURE__ */ n("div", { className: t.pageSub, children: e.subtitle })
+                ]
+              },
+              e.id
+            );
+          })
+        ] }) })
+      ] }),
+      /* @__PURE__ */ n(
+        "div",
+        {
+          className: t.colDragger,
+          onMouseDown: ie("left"),
+          title: "拖动调整左栏宽度"
+        }
+      ),
+      /* @__PURE__ */ r("main", { className: t.main, children: [
+        /* @__PURE__ */ r("div", { className: t.midArea, children: [
+          (p.primary || p.extra.length > 0) && /* @__PURE__ */ r("div", { className: t.midTabs, children: [
+            p.primary && /* @__PURE__ */ n(
+              he,
+              {
+                tab: p.primary,
+                active: p.activeKey === p.primary.key,
+                primary: !0,
+                onSelect: () => g(s, { activeKey: p.primary.key }),
+                onClose: () => le(s, p.primary.key)
+              }
+            ),
+            p.extra.map((e) => /* @__PURE__ */ n(
+              he,
+              {
+                tab: e,
+                active: p.activeKey === e.key,
+                primary: !1,
+                onSelect: () => g(s, { activeKey: e.key }),
+                onClose: () => le(s, e.key)
+              },
+              e.key
+            ))
+          ] }),
+          /* @__PURE__ */ n("div", { className: t.treeArea, children: S ? S.loading ? /* @__PURE__ */ r("div", { className: t.emptyState, children: [
+            /* @__PURE__ */ n(F, {}),
+            /* @__PURE__ */ n("span", { children: "正在从图数据库派生展开视图…" })
+          ] }) : S.failed ? /* @__PURE__ */ r("div", { className: t.emptyState, children: [
+            /* @__PURE__ */ n(V, { className: t.emptyIcon }),
+            /* @__PURE__ */ r("div", { className: t.emptyTitle, children: [
+              "「",
+              S.name,
+              "」展开视图加载失败"
+            ] }),
+            /* @__PURE__ */ n("div", { className: t.emptyDesc, children: "该节点可能在最近一次图库更新中被删除。可点右上角刷新重载快照后重试， 或关闭此 Tab 返回主视图。" })
+          ] }) : S.tree ? (me = S.tree.children) != null && me.length ? /* @__PURE__ */ n(
+            be,
+            {
+              node: S.tree,
+              path: "root",
+              depth: 0,
+              expanded: S.expanded,
+              drillLeaves: S.tree.type === "Db",
+              onToggle: (e, i) => _e(s, S.key, e, i),
+              onOpenDetail: (e) => void I(e),
+              onDrill: (e, i, c) => void se(e, i, c)
+            }
+          ) : /* @__PURE__ */ r("div", { className: t.emptyState, children: [
+            /* @__PURE__ */ n(V, { className: t.emptyIcon }),
+            /* @__PURE__ */ r("div", { className: t.emptyTitle, children: [
+              "「",
+              S.tree.name,
+              "」在图库中暂无有效关联数据"
+            ] }),
+            /* @__PURE__ */ n("div", { className: t.emptyDesc, children: "该节点的关联在当前图快照中缺失，多为历史蒸馏数据中被删除后的残留边已被过滤。 可点右上角刷新重载快照，或等下一次图谱补录后自动恢复。" })
+          ] }) : /* @__PURE__ */ n("div", { className: t.emptyState, children: /* @__PURE__ */ n(F, {}) }) : /* @__PURE__ */ r("div", { className: t.emptyState, children: [
+            /* @__PURE__ */ n(V, { className: t.emptyIcon }),
+            /* @__PURE__ */ n("div", { className: t.emptyTitle, children: ta[s] ?? `左侧选择一个${U}，看它的展开信息` }),
+            /* @__PURE__ */ r("div", { className: t.emptyDesc, children: [
+              "树的四层含义：页面上的",
+              /* @__PURE__ */ n("strong", { children: "操作" }),
+              "（点谁、调哪个接口） → 触发的",
+              /* @__PURE__ */ n("strong", { children: "因果链" }),
+              "（为什么会联动） → 链里的",
+              /* @__PURE__ */ n("strong", { children: "步骤" }),
+              "（数据与代码如何接力）→ 出问题时的",
+              /* @__PURE__ */ n("strong", { children: "症状与止血" }),
+              "（去哪处置）。右侧「图上关联」可点击，会在中部新开 Tab 下钻。"
+            ] }),
+            /* @__PURE__ */ n("div", { className: t.legend, children: Object.keys(ae).map((e) => /* @__PURE__ */ r("span", { className: t.legendItem, children: [
+              /* @__PURE__ */ n(W, { type: e }),
+              ae[e]
+            ] }, e)) })
+          ] }) })
+        ] }),
+        /* @__PURE__ */ n(
+          "div",
+          {
+            className: t.colDragger,
+            onMouseDown: ie("right"),
+            title: "拖动调整详情栏宽度"
+          }
+        ),
+        /* @__PURE__ */ n("div", { className: t.detailWrap, style: { width: ne }, children: /* @__PURE__ */ n(
+          sa,
+          {
+            detail: b,
+            loading: _,
+            onOpenDetail: (e, i, c) => void se(e, i, c)
+          }
+        ) })
+      ] })
+    ] })
+  ] });
+}
+function W({ type: a }) {
+  const l = ea[a] ?? "#8c8c8c";
+  return /* @__PURE__ */ n(
+    "span",
+    {
+      className: t.badge,
+      style: { background: `${l}1a`, color: l, borderColor: `${l}55` },
+      children: ae[a] ?? a
+    }
+  );
+}
+function he({
+  tab: a,
+  active: l,
+  primary: h,
+  onSelect: N,
+  onClose: s
+}) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: `${t.midTab} ${l ? t.midTabActive : ""}`,
+      onClick: N,
+      title: `${a.name}（${a.vid}）`,
+      children: [
+        /* @__PURE__ */ n(W, { type: a.type }),
+        /* @__PURE__ */ n("span", { className: t.midTabName, children: a.name }),
+        /* @__PURE__ */ n(
+          "span",
+          {
+            className: t.midTabClose,
+            onClick: (f) => {
+              f.stopPropagation(), s();
+            },
+            title: h ? "关闭并返回空态" : "关闭",
+            children: /* @__PURE__ */ n(ge, {})
+          }
+        )
+      ]
+    }
+  );
+}
+function be({
+  node: a,
+  path: l,
+  depth: h,
+  expanded: N,
+  drillLeaves: s = !1,
+  onToggle: f,
+  onOpenDetail: b,
+  onDrill: T
+}) {
+  var P;
+  const _ = X(a, l), L = !!((P = a.children) != null && P.length), x = N.has(_), w = !!a.label;
+  return /* @__PURE__ */ r("div", { className: t.treeNode, children: [
+    /* @__PURE__ */ r(
+      "div",
+      {
+        className: `${t.nodeRow} ${w ? t.nodeRowGroup : ""}`,
+        style: { paddingLeft: h * 18 + 6 },
+        onClick: () => L ? f(_, a) : a.id ? s ? T(a.id, a.name, a.type) : b(a.id) : void 0,
+        children: [
+          L ? /* @__PURE__ */ n("span", { className: t.caret, children: x ? /* @__PURE__ */ n(ve, {}) : /* @__PURE__ */ n(Te, {}) }) : /* @__PURE__ */ n("span", { className: t.dot }),
+          w ? /* @__PURE__ */ r("span", { className: t.groupLabel, children: [
+            a.label,
+            a.count != null && /* @__PURE__ */ n("span", { className: t.nodeCount, children: a.count })
+          ] }) : /* @__PURE__ */ r(H, { children: [
+            a.type && /* @__PURE__ */ n(W, { type: a.type }),
+            /* @__PURE__ */ n("span", { className: t.nodeName, children: a.name })
+          ] })
+        ]
+      }
+    ),
+    !w && a.subtitle && /* @__PURE__ */ n(
+      "div",
+      {
+        className: t.nodeSub,
+        style: { paddingLeft: h * 18 + 30 },
+        children: a.subtitle
+      }
+    ),
+    L && x && /* @__PURE__ */ n("div", { children: a.children.filter(($) => !!$).map(($, Y) => /* @__PURE__ */ n(
+      be,
+      {
+        node: $,
+        path: `${_}#${Y}`,
+        depth: h + 1,
+        expanded: N,
+        drillLeaves: s,
+        onToggle: f,
+        onOpenDetail: b,
+        onDrill: T
+      },
+      X($, _)
+    )) })
+  ] });
+}
+function ra({
+  list: a,
+  activeVid: l,
+  onOpenTable: h,
+  onOpenDb: N
+}) {
+  const s = [], f = /* @__PURE__ */ new Map();
+  return a.forEach((b) => {
+    const T = b.db || "（未归库）";
+    let _ = f.get(T);
+    _ || (_ = [], f.set(T, _), s.push({ db: T, items: _ })), _.push(b);
+  }), /* @__PURE__ */ n(H, { children: s.map((b) => {
+    const T = `Db:${b.db}`;
+    return /* @__PURE__ */ r("div", { className: t.dbGroup, children: [
+      /* @__PURE__ */ r(
+        "div",
+        {
+          className: `${t.dbGroupHead} ${l === T ? t.dbGroupHeadActive : ""}`,
+          onClick: () => {
+            var _;
+            return ((_ = b.items[0]) == null ? void 0 : _.db) && N(b.db, b.items.length);
+          },
+          title: `打开 ${b.db} 库总览（库 → 表，点表中钻字段）`,
+          children: [
+            /* @__PURE__ */ n("span", { className: t.dbGroupName, children: b.db }),
+            /* @__PURE__ */ r("span", { className: t.dbGroupCount, children: [
+              b.items.length,
+              " 表"
+            ] })
+          ]
+        }
+      ),
+      b.items.map((_) => /* @__PURE__ */ r(
+        "div",
+        {
+          className: `${t.pageItem} ${l === _.id ? t.pageItemActive : ""}`,
+          onClick: () => h(_),
+          title: `${_.name}（${_.id}）`,
+          children: [
+            /* @__PURE__ */ r("div", { className: t.pageItemRow, children: [
+              /* @__PURE__ */ n("div", { className: t.pageName, children: _.name }),
+              _.count != null && /* @__PURE__ */ r("span", { className: t.itemCount, children: [
+                _.count,
+                " ",
+                pe[_.type] ?? "关联"
+              ] })
+            ] }),
+            _.subtitle && /* @__PURE__ */ n("div", { className: t.pageSub, children: _.subtitle })
+          ]
+        },
+        _.id
+      ))
+    ] }, b.db);
+  }) });
+}
+function sa({
+  detail: a,
+  loading: l,
+  onOpenDetail: h
+}) {
+  if (l)
+    return /* @__PURE__ */ n("div", { className: t.detailPanel, children: /* @__PURE__ */ r("div", { className: t.listTip, children: [
+      /* @__PURE__ */ n(F, { size: "small" }),
+      " 加载详情…"
+    ] }) });
+  if (!a)
+    return /* @__PURE__ */ n("div", { className: t.detailPanel, children: /* @__PURE__ */ n("div", { className: t.detailEmpty, children: "点击任意节点查看全部属性与关联；点「图上关联」在中部新开 Tab 下钻" }) });
+  const N = a.props ?? {}, s = a.relations ?? [];
+  return /* @__PURE__ */ r("div", { className: t.detailPanel, children: [
+    /* @__PURE__ */ r("div", { className: t.detailHead, children: [
+      /* @__PURE__ */ n(W, { type: String(a.type ?? "") }),
+      /* @__PURE__ */ n("span", { className: t.detailName, children: String(a.name ?? "") })
+    ] }),
+    /* @__PURE__ */ n("div", { className: t.detailVid, children: String(a.id ?? "") }),
+    /* @__PURE__ */ n("div", { className: t.detailSection, children: "属性" }),
+    Object.entries(N).length === 0 ? /* @__PURE__ */ n("div", { className: t.detailEmpty, children: "（无属性）" }) : Object.entries(N).map(([f, b]) => /* @__PURE__ */ r("div", { className: t.propRow, children: [
+      /* @__PURE__ */ n("div", { className: t.propKey, children: f }),
+      /* @__PURE__ */ n("div", { className: t.propVal, children: la(b) })
+    ] }, f)),
+    s.length > 0 && /* @__PURE__ */ r(H, { children: [
+      /* @__PURE__ */ n("div", { className: t.detailSection, children: "图上关联（可点击下钻）" }),
+      s.map((f) => /* @__PURE__ */ r("div", { className: t.relGroup, children: [
+        /* @__PURE__ */ n("div", { className: t.relTitle, children: f.rel }),
+        f.nodes.map((b) => /* @__PURE__ */ r(
+          "div",
+          {
+            className: t.relNode,
+            onClick: () => h(b.id, b.name, b.type),
+            children: [
+              /* @__PURE__ */ n(W, { type: b.type }),
+              /* @__PURE__ */ n("span", { className: t.relName, children: b.name }),
+              b.subtitle && /* @__PURE__ */ n("span", { className: t.relSub, children: b.subtitle })
+            ]
+          },
+          b.id
+        ))
+      ] }, f.rel))
+    ] })
+  ] });
+}
+function la(a) {
+  return a == null ? "—" : Array.isArray(a) ? a.length === 0 ? "—" : /* @__PURE__ */ n("div", { className: t.propList, children: a.map((l, h) => /* @__PURE__ */ r("div", { className: t.propListItem, children: [
+    "· ",
+    typeof l == "object" ? JSON.stringify(l) : String(l)
+  ] }, h)) }) : typeof a == "object" ? /* @__PURE__ */ n("pre", { className: t.propObj, children: JSON.stringify(a, null, 2) }) : String(a);
+}
+export {
+  pa as default
+};