add reporting page, chart and filters

resources/js/utils/api.ts

@@ -2,6 +2,7 @@ import type {
     ApiOf,
     ZodiosResponseByAlias,
     ZodiosBodyByAlias,
+    ZodiosQueryParamsByAlias,
 } from '@zodios/core';
 import { api } from '../../../openapi.json.client';
 
@@ -84,3 +85,16 @@ export type ImportType = ZodiosResponseByAlias<
     'getImporters'
 >['data'][0];
 export type ImportReport = ZodiosResponseByAlias<SolidTimeApi, 'importData'>;
+
+export type ReportingResponse = ZodiosResponseByAlias<
+    SolidTimeApi,
+    'getAggregatedTimeEntries'
+>;
+
+export type AggregatedTimeEntries = ReportingResponse['data'];
+export type GroupedDataEntries = ReportingResponse['data']['grouped_data'];
+
+export type AggregatedTimeEntriesQueryParams = ZodiosQueryParamsByAlias<
+    SolidTimeApi,
+    'getAggregatedTimeEntries'
+>;

resources/js/utils/useReporting.ts

@@ -0,0 +1,68 @@
+import { defineStore } from 'pinia';
+import { api } from '../../../openapi.json.client';
+import { computed, ref } from 'vue';
+import type {
+    AggregatedTimeEntries,
+    AggregatedTimeEntriesQueryParams,
+    ReportingResponse,
+} from '@/utils/api';
+import { getCurrentOrganizationId } from '@/utils/useUser';
+import { useNotificationsStore } from '@/utils/notification';
+
+export const useReportingStore = defineStore('reporting', () => {
+    const reportingGraphResponse = ref<ReportingResponse | null>(null);
+    const reportingTableResponse = ref<ReportingResponse | null>(null);
+
+    const { handleApiRequestNotifications } = useNotificationsStore();
+
+    async function fetchGraphReporting(
+        params: AggregatedTimeEntriesQueryParams
+    ) {
+        const organization = getCurrentOrganizationId();
+        if (organization) {
+            reportingGraphResponse.value = await handleApiRequestNotifications(
+                api.getAggregatedTimeEntries({
+                    params: {
+                        organization: organization,
+                    },
+                    queries: params,
+                }),
+                undefined,
+                'Failed to fetch reporting data'
+            );
+        }
+    }
+
+    async function fetchTableReporting(
+        params: AggregatedTimeEntriesQueryParams
+    ) {
+        const organization = getCurrentOrganizationId();
+        if (organization) {
+            reportingTableResponse.value = await handleApiRequestNotifications(
+                api.getAggregatedTimeEntries({
+                    params: {
+                        organization: organization,
+                    },
+                    queries: params,
+                }),
+                undefined,
+                'Failed to fetch reporting data'
+            );
+        }
+    }
+
+    const aggregatedGraphTimeEntries = computed<AggregatedTimeEntries>(() => {
+        return reportingGraphResponse.value?.data as AggregatedTimeEntries;
+    });
+
+    const aggregatedTableTimeEntries = computed<AggregatedTimeEntries>(() => {
+        return reportingTableResponse.value?.data as AggregatedTimeEntries;
+    });
+
+    return {
+        aggregatedGraphTimeEntries,
+        fetchGraphReporting,
+        fetchTableReporting,
+        aggregatedTableTimeEntries,
+    };
+});