feat: Added pagination and filter on listFlowsStart requisition

weni-ai · Oct 25, 2023 · 97634ce · 97634ce
1 parent 9cd03af
commit 97634ce
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 3 deletions.
diff --git a/src/components/chats/FlowsTrigger/ModalListTriggeredFlows.vue b/src/components/chats/FlowsTrigger/ModalListTriggeredFlows.vue
@@ -95,7 +95,7 @@ export default {
   }),
 
   async mounted() {
-    this.triggeredFlows = await FlowsTrigger.listFlowsStart();
+    this.getListFlowsStart();
   },
 
   computed: {
@@ -134,6 +134,41 @@ export default {
     getTime(date) {
       return moment(date).format('HH:mm');
     },
+    async getListFlowsStart(paginate) {
+      this.isTableLoading = true;
+      this.isPagesLoading = true;
+
+      const { triggeredFlowsCurrentPage, triggeredFlowsLimit, filterDate } = this;
+
+      if (paginate !== true) {
+        this.triggeredFlowsCurrentPage = 1;
+      }
+
+      const offset = (triggeredFlowsCurrentPage - 1) * triggeredFlowsLimit;
+
+      try {
+        const response = await FlowsTrigger.listFlowsStart({
+          offset,
+          limit: triggeredFlowsLimit,
+          ended_at_before: filterDate.end,
+          ended_at_after: filterDate.start,
+        });
+        this.triggeredFlows = response.results || response;
+        this.triggeredFlowsCount = response.count || 0;
+        this.triggeredFlowsCountPages = Math.ceil(response.count || 0 / triggeredFlowsLimit);
+      } catch (error) {
+        console.log(error);
+      }
+
+      this.isTableLoading = false;
+      this.isPagesLoading = false;
+    },
+  },
+  watch: {
+    triggeredFlowsCurrentPage() {
+      this.getListFlowsStart(true);
+    },
+    filterDate: 'getListFlowsStart',
   },
 };
 </script>

diff --git a/src/services/api/resources/chats/flowsTrigger.js b/src/services/api/resources/chats/flowsTrigger.js
@@ -47,8 +47,15 @@ export default {
     });
     return response.data;
   },
-  async listFlowsStart() {
-    const response = await http.get(`/project/${getProject()}/list_flows_start/`);
+  async listFlowsStart({ offset = 0, limit = 5, ended_at_before = '', ended_at_after = '' }) {
+    const response = await http.get(`/project/${getProject()}/list_flows_start/`, {
+      params: {
+        offset,
+        limit,
+        ended_at_before,
+        ended_at_after,
+      },
+    });
     return response.data;
   },