Compare commits
No commits in common. "c7aeaadab2fce9b24517363dfda83678e35e7a2a" and "4692f841d4d5d94baab24df1dfe0e3b7f7685a33" have entirely different histories.
c7aeaadab2
...
4692f841d4
|
|
@ -35,14 +35,6 @@ export interface Expense {
|
|||
date: string;
|
||||
}
|
||||
|
||||
export interface Income {
|
||||
id: number;
|
||||
card_id: number;
|
||||
value: number;
|
||||
comment: string;
|
||||
date: string;
|
||||
}
|
||||
|
||||
export interface Transfer {
|
||||
id: number;
|
||||
from_card_id: number;
|
||||
|
|
@ -56,7 +48,6 @@ export const EntityTypes = {
|
|||
type: "Type",
|
||||
category: "Category",
|
||||
expense: "Expense",
|
||||
income: "Income",
|
||||
transfer: "Transfer",
|
||||
} as const;
|
||||
|
||||
|
|
@ -66,7 +57,6 @@ export type EntityType<T extends EntityName> =
|
|||
T extends "type" ? Type :
|
||||
T extends "category" ? Category :
|
||||
T extends "expense" ? Expense :
|
||||
T extends "income" ? Income :
|
||||
T extends "transfer" ? Transfer :
|
||||
never;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +0,0 @@
|
|||
|
||||
|
||||
export const NumberToFPA = (value: number): string => {
|
||||
return (value / 100).toFixed(2);
|
||||
}
|
||||
|
|
@ -7,6 +7,18 @@
|
|||
import UserIcon from '$lib/icons/UserIcon.svelte';
|
||||
|
||||
const paths = [
|
||||
{
|
||||
Path: "/ping",
|
||||
Name: "ping",
|
||||
},
|
||||
{
|
||||
Path: "/test",
|
||||
Name: "test",
|
||||
},
|
||||
{
|
||||
Path: "/test2",
|
||||
Name: "test2",
|
||||
},
|
||||
{
|
||||
Path: "/card",
|
||||
Name: "Cards",
|
||||
|
|
@ -24,9 +36,6 @@
|
|||
Name: "Expense",
|
||||
},
|
||||
{
|
||||
Path: "/income",
|
||||
Name: "Income",
|
||||
},
|
||||
Path: "/transfer",
|
||||
Name: "Transfer",
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
<script lang="ts">
|
||||
import { onMount } from "svelte";
|
||||
import { type Card } from "$lib/entities";
|
||||
import { NumberToFPA } from "$lib/util/fpa";
|
||||
|
||||
let cards: Card[] = $state([]);
|
||||
let error: string | null = $state(null);
|
||||
|
|
@ -58,12 +57,6 @@
|
|||
|
||||
function editCard(card: Card) {
|
||||
editingCard = { ...card };
|
||||
if (balanceRef) {
|
||||
balanceRef.value = NumberToFPA(card.balance);
|
||||
}
|
||||
if (creditLineRef) {
|
||||
creditLineRef.value = NumberToFPA(card.credit_line);
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteCard(id: number) {
|
||||
|
|
@ -80,27 +73,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
let balanceRef: HTMLInputElement | null = $state(null);
|
||||
let creditLineRef: HTMLInputElement | null = $state(null);
|
||||
function handleBalanceInput(
|
||||
event: Event & { currentTarget: EventTarget & HTMLInputElement },
|
||||
): void {
|
||||
const target = event.target as HTMLInputElement;
|
||||
const rawValue = target.value.replace(/[^0-9]/g, "");
|
||||
currentCard.balance = parseInt(rawValue || "0");
|
||||
target.value = NumberToFPA(currentCard.balance);
|
||||
}
|
||||
function handleCreditLineInput(
|
||||
event: Event & { currentTarget: EventTarget & HTMLInputElement },
|
||||
): void {
|
||||
const target = event.target as HTMLInputElement;
|
||||
const rawValue = target.value.replace(/[^0-9]/g, "");
|
||||
currentCard.credit_line = parseInt(rawValue || "0");
|
||||
target.value = NumberToFPA(currentCard.credit_line);
|
||||
}
|
||||
|
||||
const currentCard = $derived(editingCard ?? newCard);
|
||||
$inspect("currentCard = ", currentCard);
|
||||
</script>
|
||||
|
||||
{#if error}
|
||||
|
|
@ -127,13 +100,22 @@
|
|||
<label class="block">
|
||||
<span class="text-gray-700">Balance:</span>
|
||||
<input
|
||||
type="text"
|
||||
oninput={handleBalanceInput}
|
||||
bind:this={balanceRef}
|
||||
type="number"
|
||||
bind:value={currentCard.balance}
|
||||
required
|
||||
class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
|
||||
/>
|
||||
</label>
|
||||
{#if currentCard.have_credit_line}
|
||||
<label class="block">
|
||||
<span class="text-gray-700">Credit Line:</span>
|
||||
<input
|
||||
type="number"
|
||||
bind:value={currentCard.credit_line}
|
||||
class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
|
||||
/>
|
||||
</label>
|
||||
{/if}
|
||||
<label class="flex items-center">
|
||||
<input
|
||||
type="checkbox"
|
||||
|
|
@ -142,17 +124,6 @@
|
|||
/>
|
||||
<span class="ml-2 text-gray-700">Have Credit Line</span>
|
||||
</label>
|
||||
{#if currentCard.have_credit_line}
|
||||
<label class="block">
|
||||
<span class="text-gray-700">Credit Line:</span>
|
||||
<input
|
||||
type="number"
|
||||
oninput={handleCreditLineInput}
|
||||
bind:this={creditLineRef}
|
||||
class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
|
||||
/>
|
||||
</label>
|
||||
{/if}
|
||||
<div class="flex space-x-2">
|
||||
<button
|
||||
type="submit"
|
||||
|
|
@ -182,14 +153,8 @@
|
|||
<div>
|
||||
<strong class="block text-lg">{card.name}</strong>
|
||||
<div class="text-sm text-gray-600">
|
||||
<span>
|
||||
Balance: {NumberToFPA(card.balance)},
|
||||
</span>
|
||||
{#if card.have_credit_line}
|
||||
Credit Line: {NumberToFPA(card.credit_line)}
|
||||
{:else}
|
||||
No Credit Line
|
||||
{/if}
|
||||
Balance: {card.balance}, Credit Line: {card.credit_line},{" "}
|
||||
Have Credit Line: {card.have_credit_line ? "Yes" : "No"}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex space-x-2">
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
import { onMount } from "svelte";
|
||||
import { type Card, type Expense, type Type } from "$lib/entities";
|
||||
import { selectedDate } from "$lib/stores/dateStore";
|
||||
import { NumberToFPA } from "$lib/util/fpa";
|
||||
|
||||
let mutateDate = $state($selectedDate);
|
||||
let selectedTime = $state("00:00:00");
|
||||
|
|
@ -93,9 +92,6 @@
|
|||
const parts = expense.date.split("T");
|
||||
mutateDate = parts[0];
|
||||
selectedTime = parts[1].split("Z")[0];
|
||||
if (valueRef) {
|
||||
valueRef.value = NumberToFPA(expense.value);
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteExpense(id: number) {
|
||||
|
|
@ -129,16 +125,6 @@
|
|||
return type ? type.name : "Unknown";
|
||||
}
|
||||
|
||||
let valueRef: HTMLInputElement | null = $state(null);
|
||||
function handleValueInput(
|
||||
event: Event & { currentTarget: EventTarget & HTMLInputElement },
|
||||
): void {
|
||||
const target = event.target as HTMLInputElement;
|
||||
const rawValue = target.value.replace(/[^0-9]/g, "");
|
||||
currentExpense.value = parseInt(rawValue || "0");
|
||||
target.value = NumberToFPA(currentExpense.value);
|
||||
}
|
||||
|
||||
const constructedTime = $derived(`${mutateDate}T${selectedTime}Z`);
|
||||
const currentExpense = $derived(editingExpense ?? newExpense);
|
||||
const selectedType = $derived(
|
||||
|
|
@ -166,8 +152,7 @@
|
|||
<span class="text-gray-700">Value:</span>
|
||||
<input
|
||||
type="text"
|
||||
oninput={handleValueInput}
|
||||
bind:this={valueRef}
|
||||
bind:value={currentExpense.value}
|
||||
required
|
||||
class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
|
||||
/>
|
||||
|
|
@ -245,7 +230,7 @@
|
|||
class="bg-white p-4 rounded-lg shadow-md flex justify-between items-center"
|
||||
>
|
||||
<div>
|
||||
<strong class="block text-lg">{NumberToFPA(expense.value)}</strong>
|
||||
<strong class="block text-lg">{expense.value}</strong>
|
||||
<div class="text-sm text-gray-600">
|
||||
<span class="font-bold">Card:</span>
|
||||
{getCardName(expense.card_id)}
|
||||
|
|
|
|||
|
|
@ -1,245 +0,0 @@
|
|||
<script lang="ts">
|
||||
import { onMount } from "svelte";
|
||||
import { type Card, type Income, type Type } from "$lib/entities";
|
||||
import { selectedDate } from "$lib/stores/dateStore";
|
||||
import { NumberToFPA } from "$lib/util/fpa";
|
||||
|
||||
let mutateDate = $state($selectedDate);
|
||||
let selectedTime = $state("00:00:00");
|
||||
let incomes: Income[] = $state([]);
|
||||
let cards: Card[] = $state([]);
|
||||
let types: Type[] = $state([]);
|
||||
let error: string | null = $state(null);
|
||||
let editingIncome: Income | null = $state(null);
|
||||
let newIncome: Partial<Income> = $state({
|
||||
card_id: 0,
|
||||
value: 0,
|
||||
comment: "",
|
||||
date: "2006-01-02T15:04:05Z",
|
||||
});
|
||||
|
||||
onMount(async () => {
|
||||
await fetchCategories();
|
||||
await fetchCards();
|
||||
await fetchTypes();
|
||||
});
|
||||
|
||||
async function fetchTypes() {
|
||||
const result = await fetch("/api/type/all");
|
||||
if (!result.ok) {
|
||||
const obj = await result.json();
|
||||
error = obj.message;
|
||||
} else {
|
||||
types = await result.json();
|
||||
}
|
||||
}
|
||||
async function fetchCards() {
|
||||
const result = await fetch("/api/card/all");
|
||||
if (!result.ok) {
|
||||
const obj = await result.json();
|
||||
error = obj.message;
|
||||
} else {
|
||||
cards = await result.json();
|
||||
}
|
||||
}
|
||||
async function fetchCategories() {
|
||||
const result = await fetch("/api/income/all");
|
||||
if (!result.ok) {
|
||||
const obj = await result.json();
|
||||
error = obj.message;
|
||||
} else {
|
||||
incomes = await result.json();
|
||||
}
|
||||
}
|
||||
|
||||
async function saveIncome() {
|
||||
const endpoint = editingIncome
|
||||
? `/api/income/update`
|
||||
: "/api/income/create";
|
||||
const method = editingIncome ? "PUT" : "POST";
|
||||
|
||||
const data = {
|
||||
...currentIncome,
|
||||
card_id: Number(currentIncome.card_id),
|
||||
value: Number(currentIncome.value),
|
||||
date: constructedTime,
|
||||
};
|
||||
const response = await fetch(endpoint, {
|
||||
method,
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(data),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const { message } = await response.json();
|
||||
error = message;
|
||||
} else {
|
||||
await fetchCategories();
|
||||
if (editingIncome) {
|
||||
editingIncome = null;
|
||||
} else {
|
||||
newIncome = {
|
||||
card_id: 0,
|
||||
value: 0,
|
||||
comment: "",
|
||||
date: "",
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function editIncome(income: Income) {
|
||||
editingIncome = { ...income };
|
||||
const parts = income.date.split("T");
|
||||
mutateDate = parts[0];
|
||||
selectedTime = parts[1].split("Z")[0];
|
||||
if (valueRef) {
|
||||
valueRef.value = NumberToFPA(income.value);
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteIncome(id: number) {
|
||||
const response = await fetch(`/api/income/delete`, {
|
||||
method: "DELETE",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ id }),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const { message } = await response.json();
|
||||
error = message;
|
||||
} else {
|
||||
await fetchCategories();
|
||||
}
|
||||
}
|
||||
|
||||
// Helper function to get the name of the parent category
|
||||
function getCardName(cardId: number) {
|
||||
if (cardId === 0) return "None";
|
||||
const card = cards.find((card) => card.id === cardId);
|
||||
return card ? card.name : "Unknown";
|
||||
}
|
||||
|
||||
let valueRef: HTMLInputElement | null = $state(null);
|
||||
function handleValueInput(
|
||||
event: Event & { currentTarget: EventTarget & HTMLInputElement },
|
||||
): void {
|
||||
const target = event.target as HTMLInputElement;
|
||||
const rawValue = target.value.replace(/[^0-9]/g, "");
|
||||
currentIncome.value = parseInt(rawValue || "0");
|
||||
target.value = NumberToFPA(currentIncome.value);
|
||||
}
|
||||
|
||||
const constructedTime = $derived(`${mutateDate}T${selectedTime}Z`);
|
||||
const currentIncome = $derived(editingIncome ?? newIncome);
|
||||
$inspect(currentIncome);
|
||||
$inspect("constructedTime = ", constructedTime);
|
||||
</script>
|
||||
|
||||
{#if error}
|
||||
<p class="bg-red-100 text-red-700 p-4 rounded">{error}</p>
|
||||
{/if}
|
||||
|
||||
<div class="container mx-auto my-8 p-6 bg-gray-100 rounded-lg shadow-lg">
|
||||
<h1 class="text-2xl font-bold mb-4 text-center">Manage Incomes</h1>
|
||||
|
||||
<div class="mb-8 p-6 bg-white rounded-lg shadow-md">
|
||||
<h2 class="text-xl font-semibold mb-4">
|
||||
{editingIncome ? "Edit Income" : "Add New Income"}
|
||||
</h2>
|
||||
<form onsubmit={saveIncome} class="space-y-4">
|
||||
<label class="block">
|
||||
<span class="text-gray-700">Value:</span>
|
||||
<input
|
||||
type="text"
|
||||
oninput={handleValueInput}
|
||||
bind:this={valueRef}
|
||||
required
|
||||
class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label class="block">
|
||||
<span class="text-gray-700">Card:</span>
|
||||
<select
|
||||
bind:value={currentIncome.card_id}
|
||||
class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
|
||||
>
|
||||
{#each cards as card}
|
||||
<option value={card.id}>{card.name}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<div class="flex items-center space-x-4">
|
||||
<label>
|
||||
Date:
|
||||
<input
|
||||
type="date"
|
||||
bind:value={mutateDate}
|
||||
class="bg-gray-800 text-white p-2 rounded-md border border-gray-700"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label>
|
||||
Time:
|
||||
<input
|
||||
type="time"
|
||||
bind:value={selectedTime}
|
||||
class="bg-gray-800 text-white p-2 rounded-md border border-gray-700"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="flex space-x-2">
|
||||
<button
|
||||
type="submit"
|
||||
class="px-4 py-2 bg-indigo-500 text-white rounded-md hover:bg-indigo-600"
|
||||
>
|
||||
{editingIncome ? "Update Income" : "Add Income"}
|
||||
</button>
|
||||
{#if editingIncome}
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => (editingIncome = null)}
|
||||
class="px-4 py-2 bg-gray-300 text-gray-700 rounded-md hover:bg-gray-400"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<h2 class="text-xl font-semibold mb-4 text-center">Incomes List</h2>
|
||||
<ul class="space-y-4">
|
||||
{#each incomes as income}
|
||||
<li
|
||||
class="bg-white p-4 rounded-lg shadow-md flex justify-between items-center"
|
||||
>
|
||||
<div>
|
||||
<strong class="block text-lg">{NumberToFPA(income.value)}</strong>
|
||||
<div class="text-sm text-gray-600">
|
||||
<span class="font-bold">Card:</span>
|
||||
{getCardName(income.card_id)}
|
||||
<span class="font-bold">Date:</span>
|
||||
{income.date}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex space-x-2">
|
||||
<button
|
||||
onclick={() => editIncome(income)}
|
||||
class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
<button
|
||||
onclick={() => deleteIncome(income.id)}
|
||||
class="px-4 py-2 bg-red-500 text-white rounded-md hover:bg-red-600"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -2,7 +2,6 @@
|
|||
import { onMount } from "svelte";
|
||||
import { type Card, type Transfer } from "$lib/entities";
|
||||
import { selectedDate } from "$lib/stores/dateStore";
|
||||
import { NumberToFPA } from "$lib/util/fpa";
|
||||
|
||||
let mutateDate = $state($selectedDate);
|
||||
let selectedTime = $state("00:00:00");
|
||||
|
|
@ -30,7 +29,6 @@
|
|||
cards = await result.json();
|
||||
}
|
||||
}
|
||||
|
||||
async function fetchCategories() {
|
||||
const result = await fetch("/api/transfer/all");
|
||||
if (!result.ok) {
|
||||
|
|
@ -106,15 +104,6 @@
|
|||
return card ? card.name : "Unknown";
|
||||
}
|
||||
|
||||
function handleValueInput(
|
||||
event: Event & { currentTarget: EventTarget & HTMLInputElement },
|
||||
): void {
|
||||
const target = event.target as HTMLInputElement;
|
||||
const rawValue = target.value.replace(/[^0-9]/g, "");
|
||||
currentTransfer.value = parseInt(rawValue || "0");
|
||||
target.value = NumberToFPA(currentTransfer.value);
|
||||
}
|
||||
|
||||
const constructedTime = $derived(`${mutateDate}T${selectedTime}Z`);
|
||||
const currentTransfer = $derived(editingTransfer ?? newTransfer);
|
||||
$inspect(currentTransfer);
|
||||
|
|
@ -165,7 +154,7 @@
|
|||
<span class="text-gray-700">Value:</span>
|
||||
<input
|
||||
type="text"
|
||||
oninput={handleValueInput}
|
||||
bind:value={currentTransfer.value}
|
||||
required
|
||||
class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
|
||||
/>
|
||||
|
|
@ -218,7 +207,7 @@
|
|||
class="bg-white p-4 rounded-lg shadow-md flex justify-between items-center"
|
||||
>
|
||||
<div>
|
||||
<strong class="block text-lg">{NumberToFPA(transfer.value)}</strong>
|
||||
<strong class="block text-lg">{transfer.value}</strong>
|
||||
<div class="text-sm text-gray-600">
|
||||
<span class="font-bold">From:</span>
|
||||
{getCardName(transfer.from_card_id)}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user