Added redirect url for MaaS instance page

extensions/MaaS/maas.py

@@ -139,12 +139,15 @@ class MaasManager:
         if json_data.get("cloudstack.vm.details", {}).get("nics"):
             json_data["cloudstack.vm.details"]["nics"][0]["mac"] = mac
 
+        console_url = f"http://{self.data['endpoint'].replace('http://','').replace('https://','')}:5240/MAAS/r/machine/{system_id}/summary"
+
         result = {
             "nics": json_data["cloudstack.vm.details"]["nics"],
             "details": {
                 "External:mac_address": mac,
                 "External:maas_system_id": system_id,
                 "External:hostname": hostname,
+                "External:console_url": console_url,
             },
         }
         succeed(result)

ui/src/components/view/ActionButton.vue

@@ -17,7 +17,7 @@
 
 <template>
   <span class="row-action-button">
-    <a-tooltip arrowPointAtCenter placement="bottomRight" v-if="resource && resource.id && dataView && resource.hypervisor !== 'External'">
+    <a-tooltip arrowPointAtCenter placement="bottomRight" v-if="resource && resource.id && dataView">
       <template #title>
         {{ $t('label.view.console') }}
       </template>
@@ -29,7 +29,7 @@
         icon="code"
       />
     </a-tooltip>
-    <a-tooltip arrowPointAtCenter placement="bottomRight" v-if="resource && resource.id && dataView && resource.hypervisor !== 'External'">
+    <a-tooltip arrowPointAtCenter placement="bottomRight" v-if="resource && resource.id && dataView">
       <template #title>
         {{ $t('label.copy.consoleurl') }}
       </template>

ui/src/components/widgets/Console.vue

@@ -17,9 +17,17 @@
 
 <template>
   <a
-    v-if="['vm', 'systemvm', 'router', 'ilbvm', 'vnfapp'].includes($route.meta.name) && 'listVirtualMachines' in $store.getters.apis && 'createConsoleEndpoint' in $store.getters.apis"
+    v-if="['vm', 'systemvm', 'router', 'ilbvm', 'vnfapp'].includes($route.meta.name) &&
+           'listVirtualMachines' in $store.getters.apis &&
+           'createConsoleEndpoint' in $store.getters.apis"
     @click="consoleUrl">
-    <a-button style="margin-left: 5px" shape="circle" type="dashed" :size="size" :disabled="['Stopped', 'Restoring', 'Error', 'Destroyed'].includes(resource.state) || resource.hostcontrolstate === 'Offline'" >
+    <a-button
+      style="margin-left: 5px"
+      shape="circle"
+      type="dashed"
+      :size="size"
+      :disabled="['Stopped', 'Restoring', 'Error', 'Destroyed'].includes(resource.state) ||
+                 resource.hostcontrolstate === 'Offline'">
       <code-outlined v-if="!copyUrlToClipboard"/>
       <copy-outlined v-else />
     </a-button>
@@ -49,11 +57,29 @@ export default {
     }
   },
   methods: {
-    consoleUrl () {
+    async consoleUrl () {
-      const params = {}
+      try {
-      params.virtualmachineid = this.resource.id
+        const externalUrl = this.resource?.details?.['External:console_url']
-      postAPI('createConsoleEndpoint', params).then(json => {
+        if (externalUrl) {
-        this.url = (json && json.createconsoleendpointresponse) ? json.createconsoleendpointresponse.consoleendpoint.url : '#/exception/404'
+          this.url = externalUrl
+          if (this.copyUrlToClipboard) {
+            this.$copyText(this.url)
+            this.$message.success({
+              content: this.$t('label.copied.clipboard')
+            })
+          } else {
+            window.open(this.url, '_blank')
+          }
+          return
+        }
+
+        const params = { virtualmachineid: this.resource.id }
+        const json = await postAPI('createConsoleEndpoint', params)
+
+        this.url = (json && json.createconsoleendpointresponse)
+          ? json.createconsoleendpointresponse.consoleendpoint.url
+          : '#/exception/404'
+
         if (json.createconsoleendpointresponse.consoleendpoint.success) {
           if (this.copyUrlToClipboard) {
             this.$copyText(this.url)
@@ -69,9 +95,9 @@ export default {
             description: json.createconsoleendpointresponse.consoleendpoint.details
           })
         }
-      }).catch(error => {
+      } catch (error) {
         this.$notifyError(error)
-      })
+      }
     }
   },
   computed: {