BE+FE: better VLAN/SSID handling

Signed-off-by: jokob-sk <jokob.sk@gmail.com>

front/network.php

@@ -69,7 +69,8 @@
   require 'php/templates/footer.php';
 ?>
 
-<script src="lib/treeviz/bundle.js"></script>
+<!-- <script src="lib/treeviz/bundle.js"></script> -->
+<script src="lib/treeviz/treeviz.iife.js"></script>
 
 <script defer>
 
@@ -388,7 +389,7 @@
     const normalized_mac = node_mac.toLowerCase();
 
     const sql = `
-      SELECT devName, devMac, devLastIP, devVendor, devPresentLastScan, devAlertDown, devParentPort,
+      SELECT devName, devMac, devLastIP, devVendor, devPresentLastScan, devAlertDown, devParentPort, devVlan,
         CASE
             WHEN devIsNew = 1 THEN 'New'
             WHEN devPresentLastScan = 1 THEN 'On-line'
@@ -588,6 +589,8 @@ function getChildren(node, list, path, visited = [])
         parentNodesCount++;
     }
 
+    // console.log(node);
+
     return {
         name: node.devName,
         path: path,
@@ -607,6 +610,7 @@ function getChildren(node, list, path, visited = [])
         alertDown: node.devAlertDown,
         hasChildren: children.length > 0 || hiddenMacs.includes(node.devMac),
         relType: node.devParentRelType,
+        devVlan: node.devVlan,
         hiddenChildren: hiddenMacs.includes(node.devMac),
         qty: children.length,
         children: children
@@ -883,6 +887,16 @@ function initTree(myHierarchy)
       idKey: "mac",
       hasFlatData: false,
       relationnalField: "children",
+      linkLabel: {
+      render: (parent, child) => {
+        // Return text or HTML to display on the connection line
+        return child.data.devVlan ?? "";
+        // or with HTML:
+        // return "<tspan><strong>reports to</strong></tspan>";
+      },
+      color: "#336c87ff",      // Label text color (optional)
+      fontSize: 11           // Label font size in px (optional)
+    },
       linkWidth: (nodeData) => 2,
       linkColor: (nodeData) => {
         relConf = getRelationshipConf(nodeData.data.relType)