ayanova/devdocs/todo.txt

@@ -10,7 +10,18 @@ todo: storage graphs look shitty overtop of each other
 	maybe use completely different colors for each so no color appears twice on that tab
 	Or, what exactly is being told there, maybe a different chart would be more useful
 	it seems to be confusing to me and I made it!
-
+	CHANGE:
+		Make into only two graphs
+		combine top two into one
+			Put all items in the one chart
+		Bottom file count
+			remove backup files
+			
+todo: top tables remove color beside legend
+todo: cpu % starts at 1600?? wtf a bad number in there somehwere
+todo: moving tabs should trigger refresh or move refresh into tab so it appears to only apply to that tab
+	or check if tab data is not refreshed?
+	sometimes you might not want to refresh a tab?
 todo: metrics page not localized "storage" etc
 todo: metrics tables have no indexes?
 	but they need to fetch by date range so...not sure about that one
@@ -147,6 +158,7 @@ todo: THIS!  At this point, upload to dev server and thoroughly test with device
 	- Might need to hide attachments until user clicks on something to reveal as it seems odd to fetch every open
 todo: careful and thorough PERF tests remotely and local
 	- https://www.digitalocean.com/community/tutorials/how-to-use-chrome-dev-tools-to-find-performance-bottlenecks?utm_source=DigitalOcean_Newsletter
+	- https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/reference#rendering
 todo: keyboard usage test:
 	- https://rockfish.ayanova.com/default.htm#!/rfcaseEdit/3481
 

ayanova/src/views/ops-metrics.vue

@@ -12,10 +12,10 @@
         @input="timePeriodChanged"
       ></v-select>
     </v-col>
-
+<!-- 
     <v-col cols="12">
       {{ $vuetify.breakpoint.name }}
-    </v-col>
+    </v-col> -->
 
     <v-tabs v-model="tab" color="primary" grow @change="tabChanged">
       <v-tabs-slider></v-tabs-slider>
@@ -72,21 +72,14 @@
         <v-tab-item>
           <v-col cols="12">
             <gz-chart-line
-              :chartData="attachSizeChartData"
+              :chartData="fileSizeChartData"
               :options="timeLineChartOptions"
               class="my-12"
             />
           </v-col>
           <v-col cols="12">
             <gz-chart-line
-              :chartData="utilitySizeChartData"
-              :options="timeLineChartOptions"
-              class="my-12"
-            />
-          </v-col>
-          <v-col cols="12">
-            <gz-chart-line
-              :chartData="fileCountChartData"
+              :chartData="attachmentCountChartData"
               :options="timeLineChartOptions"
               class="my-12"
             />
@@ -363,7 +356,7 @@ export default {
           },
           {
             label: "GC Gen1",
-            borderColor: CHART_PALETTE.red,
+            borderColor: CHART_PALETTE.cyan,
             fill: false,
             radius: 0,
             hoverRadius: 10,
@@ -372,7 +365,7 @@ export default {
           },
           {
             label: "GC Gen2",
-            borderColor: CHART_PALETTE.green,
+            borderColor: CHART_PALETTE.black,
             fill: false,
             radius: 0,
             hoverRadius: 10,
@@ -418,7 +411,7 @@ export default {
         ]
       };
     },
-    attachSizeChartData() {
+    fileSizeChartData() {
       return {
         datasets: [
           {
@@ -430,7 +423,15 @@ export default {
             hitRadius: 4,
             data: this.storage.attachmentFileSize
           },
-
+          {
+            label: "Backup (MB)",
+            borderColor: CHART_PALETTE.orange,
+            fill: false,
+            radius: 0,
+            hoverRadius: 10,
+            hitRadius: 4,
+            data: this.storage.utilityFileSize
+          },
           {
             label: "Available space (MB)",
             borderColor: CHART_PALETTE.green,
@@ -443,52 +444,17 @@ export default {
         ]
       };
     },
-    utilitySizeChartData() {
-      return {
-        datasets: [
-          {
-            label: "Backup (MB)",
-            borderColor: CHART_PALETTE.orange,
-            fill: false,
-            radius: 0,
-            hoverRadius: 10,
-            hitRadius: 4,
-            data: this.storage.utilityFileSize
-          },
-
-          {
-            label: "Available space (MB)",
-            borderColor: CHART_PALETTE.green,
-            fill: false,
-            radius: 0,
-            hoverRadius: 10,
-            hitRadius: 4,
-            data: this.storage.utilityFilesAvailableSpace
-          }
-        ]
-      };
-    },
-    fileCountChartData() {
+    attachmentCountChartData() {
       return {
         datasets: [
           {
             label: "Attachment files",
-            borderColor: CHART_PALETTE.purple,
+            borderColor: CHART_PALETTE.blue,
             fill: false,
             radius: 0,
             hoverRadius: 10,
             hitRadius: 4,
             data: this.storage.attachmentFileCount
-          },
-
-          {
-            label: "Backup files",
-            borderColor: CHART_PALETTE.orange,
-            fill: false,
-            radius: 0,
-            hoverRadius: 10,
-            hitRadius: 4,
-            data: this.storage.utilityFileCount
           }
         ]
       };