Compare commits

...

6 Commits

Author SHA1 Message Date
e83fb7abb8 Enable scroll through time with mousewheel 2024-08-19 14:40:24 +02:00
3ca12139cd Default display to last month
Since we pay bills for the last month in the current month...
2024-08-19 14:34:47 +02:00
236b113c10 Rename application 2024-08-19 14:03:44 +02:00
4ee622e65e Enable marking as paid 2024-08-19 14:00:35 +02:00
2ac082f230 Add force redraw on navigate 2024-08-19 13:55:10 +02:00
45030f8634 More better displaying 2024-08-19 13:51:00 +02:00
8 changed files with 64 additions and 11 deletions

View File

@@ -4,7 +4,7 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta content="width=device-width, initial-scale=1.0" name="viewport" /> <meta content="width=device-width, initial-scale=1.0" name="viewport" />
<title>wails-template</title> <title>bill-manager</title>
</head> </head>
<body> <body>

View File

@@ -18,9 +18,16 @@
scrollingTimeFrameStore.next(); scrollingTimeFrameStore.next();
} }
} }
function scroll(event: WheelEvent) {
if (event.deltaY < 0) {
scrollingTimeFrameStore.next();
} else {
scrollingTimeFrameStore.prev();
}
}
</script> </script>
<svelte:window on:keydown={keyDown} /> <svelte:window on:keydown={keyDown} on:wheel={scroll} />
<Toaster theme="dark" expand visibleToasts={9} /> <Toaster theme="dark" expand visibleToasts={9} />
<template> <template>
<!-- <Header /> --> <!-- <Header /> -->

View File

@@ -1,13 +1,45 @@
<script lang="ts"> <script lang="ts">
import { type PaymentBill } from "$lib/types"; import { type PaymentBill } from "$lib/types";
import { SetPaid } from "$wails/main/App";
import { toast } from "svelte-sonner";
export let paymentBill: PaymentBill = { export let paymentBill: PaymentBill = {
id: -1, id: -1,
name: "none", name: "none",
payment: null, payment: null,
}; };
export let monthFor: Date = new Date();
let paymentDate: string = "";
$: {
if (!!paymentBill.payment?.paymentDate) {
// @ts-ignore Yes split exists... The type is time.Time but it's actually a string
// Because typescript is a worthless waste of bytes
// And I don't know how to properly convert time.Time to Date or String
// So I'm doing this bullshit
paymentDate = paymentBill.payment!.paymentDate.split("T")[0];
}
}
async function doPaid(event: MouseEvent) {
const res = await SetPaid(paymentBill.id, monthFor);
if (!res.success) {
toast.error(`failed setting paid for ${paymentBill.id} and month ${monthFor} with error ${res.error}`);
return;
}
paymentBill.payment = res.data;
}
</script> </script>
<template> <template>
<p>{paymentBill.name}</p> <div class="grid grid-cols-2 w-full text-start px-3 text-xl">
<p class={paymentBill.payment == null ? "text-red-700" : ""}>{paymentBill.name}</p>
<!-- svelte-ignore a11y-click-events-have-key-events -->
<p
class="h-[1.6em] cursor-pointer border-2 border-transparent hover:border-solid hover:border-sky-500"
on:click={doPaid}
>
{paymentDate}
</p>
</div>
</template> </template>

View File

@@ -40,9 +40,9 @@
<div class="text-4xl font-bold"> <div class="text-4xl font-bold">
{dateString} {dateString}
</div> </div>
<div> <div class="">
{#each Object.values(paymentsModel) as payment} {#each Object.values(paymentsModel) as payment}
<PaymentBillComp paymentBill={payment} /> <PaymentBillComp paymentBill={payment} monthFor={date} />
{/each} {/each}
</div> </div>
</div> </div>

View File

@@ -3,11 +3,24 @@
import { scrollingTimeFrameStore } from "$lib/store/scrollingTimeFrameStore"; import { scrollingTimeFrameStore } from "$lib/store/scrollingTimeFrameStore";
import { lastMonthPaymentsStore } from "$lib/store/lastMonthPaymentsStore"; import { lastMonthPaymentsStore } from "$lib/store/lastMonthPaymentsStore";
import { thisMonthPaymentsStore } from "$lib/store/thisMonthPaymentsStore"; import { thisMonthPaymentsStore } from "$lib/store/thisMonthPaymentsStore";
let forceupdate = false;
thisMonthPaymentsStore.subscribe(() => {
forceupdate = !forceupdate;
});
lastMonthPaymentsStore.subscribe(() => {
forceupdate = !forceupdate;
});
</script> </script>
<template> <template>
<div class="grid grid-cols-2"> <div class="grid grid-cols-2">
<Payments date={$scrollingTimeFrameStore.from} payments={$lastMonthPaymentsStore} /> {#if forceupdate}
<Payments date={$scrollingTimeFrameStore.to} payments={$thisMonthPaymentsStore} /> <Payments date={$scrollingTimeFrameStore.from} payments={$lastMonthPaymentsStore} />
<Payments date={$scrollingTimeFrameStore.to} payments={$thisMonthPaymentsStore} />
{:else}
<Payments date={$scrollingTimeFrameStore.from} payments={$lastMonthPaymentsStore} />
<Payments date={$scrollingTimeFrameStore.to} payments={$thisMonthPaymentsStore} />
{/if}
</div> </div>
</template> </template>

View File

@@ -4,7 +4,8 @@ import { type Writable, writable } from "svelte/store";
async function createStore(): Promise<Writable<ScrollingTimeframe> & { next: Function; prev: Function }> { async function createStore(): Promise<Writable<ScrollingTimeframe> & { next: Function; prev: Function }> {
const thism = new Date(); const thism = new Date();
const lastm = new Date(); const lastm = new Date();
lastm.setMonth(thism.getMonth() - 1); thism.setMonth(thism.getMonth() - 1);
lastm.setMonth(lastm.getMonth() - 2);
const { subscribe, update, set } = writable({ from: lastm, to: thism }); const { subscribe, update, set } = writable({ from: lastm, to: thism });
return { return {

2
go.mod
View File

@@ -1,4 +1,4 @@
module wails-template module bill-manager
go 1.21 go 1.21

View File

@@ -1,7 +1,7 @@
{ {
"$schema": "https://wails.io/schemas/config.v2.json", "$schema": "https://wails.io/schemas/config.v2.json",
"name": "wails-template", "name": "bill-manager",
"outputfilename": "wails-template", "outputfilename": "bill-manager",
"frontend:install": "pnpm install", "frontend:install": "pnpm install",
"frontend:build": "pnpm build", "frontend:build": "pnpm build",
"frontend:dev:watcher": "pnpm dev", "frontend:dev:watcher": "pnpm dev",