From 281de603e457b34a8af6fe336a3e1fb5b9ad7e01 Mon Sep 17 00:00:00 2001
From: 18alantom <2.alan.tom@gmail.com>
Date: Fri, 28 Jan 2022 01:09:48 +0530
Subject: [PATCH] fix: tentative fix to single value charts - i.e. when This
 Month

---
 src/pages/Dashboard/Cashflow.vue       |  8 ++++++--
 src/pages/Dashboard/PeriodSelector.vue | 12 +++++++++---
 src/pages/Dashboard/ProfitAndLoss.vue  |  1 +
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/pages/Dashboard/Cashflow.vue b/src/pages/Dashboard/Cashflow.vue
index 63106243..44e420cb 100644
--- a/src/pages/Dashboard/Cashflow.vue
+++ b/src/pages/Dashboard/Cashflow.vue
@@ -13,7 +13,11 @@
             <span class="ml-2 text-gray-900">{{ t('Outflow') }}</span>
           </div>
         </div>
-        <PeriodSelector :value="period" @change="(value) => (period = value)" />
+        <PeriodSelector
+          :value="period"
+          @change="(value) => (period = value)"
+          :options="['This Year', 'This Quarter']"
+        />
       </div>
       <LineChart
         v-if="hasData"
@@ -136,7 +140,7 @@ export default {
       const colors = ['#2490EF', '#B7BFC6'];
       const format = (value) => frappe.format(value ?? 0, 'Currency');
       const yMax = getYMax(points);
-      return { points, xLabels, colors, format, yMax, formatX:formatXLabels };
+      return { points, xLabels, colors, format, yMax, formatX: formatXLabels };
     },
   },
   methods: {
diff --git a/src/pages/Dashboard/PeriodSelector.vue b/src/pages/Dashboard/PeriodSelector.vue
index 49c9f9d7..4d92319f 100644
--- a/src/pages/Dashboard/PeriodSelector.vue
+++ b/src/pages/Dashboard/PeriodSelector.vue
@@ -39,14 +39,20 @@
 import Dropdown from '@/components/Dropdown';
 export default {
   name: 'PeriodSelector',
-  props: ['value'],
+  props: {
+    value: String,
+    options: {
+      type: Array,
+      default: () => ['This Year', 'This Quarter', 'This Month'],
+    },
+  },
+
   components: {
     Dropdown,
   },
   data() {
-    let options = ['This Year', 'This Quarter', 'This Month'];
     return {
-      periodOptions: options.map((option) => {
+      periodOptions: this.options.map((option) => {
         return {
           label: option,
           action: () => this.selectOption(option),
diff --git a/src/pages/Dashboard/ProfitAndLoss.vue b/src/pages/Dashboard/ProfitAndLoss.vue
index 8fc43def..5b9c4a3b 100644
--- a/src/pages/Dashboard/ProfitAndLoss.vue
+++ b/src/pages/Dashboard/ProfitAndLoss.vue
@@ -5,6 +5,7 @@
       <PeriodSelector
         slot="action"
         :value="period"
+        :options="['This Year', 'This Quarter']"
         @change="(value) => (period = value)"
       />
     </SectionHeader>