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

some buttons and buckets stuff

Browse source
This commit is contained in:
Nickiel12 2024-02-27 17:35:33 -08:00
parent a6c4e7353b
commit d0e334e842
10 changed files with 165 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
db/db.go
View file

@ -85,7 +85,7 @@ func GetUserAccounts(userID int) ([]types.Account, error) {
user_accounts[1] = types.Account {
Id: 2,
DisplayName: sql.NullString {
String: "Svngs",
String: "BECU Credit Card",
Valid: true,
} ,
Description: sql.NullString {
@ -97,6 +97,27 @@ func GetUserAccounts(userID int) ([]types.Account, error) {
return user_accounts, nil;
}
func GetUserBuckets(userID int) ([]types.Bucket, error) {
bucket1 := types.Bucket{
Id: 1,
DisplayCode: sql.NullString{String: "SVNG", Valid: true},
DisplayName: sql.NullString{String: "Savings", Valid: true},
Description: sql.NullString{String: "The Savings Bucket", Valid: true},
}
bucket2 := types.Bucket{
Id: 2,
DisplayCode: sql.NullString{String: "SPND", Valid: true},
DisplayName: sql.NullString{String: "Spending", Valid: true},
Description: sql.NullString{String: "The Spending Bucket", Valid: true},
}
// Creating a slice of length two and populating it with the two structs
buckets := []types.Bucket{bucket1, bucket2}
return buckets, nil;
}
func GetTransPaneEntries(userID int) ([]types.QuickTransactionType, error) {
transaction_types := make([]types.QuickTransactionType, 1);
@ -106,3 +127,4 @@ func GetTransPaneEntries(userID int) ([]types.QuickTransactionType, error) {
return transaction_types, nil;
}

14
tests/testdb.go
View file

@ -51,14 +51,14 @@ func Init_testdb(DB_TYPE string, DB_CONNECTION_STRING string) {
init_sql := `
CREATE TABLE accounts (
acnt_id Integer PRIMARY KEY,
acnt_dsply_name varchar(50) NOT NULL,
acnt_display_name varchar(50) NOT NULL,
acnt_description varchar(250) NULL
);
CREATE TABLE buckets (
bkt_id Integer PRIMARY KEY,
bkt_dsply_code varchar(5) NOT NULL,
bkt_dsply_name varchar(50) NULL,
bkt_display_code varchar(5) NOT NULL,
bkt_display_name varchar(50) NULL,
bkt_description varchar(250) NULL
);
@ -96,13 +96,13 @@ CREATE TABLE transaction_breakdown (
CREATE TABLE transaction_categories (
trns_ctgry_id Integer PRIMARY KEY,
trns_ctgry_dsply_code varchar(5) NOT NULL,
trns_ctgry_dsply_name varchar(50) NOT NULL,
trns_ctgry_display_code varchar(5) NOT NULL,
trns_ctgry_display_name varchar(50) NOT NULL,
trns_ctgry_description varchar(250) NULL
);
INSERT INTO accounts (acnt_dsply_name, acnt_description) VALUES ("BECU Saving", "Savings Account");
INSERT INTO buckets (bkt_dsply_code, bkt_dsply_name, bkt_description) VALUES
INSERT INTO accounts (acnt_display_name, acnt_description) VALUES ("BECU Saving", "Savings Account");
INSERT INTO buckets (bkt_display_code, bkt_display_name, bkt_description) VALUES
("SVNGS", "Savings", "Savings Bucket");
INSERT INTO transactions (trns_amount, trns_description, trns_account, trns_bucket, trns_date) VALUES
("50.00", "Money", 1, 1, "2023-11-10");

9
types/types.go
View file

@ -17,10 +17,17 @@ type Transaction struct {
type Account struct {
Id int `db:"acnt_id" json:"Id"`
DisplayName sql.NullString `db:"acnt_dsply_name" json:"DisplayName"`
DisplayName sql.NullString `db:"acnt_display_name" json:"DisplayName"`
Description sql.NullString `db:"acnt_description" json:"Description"`
}
type Bucket struct {
Id int `db:"bkt_id" json:"id"`
DisplayCode sql.NullString `db:"bkt_display_code" json:"DisplayCode"`
DisplayName sql.NullString `db:"bkt_display_name" json:"DisplayName"`
Description sql.NullString `db:"bkt_description" json:"Description"`
}
type HumanLegibleTransaction struct {
Id int `db:"trns_id" json:"Id"`
Amount string `db:"trns_amount" json:"Amount"`

12
web/router.go
View file

@ -74,9 +74,19 @@ func renderFullPage(w http.ResponseWriter, c templ.Component, pageName string) {
var new_tp bytes.Buffer;
quick_trans_types, err := db.GetTransPaneEntries(0);
if err != nil {
log.Fatal().Err(err).Msg("Could not get transaction pane entries for user");
}
user_acnts, err := db.GetUserAccounts(0);
if err != nil {
log.Fatal().Err(err).Msg("Could not get accounts for user");
}
user_bkts, err := db.GetUserBuckets(0);
if err != nil {
log.Fatal().Err(err).Msg("Could not get buckets for user");
}
err = templates.NewTransactionPane(&quick_trans_types, &user_acnts).Render(context.Background(), &new_tp);
err = templates.NewTransactionPane(&quick_trans_types, &user_acnts, &user_bkts).Render(context.Background(), &new_tp);
if err != nil {
log.Fatal().Err(err).Msg("Could not render new transaction pane for index");
}

2
web/sass/buttons.scss
View file

@ -48,7 +48,7 @@ $button_sizes: (
.borderless-btn {
@include btn;
color: var(--#{$prefix}-text);
background-color: var(--#{$prefix}-surface2);
background-color: var(--#{$prefix}-surface1);
}
.borderless-btn:hover {
background-color: var(--#{$prefix}-overlay1);

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

@ -197,59 +197,61 @@ table.table-striped {
}
.input-sizer {
display: inline-grid;
vertical-align: top;
align-items: center;
position: relative;
border: solid 1px;
padding: .25em .5em;
margin: 5px;
background-color: var(--#{$prefix}-overlay1);
color: var(--#{$prefix}-base);
display: inline-grid;
vertical-align: top;
align-items: center;
position: relative;
border: solid 1px;
border-radius: $border-radius * 2;
margin: 5px;
&.stacked {
padding: .5em;
align-items: stretch;
&.stacked {
padding: .5em;
align-items: stretch;
&::after,
input,
textarea {
grid-area: 2 / 1;
}
}
&::after,
input,
textarea {
grid-area: 2 / 1;
color: inherit;
width: auto;
min-width: 1em;
// grid-area: 1 / 1;
grid-area: 1 / 2;
font: inherit;
padding: 0.25em;
margin: 0;
resize: none;
background: none;
appearance: none;
border: none;
}
}
&::after,
input,
textarea {
width: auto;
min-width: 1em;
grid-area: 1 / 2;
font: inherit;
padding: 0.25em;
margin: 0;
resize: none;
background: none;
appearance: none;
border: none;
}
span {
padding: 0.25em;
}
&::after {
content: attr(data-value) ' ';
visibility: hidden;
white-space: pre-wrap;
}
&:focus-within {
outline: solid 1px blue;
box-shadow: 4px 4px 0px blue;
> span { color: blue; }
textarea:focus,
input:focus {
outline: none;
span {
padding: 0.25em;
// grid-area: 1 / 2;
}
&::after {
content: attr(data-value) ' ';
visibility: hidden;
white-space: pre-wrap;
}
&:focus-within {
// outline: solid 1px blue;
textarea:focus,
input:focus {
outline: none;
}
}
}
}

6
web/sass/variables.scss
View file

@ -20,9 +20,9 @@
--#{$prefix}-maroon: #{map-get($color, 'maroon')};
--#{$prefix}-mauve: #{map-get($color, 'mauve')};
--#{$prefix}-nav-bg: #{map-get($color, 'crust')};
--#{$prefix}-nav-color: #{map-get($color, 'text')};
--#{$prefix}-nav-logo-bg: #{map-get($color, 'rosewater')};
--#{$prefix}-nav-bg: #{map-get($color, 'sky')};
--#{$prefix}-nav-color: #{map-get($color, 'base')};
--#{$prefix}-nav-logo-bg: #{map-get($color, 'teal')};
--#{$prefix}-nav-hover: #{map-get($color, 'surface2')};
--#{$prefix}-nav-active-bg: #{map-get($color, 'mauve')};
--#{$prefix}-nav-active-color: #{map-get($color, 'base')};

7
web/static/index.js
View file

@ -1,6 +1,10 @@
import {fill_chart} from "./chart_functions.js";
import {register_dropdowns} from "./dropdowns.js";
import {open_new_transaction_pane, close_new_transaction_pane} from "./new_transactions.js";
import {
open_new_transaction_pane
, close_new_transaction_pane
, add_new_breakdown
} from "./new_transactions.js";
function debounce(func, delay) {
@ -61,6 +65,7 @@ function register_handlers() {
document.querySelector(".input-sizer > input").addEventListener("input", (event) => {
event.target.parentNode.dataset.value = event.target.value
});
document.getElementById("new-breakdown-btn").addEventListener("click", add_new_breakdown);
close_new_transaction_pane();
}

13
web/static/new_transactions.js
View file

@ -48,4 +48,15 @@ function close_new_transaction_pane() {
}
export {open_new_transaction_pane, close_new_transaction_pane}
function add_new_breakdown() {
let source = document.querySelector("#breakdown-template-row tr").cloneNode(true);
source.style.removeProperty("display");
console.log(source.querySelector("input[type='number']"));
document.getElementById("breakdown-tbody").appendChild(source);
}
function update_breakdown_amount() {
}
export {open_new_transaction_pane, close_new_transaction_pane, add_new_breakdown}

52
web/templates/new_transaction_pane.templ
View file

@ -4,7 +4,19 @@ import "nickiel.net/recount_server/types"
import "strconv"
templ NewTransactionPane(entry_types *[]types.QuickTransactionType, acnts *[]types.Account) {
templ NewTransactionPane(entry_types *[]types.QuickTransactionType, acnts *[]types.Account, buckets *[]types.Bucket) {
<div style="display: none" id="breakdown-template-row">
<td></td>
<td class="my-2">
<select class="ms-2 select border" id="acnt-entry-selection">
for _, value := range *buckets {
<option value={strconv.Itoa(value.Id)}>{value.DisplayCode.String} | {value.DisplayName.String}</option>
}
</select>
</td>
<td><input type="text" /></td>
<td><input type="number" step="any" /></td>
</div>
<div id="new-transaction-pane" style="opacity: 0;" class="cr-all c-base d-flex-col">
<div class="my-2 d-flex">
<h2 class="ms-5">New Transaction</h2>
@ -12,12 +24,20 @@ templ NewTransactionPane(entry_types *[]types.QuickTransactionType, acnts *[]typ
<i class="my-auto" data-feather="x"></i>
</button>
</div>
<div class="d-flex ms-5" style="overflow-x: scroll;">
for _, value := range *entry_types {
<button class="borderless-btn btn-sm mx-3">
<div class="d-flex">
<div class="d-flex ms-5" style="overflow-x: scroll; width: 90%;">
for _, value := range *entry_types {
<button class="borderless-btn btn-sm mx-3">
{value.DisplayName}
</button>
}
</div>
<div class="d-flex" style="width:10%">
<button class="btn-sm my-auto ms-auto me-4 d-flex invert c-green">
<i class="my-2" data-feather="save"></i>
<span class="my-auto ms-2">Save</span>
</button>
}
</div>
</div>
<div class="c-mantle cr-all m-5 container" style="height: 85%;">
<div class="row mt-5">
@ -43,24 +63,24 @@ templ NewTransactionPane(entry_types *[]types.QuickTransactionType, acnts *[]typ
<input class="input" id="amount-entry" type="number" step="any" />
</label>
</div>
</div>
<div class="row">
<div class="p-5 mx-auto">
<div class="d-flex p-5 mx-auto">
<span class="my-auto">Tag: </span>
<label class="input-sizer">
<span>Tag: </span>
<input
size="4"
class="input"
id="trans-tab-entry"
type="text"
/>
<span class="d-flex"> <i class="my-auto" style="transform: scale(-1,1);" data-feather="tag"></i> </span>
</label>
</div>
</div>
<div class="row">
<div class="ms-5 d-flex">
<h2 class="my-3">Breakdown</h2>
<button class="btn-sm ms-5 my-auto c-green invert">
<button class="btn-sm ms-5 my-auto c-green invert" id="new-breakdown-btn">
<i class="" data-feather="plus"></i>
<span class="my-auto pe-2">New</span>
</button>
@ -71,7 +91,19 @@ templ NewTransactionPane(entry_types *[]types.QuickTransactionType, acnts *[]typ
</div>
</div>
<div class="row" style="flex-grow: 1">
<table class="table table-striped cr-all" style="width: 100%; border: solid 1px black;">
<thead>
<tr>
<td></td>
<td class="py-2">Bucket</td>
<td>Description</td>
<td>Amount</td>
</tr>
</thead>
<tbody id="breakdown-tbody">
</tbody>
</table>
</div>
</div>
</div>