From c990f7383a0ba95c8877aad0f7277ebfa847f582 Mon Sep 17 00:00:00 2001
From: Rakesh Venkatesh <rakeshv.com@gmail.com>
Date: Wed, 10 Feb 2021 13:13:38 +0100
Subject: [PATCH 1/2] Display public ip addresses for shared network

If a vm belongs to shared network then display the list
of ip addresses available which can be used to assign for
secondary IP addresses.

Also display "Public IP addresses" tab for shared networks
---
 ui/src/config/section/network.js        |  2 +-
 ui/src/views/compute/InstanceTab.vue    | 36 ++++++++++++++++++++++---
 ui/src/views/network/IpAddressesTab.vue | 10 ++++---
 3 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/ui/src/config/section/network.js b/ui/src/config/section/network.js
index 3ea3fe071048..f274fd51d737 100644
--- a/ui/src/config/section/network.js
+++ b/ui/src/config/section/network.js
@@ -48,7 +48,7 @@ export default {
       }, {
         name: 'public.ip.addresses',
         component: () => import('@/views/network/IpAddressesTab.vue'),
-        show: (record) => { return record.type === 'Isolated' && !('vpcid' in record) && 'listPublicIpAddresses' in store.getters.apis }
+        show: (record) => { return (record.type === 'Isolated' || record.type === 'Shared') && !('vpcid' in record) && 'listPublicIpAddresses' in store.getters.apis }
       }, {
         name: 'virtual.routers',
         component: () => import('@/views/network/RoutersTab.vue'),
diff --git a/ui/src/views/compute/InstanceTab.vue b/ui/src/views/compute/InstanceTab.vue
index 29a5cdedebd2..97a8644e4ed3 100644
--- a/ui/src/views/compute/InstanceTab.vue
+++ b/ui/src/views/compute/InstanceTab.vue
@@ -102,7 +102,7 @@
                 icon="environment"
                 shape="circle"
                 :disabled="(!('addIpToNic' in $store.getters.apis) && !('addIpToNic' in $store.getters.apis))"
-                @click="fetchSecondaryIPs(record.nic.id)" />
+                @click="onAcquireSecondaryIPAddress(record)" />
             </a-tooltip>
             <a-tooltip placement="bottom">
               <template slot="title">
@@ -220,9 +220,25 @@
         {{ $t('message.network.secondaryip') }}
       </p>
       <a-divider />
-      <a-input :placeholder="$t('label.new.secondaryip.description')" v-model="newSecondaryIp" autoFocus></a-input>
+      <div class="modal-form">
+        <p class="modal-form__label">{{ $t('label.publicip') }}:</p>
+        <a-select
+          showSearch
+          v-if="editNicResource.type==='Shared'"
+          v-model="newSecondaryIp"
+          :loading="listIps.loading">
+          <a-select-option v-for="ip in listIps.opts" :key="ip.ipaddress">
+            {{ ip.ipaddress }}
+          </a-select-option>
+        </a-select>
+        <a-input
+          v-else
+          :placeholder="$t('label.new.secondaryip.description')"
+          v-model="newSecondaryIp"></a-input>
+      </div>
+
       <div style="margin-top: 10px; display: flex; justify-content:flex-end;">
-        <a-button @click="submitSecondaryIP" type="primary" style="margin-right: 10px;">{{ $t('label.add.secondary.ip') }}</a-button>
+        <a-button :disabled="listIps.opts.length === 0" @click="submitSecondaryIP" type="primary" style="margin-right: 10px;">{{ $t('label.add.secondary.ip') }}</a-button>
         <a-button @click="closeModals">{{ $t('label.close') }}</a-button>
       </div>
 
@@ -298,6 +314,7 @@ export default {
       loadingNic: false,
       editIpAddressNic: '',
       editIpAddressValue: '',
+      editNetworkId: '',
       secondaryIPs: [],
       selectedNicId: '',
       newSecondaryIp: '',
@@ -444,6 +461,15 @@ export default {
         this.fetchPublicIps(record.nic.networkid)
       }
     },
+    onAcquireSecondaryIPAddress (record) {
+      if (record.nic.type === 'Shared') {
+        this.editNicResource = record.nic
+        this.editNetworkId = record.nic.networkid
+        this.fetchPublicIps(record.nic.networkid)
+      }
+
+      this.fetchSecondaryIPs(record.nic.id)
+    },
     submitAddNetwork () {
       const params = {}
       params.virtualmachineid = this.vm.id
@@ -613,6 +639,9 @@ export default {
       }).catch(error => {
         this.$notifyError(error)
         this.loadingNic = false
+      }).finally(() => {
+        this.newSecondaryIp = null
+        this.fetchPublicIps(this.editNetworkId)
       })
     },
     removeSecondaryIP (id) {
@@ -625,6 +654,7 @@ export default {
           successMethod: () => {
             this.loadingNic = false
             this.fetchSecondaryIPs(this.selectedNicId)
+            this.fetchPublicIps(this.editNetworkId)
             this.parentFetchData()
           },
           errorMessage: this.$t('message.error.remove.secondary.ipaddress'),
diff --git a/ui/src/views/network/IpAddressesTab.vue b/ui/src/views/network/IpAddressesTab.vue
index ab7874cf0570..1a5663754403 100644
--- a/ui/src/views/network/IpAddressesTab.vue
+++ b/ui/src/views/network/IpAddressesTab.vue
@@ -19,7 +19,7 @@
   <div>
     <a-spin :spinning="fetchLoading">
       <a-button
-        :disabled="!('associateIpAddress' in $store.getters.apis)"
+        :disabled="!('associateIpAddress' in $store.getters.apis) || resource.type === 'Shared'"
         type="dashed"
         icon="plus"
         style="width: 100%; margin-bottom: 15px"
@@ -66,12 +66,12 @@
         </template>
 
         <template slot="associatednetworkname" slot-scope="text, record">
-          <router-link :to="{ path: '/guestnetwork/' + record.associatednetworkid }" > {{ record.associatednetworkname || record.associatednetworkid }} </router-link>
+          <router-link :to="{ path: '/guestnetwork/' + record.associatednetworkid }" > {{ record.associatednetworkname || record.associatednetworkid || record.networkname }} </router-link>
         </template>
 
         <template slot="action" slot-scope="text, record">
           <a-button
-            v-if="record.issourcenat !== true"
+            v-if="record.issourcenat !== true && record.forvirtualnetwork === true"
             type="danger"
             icon="delete"
             shape="circle"
@@ -212,6 +212,10 @@ export default {
         if (this.vpcTier) {
           params.associatednetworkid = this.vpcTier
         }
+      } else if (this.resource.type === 'Shared') {
+        params.networkid = this.resource.id
+        params.allocatedonly = false
+        params.forvirtualnetwork = false
       } else {
         params.associatednetworkid = this.resource.id
       }

From a8ee0049efbbe08f144511b4963801cbc8f16304 Mon Sep 17 00:00:00 2001
From: Rakesh Venkatesh <rakeshv.com@gmail.com>
Date: Thu, 1 Apr 2021 12:05:39 +0200
Subject: [PATCH 2/2] bug fix

---
 ui/src/views/compute/InstanceTab.vue    | 8 +++++---
 ui/src/views/network/IpAddressesTab.vue | 6 ++++--
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/ui/src/views/compute/InstanceTab.vue b/ui/src/views/compute/InstanceTab.vue
index 97a8644e4ed3..8ad259b290ac 100644
--- a/ui/src/views/compute/InstanceTab.vue
+++ b/ui/src/views/compute/InstanceTab.vue
@@ -238,7 +238,7 @@
       </div>
 
       <div style="margin-top: 10px; display: flex; justify-content:flex-end;">
-        <a-button :disabled="listIps.opts.length === 0" @click="submitSecondaryIP" type="primary" style="margin-right: 10px;">{{ $t('label.add.secondary.ip') }}</a-button>
+        <a-button @click="submitSecondaryIP" type="primary" style="margin-right: 10px;">{{ $t('label.add.secondary.ip') }}</a-button>
         <a-button @click="closeModals">{{ $t('label.close') }}</a-button>
       </div>
 
@@ -463,11 +463,13 @@ export default {
     },
     onAcquireSecondaryIPAddress (record) {
       if (record.nic.type === 'Shared') {
-        this.editNicResource = record.nic
-        this.editNetworkId = record.nic.networkid
         this.fetchPublicIps(record.nic.networkid)
+      } else {
+        this.listIps.opts = []
       }
 
+      this.editNicResource = record.nic
+      this.editNetworkId = record.nic.networkid
       this.fetchSecondaryIPs(record.nic.id)
     },
     submitAddNetwork () {
diff --git a/ui/src/views/network/IpAddressesTab.vue b/ui/src/views/network/IpAddressesTab.vue
index 1a5663754403..111fbee95639 100644
--- a/ui/src/views/network/IpAddressesTab.vue
+++ b/ui/src/views/network/IpAddressesTab.vue
@@ -52,7 +52,8 @@
         :rowKey="item => item.id"
         :pagination="false" >
         <template slot="ipaddress" slot-scope="text, record">
-          <router-link :to="{ path: '/publicip/' + record.id }" >{{ text }} </router-link>
+          <router-link v-if="record.forvirtualnetwork === true" :to="{ path: '/publicip/' + record.id }" >{{ text }} </router-link>
+          <div v-else>{{ text }}</div>
           <a-tag v-if="record.issourcenat === true">source-nat</a-tag>
         </template>
 
@@ -66,7 +67,8 @@
         </template>
 
         <template slot="associatednetworkname" slot-scope="text, record">
-          <router-link :to="{ path: '/guestnetwork/' + record.associatednetworkid }" > {{ record.associatednetworkname || record.associatednetworkid || record.networkname }} </router-link>
+          <router-link v-if="record.forvirtualnetwork === true" :to="{ path: '/guestnetwork/' + record.associatednetworkid }" > {{ record.associatednetworkname || record.associatednetworkid }} </router-link>
+          <div v-else>{{ record.networkname }}</div>
         </template>
 
         <template slot="action" slot-scope="text, record">