echo-todos/view/components.templ

67 lines
1.4 KiB
Text
Raw Normal View History

2024-08-19 12:56:20 +00:00
package view
import (
"git.wittern.io/public/echo-todos/model"
"strconv"
)
templ TodoForm() {
<form hx-on::after-request="this.reset()" hx-post="/todos" hx-target="#todoslist">
<fieldset role="group">
<input type="text" name="todo" required/><input value="Clear" type="reset"/>
<button type="submit">Add</button>
</fieldset>
</form>
}
templ TodosList(todos []model.Todo) {
<table class="striped" id="todoslist">
<thead>
<tr>
<th>Title</th>
<th>Done</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
for _, todo := range todos {
@TodoRow(todo)
}
</tbody>
</table>
}
templ TodoRow(todo model.Todo) {
<tr id={ "todo-" + strconv.Itoa(todo.ID) }>
<td>{ todo.Title }</td>
if todo.Done {
<td><input hx-put={ "/todos/todo-" + strconv.Itoa(todo.ID) } hx-target="#todoslist" type="checkbox" name="done" checked/></td>
} else {
<td><input hx-put={ "/todos/todo-" + strconv.Itoa(todo.ID) } hx-target="#todoslist" type="checkbox" name="done"/></td>
}
<td><button hx-delete={ "/todos/todo-" + strconv.Itoa(todo.ID) } hx-target={ "#todo-" + strconv.Itoa(todo.ID) } hx-swap="delete">Delete</button></td>
</tr>
}
templ ErrorPage(message string) {
@Base() {
<container>
<h1>{ message }</h1>
</container>
}
}
templ Hero(AppTitle string) {
@Centered() {
<div class="hero">
<h1>{ AppTitle }</h1>
</div>
}
}
templ Centered() {
<div id="centered-div" class="container centered">
{ children... }
</div>
}