Industrialize topology editor and add customizable edge styles.

Add tool modes, layouts, and per-edge/default style overrides with a cleaner toolbar and context menus.

Co-authored-by: Cursor <cursoragent@cursor.com>

web/src/i18n/en.ts

@@ -888,7 +888,7 @@ const en = {
     deleteMapConfirm: "Delete map \"{{name}}\"? Nodes and edges will be removed.",
     emptyMaps: "No maps yet. Create one to start.",
     palette: "NE library",
-    paletteHint: "Click to add to canvas",
+    paletteHint: "Click or drag onto the canvas",
     filterPh: "Filter name / IP",
     save: "Save",
     saving: "Saving…",
@@ -900,13 +900,56 @@ const en = {
     discoverFail: "Discovery failed: {{detail}}",
     discoverOneNeedNe: "This node is not linked to a scannable NE",
     selectMap: "Select or create a topology map",
-    canvasHint: "Add NEs from the left; blue dashed=found, red dashed=missing (deletable); right-click a node for actions",
+    canvasHint:
+      "Use toolbar modes (select/pan/drag/connect), box-select, and layout. Blue dashed=discovered, red=missing. Shortcuts V/H/A/C, Ctrl+Z undo.",
     selected: "Selected",
     selectedEdge: "Selected edge",
+    selectedCount: "{{count}} selected",
+    toolModes: "Edit modes",
+    toolSelect: "Select",
+    toolPan: "Pan",
+    toolDrag: "Drag",
+    toolConnect: "Connect",
+    layout: "Layout",
+    layoutHierarchicalTb: "Hierarchical · top-bottom",
+    layoutHierarchicalLr: "Hierarchical · left-right",
+    layoutForce: "Force-directed",
+    layoutGrid: "Grid",
+    layoutRadial: "Radial",
+    layoutSelected: "Selected only (hierarchical)",
+    layoutNeedSelection: "Select nodes to lay out first",
+    align: "Align",
+    alignLeft: "Align left",
+    alignRight: "Align right",
+    alignTop: "Align top",
+    alignBottom: "Align bottom",
+    alignHCenter: "Align center X",
+    alignVCenter: "Align center Y",
+    alignHDistribute: "Distribute horizontally",
+    alignVDistribute: "Distribute vertically",
+    alignNeedSelection: "Select at least two nodes",
+    snapGrid: "Snap to grid",
+    autoLayoutDiscover: "Auto-layout after discover",
+    undo: "Undo",
+    redo: "Redo",
+    discoverSelected: "Discover selected ({{count}})",
+    removeSelected: "Remove selected ({{count}})",
     openWebcrt: "Open terminal",
     openNe: "NE details",
     removeNode: "Remove from canvas",
     removeEdge: "Delete edge",
+    nodeMenu: "Node",
+    selectionMenu: "Selection",
+    edgeStyle: "Edge style",
+    edgeColor: "Color",
+    edgeLineStyle: "Line",
+    edgeLineSolid: "Solid",
+    edgeLineDashed: "Dashed",
+    edgeLineDotted: "Dotted",
+    edgeWidth: "Width",
+    edgeStyleReset: "Reset style",
+    edgeDefaults: "Default edge styles",
+    edgeDefaultsReset: "Factory reset",
     noNeLink: "Not linked to a managed NE",
     edgeManual: "Manual",
     edgeDiscovered: "Discovered",

web/src/i18n/zh.ts

@@ -885,7 +885,7 @@ const zh = {
     deleteMapConfirm: "删除拓扑图「{{name}}」？节点与链路会一并删除。",
     emptyMaps: "还没有拓扑图，先新建一张。",
     palette: "网元库",
-    paletteHint: "点击添加到画布",
+    paletteHint: "点击或拖到画布添加",
     filterPh: "筛选名称 / IP",
     save: "保存",
     saving: "保存中…",
@@ -897,13 +897,56 @@ const zh = {
     discoverFail: "发现失败：{{detail}}",
     discoverOneNeedNe: "该节点未关联可扫描网元",
     selectMap: "请选择或新建一张拓扑图",
-    canvasHint: "从左侧添加网元，拖动节点并连线；蓝虚线=发现链路，红虚线=本次未发现（可删）；右键节点可操作",
+    canvasHint:
+      "工具栏切换选择/平移/拖动/连线；框选多选；布局可自动构图。蓝虚线=发现链路，红虚线=未发现。快捷键 V/H/A/C，Ctrl+Z 撤销。",
     selected: "已选节点",
     selectedEdge: "已选链路",
+    selectedCount: "已选 {{count}}",
+    toolModes: "编辑模式",
+    toolSelect: "选择",
+    toolPan: "平移",
+    toolDrag: "拖动",
+    toolConnect: "连线",
+    layout: "布局",
+    layoutHierarchicalTb: "层次 · 自上而下",
+    layoutHierarchicalLr: "层次 · 从左到右",
+    layoutForce: "力导向",
+    layoutGrid: "网格",
+    layoutRadial: "环形",
+    layoutSelected: "仅布局选中（层次）",
+    layoutNeedSelection: "请先选中要布局的节点",
+    align: "对齐",
+    alignLeft: "左对齐",
+    alignRight: "右对齐",
+    alignTop: "顶对齐",
+    alignBottom: "底对齐",
+    alignHCenter: "水平居中",
+    alignVCenter: "垂直居中",
+    alignHDistribute: "水平分布",
+    alignVDistribute: "垂直分布",
+    alignNeedSelection: "请至少选中两个节点",
+    snapGrid: "网格吸附",
+    autoLayoutDiscover: "发现后自动布局",
+    undo: "撤销",
+    redo: "重做",
+    discoverSelected: "发现选中 ({{count}})",
+    removeSelected: "移除选中 ({{count}})",
     openWebcrt: "打开终端",
     openNe: "网元详情",
     removeNode: "从画布移除",
     removeEdge: "删除链路",
+    nodeMenu: "网元",
+    selectionMenu: "多选",
+    edgeStyle: "链路样式",
+    edgeColor: "颜色",
+    edgeLineStyle: "线型",
+    edgeLineSolid: "实线",
+    edgeLineDashed: "虚线",
+    edgeLineDotted: "点线",
+    edgeWidth: "粗细",
+    edgeStyleReset: "恢复默认",
+    edgeDefaults: "默认链路样式",
+    edgeDefaultsReset: "恢复出厂",
     noNeLink: "未关联托管网元",
     edgeManual: "人工",
     edgeDiscovered: "发现",
@@ -911,7 +954,7 @@ const zh = {
     fit: "适应画布",
     fullscreen: "全屏显示",
     exitFullscreen: "退出全屏",
-    display: "显示选项",
+    display: "显示",
     hideIp: "隐藏 IP",
     hideVendor: "隐藏厂商",
     hidePorts: "隐藏端口",