Merge pull request #223 from kytos-ng/hotfix/issue_220

backport/hotfix for issue #220 into 2024.1 -- add confirmation to link enabling/disabling
kytos-ng · Oct 8, 2024 · 229bf1b · 229bf1b
2 parents 10fad8f + 0ce4128
commit 229bf1b
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 2 deletions.
diff --git a/CHANGELOG.rst b/CHANGELOG.rst
@@ -7,6 +7,13 @@ All notable changes to the ``topology`` project will be documented in this file.
 [UNRELEASED] - Under development
 ********************************
 
+[2024.1.4] - 2024-10-08
+***********************
+
+Changed
+=======
+- UI: topology link now asks for confirmation when enabling/disabling
+
 [2024.1.3] - 2024-09-13
 ***********************
 

diff --git a/kytos.json b/kytos.json
@@ -3,7 +3,7 @@
   "username": "kytos",
   "name": "topology",
   "description": "Manage the network topology.",
-  "version": "2024.1.3",
+  "version": "2024.1.4",
   "napp_dependencies": ["kytos/of_core", "kytos/of_lldp"],
   "license": "MIT",
   "tags": ["topology", "rest"],

diff --git a/ui/k-info-panel/link_info.kytos b/ui/k-info-panel/link_info.kytos
@@ -8,6 +8,31 @@
           <k-button @click="bt_delete" title="Delete"></k-button>
         </div>
       </div>
+      <template v-if="show_modal_state_toggle">
+        <div class="modal-mask">
+          <div class="modal-wrapper">
+            <div class="modal-container">
+              <div class="modal-header">
+                <slot name="header">
+                </slot>
+              </div>
+              <div class="modal-body">
+                <slot name="body">
+                  {{next_state}} Link {{metadata.link_name !== undefined && metadata.link_name.length !== 0? '"' + metadata.link_name + '"' : details.id}}?
+                </slot>
+              </div>
+              <div class="modal-footer">
+                <slot name="footer">
+                  <k-button tooltip="Cancel" title="Cancel" @click="modal_cancel_state_toggle">
+                  </k-button>
+                  <k-button id="modal-delete" :title="next_state" @click="modal_proceed_state_toggle">
+                  </k-button>
+                </slot>
+              </div>
+            </div>
+          </div>
+        </div>
+      </template>
       <template v-if="show_modal">
         <div class="modal-mask">
           <div class="modal-wrapper">
@@ -93,6 +118,7 @@
                    'status_reason': '',
                    },
          show_modal: false,
+         show_modal_state_toggle: false,
      }
    },
    methods: {
@@ -140,6 +166,16 @@
        this.$kytos.eventBus.$emit("setNotification", notification)
      },
      bt_state_toggle(){
+       this.show_modal_state_toggle = true;
+     },
+     modal_cancel_state_toggle(){
+       this.show_modal_state_toggle = false;
+     },
+     modal_proceed_state_toggle(){
+       this.show_modal_state_toggle = false;
+       this.state_toggle_link();
+     },
+     state_toggle_link(){
        let request = $.ajax({
                         type:"POST",
                         url: this.$kytos_server_api + "kytos/topology/v3/links/" + this.details.id
@@ -360,4 +396,4 @@
   color: #ffc5c5;
   background: #be0000;
 }
-</style>
+</style>