feat(webui): device discovery in cfm webui (#58)

* feat: set the nodes width based on the device id dimensions

* feat: add ipaddress to the existed devices in dashboard

* feat: add new button to discover new devices and the related interfaces

* fix: fix the bug in addDiscoveredHosts interface

* fix: fix bug in addDiscoveredBlades interface

* feat: add function addDiscoveredDevices with output popup and waiting popup

* style:  separate lines for discovered blades and hosts

* feat: add waiting progress for device discovery

* feat: update the content after adding new discovered devices

* feat: distinguish node status by border color

* feat: prevent the user from manually adding blades to the CMA_Discovered_Blades appliance

* style: remove unnecessary stype setup

webui/src/components/Appliance/Appliances.vue

@@ -93,6 +93,7 @@
                 variant="text"
                 id="addBlade"
                 @click="addNewBladeWindowButton"
+                :disabled="isAddBladeButtonDisabled"
               >
                 <v-icon start color="#6ebe4a">mdi-plus-thick</v-icon>
                 BLADE
@@ -1524,6 +1525,12 @@ export default {
     ComposeMemoryButton,
   },
 
+  computed: {
+    isAddBladeButtonDisabled() {
+      return this.selectedApplianceId === "CMA_Discovered_Blades";
+    },
+  },
+
   methods: {
     /* Open the add appliance popup */
     addNewApplianceWindowButton() {
@@ -1985,7 +1992,10 @@ export default {
               applianceStore.selectedApplianceId,
               newBladeId
             ),
-            bladeStore.fetchBladeById(applianceStore.selectedApplianceId, newBladeId),
+            bladeStore.fetchBladeById(
+              applianceStore.selectedApplianceId,
+              newBladeId
+            ),
           ]);
           // Update the URL with the new blade ID
           updateUrlWithBladeId(applianceStore.selectedApplianceId, newBladeId);
@@ -2063,4 +2073,4 @@ export default {
 .highlighted-tab {
   font-weight: bold;
 }
-</style>
+</style>