refactor template formatting according to guidelines

app/assets/javascripts/monitoring/components/monitoring.vue

@@ -118,24 +118,20 @@
     },
   };
 </script>
+
 <template>
-  <div 
-    class="prometheus-graphs" 
-    v-if="!showEmptyState">
+  <div v-if="!showEmptyState" class="prometheus-graphs">
     <div
       class="row"
       v-for="(groupData, index) in store.groups"
-      :key="index">
-      <div 
-        class="col-md-12">
-        <div 
-          class="panel panel-default prometheus-panel">
-          <div 
-            class="panel-heading">
+      :key="index"
+    >
+      <div class="col-md-12">
+        <div class="panel panel-default prometheus-panel">
+          <div class="panel-heading">
             <h4>{{groupData.group}}</h4>
           </div>
-          <div 
-            class="panel-body">
+          <div class="panel-body">
             <monitoring-row
               v-for="(row, index) in groupData.metrics"
               :key="index"

app/assets/javascripts/monitoring/components/monitoring_row.vue

@@ -26,9 +26,9 @@
     },
   };
 </script>
+
 <template>
-  <div 
-    class="prometheus-row row">
+  <div class="prometheus-row row">
     <monitoring-column
       v-for="(column, index) in rowData"
       :column-data="column"

app/assets/javascripts/monitoring/components/monitoring_state.vue

@@ -62,48 +62,32 @@
     },
   };
 </script>
+
 <template>
-  <div 
-    class="prometheus-state">
-    <div 
-      class="row">
-      <div 
-        class="col-md-4 col-md-offset-4 state-svg" 
-        v-html="currentState.svg">
-      </div>
+  <div class="prometheus-state">
+    <div class="row">
+      <div class="col-md-4 col-md-offset-4 state-svg" v-html="currentState.svg"></div>
     </div>
-    <div 
-      class="row">
-      <div 
-        class="col-md-6 col-md-offset-3">
-        <h4 
-          class="text-center state-title">
+    <div class="row">
+      <div class="col-md-6 col-md-offset-3">
+        <h4 class="text-center state-title">
           {{currentState.title}}
         </h4>
       </div>
     </div>
-    <div 
-      class="row">
-      <div 
-        class="col-md-6 col-md-offset-3">
-        <div 
-          class="description-text text-center state-description">
+    <div class="row">
+      <div class="col-md-6 col-md-offset-3">
+        <div class="description-text text-center state-description">
           {{currentState.description}}
-            <a 
-              :href="settingsPath"
-              v-if="showButtonDescription">
+          <a v-if="showButtonDescription" :href="settingsPath">
             Prometheus server
           </a>
         </div>
       </div>
     </div>
-    <div 
-      class="row state-button-section">
-      <div 
-        class="col-md-4 col-md-offset-4 text-center state-button">
-        <a 
-          class="btn btn-success" 
-          :href="buttonPath">
+    <div class="row state-button-section">
+      <div class="col-md-4 col-md-offset-4 text-center state-button">
+        <a class="btn btn-success" :href="buttonPath">
           {{currentState.buttonText}}
         </a>
       </div>