Feat: 优化拓扑节点显示为'主机名+IP地址'格式

- 前端显示两行: 第一行主机名,第二行IP地址
- 增加节点尺寸以适应更多文本
- 启用文本自动换行
- 后端确保主机名不为空
This commit is contained in:
Your Name
2026-04-25 23:13:36 +08:00
szülő 3de2668286
commit 4dc0b3100f
2 fájl változott, egészen pontosan 22 új sor hozzáadva és 7 régi sor törölve
+7 -1
Fájl megtekintése
@@ -35,10 +35,16 @@ func (b *Builder) Build() models.TopologyGraph {
// 构建节点
nodeMap := make(map[string]models.TopologyNode)
for _, device := range b.devices {
// 优先使用主机名,如果没有则使用IP作为显示名
hostname := device.Hostname
if hostname == "" {
hostname = device.IP
}
node := models.TopologyNode{
ID: device.IP,
IP: device.IP,
Hostname: device.Hostname,
Hostname: hostname,
Type: string(device.Type),
Icon: getDeviceIcon(device.Type),
}
+15 -6
Fájl megtekintése
@@ -22,14 +22,16 @@ function initCytoscape() {
'background-color': function(ele) {
return getNodeColor(ele.data('type'));
},
'width': 60,
'height': 60,
'width': 70,
'height': 70,
'border-width': 3,
'border-color': '#667eea',
'text-valign': 'bottom',
'text-halign': 'center',
'font-size': '12px',
'font-weight': 'bold'
'font-size': '11px',
'font-weight': 'bold',
'text-wrap': 'wrap',
'text-max-width': '80px'
}
},
{
@@ -201,13 +203,20 @@ async function loadTopology() {
// 添加节点
graph.nodes.forEach(node => {
// 显示格式: 主机名 + IP地址
let label = node.ip; // 默认显示IP
if (node.hostname && node.hostname !== '') {
label = `${node.hostname}\n${node.ip}`;
}
cy.add({
group: 'nodes',
data: {
id: node.id,
label: node.hostname || node.ip,
label: label,
type: node.type,
ip: node.ip
ip: node.ip,
hostname: node.hostname
}
});
});