config: icon and action loading fixes

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>

ui/src/config/section/compute.js

@@ -439,7 +439,7 @@ export default {
         },
         {
           api: 'stopKubernetesCluster',
-          icon: 'stop',
+          icon: 'poweroff',
           label: 'label.kubernetes.cluster.stop',
           dataView: true,
           show: (record) => { return !['Stopped'].includes(record.state) }

ui/src/config/section/infra/ilbvms.js

@@ -34,7 +34,7 @@ export default {
     },
     {
       api: 'stopInternalLoadBalancerVM',
-      icon: 'stop',
+      icon: 'poweroff',
       label: 'label.action.stop.router',
       dataView: true,
       args: ['forced'],

ui/src/config/section/infra/routers.js

@@ -34,7 +34,7 @@ export default {
     },
     {
       api: 'stopRouter',
-      icon: 'stop',
+      icon: 'poweroff',
       label: 'label.action.stop.router',
       message: 'message.action.stop.router',
       dataView: true,

ui/src/config/section/infra/systemVms.js

@@ -33,7 +33,7 @@ export default {
     },
     {
       api: 'stopSystemVm',
-      icon: 'stop',
+      icon: 'poweroff',
       label: 'label.action.stop.systemvm',
       message: 'message.action.stop.systemvm',
       dataView: true,

ui/src/views/AutogenView.vue

@@ -87,7 +87,7 @@
           :closable="true"
           style="top: 20px;"
           @cancel="closeAction"
-          :confirmLoading="currentAction.loading"
+          :confirmLoading="actionLoading"
           :footer="null"
           centered
           width="auto"
@@ -110,7 +110,7 @@
         style="top: 20px;"
         @ok="handleSubmit"
         @cancel="closeAction"
-        :confirmLoading="currentAction.loading"
+        :confirmLoading="actionLoading"
         centered
       >
         <span slot="title">
@@ -123,7 +123,7 @@
             <a-icon type="question-circle-o"></a-icon>
           </a>
         </span>
-        <a-spin :spinning="currentAction.loading">
+        <a-spin :spinning="actionLoading">
           <span v-if="currentAction.message">
             <a-alert type="warning">
               <span slot="message" v-html="$t(currentAction.message)" />
@@ -338,6 +338,7 @@ export default {
       apiName: '',
       docBase: config.docBase,
       loading: false,
+      actionLoading: false,
       columns: [],
       items: [],
       itemCount: 0,
@@ -588,7 +589,7 @@ export default {
       this.fetchData()
     },
     closeAction () {
-      this.currentAction.loading = false
+      this.actionLoading = false
       this.showAction = false
       this.currentAction = {}
     },
@@ -643,7 +644,7 @@ export default {
           this.listUuidOpts(param)
         }
       }
-      this.currentAction.loading = false
+      this.actionLoading = false
       if (action.dataView && ['copy', 'edit'].includes(action.icon)) {
         this.fillEditFormFieldValues()
       }
@@ -756,7 +757,6 @@ export default {
       this.form.validateFields((err, values) => {
         console.log(values)
         if (!err) {
-          this.currentAction.loading = true
           const params = {}
           if ('id' in this.resource && this.currentAction.params.map(i => { return i.name }).includes('id')) {
             params.id = this.resource.id
@@ -812,6 +812,7 @@ export default {
           const resourceName = params.displayname || params.displaytext || params.name || params.hostname || params.username || params.ipaddress || params.virtualmachinename || this.resource.name
 
           var hasJobId = false
+          this.actionLoading = true
           api(this.currentAction.api, params).then(json => {
             for (const obj in json) {
               if (obj.includes('response')) {
@@ -822,7 +823,11 @@ export default {
                     hasJobId = true
                     break
                   } else {
-                    this.$message.success(this.$t(this.currentAction.label) + (resourceName ? ' - ' + resourceName : ''))
+                    this.$message.success({
+                      content: this.$t(this.currentAction.label) + (resourceName ? ' - ' + resourceName : ''),
+                      key: this.currentAction.label + resourceName,
+                      duration: 2
+                    })
                   }
                 }
                 break
@@ -839,6 +844,7 @@ export default {
             console.log(error)
             this.$notifyError(error)
           }).finally(f => {
+            this.actionLoading = false
             this.closeAction()
           })
         }

ui/src/views/network/VpcTab.vue

@@ -132,7 +132,7 @@
               </a-form-item>
               <a-form-item
                 :label="$t('label.bypassvlanoverlapcheck')"
-                v-if="$store.getters.apis.createPrivateGateway.params.filter(x => x.name === 'bypassvlanoverlapcheck').length > 0" >
+                v-if="$store.getters.apis.createPrivateGateway && $store.getters.apis.createPrivateGateway.params.filter(x => x.name === 'bypassvlanoverlapcheck').length > 0" >
                 <a-checkbox
                   v-decorator="['bypassvlanoverlapcheck']"
                 ></a-checkbox>