You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cloudstack.apache.org by nv...@apache.org on 2022/04/11 14:46:05 UTC

[cloudstack] branch main updated: ui: use different icon labe for releaseIpAddress action (#6235)

This is an automated email from the ASF dual-hosted git repository.

nvazquez pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/cloudstack.git


The following commit(s) were added to refs/heads/main by this push:
     new 63a9da95486 ui: use different icon labe for releaseIpAddress action (#6235)
63a9da95486 is described below

commit 63a9da95486fe42040bf76a9a2895a0638363e09
Author: Abhishek Kumar <ab...@gmail.com>
AuthorDate: Mon Apr 11 20:15:57 2022 +0530

    ui: use different icon labe for releaseIpAddress action (#6235)
    
    In publicip view, actions disassociateIpAddress and releaseIpAddress actions are shown same which could cause confusion for user.
    Added a different icon and label for releaseIpAddress action
    
    Signed-off-by: Abhishek Kumar <ab...@gmail.com>
---
 ui/public/locales/en.json               |  2 ++
 ui/src/components/view/ActionButton.vue | 16 ++++++++++++----
 ui/src/config/section/network.js        |  6 +++---
 ui/src/core/lazy_lib/icons_use.js       |  2 ++
 4 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/ui/public/locales/en.json b/ui/public/locales/en.json
index 458a0b73884..a61d3442ebf 100644
--- a/ui/public/locales/en.json
+++ b/ui/public/locales/en.json
@@ -244,6 +244,7 @@
 "label.action.register.ncc": "Register NCC",
 "label.action.register.template": "Register Template from URL",
 "label.action.release.ip": "Release IP",
+"label.action.release.reserved.ip": "Release Reserved IP",
 "label.action.release.ip.processing": "Releasing IP....",
 "label.action.remove.host": "Remove Host",
 "label.action.remove.host.processing": "Removing Host....",
@@ -2577,6 +2578,7 @@
 "message.action.reboot.systemvm": "Please confirm that you want to reboot this system VM.",
 "message.action.recover.volume": "Please confirm that you would like to recover this volume.",
 "message.action.release.ip": "Please confirm that you want to release this IP.",
+"message.action.release.reserved.ip": "Please confirm that you want to release this reserved IP.",
 "message.action.remove.host": "Please confirm that you want to remove this host.",
 "message.action.reserve.ip": "Please confirm that you want to reserve this IP.",
 "message.action.reset.password.off": "Your instance currently does not support this feature.",
diff --git a/ui/src/components/view/ActionButton.vue b/ui/src/components/view/ActionButton.vue
index da4bcbf8a67..95554f23820 100644
--- a/ui/src/components/view/ActionButton.vue
+++ b/ui/src/components/view/ActionButton.vue
@@ -42,9 +42,9 @@
           )"
         :disabled="'disabled' in action ? action.disabled(resource, $store.getters) : false" >
         <a-button
-          :type="(['PlusOutlined', 'plus-outlined', 'DeleteOutlined', 'delete-outlined'].includes(action.icon) ? 'primary' : 'default')"
+          :type="(primaryIconList.includes(action.icon) ? 'primary' : 'default')"
           :shape="!dataView && ['PlusOutlined', 'plus-outlined'].includes(action.icon) ? 'round' : 'circle'"
-          :danger="['DeleteOutlined', 'delete-outlined'].includes(action.icon)"
+          :danger="dangerIconList.includes(action.icon)"
           style="margin-left: 5px"
           :size="size"
           @click="execAction(action)">
@@ -62,8 +62,8 @@
             (dataView && action.dataView && ('show' in action ? action.show(resource, $store.getters) : true))
           )"
         :disabled="'disabled' in action ? action.disabled(resource, $store.getters) : false"
-        :type="(['PlusOutlined', 'plus-outlined', 'DeleteOutlined', 'delete-outlined'].includes(action.icon) ? 'primary' : 'default')"
-        :danger="['DeleteOutlined', 'delete-outlined'].includes(action.icon)"
+        :type="(primaryIconList.includes(action.icon) ? 'primary' : 'default')"
+        :danger="dangerIconList.includes(action.icon)"
         :shape="!dataView && ['PlusOutlined', 'plus-outlined', 'UserAddOutlined', 'user-add-outlined'].includes(action.icon) ? 'round' : 'circle'"
         style="margin-left: 5px"
         :size="size"
@@ -144,6 +144,14 @@ export default {
       }
     }
   },
+  computed: {
+    primaryIconList () {
+      return ['PlusOutlined', 'plus-outlined', 'DeleteOutlined', 'delete-outlined', 'UsergroupDeleteOutlined', 'usergroup-delete-outlined']
+    },
+    dangerIconList () {
+      return ['DeleteOutlined', 'delete-outlined', 'UsergroupDeleteOutlined', 'usergroup-delete-outlined']
+    }
+  },
   methods: {
     execAction (action) {
       action.resource = this.resource
diff --git a/ui/src/config/section/network.js b/ui/src/config/section/network.js
index 2b7ff42e00a..7c90c077446 100644
--- a/ui/src/config/section/network.js
+++ b/ui/src/config/section/network.js
@@ -354,9 +354,9 @@ export default {
         },
         {
           api: 'releaseIpAddress',
-          icon: 'delete-outlined',
-          label: 'label.action.release.ip',
-          message: 'message.action.release.ip',
+          icon: 'usergroup-delete-outlined',
+          label: 'label.action.release.reserved.ip',
+          message: 'message.action.release.reserved.ip',
           dataView: true,
           show: (record) => { return record.state === 'Reserved' },
           groupAction: true,
diff --git a/ui/src/core/lazy_lib/icons_use.js b/ui/src/core/lazy_lib/icons_use.js
index 9382775afe4..6d1c0c62e05 100644
--- a/ui/src/core/lazy_lib/icons_use.js
+++ b/ui/src/core/lazy_lib/icons_use.js
@@ -148,6 +148,7 @@ import {
   UndoOutlined,
   UsbOutlined,
   UserAddOutlined,
+  UsergroupDeleteOutlined,
   UserOutlined,
   UploadOutlined,
   WifiOutlined
@@ -288,6 +289,7 @@ export default {
     app.component('UndoOutlined', UndoOutlined)
     app.component('UsbOutlined', UsbOutlined)
     app.component('UserAddOutlined', UserAddOutlined)
+    app.component('UsergroupDeleteOutlined', UsergroupDeleteOutlined)
     app.component('UserOutlined', UserOutlined)
     app.component('UploadOutlined', UploadOutlined)
     app.component('WifiOutlined', WifiOutlined)