[Enhancement] Move chart options to a variable (#189)

2019-10-28 10:30:02 -05:00 · 2019-10-28 10:30:02 -05:00 · 5a41f321c8
commit 5a41f321c8
parent 17bb50c977
1 changed files with 34 additions and 32 deletions
--- a/app/javascript/dashboard/components/widgets/chart/BarChart.js
+++ b/app/javascript/dashboard/components/widgets/chart/BarChart.js
@ -3,41 +3,43 @@ import { Bar } from 'vue-chartjs';
 const fontFamily =
  '-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif';

+const chartOptions = {
+  responsive: true,
+  maintainAspectRatio: false,
+  legend: {
+    labels: {
+      fontFamily,
+    },
+  },
+  scales: {
+    xAxes: [
+      {
+        barPercentage: 1.9,
+        ticks: {
+          fontFamily,
+        },
+        gridLines: {
+          display: false,
+        },
+      },
+    ],
+    yAxes: [
+      {
+        ticks: {
+          fontFamily,
+        },
+        gridLines: {
+          display: false,
+        },
+      },
+    ],
+  },
+};
+
 export default {
  extends: Bar,
  props: ['collection'],
  mounted() {
-    this.renderChart(this.collection, {
-      responsive: true,
-      maintainAspectRatio: false,
-      legend: {
-        labels: {
-          fontFamily,
-        },
-      },
-      scales: {
-        xAxes: [
-          {
-            barPercentage: 1.9,
-            ticks: {
-              fontFamily,
-            },
-            gridLines: {
-              display: false,
-            },
-          },
-        ],
-        yAxes: [
-          {
-            ticks: {
-              fontFamily,
-            },
-            gridLines: {
-              display: false,
-            },
-          },
-        ],
-      },
-    });
+    this.renderChart(this.collection, chartOptions);
  },
 };