swipe refresh

src/pages/dashboard/DashboardPage.vue

@@ -6,27 +6,29 @@
       </div>
     </template>
     <template v-else>
-      <DashboardHeaderBar
-        :data="headerBar"
-        :notifications="notifications"
-      />
-      <DashboardRegistrationIncomplete v-if="!registrationComplete" />
-      <DashboardSummaryInfos v-else :data="summaryInfos" />
-      <DashboardPaymentIncomplete v-if="!hasPaymentMethods" />
-      <DashboardPendingSchedules
-        v-if="pendingSchedules.length > 0"
-        :data="pendingSchedules"
-        @view-details="openAcceptedDialog"
-        @cancel="cancelSchedule"
-      />
-      <DashboardTodaySchedules v-if="todaySchedules.length > 0" :data="todaySchedules" @rate="openRatingDialog" />
-      <DashboardScrollAreaSchedules />
-      <DashboardClientProposals v-if="clientProposals.length > 0" :data="clientProposals" @refresh-data="reloadDashboard" />
-      <DashboardPendingCustomSchedules v-if="customSchedulesNoProposals.length > 0" />
-      <DashboardNextSchedules v-if="nextSchedules.length > 0" :data="nextSchedules" @view-details="openNextScheduleDialog" />
-      <DashboardLastDoneSchedules v-if="lastDoneSchedules.length > 0" :data="lastDoneSchedules" />
-      <DashboardFavoriteProviders v-if="favoriteProviders.length > 0" :data="favoriteProviders" />
-      <DashboardProvidersClose v-if="providersClose.length > 0" :data="providersClose" />
+      <q-pull-to-refresh color="primary" @refresh="onRefresh">
+        <DashboardHeaderBar
+          :data="headerBar"
+          :notifications="notifications"
+        />
+        <DashboardRegistrationIncomplete v-if="!registrationComplete" />
+        <DashboardSummaryInfos v-else :data="summaryInfos" />
+        <DashboardPaymentIncomplete v-if="!hasPaymentMethods" />
+        <DashboardPendingSchedules
+          v-if="pendingSchedules.length > 0"
+          :data="pendingSchedules"
+          @view-details="openAcceptedDialog"
+          @cancel="cancelSchedule"
+        />
+        <DashboardTodaySchedules v-if="todaySchedules.length > 0" :data="todaySchedules" @rate="openRatingDialog" />
+        <DashboardScrollAreaSchedules />
+        <DashboardClientProposals v-if="clientProposals.length > 0" :data="clientProposals" @refresh-data="reloadDashboard" />
+        <DashboardPendingCustomSchedules v-if="customSchedulesNoProposals.length > 0" />
+        <DashboardNextSchedules v-if="nextSchedules.length > 0" :data="nextSchedules" @view-details="openNextScheduleDialog" />
+        <DashboardLastDoneSchedules v-if="lastDoneSchedules.length > 0" :data="lastDoneSchedules" />
+        <DashboardFavoriteProviders v-if="favoriteProviders.length > 0" :data="favoriteProviders" />
+        <DashboardProvidersClose v-if="providersClose.length > 0" :data="providersClose" />
+      </q-pull-to-refresh>
     </template>
   </div>
 </template>
@@ -87,8 +89,8 @@ const openAcceptedDialog = (schedule) => {
   });
 };
 
-const reloadDashboard = async () => {
-  loading.value = true;
+const reloadDashboard = async (showLoader = true) => {
+  if (showLoader) loading.value = true;
   const response = await dadosDashboard();
   if (response) {
     headerBar.value = response.headerBar;
@@ -116,6 +118,14 @@ const reloadDashboard = async () => {
   loading.value = false;
 };
 
+const onRefresh = async (done) => {
+  try {
+    await reloadDashboard(false);
+  } finally {
+    done();
+  }
+};
+
 const openNextScheduleDialog = (schedule) => {
   $q.dialog({
     component: NextSchedulesDetailsDialog,