rearranged files
This commit is contained in:
parent
66b6cc397e
commit
b7773981ed
10 changed files with 67 additions and 74 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
@ -2,7 +2,7 @@
|
||||||
test.db
|
test.db
|
||||||
|
|
||||||
# --> generated files
|
# --> generated files
|
||||||
web/*_templ.go
|
*_templ.go
|
||||||
web/static/*.css
|
web/static/*.css
|
||||||
web/static/*.css.map
|
web/static/*.css.map
|
||||||
.sass-cache/*
|
.sass-cache/*
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
package web
|
package web
|
||||||
|
|
||||||
import (
|
import (
|
||||||
|
"nickiel.net/recount_server/web/templates"
|
||||||
|
|
||||||
"context"
|
"context"
|
||||||
"database/sql"
|
"database/sql"
|
||||||
"encoding/json"
|
"encoding/json"
|
||||||
|
@ -16,7 +18,7 @@ import (
|
||||||
|
|
||||||
const DEFAULT_RESULT_COUNT = 20;
|
const DEFAULT_RESULT_COUNT = 20;
|
||||||
|
|
||||||
func getTransactionsRows(w http.ResponseWriter, req *http.Request) {
|
func GetTransactionsRows(w http.ResponseWriter, req *http.Request) {
|
||||||
transactions := make([]types.HumanLegibleTransaction, 10)
|
transactions := make([]types.HumanLegibleTransaction, 10)
|
||||||
|
|
||||||
// Populate the slice with dummy data (you can replace this with your actual data)
|
// Populate the slice with dummy data (you can replace this with your actual data)
|
||||||
|
@ -35,11 +37,11 @@ func getTransactionsRows(w http.ResponseWriter, req *http.Request) {
|
||||||
transactions[10 - i] = transaction
|
transactions[10 - i] = transaction
|
||||||
}
|
}
|
||||||
|
|
||||||
component := transaction_rows(&transactions);
|
component := templates.TransactionRows(&transactions);
|
||||||
component.Render(context.Background(), w);
|
component.Render(context.Background(), w);
|
||||||
}
|
}
|
||||||
|
|
||||||
func getTransactionQuickAccessEntries(w http.ResponseWriter, req *http.Request) {
|
func GetTransactionQuickAccessEntries(w http.ResponseWriter, req *http.Request) {
|
||||||
transactions := make([]types.HumanLegibleTransaction, 20)
|
transactions := make([]types.HumanLegibleTransaction, 20)
|
||||||
|
|
||||||
// Populate the slice with dummy data (you can replace this with your actual data)
|
// Populate the slice with dummy data (you can replace this with your actual data)
|
||||||
|
@ -57,22 +59,11 @@ func getTransactionQuickAccessEntries(w http.ResponseWriter, req *http.Request)
|
||||||
|
|
||||||
transactions[i] = transaction
|
transactions[i] = transaction
|
||||||
}
|
}
|
||||||
component := transaction_quick_access_entries(&transactions);
|
component := templates.TransactionQuickAccessEntries(&transactions);
|
||||||
component.Render(context.Background(), w);
|
component.Render(context.Background(), w);
|
||||||
}
|
}
|
||||||
|
|
||||||
func getNewTransactionPane(w http.ResponseWriter, req *http.Request) {
|
func GetExpenditureChart(w http.ResponseWriter, req *http.Request) {
|
||||||
component := new_transaction_pane();
|
|
||||||
component.Render(context.Background(), w);
|
|
||||||
}
|
|
||||||
|
|
||||||
func getRightPanelQuickAccess(w http.ResponseWriter, req *http.Request) {
|
|
||||||
component := right_panel_quick_access();
|
|
||||||
component.Render(context.Background(), w);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
func getExpenditureChart(w http.ResponseWriter, req *http.Request) {
|
|
||||||
data_package := struct{
|
data_package := struct{
|
||||||
Labels []string `json:"labels"`
|
Labels []string `json:"labels"`
|
||||||
IncomeDataset []int `json:"income_data"`
|
IncomeDataset []int `json:"income_data"`
|
||||||
|
@ -91,16 +82,16 @@ func getExpenditureChart(w http.ResponseWriter, req *http.Request) {
|
||||||
w.Write(json_data);
|
w.Write(json_data);
|
||||||
}
|
}
|
||||||
|
|
||||||
func getAccountSummaries(w http.ResponseWriter, req *http.Request) {
|
func GetAccountSummaries(w http.ResponseWriter, req *http.Request) {
|
||||||
accounts := make([]types.TwoIntsItem, 20)
|
accounts := make([]types.TwoIntsItem, 20)
|
||||||
for i := 0; i < 20; i++ {
|
for i := 0; i < 20; i++ {
|
||||||
accounts[i] = types.TwoIntsItem {Item1: i*100, Item2: i+5}
|
accounts[i] = types.TwoIntsItem {Item1: i*100, Item2: i+5}
|
||||||
}
|
}
|
||||||
component := account_summary_rows(&accounts)
|
component := templates.AccountSummaryRows(&accounts)
|
||||||
component.Render(context.Background(), w)
|
component.Render(context.Background(), w)
|
||||||
}
|
}
|
||||||
|
|
||||||
func getAccountSummaryChart(w http.ResponseWriter, req *http.Request) {
|
func GetAccountSummaryChart(w http.ResponseWriter, req *http.Request) {
|
||||||
accountID := chi.URLParam(req, "accountID")
|
accountID := chi.URLParam(req, "accountID")
|
||||||
|
|
||||||
data_package := types.ChartjsData {
|
data_package := types.ChartjsData {
|
|
@ -1,6 +1,8 @@
|
||||||
package web
|
package web
|
||||||
|
|
||||||
import (
|
import (
|
||||||
|
"nickiel.net/recount_server/web/templates"
|
||||||
|
|
||||||
"html/template"
|
"html/template"
|
||||||
"net/http"
|
"net/http"
|
||||||
"strconv"
|
"strconv"
|
||||||
|
@ -14,9 +16,11 @@ import (
|
||||||
"github.com/rs/zerolog/log"
|
"github.com/rs/zerolog/log"
|
||||||
)
|
)
|
||||||
|
|
||||||
type TemplateState struct {
|
type IndexTemplateModel struct {
|
||||||
InnerHtml template.HTML
|
InnerHtml template.HTML
|
||||||
ActivePage string
|
ActivePage string
|
||||||
|
NewTransactionPane template.HTML
|
||||||
|
QuickAccessPane template.HTML
|
||||||
}
|
}
|
||||||
|
|
||||||
const TemplateDir = "./web/templates/"
|
const TemplateDir = "./web/templates/"
|
||||||
|
@ -30,14 +34,12 @@ func WebRouter() http.Handler {
|
||||||
r.Get("/", getDashboard)
|
r.Get("/", getDashboard)
|
||||||
r.Get("/transactions", getTransactionsPage)
|
r.Get("/transactions", getTransactionsPage)
|
||||||
|
|
||||||
r.Get("/components/account_summaries", getAccountSummaries)
|
r.Get("/components/account_summaries", GetAccountSummaries)
|
||||||
r.Get("/components/new_transaction_pane", getNewTransactionPane)
|
|
||||||
r.Get("/components/right_panel_quick_access", getRightPanelQuickAccess)
|
|
||||||
|
|
||||||
r.Get("/components/data/transaction_table_rows", getTransactionsRows)
|
r.Get("/components/data/transaction_table_rows", GetTransactionsRows)
|
||||||
r.Get("/components/data/expenditure_chart", getExpenditureChart)
|
r.Get("/components/data/expenditure_chart", GetExpenditureChart)
|
||||||
r.Get("/components/data/account_summary/{accountID}", getAccountSummaryChart)
|
r.Get("/components/data/account_summary/{accountID}", GetAccountSummaryChart)
|
||||||
r.Get("/components/data/transaction_quick_access", getTransactionQuickAccessEntries)
|
r.Get("/components/data/transaction_quick_access", GetTransactionQuickAccessEntries)
|
||||||
|
|
||||||
r.Handle("/static/*", http.StripPrefix("/static/", http.FileServer(http.Dir("web/static/"))))
|
r.Handle("/static/*", http.StripPrefix("/static/", http.FileServer(http.Dir("web/static/"))))
|
||||||
return r
|
return r
|
||||||
|
@ -51,10 +53,10 @@ func WebRouter() http.Handler {
|
||||||
// }
|
// }
|
||||||
|
|
||||||
func renderFullPage(w http.ResponseWriter, c templ.Component, pageName string) {
|
func renderFullPage(w http.ResponseWriter, c templ.Component, pageName string) {
|
||||||
var buf bytes.Buffer
|
var main_component bytes.Buffer
|
||||||
|
|
||||||
// Render the provided templ component
|
// Render the provided templ component
|
||||||
err := c.Render(context.Background(), &buf)
|
err := c.Render(context.Background(), &main_component)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
log.Fatal().Err(err).Msg("Fatal error reading hello template");
|
log.Fatal().Err(err).Msg("Fatal error reading hello template");
|
||||||
}
|
}
|
||||||
|
@ -67,11 +69,26 @@ func renderFullPage(w http.ResponseWriter, c templ.Component, pageName string) {
|
||||||
Msg("Fatal error reading index template")
|
Msg("Fatal error reading index template")
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
var new_tp bytes.Buffer;
|
||||||
|
err = templates.NewTransactionPane().Render(context.Background(), &new_tp);
|
||||||
|
if err != nil {
|
||||||
|
log.Fatal().Err(err).Msg("Could not render new transaction pane for index");
|
||||||
|
}
|
||||||
|
|
||||||
|
var quick_ap bytes.Buffer;
|
||||||
|
err = templates.QuickAccessPane().Render(context.Background(), &quick_ap);
|
||||||
|
if err != nil {
|
||||||
|
log.Fatal().Err(err).Msg("Could not render quick access pane for index");
|
||||||
|
}
|
||||||
|
|
||||||
// Inject the templ component html into the index template
|
// Inject the templ component html into the index template
|
||||||
err = index.Execute(w,
|
err = index.Execute(w,
|
||||||
TemplateState{
|
IndexTemplateModel{
|
||||||
InnerHtml: template.HTML(buf.String()),
|
InnerHtml: template.HTML(main_component.String()),
|
||||||
ActivePage: pageName,
|
ActivePage: pageName,
|
||||||
|
NewTransactionPane: template.HTML(new_tp.String()),
|
||||||
|
QuickAccessPane: template.HTML(quick_ap.String()),
|
||||||
});
|
});
|
||||||
if err != nil {
|
if err != nil {
|
||||||
log.Fatal().Err(err).Msg("Fatal error reading hello template");
|
log.Fatal().Err(err).Msg("Fatal error reading hello template");
|
||||||
|
@ -79,7 +96,7 @@ func renderFullPage(w http.ResponseWriter, c templ.Component, pageName string) {
|
||||||
}
|
}
|
||||||
|
|
||||||
func getDashboard(w http.ResponseWriter, req *http.Request) {
|
func getDashboard(w http.ResponseWriter, req *http.Request) {
|
||||||
component := dashboard();
|
component := templates.Dashboard();
|
||||||
|
|
||||||
_, ok := req.Header["Hx-Request"]
|
_, ok := req.Header["Hx-Request"]
|
||||||
if ok {
|
if ok {
|
||||||
|
@ -98,7 +115,7 @@ func getTransactionsPage(w http.ResponseWriter, req *http.Request) {
|
||||||
accounts[i] = strconv.Itoa(i) + " Account";
|
accounts[i] = strconv.Itoa(i) + " Account";
|
||||||
}
|
}
|
||||||
|
|
||||||
component := transactions_page(1, &accounts);
|
component := templates.TransactionsPage(1, &accounts);
|
||||||
_, ok := req.Header["Hx-Request"]
|
_, ok := req.Header["Hx-Request"]
|
||||||
if ok {
|
if ok {
|
||||||
err := component.Render(context.Background(), w);
|
err := component.Render(context.Background(), w);
|
||||||
|
|
|
@ -14,6 +14,7 @@ $border-radius: 8px;
|
||||||
body {
|
body {
|
||||||
background-color: var(--#{$prefix}-base);
|
background-color: var(--#{$prefix}-base);
|
||||||
height: 97vh;
|
height: 97vh;
|
||||||
|
overflow-x: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.row {
|
.row {
|
||||||
|
@ -54,7 +55,6 @@ div#left-col {
|
||||||
width: 15vw;
|
width: 15vw;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
background-color: var(--#{$prefix}-nav-bg);
|
background-color: var(--#{$prefix}-nav-bg);
|
||||||
border-radius: $border-radius;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
div#main-body-content {
|
div#main-body-content {
|
||||||
|
@ -76,18 +76,11 @@ div#right-col {
|
||||||
width: 15vw;
|
width: 15vw;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
background-color: var(--#{$prefix}-nav-bg);
|
background-color: var(--#{$prefix}-nav-bg);
|
||||||
border-radius: $border-radius;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
#transactions-quick-access {
|
#quick-access-pane {
|
||||||
border-radius: $border-radius;
|
|
||||||
height: 500px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#right-panel-quick-access {
|
|
||||||
border-radius: $border-radius;
|
|
||||||
margin-top: auto;
|
margin-top: auto;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
height: 300px;
|
height: 300px;
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
package web
|
package templates
|
||||||
|
|
||||||
templ dashboard() {
|
templ Dashboard() {
|
||||||
<title>Dashboard</title>
|
<title>Dashboard</title>
|
||||||
<div class="container" data-main-body="true">
|
<div class="container" data-main-body="true">
|
||||||
<div class="row" style="margin-top: -20px">
|
<div class="row" style="margin-top: -20px">
|
||||||
|
@ -75,8 +75,3 @@ templ dashboard() {
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
templ new_transaction_pane() {
|
|
||||||
<div id="new_transaction_pane" style="opacity: 0;" class="cr-all c-base">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
}
|
|
|
@ -1,4 +1,4 @@
|
||||||
package web
|
package templates
|
||||||
|
|
||||||
import (
|
import (
|
||||||
"nickiel.net/recount_server/types"
|
"nickiel.net/recount_server/types"
|
||||||
|
@ -6,7 +6,7 @@ import (
|
||||||
"strconv"
|
"strconv"
|
||||||
)
|
)
|
||||||
|
|
||||||
templ transaction_rows(transactions *[]types.HumanLegibleTransaction) {
|
templ TransactionRows(transactions *[]types.HumanLegibleTransaction) {
|
||||||
for i, value := range *transactions {
|
for i, value := range *transactions {
|
||||||
<tr class="row_awaiting_processing" data-rcnt-transaction-row-pos={strconv.Itoa(i)}>
|
<tr class="row_awaiting_processing" data-rcnt-transaction-row-pos={strconv.Itoa(i)}>
|
||||||
<td></td>
|
<td></td>
|
||||||
|
@ -27,7 +27,7 @@ templ transaction_rows(transactions *[]types.HumanLegibleTransaction) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
templ account_summary_rows(accounts *[]types.TwoIntsItem){
|
templ AccountSummaryRows(accounts *[]types.TwoIntsItem){
|
||||||
for _, value := range *accounts {
|
for _, value := range *accounts {
|
||||||
<div class="c-crust m-2" style="height: 90px">
|
<div class="c-crust m-2" style="height: 90px">
|
||||||
<div class="w-100 d-flex" style="height:15px">
|
<div class="w-100 d-flex" style="height:15px">
|
||||||
|
@ -57,7 +57,7 @@ templ account_summary_rows(accounts *[]types.TwoIntsItem){
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
templ transaction_quick_access_entries(transactions *[]types.HumanLegibleTransaction) {
|
templ TransactionQuickAccessEntries(transactions *[]types.HumanLegibleTransaction) {
|
||||||
for _, value := range *transactions {
|
for _, value := range *transactions {
|
||||||
<div class="card-item">
|
<div class="card-item">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
@ -84,7 +84,7 @@ templ transaction_quick_access_entries(transactions *[]types.HumanLegibleTransac
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
templ right_panel_quick_access() {
|
templ QuickAccessPane() {
|
||||||
<div id="quick-access-panel">
|
<div id="quick-access-pane" class="cr-all c-base">
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
|
@ -14,7 +14,7 @@
|
||||||
</header>
|
</header>
|
||||||
<div class="d-flex" id="below-header">
|
<div class="d-flex" id="below-header">
|
||||||
|
|
||||||
<div id="left-col">
|
<div id="left-col" class="cr-all">
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
|
@ -55,7 +55,7 @@
|
||||||
<div id="main-body-content">
|
<div id="main-body-content">
|
||||||
{{.InnerHtml}}
|
{{.InnerHtml}}
|
||||||
</div>
|
</div>
|
||||||
<div id="right-col">
|
<div id="right-col" class="cr-all">
|
||||||
<div id="transaction-quick-access-panel">
|
<div id="transaction-quick-access-panel">
|
||||||
<div class="t-header">
|
<div class="t-header">
|
||||||
<!--
|
<!--
|
||||||
|
@ -79,12 +79,7 @@
|
||||||
<button id="open-draft">
|
<button id="open-draft">
|
||||||
<i data-feather="file-plus"></i>
|
<i data-feather="file-plus"></i>
|
||||||
</button>
|
</button>
|
||||||
<div
|
{{.NewTransactionPane}}
|
||||||
hx-get="/components/new_transaction_pane"
|
|
||||||
hx-trigger="load"
|
|
||||||
>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="t-list-container"
|
class="t-list-container"
|
||||||
|
@ -97,14 +92,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div style="height: 25%"></div>
|
<div style="height: 25%"></div>
|
||||||
|
|
||||||
<div
|
{{.QuickAccessPane}}
|
||||||
class=""
|
|
||||||
id="right-panel-quick-access"
|
|
||||||
hx-get="/components/right_panel_quick_access"
|
|
||||||
hx-swap="innerHtml swap:0.2s settle:0.2s"
|
|
||||||
hx-trigger="load"
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.min.js" integrity="sha512-CQBWl4fJHWbryGE+Pc7UAxWMUMNMWzWxF4SQo9CgkJIN1kx6djDQZjh3Y8SZ1d+6I+1zze6Z7kHXO7q3UyZAWw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.min.js" integrity="sha512-CQBWl4fJHWbryGE+Pc7UAxWMUMNMWzWxF4SQo9CgkJIN1kx6djDQZjh3Y8SZ1d+6I+1zze6Z7kHXO7q3UyZAWw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||||
|
|
9
web/templates/new_transaction_pane.templ
Normal file
9
web/templates/new_transaction_pane.templ
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
package templates
|
||||||
|
|
||||||
|
|
||||||
|
templ NewTransactionPane() {
|
||||||
|
<div id="new_transaction_pane" style="opacity: 0;" class="cr-all c-base">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
package web
|
package templates
|
||||||
|
|
||||||
templ transactions_page(userID int, accounts *[]string) {
|
templ TransactionsPage(userID int, accounts *[]string) {
|
||||||
<title>Transactions</title>
|
<title>Transactions</title>
|
||||||
<div class="d-flex-col mx-4 h-100" data-main-body="true">
|
<div class="d-flex-col mx-4 h-100" data-main-body="true">
|
||||||
<div class="c-crust row cr-all p-5" style="height: fit-content">
|
<div class="c-crust row cr-all p-5" style="height: fit-content">
|
Loading…
Reference in a new issue