1. 页面概览
情报工作台是 LightGotham 的总览入口,路由 /gotham,对应源码 action/web/src/views/GothamPage.vue(约 1344 行)。核心是一块 SVG 自绘知识图谱画布:节点为圆形、按类型分色(person 蓝 / org 橙 / ship 绿 / custom 紫),边为带箭头直线;点击节点高亮其直接邻居(/graph/nodes/:id/neighbors),拖拽画布可平移。
除可视化外还有两类操作:图分析——通过「图分析」卡片执行 1-3 度展开、最短路径、中心度、社群着色、PageRank、紧密中心度、标签传播、强连通分量、图统计、子图过滤,结果以表格/标签/着色叠加到画布;图编辑——「新增节点 / 边」表单直接写入图谱(POST),「图谱元素管理」列表提供节点/边删除(DELETE /graph/nodes/:id、DELETE /graph/edges/:id,二次确认,节点删除级联清理关联边)。页面顶部另有「默认中心节点」配置卡(localStorage 持久化,key gotham.defaultNode),控制加载时默认展开中心与最短路径起点,未配置回退 graph:person:zhy。一句话总结:情报工作台是图谱总览、图算法分析、节点边增删三位一体入口。
2. 访问入口
- 路由与菜单:
/gotham布局(GothamLayout)空子路由,nameGotham,标题「Gotham 情报工作台」,requiresAuth: true;侧边栏第一项「情报工作台」({ path: '/gotham', label: '情报工作台' })。 - 认证与权限:请求经
gothamClient.js(baseURL/gotham-api/v1)附aip_token,401 用gotham_refresh_token调/auth/refresh换发重放;/analysis/graph/*图算法接口仅 admin 角色可执行,非 admin 返回 403AUTHZ_ERROR。 - 端口与 API 前缀:Gotham 后端 18083,前端前缀
/gotham-api。
3. 界面布局
+-------------------------------------------------------------+
| 页头:Gotham 情报工作台 节点<n> 边<n> [刷新图谱] |
+-------------------------------------------------------------+
| 操作结果提示 alert(有消息时显示,可关闭) |
+-------------------------------------------------------------+
| 默认中心节点(card):输入 rid [保存][恢复默认] 当前生效 rid |
+-------------------------------------------------------------+
| 图分析(card) |
| 展开(深度▾/limit/中心rid) 最短路径(from/to) |
| 中心度/社群:[中心度][社群着色][清除高亮] |
| 高级:[PageRank][紧密中心度][标签传播][强连通分量][图统计] |
| 子图过滤:types rootIds depth [子图过滤] |
| └ 结果面板:中心度/社群/PageRank/紧密中心度/标签传播/SCC/ |
| 子图/图统计 |
+-------------------------------------------------------------+
| 图谱可视化(card):SVG 画布(节点/边/箭头/标签),空态提示 |
+-------------------------------------------------------------+
| 图谱元素管理(card):节点列表/边列表,每行 [删除] + 二次确认弹窗 |
+-------------------------------------------------------------+
| 新增节点 / 边(card):左新增节点表单,右新增边表单 |
+-------------------------------------------------------------+
各板块职责:
- 页头:统计芯片显示节点/边数,「刷新图谱」全量重载。
- 默认中心节点:输入中心节点 rid,[保存] 写入
localStorage['gotham.defaultNode']并按该节点重载图谱,[恢复默认] 清除配置回退graph:person:zhy;当前生效值实时显示。 - 图分析:算法工具栏 + 分区结果面板;社群/标签传播对节点按 ID 哈希换色。
- 图谱可视化:520px 高 SVG 画布,点击节点高亮邻居、拖拽平移;空态显示「图谱为空,请刷新或新建节点。」
- 图谱元素管理:节点/边双列表(可滚动),每行「删除」按钮打开二次确认弹窗(展示 RID 与标签/关系),确认后调 DELETE 并刷新列表;节点删除后本地同步剔除其关联边。
- 新增节点 / 边:双列表单,分别 POST
/graph/nodes与/graph/edges,成功并入画布重排布局。
4. 交互元素
| 控件 | 位置 | 含义与作用 |
|---|---|---|
| 刷新图谱按钮 | 页头 | 并行加载 /graph/stats、/graph/nodes 与默认 3 度展开(中心取默认中心节点配置,未配置回退 graph:person:zhy,limit 100) |
| 默认中心节点 | 默认中心节点 | 输入 rid + [保存] 持久化到 localStorage['gotham.defaultNode'] 并重载图谱;[恢复默认] 清除配置 |
| 展开(BFS 1-3 度) | 图分析 | 深度 + limit + 中心节点 rid,GET /analysis/graph/expand 并入新节点/边;中心默认取默认中心节点配置 |
| 最短路径 | 图分析 | from/to rid 必填,GET /analysis/graph/path;不可达提示「路径不可达」,命中路径红色高亮;from 默认取默认中心节点配置,to 记忆上次使用值(localStorage['gotham.pathTo'],未使用过回退 graph:org:tianhe) |
| 删除按钮 | 图谱元素管理 | 节点/边每行「删除」,打开二次确认弹窗;确认调 DELETE /graph/nodes/:id 或 DELETE /graph/edges/:id,成功后刷新列表与统计,节点删除同步剔除关联边 |
| 删除确认弹窗 | 全局遮罩 | 展示将删除的 RID 与标签(节点)或关系 type/source→target(边),提示不可撤销、节点删除级联边;失败按 403/404/其他分别提示 |
| 中心度 / 社群着色 | 图分析 | 「中心度」拉度中心度 Top 表;「社群着色」按社区换色;「清除高亮」复位 |
| 高级图分析 | 图分析 | PageRank、紧密中心度(Top 20)、标签传播、强连通分量、图统计(节点/边/平均度 + 类型分布) |
| 子图过滤 | 图分析 | types/rootIds/depth 调 GET /analysis/graph/subgraph(接口无 limit、一次返回全部命中),结果表按渲染层分页(50/100/200/全部)展示节点并提供边明细折叠表,可「应用为当前视图」 |
| 节点点击 | 图谱可视化 | 高亮直接邻居(depth=1),邻居缺失自动并入 |
| 新增节点表单 | 新增节点 / 边 | ID(如 graph:person:xx)、类型(person/org/ship/custom)、标签必填;属性 JSON 可选 |
| 新增边表单 | 新增节点 / 边 | 源/目标 ID、边类型(如 member_of)、方向(directed/bidirectional)、属性 JSON |
5. 后端关联
API 客户端:gothamClient.js,axios.create({ baseURL: '/gotham-api/v1', timeout: 30000 });请求注入 Bearer token,响应 401 用 refresh token 调 POST /auth/refresh 换发重放,失败清 token 跳 /login。
端点表:
| 方法 | 路径 | 用途 |
|---|---|---|
| GET | /graph/stats | 图统计(节点/边数),页头芯片 |
| GET | /graph/nodes | 全量节点列表 |
| POST | /graph/nodes | 新增节点 {id, type, label, properties} |
| POST | /graph/edges | 新增边 {type, source, target, direction, properties} |
| DELETE | /graph/nodes/:id | 删除节点(级联删除关联边),成功 200 {code:0,data:{deleted:id}};经 abacPEP("graph.node","execute:delete"),deny 命中 403 ABAC_DENIED |
| DELETE | /graph/edges/:id | 删除单条边,成功 200 {code:0,data:{deleted:id}};经 abacPEP("graph.edge","execute:delete"),deny 命中 403 ABAC_DENIED |
| GET | /graph/nodes/:id/neighbors | 节点直接邻居(depth=1) |
| GET | /analysis/graph/expand | BFS 展开 node/depth/limit |
| GET | /analysis/graph/path | 最短路径 from/to |
| GET | /analysis/graph/centrality | 度中心度 kind=degree |
| GET | /analysis/graph/community | 社群检测 {method, modularity, communities} |
| GET | /analysis/graph/pagerank | PageRank top_k=20 |
| GET | /analysis/graph/closeness | 紧密中心度 top_k=20 |
| GET | /analysis/graph/label-propagation | 标签传播社区 |
| GET | /analysis/graph/scc | 强连通分量 {components} |
| GET | /analysis/graph/subgraph | 子图过滤 types/root_ids/depth/properties(无 limit 参数,一次返回全部命中节点与边) |
| GET | /analysis/graph/stats | 图统计详情(含节点/边类型分布) |
关键机制:
- 零依赖力导向布局(runLayout):220 轮迭代 n² 斥力 + 边引力 + 向心力,画布 ±520×±320,新节点按角度圆环初始化;并入节点/边后重跑。
- 加载即联动:
loadGraph用Promise.allSettled并行发/graph/stats、/graph/nodes与默认展开,部分失败不阻塞整体。 - 状态独立叠加:选中/高亮/路径/社区着色四类状态独立维护,选中节点后其余元素淡化;错误统一
err.response?.data?.error || err.message。
6. 权限与安全
- 认证:全部请求走
aip_tokenBearer,401 自动 refresh 换发重放;刷新失效清 token 跳/login。 - 角色限制:
/analysis/graph/*为管理能力,仅 admin 可执行(非 admin 403AUTHZ_ERROR);/graph/*无细分。 - 写操作防护:新增节点/边前端校验必填与 JSON 合法性;删除均经二次确认弹窗,且删除端点挂
abacPEP(graph.node/graph.edge的execute:delete),无权限返回 403ABAC_DENIED,前端按 403(无权限)/404(不存在)/其他分别提示,不静默。 - 诚实边界:后端无节点/边更新端点(仅
POST幂等 upsert 与DELETE),故前端不提供字段编辑 UI,避免臆造接口。
7. 常见问题与排错
问题 1:图算法按钮报 "admin role required"
现象:点「展开」「PageRank」等报 403 AUTHZ_ERROR。
原因:/analysis/graph/* 挂 adminMiddleware(),当前账号非 admin。
处理:用 admin 角色账号登录重试,或确认后端 IsUserAdmin 判定通过。
问题 2:新增节点/边提示「属性 JSON 格式错误」
现象:属性框提交被前端拦截。
原因:props 不是合法 JSON。
处理:按标准 JSON 填写(如 {"region":"华北"});留空默认 {}。
问题 3:页面提示「加载失败」且画布为空,或访问 /gotham 报 404/白屏
现象:节点/边为 0、画布空态,或路由打不开。
原因:/graph/stats、/graph/nodes 请求失败或 Gotham 后端未启动(代理未分流、token 失效、路由未注册)。
处理:确认 18083 进程存活、Vite 代理把 /gotham-api 分流到 18083、router/index.js 已注册 /gotham 父布局与空子路由;401 则重新登录。
问题 4:删除节点/边提示「无权限删除(ABAC 拒绝)」或「目标不存在」
现象:图谱元素管理点「删除」并确认后,提示 无权限删除(ABAC 拒绝:...)(403)或 目标不存在(可能已被删除,请刷新列表)(404)。
原因:删除端点挂 abacPEP("graph.node"/"graph.edge","execute:delete"),deny 策略命中即 403 ABAC_DENIED;404 多为目标已被其他会话删除(节点删除会级联删边,列表未刷新)。
处理:403 时确认当前账号/ABAC 策略是否允许该资源删除(默认放行,仅 deny 命中才拒绝);404 时点「刷新列表」重新同步节点/边。
8. 已知缺陷与边界
| 项 | 说明 |
|---|---|
| 大图渲染瓶颈 | 节点全量渲染 SVG,百节点以上拖拽/布局变慢,无虚拟化 |
| 力导向布局纯前端 | 220 轮启发式,坐标不持久化 |
| 无节点/边字段编辑(后端缺口) | 后端仅 POST(幂等 upsert 返回值即已存在则为更新)与 DELETE,无更新端点,故不提供字段编辑 UI;新增与删除均已支持 |
| 子图结果分页(现实边界) | 子图接口 GET /analysis/graph/subgraph 只接受 types / root_ids / depth / properties 四个参数,无 limit,一次返回全部命中节点与边;结果表按「节点显示条数」下拉(50/100/200/全部,默认 50)分页,分页仅为渲染层、不影响返回数据完整性,并附边明细折叠表(边 ID / 源 / 目标 / 类型) |
| 默认展开中心可配 | 加载默认按「默认中心节点」配置展开(localStorage['gotham.defaultNode']),未配置回退 graph:person:zhy;无该节点时补边为空 |
| 无 WebSocket 订阅 | 实时协作推送(/gotham-api/v1/ws)在「协同动态」等页使用 |
注:子图结果表原先硬截断为前 50 节点(后端返回的其余节点用户不可见),已于 2026-09-13 改为渲染层分页(条数档 50/100/200/全部 + 上/下一页),并在界面注明「子图接口无 limit、一次返回全部」。因为子图接口本身无 limit 参数,故这是纯前端渲染层分页,不是服务端分页。