flatter html
This commit is contained in:
bronkuu
parent
cf2e217030
commit
a74c276cd3
11 changed files with 84 additions and 107 deletions
|
|
@ -7,7 +7,7 @@ import (
|
|||
)
|
||||
|
||||
templ BlockedPage(blocked []models.BlockedDate) {
|
||||
@Layout("Terminy zablokowane", templ.NopComponent, BlockedMain(blocked))
|
||||
@Layout("Terminy zablokowane", BlockedMain(blocked))
|
||||
}
|
||||
|
||||
templ BlockedMain(blocked []models.BlockedDate) {
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import (
|
|||
)
|
||||
|
||||
templ CakePage(cake models.Cake, allTags []models.Tag) {
|
||||
@Layout(CakeTitle(cake), templ.NopComponent, CakeForm(cake, allTags))
|
||||
@Layout(CakeTitle(cake), CakeForm(cake, allTags))
|
||||
}
|
||||
|
||||
templ CakeForm(cake models.Cake, allTags []models.Tag) {
|
||||
|
|
|
|||
|
|
@ -7,11 +7,11 @@ import (
|
|||
)
|
||||
|
||||
templ CakesPage(cakes []models.Cake, allTags []models.Tag) {
|
||||
@Layout("Katalog", templ.NopComponent, CakesMain(cakes, allTags))
|
||||
@Layout("Katalog", CakesMain(cakes, allTags))
|
||||
}
|
||||
|
||||
templ CakesMain(cakes []models.Cake, allTags []models.Tag) {
|
||||
<section class="card">
|
||||
<section class="card" id="cakes-card">
|
||||
<header>
|
||||
<h2>
|
||||
<span class="material-symbols-outlined">inventory_2</span>
|
||||
|
|
@ -30,10 +30,9 @@ templ CakesMain(cakes []models.Cake, allTags []models.Tag) {
|
|||
}
|
||||
</div>
|
||||
}
|
||||
<table class="data-table" id="cakes-table">
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Nazwa</th>
|
||||
<th>SKU</th>
|
||||
<th>Tagi</th>
|
||||
|
|
@ -44,11 +43,6 @@ templ CakesMain(cakes []models.Cake, allTags []models.Tag) {
|
|||
<tbody>
|
||||
for _, c := range cakes {
|
||||
<tr data-tags={ tagNames(c.Tags) }>
|
||||
<td>
|
||||
<div class="icon cake">
|
||||
<span class="material-symbols-outlined">cake</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="font-medium">{ c.Name }</td>
|
||||
<td class="text-muted">#{ strconv.Itoa(c.ID) }</td>
|
||||
<td>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ package templates
|
|||
import "strconv"
|
||||
|
||||
templ Confirmation(title string, id int) {
|
||||
@Layout(title, templ.NopComponent, ConfirmationBody(id))
|
||||
@Layout(title, ConfirmationBody(id))
|
||||
}
|
||||
|
||||
templ ConfirmationBody(id int) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
package templates
|
||||
|
||||
templ Layout(title string, header, main templ.Component) {
|
||||
templ Layout(title string, main templ.Component) {
|
||||
<!DOCTYPE html>
|
||||
<html lang="pl">
|
||||
<head>
|
||||
|
|
@ -17,11 +17,10 @@ templ Layout(title string, header, main templ.Component) {
|
|||
<aside>
|
||||
@Nav()
|
||||
</aside>
|
||||
<header class="topnav">
|
||||
<h1>{ title }</h1>
|
||||
</header>
|
||||
<main id="main">
|
||||
<header class="topnav">
|
||||
<h1>{ title }</h1>
|
||||
@header
|
||||
</header>
|
||||
<div class="main-content">
|
||||
@main
|
||||
</div>
|
||||
|
|
@ -30,13 +29,12 @@ templ Layout(title string, header, main templ.Component) {
|
|||
</html>
|
||||
}
|
||||
|
||||
templ MainContent(title string, header, main templ.Component) {
|
||||
templ MainContent(title string, main templ.Component) {
|
||||
<header class="topnav" hx-swap-oob="true">
|
||||
<h1>{ title }</h1>
|
||||
</header>
|
||||
<main id="main">
|
||||
<title hx-swap-oob="true">{ title } — Zamówienia ciast</title>
|
||||
<header class="topnav">
|
||||
<h1>{ title }</h1>
|
||||
@header
|
||||
</header>
|
||||
<div class="main-content">
|
||||
@main
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import (
|
|||
)
|
||||
|
||||
templ OrderPage(order models.Order, catalogue []models.Cake, allTags []models.Tag, blockedDates []models.BlockedDate) {
|
||||
@Layout(OrderTitle(order), templ.NopComponent, OrderForm(order, catalogue, allTags, blockedDates))
|
||||
@Layout(OrderTitle(order), OrderForm(order, catalogue, allTags, blockedDates))
|
||||
}
|
||||
|
||||
templ OrderForm(order models.Order, catalogue []models.Cake, allTags []models.Tag, blockedDates []models.BlockedDate) {
|
||||
|
|
|
|||
|
|
@ -7,17 +7,17 @@ import (
|
|||
)
|
||||
|
||||
templ OrdersPage(first, last, today, tomorrow, special string, counts models.OrderCounts, cakeCounts []models.CakeCount, orders []models.Order) {
|
||||
@Layout("Panel główny", DateForm(first, last, today, tomorrow, special), OrdersMain(counts, cakeCounts, orders, first, last, special))
|
||||
@Layout("Panel główny", OrdersMain(counts, cakeCounts, orders, first, last, special, today, tomorrow))
|
||||
}
|
||||
|
||||
templ DateForm(first, last, today, tomorrow, special string) {
|
||||
<div class="horizontal-group">
|
||||
<div class="preset-group">
|
||||
<a href={ templ.URL("/orders?from=" + today + "&to=" + today + "&special=" + special) } hx-get={ templ.URL("/orders?from=" + today + "&to=" + today + "&special=" + special) } hx-target="#results-pane" class="preset-btn">Dzisiaj</a>
|
||||
<a href={ templ.URL("/orders?from=" + tomorrow + "&to=" + tomorrow + "&special=" + special) } hx-get={ templ.URL("/orders?from=" + tomorrow + "&to=" + tomorrow + "&special=" + special) } hx-target="#results-pane" class="preset-btn">Jutro</a>
|
||||
<a href={ templ.URL("/orders?special=" + special) } hx-get={ templ.URL("/orders?special=" + special) } hx-target="#results-pane" class="preset-btn">W tym tygodniu</a>
|
||||
<a href={ templ.URL("/orders?from=" + today + "&to=" + today + "&special=" + special) } hx-get={ templ.URL("/orders?from=" + today + "&to=" + today + "&special=" + special) } hx-target="#orders-results" class="preset-btn">Dzisiaj</a>
|
||||
<a href={ templ.URL("/orders?from=" + tomorrow + "&to=" + tomorrow + "&special=" + special) } hx-get={ templ.URL("/orders?from=" + tomorrow + "&to=" + tomorrow + "&special=" + special) } hx-target="#orders-results" class="preset-btn">Jutro</a>
|
||||
<a href={ templ.URL("/orders?special=" + special) } hx-get={ templ.URL("/orders?special=" + special) } hx-target="#orders-results" class="preset-btn">W tym tygodniu</a>
|
||||
</div>
|
||||
<form method="GET" action="/orders" class="horizontal-group" hx-get="/orders" hx-target="#results-pane" hx-trigger="change, keyup delay:500ms">
|
||||
<form method="GET" action="/orders" class="horizontal-group" hx-get="/orders" hx-target="#orders-results" hx-trigger="change, keyup delay:500ms">
|
||||
<label>Od</label>
|
||||
<input type="date" name="from" value={ first }/>
|
||||
<label>Do</label>
|
||||
|
|
@ -27,32 +27,31 @@ templ DateForm(first, last, today, tomorrow, special string) {
|
|||
</div>
|
||||
}
|
||||
|
||||
templ OrdersMain(counts models.OrderCounts, cakeCounts []models.CakeCount, orders []models.Order, first, last, special string) {
|
||||
<div class="metrics-grid">
|
||||
<div>
|
||||
<span class="label">
|
||||
<span class="material-symbols-outlined">receipt_long</span>
|
||||
Aktywne
|
||||
</span>
|
||||
<span class="value">{ strconv.Itoa(counts.Active) }</span>
|
||||
<span class="change">Wszystkie niezrealizowane</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="label">
|
||||
<span class="material-symbols-outlined">today</span>
|
||||
Na dziś
|
||||
</span>
|
||||
<span class="value">{ strconv.Itoa(counts.DueToday) }</span>
|
||||
<span class="change">Do zrobienia</span>
|
||||
</div>
|
||||
templ OrdersMain(counts models.OrderCounts, cakeCounts []models.CakeCount, orders []models.Order, first, last, special, today, tomorrow string) {
|
||||
@DateForm(first, last, today, tomorrow, special)
|
||||
<div class="metric">
|
||||
<span class="label">
|
||||
<span class="material-symbols-outlined">receipt_long</span>
|
||||
Aktywne
|
||||
</span>
|
||||
<span class="value">{ strconv.Itoa(counts.Active) }</span>
|
||||
<span class="change">Wszystkie niezrealizowane</span>
|
||||
</div>
|
||||
<div id="results-pane">
|
||||
<div class="metric">
|
||||
<span class="label">
|
||||
<span class="material-symbols-outlined">today</span>
|
||||
Na dziś
|
||||
</span>
|
||||
<span class="value">{ strconv.Itoa(counts.DueToday) }</span>
|
||||
<span class="change">Do zrobienia</span>
|
||||
</div>
|
||||
<div id="orders-results">
|
||||
@OrdersContent(orders, cakeCounts, first, last, special)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ OrdersContent(orders []models.Order, cakeCounts []models.CakeCount, first, last, special string) {
|
||||
<section class="card">
|
||||
<section class="card" id="orders-card">
|
||||
<header>
|
||||
<h2>
|
||||
<span class="material-symbols-outlined">list_alt</span>
|
||||
|
|
@ -60,9 +59,9 @@ templ OrdersContent(orders []models.Order, cakeCounts []models.CakeCount, first,
|
|||
</h2>
|
||||
<div class="header-actions">
|
||||
<div class="preset-group">
|
||||
<a href={ templ.URL("/orders?special=true&from=" + first + "&to=" + last) } hx-get={ templ.URL("/orders?special=true&from=" + first + "&to=" + last) } hx-target="#results-pane"
|
||||
<a href={ templ.URL("/orders?special=true&from=" + first + "&to=" + last) } hx-get={ templ.URL("/orders?special=true&from=" + first + "&to=" + last) } hx-target="#orders-results"
|
||||
class={ "preset-btn", templ.KV("active", special == "true") }>Torty</a>
|
||||
<a href={ templ.URL("/orders?from=" + first + "&to=" + last) } hx-get={ templ.URL("/orders?from=" + first + "&to=" + last) } hx-target="#results-pane"
|
||||
<a href={ templ.URL("/orders?from=" + first + "&to=" + last) } hx-get={ templ.URL("/orders?from=" + first + "&to=" + last) } hx-target="#orders-results"
|
||||
class={ "preset-btn", templ.KV("active", special != "true") }>Wszystkie</a>
|
||||
</div>
|
||||
<div class="search">
|
||||
|
|
@ -158,25 +157,33 @@ templ OrderRow(order models.Order) {
|
|||
}
|
||||
|
||||
templ CakeBreakdown(cakeCounts []models.CakeCount) {
|
||||
<section class="card">
|
||||
<section class="card" id="breakdown-card">
|
||||
<header>
|
||||
<h2>
|
||||
<span class="material-symbols-outlined">cake</span>
|
||||
Zapotrzebowanie
|
||||
</h2>
|
||||
</header>
|
||||
<div>
|
||||
<ul class="breakdown-list">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nazwa</th>
|
||||
<th class="text-right">Ilość</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
for _, cc := range cakeCounts {
|
||||
<li class="breakdown-item">
|
||||
<span>{ cc.Name }</span>
|
||||
<span class="breakdown-amount">{ strconv.Itoa(cc.Amount) }</span>
|
||||
</li>
|
||||
<tr>
|
||||
<td>{ cc.Name }</td>
|
||||
<td class="text-right font-bold">{ strconv.Itoa(cc.Amount) }</td>
|
||||
</tr>
|
||||
}
|
||||
if len(cakeCounts) == 0 {
|
||||
<li class="breakdown-empty">Brak ciast w tym okresie</li>
|
||||
<tr>
|
||||
<td colspan="2" class="empty-state">Brak ciast w tym okresie</td>
|
||||
</tr>
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue