Agregaciones por fecha y categoria

my-app/src/routes/groups/aggregations/[[id=integer]]/+page.server.ts

@@ -0,0 +1,38 @@
+import { categoryService, groupService, spendingService } from '$lib/server/api';
+import type { Actions, PageServerLoad } from './$types';
+
+export const load: PageServerLoad = async ({ params, cookies }) => {
+	const id = Number(params.id) || 0;
+	const group: Group = await groupService.get(id, cookies);
+	const categories: Category[] = await categoryService.list(id, cookies);
+	return { group, categories };
+};
+
+export const actions: Actions = {
+	default: async ({ cookies, request, params }) => {
+		const id = Number(params.id) || 0;
+
+		const data = await request.formData();
+		const dateIni = new Date(data.get('dateIni') as string);
+		const dateFin = new Date(data.get('dateFin') as string);
+
+		const spendings: Spending[] = await spendingService.list(id, cookies);
+
+        const filteredSpendings = spendings.filter((spending: Spending) => {
+			const spendingDate = new Date(spending.date.slice(0,10)); //removing timezone
+			return spendingDate >= dateIni && spendingDate <= dateFin;
+		});
+
+		const totalSum = filteredSpendings.reduce((sum: number, spending: Spending) => sum + spending.amount, 0);
+
+        const sumPerCategory = filteredSpendings.reduce((acc: { [x: number]: number; }, spending: Spending) => {
+			acc[spending.category_id] = (acc[spending.category_id] || 0) + spending.amount;
+			return acc;
+		}, {});
+
+        return {
+			totalSum,
+			sumPerCategory
+		};
+	}
+};

my-app/src/routes/groups/aggregations/[[id=integer]]/+page.svelte

@@ -0,0 +1,79 @@
+<script lang="ts">
+	import { enhance } from '$app/forms';
+	import type { PageData } from './$types';
+	import { formatDateInput } from '$lib/formatter';
+
+	export let form;
+	export let data: PageData;
+
+	const now = new Date();
+	const last_week = new Date();
+	last_week.setDate(now.getDay() - 7);
+
+	let initDate = last_week.toJSON()
+	let finDate = now.toJSON()
+
+	function getCategoryName(id: Number): string {
+		return data.categories.filter(
+			(category: Category) => {
+				return category.id == id
+			}
+		)[0].name
+	}
+
+</script>
+
+<svelte:head>
+	<title>{data.group.name} - Agregaciones</title>
+</svelte:head>
+
+<nav aria-label="breadcrumb">
+	<ul>
+		<li><a href="/groups">Grupos</a></li>
+		<li>Agregaciones</li>
+	</ul>
+</nav>
+
+<h2>Rango de la Agregación</h2>
+<form method="POST" autocomplete="off" use:enhance>
+	<fieldset>
+		<label>
+			Fecha de Inicio
+			<input
+				type="date"
+				name="dateIni"
+				placeholder="Fecha Inicial"
+				required
+				value={formatDateInput(initDate)}
+			/>
+		</label>
+		<label>
+			Fecha de Fin
+			<input
+				type="date"
+				name="dateFin"
+				placeholder="Fecha Final"
+				required
+				value={formatDateInput(finDate)}
+			/>
+		</label>
+		<button>Generar</button>
+		<button type="button" class="outline" on:click={() => history.back()}>Cancelar</button>
+	</fieldset>
+</form>
+
+{#if form !== null}
+	<div>
+		<h3>Total</h3>
+		<ul>
+			<li>{form.totalSum}</li>
+		</ul>
+
+		<h3>Por Categorias</h3>
+		<ul>
+			{#each Object.entries(form.sumPerCategory) as [category_id, sum]}
+				<li>{getCategoryName(category_id)}: {sum}</li>
+			{/each}
+		</ul>
+	</div>
+{/if}

my-app/src/routes/groups/movements/[id=integer]/+page.svelte

@@ -55,6 +55,7 @@
 			<ul>
 				<li><a href="/groups/balance/{data.group.id}">Estado de cuenta grupal</a></li>
 				<li><a href="/groups/graphs/{data.group.id}">Gráficos de finanzas</a></li>
+				<li><a href="/groups/aggregations/{data.group.id}">Agregación por fecha</a></li>
 			</ul>
 		</details>
 		<details class="dropdown" style="margin-left: 10px">