From 2d19c8a1fcbfb8a2c40a5b84cf8b374b3e4fca3b Mon Sep 17 00:00:00 2001
From: John Cardinal <support@ayanova.com>
Date: Wed, 3 Jun 2020 00:44:50 +0000
Subject: [PATCH]

---
 ayanova/src/views/ops-metrics.vue | 98 +++++++++++++++++--------------
 1 file changed, 54 insertions(+), 44 deletions(-)

diff --git a/ayanova/src/views/ops-metrics.vue b/ayanova/src/views/ops-metrics.vue
index 0874c020..20ed17e5 100644
--- a/ayanova/src/views/ops-metrics.vue
+++ b/ayanova/src/views/ops-metrics.vue
@@ -25,29 +25,26 @@
 
       <v-tabs-items v-model="tab">
         <v-tab-item>
-          <v-col cols="12" class="my-1">
-            <v-sheet elevation="4">
-              <gz-chart-line
-                :chartData="memAllChartData"
-                :options="timeLineChartOptions"
-              />
-            </v-sheet>
+          <v-col cols="12">
+            <gz-chart-line
+              :chartData="memAllChartData"
+              :options="timeLineChartOptions"
+              class="my-12"
+            />
           </v-col>
-          <v-col cols="12" class="my-1">
-            <v-sheet elevation="4">
-              <gz-chart-line
-                :chartData="cpuChartData"
-                :options="timeLineChartOptions"
-              />
-            </v-sheet>
+          <v-col cols="12">
+            <gz-chart-line
+              :chartData="cpuChartData"
+              :options="timeLineChartOptions"
+              class="my-12"
+            />
           </v-col>
-          <v-col cols="12" class="my-1">
-            <v-sheet elevation="4">
-              <gz-chart-line
-                :chartData="gcAllChartData"
-                :options="timeLineChartOptions"
-              />
-            </v-sheet>
+          <v-col cols="12">
+            <gz-chart-line
+              :chartData="gcAllChartData"
+              :options="timeLineChartOptions"
+              class="my-12"
+            />
           </v-col>
         </v-tab-item>
         <v-tab-item>
@@ -61,35 +58,38 @@
           <v-col cols="12" lg="10" xl="8">
             <gz-chart-bar-horizontal
               :chartData="dbTopTablesChartData"
-              :options="{ responsive: true }"
+              :options="{
+                responsive: true,
+                scales: {
+                  xAxes: [{ gridLines: { display: true } }],
+                  yAxes: [{ gridLines: { display: false } }]
+                }
+              }"
               class="my-12"
             />
           </v-col>
         </v-tab-item>
         <v-tab-item>
-          <v-col cols="12" class="my-1">
-            <v-sheet elevation="4">
-              <gz-chart-line
-                :chartData="attachSizeChartData"
-                :options="timeLineChartOptions"
-              />
-            </v-sheet>
+          <v-col cols="12">
+            <gz-chart-line
+              :chartData="attachSizeChartData"
+              :options="timeLineChartOptions"
+              class="my-12"
+            />
           </v-col>
-          <v-col cols="12" class="my-1">
-            <v-sheet elevation="4">
-              <gz-chart-line
-                :chartData="utilitySizeChartData"
-                :options="timeLineChartOptions"
-              />
-            </v-sheet>
+          <v-col cols="12">
+            <gz-chart-line
+              :chartData="utilitySizeChartData"
+              :options="timeLineChartOptions"
+              class="my-12"
+            />
           </v-col>
-          <v-col cols="12" class="my-1">
-            <v-sheet elevation="4">
-              <gz-chart-line
-                :chartData="fileCountChartData"
-                :options="timeLineChartOptions"
-              />
-            </v-sheet>
+          <v-col cols="12">
+            <gz-chart-line
+              :chartData="fileCountChartData"
+              :options="timeLineChartOptions"
+              class="my-12"
+            />
           </v-col>
         </v-tab-item>
       </v-tabs-items>
@@ -150,7 +150,17 @@ export default {
           xAxes: [
             {
               type: "time",
-              distribution: "linear"
+              distribution: "linear",
+              gridLines: {
+                drawOnChartArea: false
+              }
+            }
+          ],
+          yAxes: [
+            {
+              gridLines: {
+                drawOnChartArea: false
+              }
             }
           ]
         }