fixed order popup

This commit is contained in:
Bronku 2025-01-27 16:02:27 +01:00
parent cdd60a01f7
commit ec24dace6a
7 changed files with 55 additions and 30 deletions

View file

@ -1 +1,17 @@
# iroon
# iroon
## ux design
### adding an order:
1. user selects the _add order_ button
1. the button should open an order creation menu
2. user enters the customer details
1. incorrect details are highlighted
2. user can't submit an incorrect order
3. user selects the cakes to add from the list
1. the list should be scrollable, with a search box if needed
2. added cakes should appear next to other order details
3. the user can change the count, or remove the cake entirely
4. user submits the order
1. after submission the user should get a confirmation, and an order id along with the link to said order page
2. the form should disappear after submission
3. there should be a button to go back to creating a new form

29
main.go
View file

@ -3,7 +3,6 @@ package main
import (
"embed"
"fmt"
"html/template"
"io/fs"
"net/http"
)
@ -11,9 +10,6 @@ import (
//go:embed public
var public embed.FS
//go:embed templates
var templates embed.FS
func unwrap[T any](output T, err error) T {
if err != nil {
panic(err)
@ -21,30 +17,21 @@ func unwrap[T any](output T, err error) T {
return output
}
func getNewOrder(w http.ResponseWriter, r *http.Request) {
tmpl, err := template.ParseFS(templates, "templates/*.gohtml")
func handlePost(w http.ResponseWriter, r *http.Request) {
fmt.Println("received Post request: ", r)
err := r.ParseForm()
if err != nil {
_, _ = fmt.Fprint(w, err)
w.WriteHeader(http.StatusInternalServerError)
return
fmt.Println(err)
}
err = tmpl.ExecuteTemplate(w, "new_order.gohtml", nil)
if err != nil {
_, _ = fmt.Fprint(w, err)
w.WriteHeader(http.StatusInternalServerError)
}
}
func postNewOrder(w http.ResponseWriter, r *http.Request) {
fmt.Println(r.Form)
w.WriteHeader(http.StatusAccepted)
}
func main() {
server := http.NewServeMux()
server.Handle("/", http.FileServerFS(unwrap(fs.Sub(public, "public"))))
server.HandleFunc("GET /order/new", getNewOrder)
server.HandleFunc("POST /order/new", postNewOrder)
server.Handle("GET /", http.FileServerFS(unwrap(fs.Sub(public, "public"))))
server.HandleFunc("POST /", handlePost)
err := http.ListenAndServe(":8080", server)
if err != nil {

5
public/alpine-3.14.8.js Normal file

File diff suppressed because one or more lines are too long

4
public/confirmation.html Normal file
View file

@ -0,0 +1,4 @@
<div id="order_confirmation" hx-get="new_order.html" hx-swap="outerHTML">
<button hx-get="new_order.html" hx-target="#order_confirmation" hx-swap="outerHTML" x-on:click="open = false">Back</button>
<button hx-get="new_order.html" hx-target="#order_confirmation" hx-swap="outerHTML">New Order</button>
</div>

View file

@ -5,13 +5,17 @@
<title>IROON</title>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<script src="htmx-2.04.js"></script>
<script defer src="alpine-3.14.8.js"></script>
</head>
<body>
<header>
<h1>I ran out of names</h1>
</header>
<main>
<button hx-get="/order/new" hx-swap="afterend">New Order</button>
<div id="new_order" x-data="{open:false}">
<button x-on:click="open = !open" x-show="!open">New Order</button>
<form hx-get="new_order.html" hx-swap="innerHTML" hx-trigger="load"></form>
</div>
</main>
</body>
</html>

16
public/new_order.html Normal file
View file

@ -0,0 +1,16 @@
<form x-show="open" hx-get="confirmation.html" hx-swap="outerHTML">
<div>
<label for="firstname">First Name</label>
<input type="text" id="firstname" name="firstname" value="">
</div>
<div >
<label for="lastname">Last Name</label>
<input type="text" id="lastname" name="lastname" value="">
</div>
<div >
<label for="phone">Phone</label>
<input type="tel" id="phone" name="phone" value="">
</div>
<button type="button" x-on:click="open = false">Cancel</button>
<button type="submit">Submit</button>
</form>

View file

@ -1,7 +0,0 @@
<form>
<label>
ok
<input>
</label>
<button hx-post="/order/new" hx-swap="delete" hx-target="closest form">Submit</button>
</form>