Read Grafana address from backend

[chickenlj]

By requesting /metrics/metadata, we can get the backend Grafana service address and then set it as the Iframe url.

The front page is currently ServiceMetrics and should be something like:

<template>
  <v-container grid-list-xl fluid>
    <v-layout row wrap>
      <v-flex>
        <iframe src="http:metadata.grafanaAdress/dashboard-solo/new?utm_source=grafana_gettingstarted&orgId=1&from=1684139950126&to=1684161550126&panelId=1" width="1350" height="700" frameborder="0"></iframe>
      </v-flex>
    </v-layout>
  </v-container>
</template>

<script>
 import Material from 'vuetify/es5/util/colors'

export default {

  name: 'ServiceMetrics'
   components: {
     Breadcrumb,
     Search
   },
   data () {
     return {
       breads: [
         {
           text: 'metrics',
           href: ''
         }
       ],
       metadata: [],
     }
   },
   methods: {
     getMetadata () {
       this.$axios.get('/metrics/metadata').then(response => {
         console.log(response)
       })
     },
   },
   mounted: function () {
      this.getMetadata();
   }
}
</script>

<style scoped>
  .echarts {
    width: 105%;
    height: 68px;
  }

</style>

[chickenlj]

It could be either an embedded IFrame or open a new tab