86 lines
2.4 KiB
Text
86 lines
2.4 KiB
Text
package pages
|
|
|
|
import (
|
|
"fmt"
|
|
"git.juancwu.dev/juancwu/budgit/internal/model"
|
|
"git.juancwu.dev/juancwu/budgit/internal/ui/components/button"
|
|
"git.juancwu.dev/juancwu/budgit/internal/ui/components/dialog"
|
|
"git.juancwu.dev/juancwu/budgit/internal/ui/components/expense"
|
|
"git.juancwu.dev/juancwu/budgit/internal/ui/layouts"
|
|
)
|
|
|
|
templ SpaceExpensesPage(space *model.Space, expenses []*model.Expense, balance int, tags []*model.Tag, lists []*model.ShoppingList) {
|
|
@layouts.Space("Expenses", space) {
|
|
<div class="space-y-4">
|
|
<div class="flex justify-between items-center">
|
|
<h1 class="text-2xl font-bold">Expenses</h1>
|
|
@dialog.Dialog(dialog.Props{ID: "add-expense-dialog"}) {
|
|
@dialog.Trigger() {
|
|
@button.Button() {
|
|
Add Expense
|
|
}
|
|
}
|
|
@dialog.Content() {
|
|
@dialog.Header() {
|
|
@dialog.Title() {
|
|
Add Transaction
|
|
}
|
|
@dialog.Description() {
|
|
Add a new expense or top-up to your space.
|
|
}
|
|
}
|
|
@expense.AddExpenseForm(space, tags, lists)
|
|
}
|
|
}
|
|
</div>
|
|
// Balance Card
|
|
@expense.BalanceCard(space.ID, balance, false)
|
|
// List of expenses
|
|
<div
|
|
class="border rounded-lg"
|
|
hx-get={ "/app/spaces/" + space.ID + "/components/expenses" }
|
|
hx-trigger="sse:expenses_updated"
|
|
hx-swap="innerHTML"
|
|
>
|
|
@ExpensesListContent(expenses)
|
|
</div>
|
|
</div>
|
|
}
|
|
}
|
|
|
|
templ ExpensesListContent(expenses []*model.Expense) {
|
|
<h2 class="text-lg font-semibold p-4">History</h2>
|
|
<div id="expenses-list" class="divide-y">
|
|
if len(expenses) == 0 {
|
|
<p class="p-4 text-sm text-muted-foreground">No expenses recorded yet.</p>
|
|
}
|
|
for _, expense := range expenses {
|
|
@ExpenseListItem(expense)
|
|
}
|
|
</div>
|
|
}
|
|
|
|
templ ExpenseListItem(expense *model.Expense) {
|
|
<div class="p-4 flex justify-between items-center">
|
|
<div>
|
|
<p class="font-medium">{ expense.Description }</p>
|
|
<p class="text-sm text-muted-foreground">{ expense.Date.Format("Jan 02, 2006") }</p>
|
|
</div>
|
|
<div>
|
|
if expense.Type == model.ExpenseTypeExpense {
|
|
<p class="font-bold text-destructive">
|
|
- { fmt.Sprintf("$%.2f", float64(expense.AmountCents)/100.0) }
|
|
</p>
|
|
} else {
|
|
<p class="font-bold text-green-500">
|
|
+ { fmt.Sprintf("$%.2f", float64(expense.AmountCents)/100.0) }
|
|
</p>
|
|
}
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
templ ExpenseCreatedResponse(newExpense *model.Expense, balance int) {
|
|
@ExpenseListItem(newExpense)
|
|
@expense.BalanceCard(newExpense.SpaceID, balance, true)
|
|
}
|