Fix home dashboard and reports (#424)

Author: joanagmaia

frontend/src/modules/dashboard/components/dashboard-count.vue

@@ -91,7 +91,12 @@ export default {
         moment()
           .utc()
           .startOf('day')
-          .subtract(this.period - 1, 'd')
+          .subtract(
+            this.period.granularity === 'day'
+              ? this.period.value - 1
+              : this.period.value,
+            this.period.granularity
+          )
           .toISOString(),
         moment().utc().endOf('day').toISOString()
       ]
@@ -101,15 +106,30 @@ export default {
         moment()
           .utc()
           .startOf('day')
-          .subtract(this.period - 1, 'd')
+          .subtract(
+            this.period.granularity === 'day'
+              ? this.period.value - 1
+              : this.period.value,
+            this.period.granularity
+          )
           .subtract(1, 'ms')
           .startOf('day')
-          .subtract(this.period - 1, 'd')
+          .subtract(
+            this.period.granularity === 'day'
+              ? this.period.value - 1
+              : this.period.value,
+            this.period.granularity
+          )
           .toISOString(),
         moment()
           .utc()
           .startOf('day')
-          .subtract(this.period - 1, 'd')
+          .subtract(
+            this.period.granularity === 'day'
+              ? this.period.value - 1
+              : this.period.value,
+            this.period.granularity
+          )
           .subtract(1, 'ms')
           .toISOString()
       ]

frontend/src/modules/dashboard/dashboard.cube.js

@@ -38,7 +38,12 @@ export const chartOptions = {
 function dateRange(period) {
   const end = moment().utc().endOf('day')
   const start = moment()
-    .subtract(period - 1, 'day')
+    .subtract(
+      period.granularity === 'day'
+        ? period.value - 1
+        : period.value,
+      period.granularity
+    )
     .utc()
     .startOf('day')
   return [start, end]

frontend/src/modules/report/pages/report-view-page-public.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="report-view-page">
     <div
-      v-if="loading"
-      v-loading="loading"
+      v-if="computedLoading"
+      v-loading="computedLoading"
       class="app-page-spinner"
     ></div>
     <div v-else>
@@ -152,10 +152,13 @@ export default {
   computed: {
     ...mapGetters({
       reportFind: 'report/find',
-      loading: 'report/loading'
+      reportLoading: 'report/loading'
     }),
     report() {
       return this.reportFind(this.id)
+    },
+    computedLoading() {
+      return this.reportLoading || this.loading
     }
   },
 

frontend/src/modules/report/pages/report-view-page.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="report-view-page">
     <div
-      v-if="loading"
-      v-loading="loading"
+      v-if="computedLoading"
+      v-loading="computedLoading"
       class="app-page-spinner"
     ></div>
     <div v-else>
@@ -94,10 +94,13 @@ export default {
     ...mapGetters({
       menuCollapsed: 'layout/menuCollapsed',
       reportFind: 'report/find',
-      loading: 'report/loading'
+      reportLoading: 'report/loading'
     }),
     report() {
       return this.reportFind(this.id)
+    },
+    computedLoading() {
+      return this.reportLoading || this.loading
     }
   },
 

frontend/src/modules/widget/components/v2/widget-active-members.vue

@@ -36,7 +36,10 @@
             #default="{ resultSet, loading, error }"
           >
             <!-- Loading -->
-            <app-widget-loading v-if="loading" type="kpi" />
+            <app-widget-loading
+              v-if="loading || !resultSet?.loadResponses"
+              type="kpi"
+            />
 
             <!-- Error -->
             <app-widget-error
@@ -148,6 +151,7 @@ const kpiPreviousValue = (resultSet) => {
   const pivot = resultSet.chartPivot()
   return Number(pivot[pivot.length - 2]['Members.count'])
 }
+
 const handleDrawerOpen = (period) => {
   drawerExpanded.value = period
 }

frontend/src/modules/widget/components/v2/widget-total-members.vue

@@ -23,7 +23,10 @@
       >
         <template #default="{ resultSet, loading, error }">
           <!-- Loading -->
-          <app-widget-loading v-if="loading" size="small" />
+          <app-widget-loading
+            v-if="loading || !resultSet?.loadResponses"
+            size="small"
+          />
 
           <!-- Error -->
           <app-widget-error v-else-if="error" />