67 lines
1.4 KiB
Text
67 lines
1.4 KiB
Text
|
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>
|
||
|
}
|