feat: investment accounts
All checks were successful
Deploy / build-and-deploy (push) Successful in 1m50s
All checks were successful
Deploy / build-and-deploy (push) Successful in 1m50s
This commit is contained in:
parent
f444a074bc
commit
7c24a8302d
25 changed files with 2205 additions and 56 deletions
213
internal/ui/pages/investment_holding_detail.templ
Normal file
213
internal/ui/pages/investment_holding_detail.templ
Normal file
|
|
@ -0,0 +1,213 @@
|
|||
package pages
|
||||
|
||||
import (
|
||||
"fmt"
|
||||
"time"
|
||||
|
||||
"git.juancwu.dev/juancwu/budgit/internal/model"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/routeurl"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/components/badge"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/components/button"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/components/card"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/components/form"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/components/icon"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/components/input"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/layouts"
|
||||
"git.juancwu.dev/juancwu/budgit/internal/ui/utils"
|
||||
)
|
||||
|
||||
type InvestmentHoldingDetailProps struct {
|
||||
SpaceID string
|
||||
SpaceName string
|
||||
AccountID string
|
||||
AccountName string
|
||||
Currency string
|
||||
Position model.HoldingPosition
|
||||
Trades []*model.InvestmentTrade
|
||||
}
|
||||
|
||||
func holdingPlClass(d string) string {
|
||||
if len(d) > 0 && d[0] == '-' {
|
||||
return "text-red-600 dark:text-red-400"
|
||||
}
|
||||
return "text-green-600 dark:text-green-400"
|
||||
}
|
||||
|
||||
templ InvestmentHoldingDetailPage(props InvestmentHoldingDetailProps) {
|
||||
@layouts.AppWithBreadcrumb(
|
||||
props.Position.Holding.Symbol,
|
||||
accountChildBreadcrumb(props.SpaceID, props.SpaceName, props.AccountID, props.AccountName, props.Position.Holding.Symbol),
|
||||
spaceOverviewSidebarContent(),
|
||||
spaceSpecificSidebarContent(props.SpaceID),
|
||||
spaceAccountSidebarContent(props.SpaceID, props.AccountID),
|
||||
) {
|
||||
<div class="container px-6 py-8 mx-auto space-y-8">
|
||||
<div class="flex items-start justify-between gap-3 flex-wrap">
|
||||
<div>
|
||||
<h1 class="text-3xl font-bold flex items-center gap-3">
|
||||
{ props.Position.Holding.Symbol }
|
||||
@badge.Badge(badge.Props{Variant: badge.VariantSecondary}) {
|
||||
{ props.Currency }
|
||||
}
|
||||
</h1>
|
||||
<p class="text-muted-foreground">{ props.Position.Holding.DisplayName }</p>
|
||||
</div>
|
||||
<form
|
||||
hx-post={ routeurl.URL("action.app.spaces.space.accounts.account.investments.holdings.holding.delete", "spaceID", props.SpaceID, "accountID", props.AccountID, "holdingID", props.Position.Holding.ID) }
|
||||
hx-confirm="Delete this holding and all its trades?"
|
||||
>
|
||||
@button.Button(button.Props{
|
||||
Type: button.TypeSubmit,
|
||||
Variant: button.VariantDestructive,
|
||||
Class: "flex items-center gap-2",
|
||||
}) {
|
||||
@icon.Trash2()
|
||||
Delete holding
|
||||
}
|
||||
</form>
|
||||
</div>
|
||||
@card.Card(card.Props{Class: "rounded-sm"}) {
|
||||
@card.Content(card.ContentProps{Class: "grid grid-cols-2 md:grid-cols-5 gap-4 text-sm p-4"}) {
|
||||
<div>
|
||||
<div class="text-muted-foreground">Quantity</div>
|
||||
<div class="text-lg font-semibold">{ props.Position.Quantity.StringFixedBank(4) }</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-muted-foreground">Avg cost</div>
|
||||
<div class="text-lg font-semibold">${ utils.FormatDecimalWithThousands(props.Position.AvgCost.StringFixedBank(2)) }</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-muted-foreground">Cost basis</div>
|
||||
<div class="text-lg font-semibold">${ utils.FormatDecimalWithThousands(props.Position.CostBasis.StringFixedBank(2)) }</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-muted-foreground">Realized P/L</div>
|
||||
<div class={ "text-lg font-semibold", holdingPlClass(props.Position.RealizedPL.StringFixedBank(2)) }>
|
||||
${ utils.FormatDecimalWithThousands(props.Position.RealizedPL.StringFixedBank(2)) }
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-muted-foreground">Total fees</div>
|
||||
<div class="text-lg font-semibold">${ utils.FormatDecimalWithThousands(props.Position.TotalFees.StringFixedBank(2)) }</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
@card.Card(card.Props{Class: "rounded-sm"}) {
|
||||
@card.Header() {
|
||||
@card.Title() {
|
||||
Record a trade
|
||||
}
|
||||
@card.Description() {
|
||||
Manually enter a buy or sell. Quantities and prices recompute the position.
|
||||
}
|
||||
}
|
||||
@card.Content() {
|
||||
<form
|
||||
hx-post={ routeurl.URL("action.app.spaces.space.accounts.account.investments.holdings.holding.trades.create", "spaceID", props.SpaceID, "accountID", props.AccountID, "holdingID", props.Position.Holding.ID) }
|
||||
class="grid grid-cols-1 md:grid-cols-6 gap-3 items-end"
|
||||
>
|
||||
@form.Item() {
|
||||
@form.Label(form.LabelProps{For: "type"}) { Type }
|
||||
<select id="type" name="type" class="h-9 rounded-sm border bg-transparent px-3 text-sm">
|
||||
<option value="buy">Buy</option>
|
||||
<option value="sell">Sell</option>
|
||||
</select>
|
||||
}
|
||||
@form.Item() {
|
||||
@form.Label(form.LabelProps{For: "quantity"}) { Quantity }
|
||||
@input.Input(input.Props{ID: "quantity", Name: "quantity", Type: input.TypeText, Placeholder: "0", Class: "rounded-sm", Required: true})
|
||||
}
|
||||
@form.Item() {
|
||||
@form.Label(form.LabelProps{For: "price"}) { Price / unit }
|
||||
@input.Input(input.Props{ID: "price", Name: "price", Type: input.TypeText, Placeholder: "0.00", Class: "rounded-sm", Required: true})
|
||||
}
|
||||
@form.Item() {
|
||||
@form.Label(form.LabelProps{For: "fees"}) { Fees }
|
||||
@input.Input(input.Props{ID: "fees", Name: "fees", Type: input.TypeText, Placeholder: "0.00", Class: "rounded-sm"})
|
||||
}
|
||||
@form.Item() {
|
||||
@form.Label(form.LabelProps{For: "occurred_at"}) { Date }
|
||||
@input.Input(input.Props{ID: "occurred_at", Name: "occurred_at", Type: input.TypeDate, Value: time.Now().Format("2006-01-02"), Class: "rounded-sm"})
|
||||
}
|
||||
@button.Button(button.Props{Type: button.TypeSubmit, Class: "rounded-sm"}) {
|
||||
Record
|
||||
}
|
||||
</form>
|
||||
}
|
||||
}
|
||||
@card.Card(card.Props{Class: "rounded-sm"}) {
|
||||
@card.Header() {
|
||||
@card.Title() { Trade history }
|
||||
}
|
||||
@card.Content() {
|
||||
if len(props.Trades) == 0 {
|
||||
<p class="text-sm text-muted-foreground">No trades recorded yet.</p>
|
||||
} else {
|
||||
<div class="overflow-x-auto">
|
||||
<table class="w-full text-sm">
|
||||
<thead class="text-left text-muted-foreground border-b">
|
||||
<tr>
|
||||
<th class="py-2 pr-2">Date</th>
|
||||
<th class="py-2 pr-2">Type</th>
|
||||
<th class="py-2 pr-2">Quantity</th>
|
||||
<th class="py-2 pr-2">Price / unit</th>
|
||||
<th class="py-2 pr-2">Fees</th>
|
||||
<th class="py-2 pr-2">Total</th>
|
||||
<th class="py-2"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
for _, t := range props.Trades {
|
||||
{{
|
||||
fees := "—"
|
||||
if t.Fees != nil {
|
||||
fees = t.Fees.StringFixedBank(2)
|
||||
}
|
||||
total := t.Quantity.Mul(t.PricePerUnit)
|
||||
typeLabel := "Buy"
|
||||
if string(t.Type) == "sell" {
|
||||
typeLabel = "Sell"
|
||||
}
|
||||
}}
|
||||
<tr class="border-b last:border-b-0">
|
||||
<td class="py-2 pr-2">{ t.OccurredAt.Format("2006-01-02") }</td>
|
||||
<td class="py-2 pr-2">
|
||||
@badge.Badge(badge.Props{
|
||||
Variant: badge.VariantSecondary,
|
||||
Class: "text-xs",
|
||||
}) {
|
||||
{ typeLabel }
|
||||
}
|
||||
</td>
|
||||
<td class="py-2 pr-2">{ t.Quantity.StringFixedBank(4) }</td>
|
||||
<td class="py-2 pr-2">${ utils.FormatDecimalWithThousands(t.PricePerUnit.StringFixedBank(2)) }</td>
|
||||
<td class="py-2 pr-2">{ fees }</td>
|
||||
<td class="py-2 pr-2">${ utils.FormatDecimalWithThousands(total.StringFixedBank(2)) }</td>
|
||||
<td class="py-2 text-right">
|
||||
<form
|
||||
hx-post={ routeurl.URL("action.app.spaces.space.accounts.account.investments.holdings.holding.trades.trade.delete", "spaceID", props.SpaceID, "accountID", props.AccountID, "holdingID", props.Position.Holding.ID, "tradeID", t.ID) }
|
||||
hx-confirm="Delete this trade?"
|
||||
class="inline"
|
||||
>
|
||||
@button.Button(button.Props{
|
||||
Type: button.TypeSubmit,
|
||||
Variant: button.VariantGhost,
|
||||
Class: "h-8 px-2",
|
||||
}) {
|
||||
@icon.Trash2()
|
||||
}
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
var _ = fmt.Sprintf
|
||||
Loading…
Add table
Add a link
Reference in a new issue