Recount/Recount-Server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

added more to right quick access

Browse source
This commit is contained in:
Nickiel12 2024-01-27 12:20:25 -08:00
parent 6d547e0585
commit bf84fcce29
6 changed files with 93 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
web/data_endpoints.go
View file

@ -39,10 +39,26 @@ func getTransactionsRows(w http.ResponseWriter, req *http.Request) {
component.Render(context.Background(), w);
}
func getTransactionQuickAccess(w http.ResponseWriter, req *http.Request) {
component := transaction_quick_access();
component.Render(context.Background(), w);
func getTransactionQuickAccessEntries(w http.ResponseWriter, req *http.Request) {
transactions := make([]types.HumanLegibleTransaction, 20)
// Populate the slice with dummy data (you can replace this with your actual data)
for i := 20; i > 0; i-- {
transaction := types.HumanLegibleTransaction{
Id: i,
Amount: fmt.Sprintf("%d.00", (i+1)*100),
Description: sql.NullString{String: fmt.Sprintf("Transaction %d", i+1), Valid: true},
AccountName: sql.NullString{String: "Savings", Valid: true},
Account: 123,
Bucket: sql.NullInt64{Int64: int64(i + 100), Valid: true},
BucketName: sql.NullString{String: fmt.Sprintf("Bucket %d", i+1), Valid: true},
Date: time.Now(),
}
transactions[20 - i] = transaction
}
component := transaction_quick_access_entries(&transactions);
component.Render(context.Background(), w);
}
func getRightPanelQuickAccess(w http.ResponseWriter, req *http.Request) {

49
web/dataendpoints.templ
View file

@ -57,34 +57,31 @@ templ account_summary_rows(accounts *[]types.TwoIntsItem){
}
}
templ transaction_quick_access() {
<div id="transaction-quick-access-panel">
<div class="t-header">
<button
class="borderless-btn btn-sm mx-auto c-green ch-teal"
style="color: var(--pf-base);"
>
<i class="" data-feather="plus"></i>
Add New
</button>
<div class="m-auto d-flex">
<input id="show-pending-transactions" type="checkbox"></input>
<label for="show-pending-transactions">
Show Pending
</label>
templ transaction_quick_access_entries(transactions *[]types.HumanLegibleTransaction) {
for _, value := range *transactions {
<div class="card-item">
<div class="row">
<div class="w-50 d-flex">
<span class="mx-auto">{strconv.Itoa(value.Id)}</span>
</div>
<div class="w-50 d-flex">
if (len(value.Amount) > 0 && value.Amount[0] == '-') {
<span class="mx-auto negative">{value.Amount}</span>
} else {
<span class="mx-auto positive">+{value.Amount}</span>
}
</div>
</div>
<div class="row">
<div class="w-50 d-flex">
<span class="mx-auto">{value.AccountName.String}</span>
</div>
<div class="w-50 d-flex">
<span class="mx-auto c-surface0">Description</span>
</div>
</div>
</div>
<div class="t-list">
<div class="tab-div">
<button id="open-draft">
<i data-feather="file-plus"></i>
</button>
</div>
<div class="t-list-container">
</div>
</div>
</div>
}
}
templ right_panel_quick_access() {

2
web/router.go
View file

@ -31,12 +31,12 @@ func WebRouter() http.Handler {
r.Get("/transactions", getTransactionsPage)
r.Get("/components/account_summaries", getAccountSummaries)
r.Get("/components/transactions_quick_access", getTransactionQuickAccess)
r.Get("/components/right_panel_quick_access", getRightPanelQuickAccess)
r.Get("/components/data/transaction_table_rows", getTransactionsRows)
r.Get("/components/data/expenditure_chart", getExpenditureChart)
r.Get("/components/data/account_summary/{accountID}", getAccountSummaryChart)
r.Get("/components/data/transaction_quick_access", getTransactionQuickAccessEntries)
r.Handle("/static/*", http.StripPrefix("/static/", http.FileServer(http.Dir("web/static/"))))
return r

19
web/sass/nav.scss
View file

@ -49,9 +49,9 @@ nav {
}
#transaction-quick-access-panel {
height: 100%;
display:flex;
flex-direction: column;
height: 60%;
.t-header {
display: flex;
@ -71,9 +71,7 @@ nav {
.t-list {
display: flex;
flex-grow: 1;
margin-left: 10px;
margin-right: 10px;
height: inherit;
.tab-div {
height: 100%;
width: 50px;
@ -100,12 +98,19 @@ nav {
.t-list-container {
overflow-y: scroll;
border: 2px solid var(--#{$prefix}-surface1);
margin: 5px;
margin-left: 0px;
background-color: var(--#{$prefix}-base);
height: 100%;
flex-grow: 1;
border-radius: $border-radius;
.card-item {
border-radius: $border-radius;
background-color: var(--#{$prefix}-surface0);
margin: 10px;
.row {
width: 100%;
padding-top: 5px;
padding-bottom: 5px;
}
}
}
}
}

24
web/sass/utility-classes.scss
View file

@ -49,17 +49,6 @@ $directions: (
padding-bottom: $val;
}
}
.m-auto {
margin: auto;
}
.my-auto {
margin-top: auto;
margin-bottom: auto;
}
.mx-auto {
margin-left: auto;
margin-right: auto;
}
$w_h_sizes: (
'25': 25%,
@ -124,6 +113,13 @@ $w_h_sizes: (
color: var(--#{$prefix}-text) !important;
}
.positive {
color: var(--#{$prefix}-green);
}
.negative {
color: var(--#{$prefix}-red);
}
.borderless-btn.btn-sm {
padding: 4px 8px 4px 8px;
}
@ -184,12 +180,6 @@ table.table-striped {
}
}
}
.positive {
color: var(--#{$prefix}-green);
}
.negative {
color: var(--#{$prefix}-red);
}
}
.popup-menu {

37
web/templates/index.html
View file

@ -56,13 +56,38 @@
{{.InnerHtml}}
</div>
<div id="right-col">
<div
id="transactions-quick-access"
hx-get="/components/transactions_quick_access"
hx-swap="innerHtml swap:0.2s settle:0.2s"
hx-trigger="load"
>
<div id="transaction-quick-access-panel">
<div class="t-header">
<button
class="borderless-btn btn-sm mx-auto c-green ch-teal"
style="color: var(--pf-base);"
>
<i class="" data-feather="plus"></i>
Add New
</button>
<div class="m-auto d-flex">
<input id="show-pending-transactions" type="checkbox"></input>
<label for="show-pending-transactions">
Show Pending
</label>
</div>
</div>
<div class="t-list">
<div class="tab-div">
<button id="open-draft">
<i data-feather="file-plus"></i>
</button>
</div>
<div
class="t-list-container"
hx-get="/components/data/transaction_quick_access"
hx-trigger="load"
>
</div>
</div>
</div>
<div style="height: 25%"></div>
<div
class=""