Merge pull request #540 from HeriLFIU/UI_vue3sfcloaderChanges

Made changes for vue3sfcloader compatibility k-toolbar
kytos-ng · Dec 2, 2024 · 71c496a · 71c496a
2 parents f7567a1 + 624eda4
commit 71c496a
Showing 1 changed file with 11 additions and 8 deletions.
diff --git a/ui/k-toolbar/main.kytos b/ui/k-toolbar/main.kytos
@@ -64,6 +64,7 @@
            <k-checkbox title="Enable INT" v-model:model="enable_int" :value="'enable'"
                        tooltip="Enable In-band Network Telemetry (INT)"
            ></k-checkbox>
+          </form>
         </k-accordion-item>
 
         <span v-for="constraint in ['primary_constraints', 'secondary_constraints']">
@@ -199,16 +200,11 @@
                     <k-input icon="arrow-right"
                     placeholder='["blue", "red"]'
                     v-model:value="form_constraints[constraint].not_ownership"
-                    :action="function(val){
-                        try{form_constraints[constraint].metrics.not_ownership = JSON.parse(val)}
-                        catch(e){
-                          if(e instanceof SyntaxError){form_constraints[constraint].metrics.not_ownership=val}
-                          else{throw e}}}"></k-input>
+                    :action="function (val) { set_metrics(val, constraint) }"></k-input>
                   </div>
                 </div>
             </k-accordion-item>
         </span>
-        </form>
         <k-button tooltip="Request Circuit" title="Request Circuit"
         icon="gear" @click="request_circuit">
         </k-button>
@@ -309,6 +305,13 @@ module.exports = {
     },
   },
   methods: {
+    set_metrics: function (val, constraint) {
+      try { this.form_constraints[constraint].metrics.not_ownership = JSON.parse(val) }
+      catch (e) {
+        if (e instanceof SyntaxError) { this.form_constraints[constraint].metrics.not_ownership = val }
+        else { throw e }
+      }
+    },
     parse_check: function (val) {
       try { return JSON.parse(val) }
       catch (e) {
@@ -556,11 +559,11 @@ module.exports = {
     },
     fetch_dpids: function() {
         var self = this // create a closure to access component in the callback below
-        dataUrl = "/api/kytos/topology/v3/interfaces"
+        let dataUrl = "/api/kytos/topology/v3/interfaces"
         // Autocomplete usage example.
         fetch(dataUrl).then(response => response.json())
                     .then(data => {
-                        dpids = []
+                        let dpids = []
                         for ( const [key,value] of Object.entries( data.interfaces ) ) {
                             let item = key;
                             if(value.name) {