From 3f651414221172355dcba38d1ee97c9db4ec7226 Mon Sep 17 00:00:00 2001
From: Emily <adharaultimasheireen@gmail.com>
Date: Fri, 14 Jun 2024 16:19:57 +0200
Subject: [PATCH] add csv filters

---
 dashboard/pages/admin/index.vue              | 49 ++++++++++++++++++++
 dashboard/pages/dashboard/visits.vue         | 19 +++++++-
 dashboard/server/api/project/generate_csv.ts | 16 ++++++-
 3 files changed, 80 insertions(+), 4 deletions(-)

diff --git a/dashboard/pages/admin/index.vue b/dashboard/pages/admin/index.vue
index ddd9eea..d5f2231 100644
--- a/dashboard/pages/admin/index.vue
+++ b/dashboard/pages/admin/index.vue
@@ -79,6 +79,35 @@ function onHideClicked() {
     isAdminHidden.value = true;
 }
 
+
+const projectsCount = computed(() => {
+    return projects.value?.length || 0;
+});
+
+const premiumCount = computed(() => {
+    let premiums = 0;
+    projects.value?.forEach(e => {
+        if (e.premium) premiums++;
+    })
+    return premiums;
+})
+
+
+const usersCount = computed(() => {
+    const uniqueUsers = new Set<string>();
+    projects.value?.forEach(e => uniqueUsers.add(e.user.email));
+    return uniqueUsers.size;
+});
+
+
+const totalVisits = computed(() => {
+    return projects.value?.reduce((a, e) => a + e.total_visits, 0) || 0;
+});
+const totalEvents = computed(() => {
+    return projects.value?.reduce((a, e) => a + e.total_events, 0) || 0;
+});
+
+
 const details = ref<any>();
 const showDetails = ref<boolean>(false);
 async function getProjectDetails(project_id: string) {
@@ -114,6 +143,26 @@ async function resetCount(project_id: string) {
         </div>
 
 
+        <Card class="p-4">
+
+            <div class="grid grid-cols-2">
+                <div>
+                    Users: {{ usersCount }}
+                </div>
+                <div>
+                    Projects: {{ projectsCount }} ( {{ premiumCount }} premium )
+                </div>
+                <div>
+                    Total visits: {{ formatNumberK(totalVisits) }}
+                </div>
+                <div>
+                    Total events: {{ formatNumberK(totalEvents) }}
+                </div>
+            </div>
+
+        </Card>
+
+
         <div v-for="item of projectsGrouped" class="bg-menu p-4 rounded-xl flex flex-col gap-2 w-full relative">
             <div class="flex flex-col gap-6">
 
diff --git a/dashboard/pages/dashboard/visits.vue b/dashboard/pages/dashboard/visits.vue
index e29c0d8..5b2fc91 100644
--- a/dashboard/pages/dashboard/visits.vue
+++ b/dashboard/pages/dashboard/visits.vue
@@ -47,7 +47,7 @@ const creatingCsv = ref<boolean>(false);
 
 async function downloadCSV() {
     creatingCsv.value = true;
-    const result = await $fetch(`/api/project/generate_csv?mode=visits`, signHeaders());
+    const result = await $fetch(`/api/project/generate_csv?mode=visits&slice=${options.indexOf(selectedTimeFrom.value)}`, signHeaders());
     const blob = new Blob([result], { type: 'text/csv' });
     const url = window.URL.createObjectURL(blob);
     const a = document.createElement('a');
@@ -60,6 +60,14 @@ async function downloadCSV() {
     creatingCsv.value = false;
 }
 
+
+const options = ['Last day', 'Last week', 'Last month', 'Total']
+const selectedTimeFrom = ref<string>(options[0]);
+
+const showWarning = computed(() => {
+    return options.indexOf(selectedTimeFrom.value) > 1
+})
+
 </script>
 
 
@@ -75,7 +83,14 @@ async function downloadCSV() {
             </div>
         </div>
 
-        <div class="flex justify-end px-12 py-3">
+        <div class="flex justify-end px-12 py-3 items-center gap-2">
+            <div v-if="showWarning" class="text-orange-400 flex gap-2 items-center">
+                <i class="far fa-warning "></i>
+                <div> It can take a few minutes </div>
+            </div>
+            <div class="w-[15rem] flex flex-col gap-0">
+                <USelectMenu v-model="selectedTimeFrom" :options="options"></USelectMenu>
+            </div>
             <div @click="downloadCSV()"
                 class="bg-[#57c78fc0] hover:bg-[#57c78fab] cursor-pointer text-text poppins font-semibold px-8 py-2 rounded-lg">
                 Download CSV
diff --git a/dashboard/server/api/project/generate_csv.ts b/dashboard/server/api/project/generate_csv.ts
index 027b5f7..33f000e 100644
--- a/dashboard/server/api/project/generate_csv.ts
+++ b/dashboard/server/api/project/generate_csv.ts
@@ -18,14 +18,26 @@ export default defineEventHandler(async event => {
     const project = await ProjectModel.findById(project_id);
     if (!project) return setResponseStatus(event, 400, 'Project not found');
 
-    const { mode } = getQuery(event);
+    const { mode, slice } = getQuery(event);
+
+    let timeSub = 1000 * 60 * 60 * 24;
+
+    if (slice == '0') {
+        timeSub = 1000 * 60 * 60 * 24
+    } else if (slice == '1') {
+        timeSub = 1000 * 60 * 60 * 24 * 7
+    } else if (slice == '2') {
+        timeSub = 1000 * 60 * 60 * 24 * 7 * 30
+    } else if (slice == '3') {
+        timeSub = 1000 * 60 * 60 * 24 * 7 * 30 * 12 * 2
+    }
 
     if (mode === 'visits') {
 
         const visistsReportData = await VisitModel.find({
             project_id,
             created_at: {
-                $gt: Date.now() - 1000 * 60 * 60 * 24 * 7
+                $gt: Date.now() - timeSub
             }
         });