cmtimm/budget
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Getting decent

Browse Source
This commit is contained in:
Casey Timm
2025-07-20 17:56:46 -04:00
parent c1991aaa3e
commit 701715083f
6 changed files with 105 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/united.js
View File

@ -210,7 +210,7 @@ export async function pullData(amount = 100) {
for (const transaction of transactions) {
const amount = Number(transaction.amount);
const date = new Date(transaction.postedDate);
const id = transaction.transactionId;
const id = transaction.hostTranNumber;
const payee = transaction.description || '';
const statementDescription = transaction.statementDescription;
const card = cardRegEx.test(statementDescription)

22
src/routes/+layout.svelte
View File

@ -1,14 +1,25 @@
<script>
import '../app.css';
import { setContext } from 'svelte';
let { children, data } = $props();
let budgets = $derived(data.budgets);
let total = $derived(data.total);
let toast = $state([]);
function addToast(message, type = 'info') {
toast.push({ message, type });
setTimeout(() => {
toast.pop();
}, 3000);
}
setContext('addToast', addToast);
</script>
<div class="drawer lg:drawer-open">
<input id="my-drawer-2" type="checkbox" class="drawer-toggle" />
<div class="drawer-content flex flex-col m-5">
<div class="navbar bg-base-100 shadow-sm">
<div class="navbar bg-base-100 shadow-sm lg:hidden">
<div class="flex-none">
<label
for="my-drawer-2"
@ -62,6 +73,15 @@
<li><div class="divider"></div></li>
<li><a href="/rules">Rules</a></li>
<li><a href="/settings">Settings</a></li>
<li><a href="/united">United</a></li>
</ul>
</div>
</div>
<div class="toast toast-top toast-center">
{#each toast as t}
<div class="alert alert-{t.type}">
<span>{t.message}</span>
</div>
{/each}
</div>

125
src/routes/account/[slug]/+page.svelte
View File

@ -2,7 +2,11 @@
import { EditSymbol } from '$lib/editSymbol.svelte';
import { settingsSymbol } from '$lib/settingsSymbol.svelte';
import { invalidate, invalidateAll } from '$app/navigation';
import { loadingModal } from '$lib/loadingModal.svelte';
import { getContext } from 'svelte';
let { data } = $props();
const addToast = getContext('addToast');
let trans = $derived(data.transactions);
let budgets = $derived(data.budgets);
let budgetTransactions = $derived(data.budgetTransactions);
@ -12,6 +16,7 @@
let hide = $derived(account?.hide || false);
let inTotal = $derived(account?.in_total || false);
let expanded = $state([]);
let loading = $state(false);
function editNotes(transaction) {
my_modal_3.showModal();
@ -19,6 +24,8 @@
notes = transaction.notes;
}
async function saveNotes() {
my_modal_3.close();
loading = true;
let res = fetch(`/transcation/${currentTransaction.id}`, {
method: 'POST',
headers: {
@ -26,18 +33,22 @@
},
body: JSON.stringify({ notes: $state.snapshot(notes) })
});
my_modal_3.close();
loading = false;
let result = await res;
if (result.ok) {
// Update the transaction in the data
currentTransaction.notes = notes;
// Optionally, you can also update the UI or show a success message
addToast('Notes saved successfully', 'success');
} else {
// Handle error case
console.error('Failed to save notes');
addToast('Failed to save notes', 'error');
}
}
async function saveSettings() {
loading = true;
settings_modal.close();
let res = await fetch(`/api/account/${account.id}`, {
method: 'POST',
headers: {
@ -48,8 +59,9 @@
in_total: $state.snapshot(inTotal)
})
});
loading = false;
invalidateAll();
if (res.ok) {
settings_modal.close();
// Optionally, you can refresh the account data or show a success message
} else {
console.error('Failed to save settings');
@ -59,9 +71,9 @@
<div class="flex mb-4">
<div class="w-128 flex-none justify-bottom">
<h1 class="text-xl font-bold">{account?.name}</h1>
<h1 class="text-lg font-semibold">{account?.name}</h1>
</div>
<div class="w-64 grow">{account?.balance}</div>
<div class="w-64 grow text-lg uppercase font-semibold">{account?.balance}</div>
<div class="w-14 flex-none text-right">
<button class="btn btn-square btn-ghost" onclick={() => settings_modal.showModal()}
>{@render settingsSymbol()}
@ -70,63 +82,44 @@
</div>
<h1>Transcations</h1>
<table class="table w-full">
<thead>
<tr>
<th>Date</th>
<th>Payee</th>
<th>Description</th>
<th>Amount</th>
<th>Notes</th>
<th>Budgets</th>
<th></th>
</tr>
</thead>
<tbody>
{#each trans as transaction}
{@const applicableBudgets = budgetTransactions.filter(
(bt) => bt.transaction_id === transaction.id
)}
{@const budgetTotal = applicableBudgets.reduce(
(accumulator, currentValue) => accumulator + Number(currentValue.amount),
0
)}
<tr class="hover:bg-base-300">
<td>{transaction.date.toDateString()}</td>
<td>{transaction.payee ?? ''}</td>
<td>{transaction.description}</td>
<td
><ul class="list bg-base-100 rounded-box shadow-md">
<li class="list-row">Amount: {transaction.amount}</li>
<li class="list-row">Budget: {budgetTotal.toFixed(2)}</li>
<li class="list-row">Remains: {(transaction.amount - budgetTotal).toFixed(2)}</li>
</ul></td
>
<td>{transaction.notes}</td>
<td>
<ul class="list bg-base-100 rounded-box shadow-md">
{#each applicableBudgets as budgetTransaction}
<li class="list-row">
<div class="flex">
<div class="flex-auto w-24">
{budgets.find((b) => b.id === budgetTransaction.budget_id)?.name}
</div>
<div class="flex-auto w-16">${budgetTransaction.amount}</div>
<div class="flex-auto w-48">{budgetTransaction.notes}</div>
</div>
</li>
{/each}
</ul></td
>
<td
><button class="btn btn-square btn-ghost" onclick={() => editNotes(transaction)}
>{@render EditSymbol()}</button
></td
>
</tr>
{/each}
</tbody>
</table>
<ul class="list bg-base-100 rounded-box shadow-md">
{#each trans as transaction}
{@const applicableBudgets = budgetTransactions.filter(
(bt) => bt.transaction_id === transaction.id
)}
{@const budgetTotal = applicableBudgets.reduce(
(accumulator, currentValue) => accumulator + Number(currentValue.amount),
0
)}
{@const remaining = transaction.amount - budgetTotal}
<li
class="list-row {remaining != 0 ? 'bg-warning-content' : ''} {transaction.pending
? 'opacity-50'
: ''}"
>
<div>
<div>{transaction.description}</div>
<div class="text-xs uppercase font-semibold opacity-60">
{transaction.date.toDateString()}
</div>
</div>
<div></div>
<div class="w-32">
<div class="text-xs uppercase font-semibold text-left">
In Budget: {budgetTotal.toFixed(2)}
</div>
<div class="text-xs uppercase font-semibold text-left">
Remaining {remaining.toFixed(2)}
</div>
</div>
<div class="text-lg uppercase font-semibold text-right w-32">{transaction.amount}</div>
<button class="btn btn-square btn-ghost" onclick={() => editNotes(transaction)}>
{@render EditSymbol()}
</button>
</li>
{/each}
</ul>
<dialog id="my_modal_3" class="modal">
<div class="modal-box">
@ -165,6 +158,8 @@
class="btn btn-primary"
onclick={() => {
if (currentTransaction.budget_id) {
loading = true;
my_modal_3.close();
fetch(`/api/budget/${currentTransaction.budget_id}/transaction`, {
method: 'POST',
headers: {
@ -176,10 +171,14 @@
notes: currentTransaction.notes
})
}).then((res) => {
loading = false;
invalidateAll();
if (res.ok) {
// Optionally, you can refresh the UI or show a success message
addToast('Transaction added to budget', 'success');
console.log('Transaction added to budget successfully');
} else {
addToast('Failed to add transaction to budget', 'error');
console.error('Failed to add transaction to budget');
}
});
@ -218,3 +217,7 @@
<button>close</button>
</form>
</dialog>
{#if loading}
{@render loadingModal()}
{/if}

18
src/routes/api/budget/+server.js Normal file
View File

@ -0,0 +1,18 @@
import { json } from '@sveltejs/kit';
import { addBudget, deleteBudget } from '$lib/db';
// In-memory store for demonstration (replace with a database in production)
let budgets = [];
/** @type {import('./$types').RequestHandler} */
export async function POST({ request }) {
const data = await request.json();
// Basic validation
if (!data.name || typeof data.amount !== 'number') {
return json({ error: 'Invalid input' }, { status: 400 });
}
let res = await addBudget(data.name, data.amount, data.notes);
return json(res, { status: 201 });
}

18
src/routes/budget/+server.js
View File

@ -1,18 +0,0 @@
import { json } from '@sveltejs/kit';
import { addBudget, deleteBudget } from '$lib/db';
// In-memory store for demonstration (replace with a database in production)
let budgets = [];
/** @type {import('./$types').RequestHandler} */
export async function POST({ request }) {
const data = await request.json();
// Basic validation
if (!data.name || typeof data.amount !== 'number') {
return json({ error: 'Invalid input' }, { status: 400 });
}
let res = await addBudget(data.name, data.amount, data.notes);
return json(res, { status: 201 });
}

12
src/routes/settings/+page.svelte
View File

@ -15,7 +15,7 @@
async function saveBudget() {
loading = true;
let res = await fetch('/budget', {
let res = await fetch('/api/budget', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
@ -36,14 +36,6 @@
loading = false;
}
async function update() {
loading = true;
let res = await fetch('/api/simplefin/update', {
method: 'POST'
});
loading = false;
}
async function deleteBudget(name) {
loading = true;
if (name === toDeleteBudget.name) {
@ -69,8 +61,6 @@
{@render loadingModal()}
{/if}
<button class="btn btn-primary" onclick={update}>Update</button>
<div class="flex flex-col gap-4">
<h1 class="text-2xl font-bold">Settings</h1>
<div class="mb-4">