tenis booking site done by claude
This commit is contained in:
Priec
@@ -1,4 +0,0 @@
|
||||
hello-world = Hallo Welt!
|
||||
greeting = Hallochen { $name }!
|
||||
.placeholder = Hallo Freund!
|
||||
about = Uber
|
||||
@@ -1,10 +0,0 @@
|
||||
hello-world = Hello World!
|
||||
greeting = Hello { $name }!
|
||||
.placeholder = Hello Friend!
|
||||
about = About
|
||||
simple = simple text
|
||||
reference = simple text with a reference: { -something }
|
||||
parameter = text with a { $param }
|
||||
parameter2 = text one { $param } second { $multi-word-param }
|
||||
email = text with an EMAIL("example@example.org")
|
||||
fallback = this should fall back
|
||||
43
ht_booking/assets/i18n/en/main.ftl
Normal file
43
ht_booking/assets/i18n/en/main.ftl
Normal file
@@ -0,0 +1,43 @@
|
||||
brand = Tennis Court Booking
|
||||
nav-calendar = Calendar
|
||||
nav-admin = Admin login
|
||||
admin-title = Admin
|
||||
calendar-title = Court Calendar
|
||||
court-label = Court
|
||||
prev-week = Previous week
|
||||
this-week = This week
|
||||
next-week = Next week
|
||||
free = Free
|
||||
booked = Booked
|
||||
no-courts = No courts available yet.
|
||||
day-mon = Mon
|
||||
day-tue = Tue
|
||||
day-wed = Wed
|
||||
day-thu = Thu
|
||||
day-fri = Fri
|
||||
day-sat = Sat
|
||||
day-sun = Sun
|
||||
login-title = Admin Login
|
||||
email = Email
|
||||
password = Password
|
||||
login-button = Sign in
|
||||
login-error = Invalid email or password.
|
||||
logout = Log out
|
||||
manage-courts = Courts
|
||||
back-to-calendar = Back to calendar
|
||||
add-booking = New Booking
|
||||
edit-booking = Edit Booking
|
||||
date = Date
|
||||
hour = Hour
|
||||
booking-color = Colour
|
||||
booking-name = Name
|
||||
booking-contact = Contact
|
||||
booking-note = Note
|
||||
save = Save
|
||||
cancel = Cancel
|
||||
delete = Delete
|
||||
confirm-delete = Delete this booking?
|
||||
court-name = Name
|
||||
court-surface = Surface
|
||||
court-indoor = Indoor
|
||||
add-court = Add Court
|
||||
43
ht_booking/assets/i18n/sk/main.ftl
Normal file
43
ht_booking/assets/i18n/sk/main.ftl
Normal file
@@ -0,0 +1,43 @@
|
||||
brand = Rezervácia tenisového kurtu
|
||||
nav-calendar = Kalendár
|
||||
nav-admin = Prihlásenie admina
|
||||
admin-title = Admin
|
||||
calendar-title = Kalendár kurtu
|
||||
court-label = Kurt
|
||||
prev-week = Predchádzajúci týždeň
|
||||
this-week = Tento týždeň
|
||||
next-week = Nasledujúci týždeň
|
||||
free = Voľné
|
||||
booked = Obsadené
|
||||
no-courts = Zatiaľ nie sú k dispozícii žiadne kurty.
|
||||
day-mon = Po
|
||||
day-tue = Ut
|
||||
day-wed = St
|
||||
day-thu = Št
|
||||
day-fri = Pi
|
||||
day-sat = So
|
||||
day-sun = Ne
|
||||
login-title = Prihlásenie admina
|
||||
email = E-mail
|
||||
password = Heslo
|
||||
login-button = Prihlásiť sa
|
||||
login-error = Nesprávny e-mail alebo heslo.
|
||||
logout = Odhlásiť sa
|
||||
manage-courts = Kurty
|
||||
back-to-calendar = Späť na kalendár
|
||||
add-booking = Nová rezervácia
|
||||
edit-booking = Upraviť rezerváciu
|
||||
date = Dátum
|
||||
hour = Hodina
|
||||
booking-color = Farba
|
||||
booking-name = Meno
|
||||
booking-contact = Kontakt
|
||||
booking-note = Poznámka
|
||||
save = Uložiť
|
||||
cancel = Zrušiť
|
||||
delete = Zmazať
|
||||
confirm-delete = Zmazať túto rezerváciu?
|
||||
court-name = Názov
|
||||
court-surface = Povrch
|
||||
court-indoor = Krytý
|
||||
add-court = Pridať kurt
|
||||
64
ht_booking/assets/views/admin/booking_form.html
Normal file
64
ht_booking/assets/views/admin/booking_form.html
Normal file
@@ -0,0 +1,64 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}
|
||||
{% if mode == "edit" %}{{ t(key="edit-booking", lang=lang) }}{% else %}{{ t(key="add-booking", lang=lang) }}{% endif %}
|
||||
{% endblock title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mx-auto max-w-md">
|
||||
<div class="mb-4 flex items-center justify-between">
|
||||
<h1 class="text-2xl font-bold">
|
||||
{% if mode == "edit" %}{{ t(key="edit-booking", lang=lang) }}{% else %}{{ t(key="add-booking", lang=lang) }}{% endif %}
|
||||
</h1>
|
||||
<a href="/admin" class="text-sm text-blue-600 hover:underline">← {{ t(key="back-to-calendar", lang=lang) }}</a>
|
||||
</div>
|
||||
|
||||
<form method="post" action="{{ action }}" class="space-y-3 rounded-lg border bg-white p-4">
|
||||
<input type="hidden" name="court_id" value="{{ court_id }}">
|
||||
<div class="text-sm text-gray-600">{{ t(key="court-label", lang=lang) }}: <strong>{{ court_name }}</strong></div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="date", lang=lang) }}</label>
|
||||
<input type="date" name="date" value="{{ date }}" required class="w-full rounded border-gray-300 text-sm">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="hour", lang=lang) }}</label>
|
||||
<select name="hour" class="w-full rounded border-gray-300 text-sm">
|
||||
{% for h in hours %}
|
||||
<option value="{{ h.v }}" {% if h.v == hour %}selected{% endif %}>{{ h.label }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="booking-color", lang=lang) }}</label>
|
||||
<input type="color" name="color" value="{{ color }}" class="h-9 w-16 rounded border-gray-300">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="booking-name", lang=lang) }}</label>
|
||||
<input name="name" value="{{ name }}" required class="w-full rounded border-gray-300 text-sm">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="booking-contact", lang=lang) }}</label>
|
||||
<input name="contact" value="{{ contact }}" class="w-full rounded border-gray-300 text-sm">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="booking-note", lang=lang) }}</label>
|
||||
<textarea name="note" rows="3" class="w-full rounded border-gray-300 text-sm">{{ note }}</textarea>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<button class="rounded bg-gray-900 px-4 py-2 text-sm text-white hover:bg-gray-700">
|
||||
{{ t(key="save", lang=lang) }}
|
||||
</button>
|
||||
<a href="/admin" class="rounded border px-4 py-2 text-sm hover:bg-gray-100">{{ t(key="cancel", lang=lang) }}</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{% if mode == "edit" %}
|
||||
<form method="post" action="/admin/booking/{{ booking_id }}/delete" class="mt-3"
|
||||
onsubmit="return confirm('{{ t(key="confirm-delete", lang=lang) }}');">
|
||||
<button class="rounded bg-red-600 px-4 py-2 text-sm text-white hover:bg-red-700">
|
||||
{{ t(key="delete", lang=lang) }}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock content %}
|
||||
51
ht_booking/assets/views/admin/courts.html
Normal file
51
ht_booking/assets/views/admin/courts.html
Normal file
@@ -0,0 +1,51 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}{{ t(key="manage-courts", lang=lang) }}{% endblock title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mb-4 flex items-center justify-between">
|
||||
<h1 class="text-2xl font-bold">{{ t(key="manage-courts", lang=lang) }}</h1>
|
||||
<a href="/admin" class="text-sm text-blue-600 hover:underline">← {{ t(key="back-to-calendar", lang=lang) }}</a>
|
||||
</div>
|
||||
|
||||
<div class="mb-6 overflow-auto rounded-lg border bg-white">
|
||||
<table class="w-full text-sm">
|
||||
<thead>
|
||||
<tr class="bg-gray-100 text-left">
|
||||
<th class="p-2">{{ t(key="court-name", lang=lang) }}</th>
|
||||
<th class="p-2">{{ t(key="court-surface", lang=lang) }}</th>
|
||||
<th class="p-2">{{ t(key="court-indoor", lang=lang) }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for c in courts %}
|
||||
<tr class="border-t">
|
||||
<td class="p-2">{{ c.name }}</td>
|
||||
<td class="p-2">{{ c.surface }}</td>
|
||||
<td class="p-2">{{ c.indoor }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="max-w-md rounded-lg border bg-white p-4">
|
||||
<h2 class="mb-3 font-semibold">{{ t(key="add-court", lang=lang) }}</h2>
|
||||
<form method="post" action="/admin/courts" class="space-y-3">
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="court-name", lang=lang) }}</label>
|
||||
<input name="name" required class="w-full rounded border-gray-300 text-sm">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="court-surface", lang=lang) }}</label>
|
||||
<input name="surface" class="w-full rounded border-gray-300 text-sm">
|
||||
</div>
|
||||
<label class="flex items-center gap-2 text-sm">
|
||||
<input type="checkbox" name="indoor" value="1"> {{ t(key="court-indoor", lang=lang) }}
|
||||
</label>
|
||||
<button class="rounded bg-gray-900 px-4 py-2 text-sm text-white hover:bg-gray-700">
|
||||
{{ t(key="add-court", lang=lang) }}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
25
ht_booking/assets/views/admin/login.html
Normal file
25
ht_booking/assets/views/admin/login.html
Normal file
@@ -0,0 +1,25 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}{{ t(key="login-title", lang=lang) }}{% endblock title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mx-auto mt-8 max-w-sm rounded-lg border bg-white p-6">
|
||||
<h1 class="mb-4 text-xl font-bold">{{ t(key="login-title", lang=lang) }}</h1>
|
||||
{% if error %}
|
||||
<div class="mb-3 rounded bg-red-100 px-3 py-2 text-sm text-red-700">{{ t(key="login-error", lang=lang) }}</div>
|
||||
{% endif %}
|
||||
<form method="post" action="/admin/login" class="space-y-3">
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="email", lang=lang) }}</label>
|
||||
<input type="email" name="email" required class="w-full rounded border-gray-300 text-sm">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm text-gray-600">{{ t(key="password", lang=lang) }}</label>
|
||||
<input type="password" name="password" required class="w-full rounded border-gray-300 text-sm">
|
||||
</div>
|
||||
<button class="w-full rounded bg-gray-900 py-2 text-sm text-white hover:bg-gray-700">
|
||||
{{ t(key="login-button", lang=lang) }}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
@@ -1,65 +1,50 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="{{ lang }}">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>{% block title %}{% endblock title %}</title>
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio,line-clamp"></script>
|
||||
{% block head %}
|
||||
|
||||
{% endblock head %}
|
||||
<title>{% block title %}{{ t(key="brand", lang=lang) }}{% endblock title %}</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
{% block head %}{% endblock head %}
|
||||
</head>
|
||||
|
||||
<body class="min-h-screen bg-background font-sans antialiased">
|
||||
<div class="relative flex min-h-screen flex-col bg-background">
|
||||
<div class="themes-wrapper bg-background">
|
||||
<main class="relative flex min-h-svh flex-1 flex-col bg-background peer-data-[variant=inset]:min-h-[calc(100svh-theme(spacing.4))] md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow">
|
||||
<div class="flex flex-1 flex-col gap-4 p-5 pt-5">
|
||||
<h1 class="scroll-m-20 text-3xl font-bold tracking-tight">
|
||||
{% block page_title %}{% endblock page_title %}
|
||||
</h1>
|
||||
{% block content %}
|
||||
{% endblock content %}
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
<body class="min-h-screen bg-gray-50 text-gray-900 font-sans antialiased">
|
||||
<header class="border-b bg-white">
|
||||
<div class="mx-auto flex max-w-6xl items-center justify-between px-5 py-3">
|
||||
<a href="/" class="text-lg font-bold">{{ t(key="brand", lang=lang) }}</a>
|
||||
<nav class="flex items-center gap-4 text-sm">
|
||||
<a href="/" class="hover:underline">{{ t(key="nav-calendar", lang=lang) }}</a>
|
||||
{% if is_admin %}
|
||||
<a href="/admin" class="hover:underline">{{ t(key="admin-title", lang=lang) }}</a>
|
||||
<a href="/admin/courts" class="hover:underline">{{ t(key="manage-courts", lang=lang) }}</a>
|
||||
<form method="post" action="/admin/logout" class="inline">
|
||||
<button class="hover:underline">{{ t(key="logout", lang=lang) }}</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a href="/admin/login" class="hover:underline">{{ t(key="nav-admin", lang=lang) }}</a>
|
||||
{% endif %}
|
||||
<span class="flex gap-1">
|
||||
<button onclick="setLang('en')"
|
||||
class="rounded px-2 py-0.5 {% if lang == 'en' %}bg-gray-900 text-white{% else %}bg-gray-200{% endif %}">EN</button>
|
||||
<button onclick="setLang('sk')"
|
||||
class="rounded px-2 py-0.5 {% if lang == 'sk' %}bg-gray-900 text-white{% else %}bg-gray-200{% endif %}">SK</button>
|
||||
</span>
|
||||
</nav>
|
||||
</div>
|
||||
{% block js %}
|
||||
</header>
|
||||
|
||||
{% endblock js %}
|
||||
<main class="mx-auto max-w-6xl px-5 py-6">
|
||||
{% block content %}{% endblock content %}
|
||||
</main>
|
||||
|
||||
<script>
|
||||
function confirmDelete(event, delete_url, redirect_to) {
|
||||
event.preventDefault();
|
||||
if (confirm("Are you sure you want to delete this item?")) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("DELETE", delete_url, true);
|
||||
xhr.onreadystatechange = function () {
|
||||
if (xhr.readyState == 4 && xhr.status == 200) {
|
||||
window.location.href = redirect_to;
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
}
|
||||
function setLang(l) {
|
||||
document.cookie = 'lang=' + l + ';path=/;max-age=31536000';
|
||||
location.reload();
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
document.querySelectorAll('.add-more').forEach(button => {
|
||||
button.addEventListener('click', function () {
|
||||
const group = this.getAttribute('data-group');
|
||||
const first = document.getElementById(`${group}-inputs`).querySelector('input');
|
||||
if (first) {
|
||||
const clonedInput = first.cloneNode();
|
||||
clonedInput.value = '';
|
||||
const container = document.getElementById(`${group}-inputs`);
|
||||
container.appendChild(clonedInput);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
{% block js %}{% endblock js %}
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
82
ht_booking/assets/views/calendar/week.html
Normal file
82
ht_booking/assets/views/calendar/week.html
Normal file
@@ -0,0 +1,82 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}{{ t(key="calendar-title", lang=lang) }}{% endblock title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mb-4 flex flex-wrap items-center justify-between gap-3">
|
||||
<h1 class="text-2xl font-bold">
|
||||
{% if is_admin %}{{ t(key="admin-title", lang=lang) }}{% else %}{{ t(key="calendar-title", lang=lang) }}{% endif %}
|
||||
</h1>
|
||||
{% if has_courts %}
|
||||
<form method="get" action="{{ base_path }}" class="flex items-center gap-2">
|
||||
<label class="text-sm text-gray-600">{{ t(key="court-label", lang=lang) }}</label>
|
||||
<input type="hidden" name="week" value="{{ week }}">
|
||||
<select name="court" onchange="this.form.submit()" class="rounded border-gray-300 text-sm">
|
||||
{% for c in courts %}
|
||||
<option value="{{ c.id }}" {% if c.selected %}selected{% endif %}>{{ c.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</form>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if has_courts %}
|
||||
<div class="mb-3 flex flex-wrap items-center justify-between gap-2">
|
||||
<div class="flex gap-2">
|
||||
<a href="{{ base_path }}?court={{ court_id }}&week={{ prev_week }}"
|
||||
class="rounded border bg-white px-3 py-1 text-sm hover:bg-gray-100">← {{ t(key="prev-week", lang=lang) }}</a>
|
||||
<a href="{{ base_path }}?court={{ court_id }}&week={{ this_week }}"
|
||||
class="rounded border bg-white px-3 py-1 text-sm hover:bg-gray-100">{{ t(key="this-week", lang=lang) }}</a>
|
||||
<a href="{{ base_path }}?court={{ court_id }}&week={{ next_week }}"
|
||||
class="rounded border bg-white px-3 py-1 text-sm hover:bg-gray-100">{{ t(key="next-week", lang=lang) }} →</a>
|
||||
</div>
|
||||
<div class="text-sm font-medium text-gray-600">{{ court_name }} · {{ week_label }}</div>
|
||||
</div>
|
||||
|
||||
<div class="overflow-auto rounded-lg border bg-white">
|
||||
<table class="w-full border-collapse text-sm">
|
||||
<thead>
|
||||
<tr class="bg-gray-100">
|
||||
<th class="w-16 border p-2"></th>
|
||||
{% for d in days %}
|
||||
<th class="border p-2 text-center">
|
||||
<div class="font-semibold">{{ t(key=d.key, lang=lang) }}</div>
|
||||
<div class="text-xs font-normal text-gray-500">{{ d.num }}</div>
|
||||
</th>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for row in rows %}
|
||||
<tr>
|
||||
<td class="border p-2 text-center font-medium text-gray-500">{{ row.hour_label }}</td>
|
||||
{% for cell in row.cells %}
|
||||
<td class="h-14 border p-1 align-top">
|
||||
{% if cell.booked %}
|
||||
{% if is_admin %}
|
||||
<a href="/admin/booking/{{ cell.booking_id }}"
|
||||
class="block h-full rounded px-1 py-1 text-xs font-medium text-white"
|
||||
style="background-color: {{ cell.color }}">{{ cell.name }}</a>
|
||||
{% else %}
|
||||
<div class="h-full rounded px-1 py-1 text-xs font-medium text-white"
|
||||
style="background-color: {{ cell.color }}" title="{{ cell.name }}">{{ t(key="booked", lang=lang) }}</div>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% if is_admin %}
|
||||
<a href="/admin/booking?court={{ court_id }}&date={{ cell.date }}&hour={{ cell.hour }}"
|
||||
class="block h-full rounded px-1 py-1 text-xs text-gray-400 hover:bg-gray-100">+</a>
|
||||
{% else %}
|
||||
<div class="h-full px-1 py-1 text-xs text-gray-300">{{ t(key="free", lang=lang) }}</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="rounded-lg border bg-white p-8 text-center text-gray-500">{{ t(key="no-courts", lang=lang) }}</div>
|
||||
{% endif %}
|
||||
{% endblock content %}
|
||||
@@ -1,37 +0,0 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}
|
||||
Create court
|
||||
{% endblock title %}
|
||||
|
||||
{% block page_title %}
|
||||
Create new court
|
||||
{% endblock page_title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mb-10">
|
||||
<form action="/courts" method="post" class="flex-1 lg:max-w-2xl">
|
||||
<div class="space-y-2">
|
||||
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" for=":r2l:-form-item">name</label>
|
||||
<input class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm md:text-sm" id="name" name="name" type="text" value="" />
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" for=":r2l:-form-item">surface</label>
|
||||
<input class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm md:text-sm" id="surface" name="surface" type="text" value="" />
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" for=":r2l:-form-item">indoor</label>
|
||||
<input class="flex rounded-md border border-input bg-transparent text-base shadow-sm md:text-sm" id="indoor" name="indoor" type="checkbox" value="true" />
|
||||
</div>
|
||||
<div class="mt-5">
|
||||
<button class=" text-xs py-3 px-6 rounded-lg bg-gray-900 text-white" type="submit">Submit</button>
|
||||
</div>
|
||||
</form>
|
||||
<br />
|
||||
<a href="/courts">Back to courts</a>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
||||
{% block js %}
|
||||
|
||||
{% endblock js %}
|
||||
@@ -1,42 +0,0 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}
|
||||
Edit court: {{ item.id }}
|
||||
{% endblock title %}
|
||||
|
||||
{% block page_title %}
|
||||
Edit court: {{ item.id }}
|
||||
{% endblock page_title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mb-10">
|
||||
<form action="/courts/{{ item.id }}" method="post" class="flex-1 lg:max-w-2xl">
|
||||
<div class="space-y-2">
|
||||
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" for=":r2l:-form-item">name</label>
|
||||
<input class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm md:text-sm" id="name" name="name" type="text" value="{{item.name}}" />
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" for=":r2l:-form-item">surface</label>
|
||||
<input class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm md:text-sm" id="surface" name="surface" type="text" value="{{item.surface}}" />
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" for=":r2l:-form-item">indoor</label>
|
||||
<input class="flex rounded-md border border-input bg-transparent text-base shadow-sm md:text-sm" id="indoor" name="indoor" type="checkbox" value="true" {% if item.indoor %}checked{%endif %} />
|
||||
</div>
|
||||
<div>
|
||||
<div class="mt-5">
|
||||
<button class=" text-xs py-3 px-6 rounded-lg bg-gray-900 text-white" type="submit">Submit</button>
|
||||
<button class="text-xs py-3 px-6 rounded-lg bg-red-600 text-white"
|
||||
onclick="confirmDelete(event, '/courts/{{ item.id }}', '/courts' )">Delete</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div id="success-message" class="mt-4"></div>
|
||||
<br />
|
||||
<a href="/courts">Back to court</a>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
||||
{% block js %}
|
||||
|
||||
{% endblock js %}
|
||||
@@ -1,86 +0,0 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}
|
||||
List of court
|
||||
{% endblock title %}
|
||||
|
||||
{% block page_title %}
|
||||
court
|
||||
{% endblock page_title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mb-10">
|
||||
|
||||
{% if items %}
|
||||
|
||||
<div class="mb-5">
|
||||
<div class="relative w-full overflow-auto">
|
||||
<table class="w-full caption-bottom text-sm">
|
||||
<thead class="[&_tr]:border-b">
|
||||
<tr class="border-b transition-colors hover:bg-muted/50">
|
||||
<th class="h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] w-[100px]">
|
||||
{{"name" | capitalize }}
|
||||
</th>
|
||||
<th class="h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] w-[100px]">
|
||||
{{"surface" | capitalize }}
|
||||
</th>
|
||||
<th class="h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] w-[100px]">
|
||||
{{"indoor" | capitalize }}
|
||||
</th>
|
||||
<th class="h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] w-[100px]">
|
||||
Actions
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="[&_tr:last-child]:border-0">
|
||||
{% for item in items %}
|
||||
<tr class="border-b transition-colors hover:bg-muted/50">
|
||||
<td
|
||||
class="p-2 align-middle font-medium">
|
||||
{{item.name | escape }}
|
||||
</td>
|
||||
<td
|
||||
class="p-2 align-middle font-medium">
|
||||
{{item.surface | escape }}
|
||||
</td>
|
||||
<td
|
||||
class="p-2 align-middle font-medium">
|
||||
{{ item.indoor }}
|
||||
</td>
|
||||
<td>
|
||||
<a href="/courts/{{ item.id }}/edit">Edit</a>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="flex">
|
||||
<div class="ml-auto p-4">
|
||||
<a href="/courts/new"
|
||||
class="mt-5 bg-blue-500 text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800">
|
||||
Create
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
|
||||
<div class="mt-10 flex items-center justify-center">
|
||||
<div class="bg-white rounded-lg shadow-lg p-8 max-w-4xl w-full flex flex-col items-center">
|
||||
<h3 class="font-bold text-lg">Nothing Here Yet</h3>
|
||||
There are no records to display. Add a new record to get started!
|
||||
<a href="/courts/new"
|
||||
class="mt-5 bg-blue-500 text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800">
|
||||
Create
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endif %}
|
||||
|
||||
|
||||
</div>
|
||||
{% endblock content %}
|
||||
@@ -1,22 +0,0 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}
|
||||
View court: {{ item.id }}
|
||||
{% endblock title %}
|
||||
|
||||
{% block content %}
|
||||
<h1>View court: {{ item.id }}</h1>
|
||||
<div class="mb-10">
|
||||
<div>
|
||||
<label>name: {{item.name}}</label>
|
||||
</div>
|
||||
<div>
|
||||
<label>surface: {{item.surface}}</label>
|
||||
</div>
|
||||
<div>
|
||||
<label>indoor: {{item.indoor}}</label>
|
||||
</div>
|
||||
<br />
|
||||
<a href="/courts">Back to courts</a>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
@@ -1,12 +0,0 @@
|
||||
<html><body>
|
||||
<img src="/static/image.png" width="200"/>
|
||||
<br/>
|
||||
find this tera template at <code>assets/views/home/hello.html</code>:
|
||||
<br/>
|
||||
<br/>
|
||||
{{ t(key="hello-world", lang="en-US") }},
|
||||
<br/>
|
||||
{{ t(key="hello-world", lang="de-DE") }}
|
||||
|
||||
</body></html>
|
||||
|
||||
@@ -1,181 +0,0 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}ht_booking · Loco SaaS starter{% endblock title %}
|
||||
|
||||
{% block page_title %}What this Loco app gives you out of the box{% endblock page_title %}
|
||||
|
||||
{% block content %}
|
||||
<p class="text-gray-600 max-w-3xl">
|
||||
This page replaces the default Loco fallback screen. Every model, controller,
|
||||
migration and route below was produced by <code class="bg-gray-100 px-1 rounded">cargo loco generate</code> —
|
||||
nothing here is hand-written boilerplate.
|
||||
</p>
|
||||
|
||||
<!-- 1. AUTHENTICATION -->
|
||||
<section class="rounded-xl border border-gray-200 bg-white p-6 shadow-sm mt-4">
|
||||
<h2 class="text-xl font-semibold">1 · Authentication — JWT API</h2>
|
||||
<p class="text-sm text-gray-600 mt-1 max-w-3xl">
|
||||
The SaaS starter ships a complete JWT auth flow in <code class="bg-gray-100 px-1 rounded">src/controllers/auth.rs</code>.
|
||||
It is a JSON API (no HTML login pages) — so here is a live console that calls those exact endpoints.
|
||||
</p>
|
||||
|
||||
<div class="overflow-auto mt-4">
|
||||
<table class="w-full text-sm border-collapse">
|
||||
<thead>
|
||||
<tr class="text-left border-b border-gray-300">
|
||||
<th class="py-1 pr-4">Method</th>
|
||||
<th class="py-1 pr-4">Path</th>
|
||||
<th class="py-1 pr-4">JSON body</th>
|
||||
<th class="py-1">Purpose</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="font-mono text-xs">
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">POST</td><td class="pr-4">/api/auth/register</td><td class="pr-4">name, email, password</td><td class="font-sans">create an account</td></tr>
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">POST</td><td class="pr-4">/api/auth/login</td><td class="pr-4">email, password</td><td class="font-sans">returns a JWT token</td></tr>
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">GET</td><td class="pr-4">/api/auth/current</td><td class="pr-4">— (Bearer token)</td><td class="font-sans">info about the logged-in user</td></tr>
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">POST</td><td class="pr-4">/api/auth/forgot</td><td class="pr-4">email</td><td class="font-sans">start password reset</td></tr>
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">POST</td><td class="pr-4">/api/auth/reset</td><td class="pr-4">token, password</td><td class="font-sans">set a new password</td></tr>
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">GET</td><td class="pr-4">/api/auth/verify/{token}</td><td class="pr-4">—</td><td class="font-sans">verify an email address</td></tr>
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">POST</td><td class="pr-4">/api/auth/magic-link</td><td class="pr-4">email</td><td class="font-sans">email a passwordless login link</td></tr>
|
||||
<tr class="border-b border-gray-100"><td class="py-1 pr-4">GET</td><td class="pr-4">/api/auth/magic-link/{token}</td><td class="pr-4">—</td><td class="font-sans">exchange the link for a JWT</td></tr>
|
||||
<tr><td class="py-1 pr-4">POST</td><td class="pr-4">/api/auth/resend-verification-mail</td><td class="pr-4">email</td><td class="font-sans">resend the verification mail</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="grid md:grid-cols-3 gap-4 mt-6">
|
||||
<form onsubmit="doRegister(event)" class="space-y-2 rounded-lg bg-gray-50 p-4">
|
||||
<h3 class="font-medium">Register</h3>
|
||||
<input name="name" value="Alice" class="w-full rounded border-gray-300 text-sm" placeholder="name">
|
||||
<input name="email" value="alice@example.com" class="w-full rounded border-gray-300 text-sm" placeholder="email">
|
||||
<input name="password" type="password" value="loco-password-123" class="w-full rounded border-gray-300 text-sm" placeholder="password">
|
||||
<button class="w-full rounded bg-blue-600 text-white text-sm py-2 hover:bg-blue-700">POST /register</button>
|
||||
<pre id="register-out" class="text-xs bg-gray-900 text-gray-100 rounded p-2 overflow-auto min-h-[3rem] whitespace-pre-wrap"></pre>
|
||||
</form>
|
||||
|
||||
<form onsubmit="doLogin(event)" class="space-y-2 rounded-lg bg-gray-50 p-4">
|
||||
<h3 class="font-medium">Login</h3>
|
||||
<input name="email" value="alice@example.com" class="w-full rounded border-gray-300 text-sm" placeholder="email">
|
||||
<input name="password" type="password" value="loco-password-123" class="w-full rounded border-gray-300 text-sm" placeholder="password">
|
||||
<button class="w-full rounded bg-blue-600 text-white text-sm py-2 hover:bg-blue-700">POST /login</button>
|
||||
<pre id="login-out" class="text-xs bg-gray-900 text-gray-100 rounded p-2 overflow-auto min-h-[3rem] whitespace-pre-wrap"></pre>
|
||||
</form>
|
||||
|
||||
<div class="space-y-2 rounded-lg bg-gray-50 p-4">
|
||||
<h3 class="font-medium">Current user</h3>
|
||||
<p class="text-xs text-gray-500">Sends the JWT from a successful login as a Bearer token.</p>
|
||||
<button onclick="doCurrent()" class="w-full rounded bg-blue-600 text-white text-sm py-2 hover:bg-blue-700">GET /current</button>
|
||||
<pre id="current-out" class="text-xs bg-gray-900 text-gray-100 rounded p-2 overflow-auto min-h-[3rem] whitespace-pre-wrap"></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="text-xs text-gray-500 mt-3">
|
||||
Active JWT: <code id="token-box" class="bg-gray-100 px-1 rounded break-all"></code>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!-- 2. DATABASE CRUD -->
|
||||
<section class="rounded-xl border border-gray-200 bg-white p-6 shadow-sm mt-4">
|
||||
<h2 class="text-xl font-semibold">2 · Database CRUD — Courts</h2>
|
||||
<p class="text-sm text-gray-600 mt-1 max-w-3xl">
|
||||
A model, SeaORM entity, migration, controller and Tera views, all generated with one command:
|
||||
</p>
|
||||
<pre class="text-xs bg-gray-900 text-gray-100 rounded p-3 mt-2 overflow-auto">cargo loco generate scaffold court name:string surface:string indoor:bool --html</pre>
|
||||
<a href="/courts" class="inline-block mt-3 rounded bg-emerald-600 text-white text-sm px-4 py-2 hover:bg-emerald-700">Open /courts →</a>
|
||||
</section>
|
||||
|
||||
<!-- 3. HEALTH -->
|
||||
<section class="rounded-xl border border-gray-200 bg-white p-6 shadow-sm mt-4">
|
||||
<h2 class="text-xl font-semibold">3 · Health & ops endpoints</h2>
|
||||
<p class="text-sm text-gray-600 mt-1">Built-in, no code needed:</p>
|
||||
<ul class="list-disc list-inside text-sm mt-2 space-y-1">
|
||||
<li><a class="text-blue-600 underline" href="/_ping">/_ping</a> — liveness</li>
|
||||
<li><a class="text-blue-600 underline" href="/_health">/_health</a> — DB & queue health</li>
|
||||
<li><a class="text-blue-600 underline" href="/_readiness">/_readiness</a> — readiness probe</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<!-- 4. VIEWS + I18N -->
|
||||
<section class="rounded-xl border border-gray-200 bg-white p-6 shadow-sm mt-4">
|
||||
<h2 class="text-xl font-semibold">4 · Server-side views & i18n</h2>
|
||||
<p class="text-sm text-gray-600 mt-1 max-w-3xl">
|
||||
Tera templates plus Fluent translations. The same key <code class="bg-gray-100 px-1 rounded">hello-world</code>,
|
||||
resolved by the <code class="bg-gray-100 px-1 rounded">t()</code> function in this template:
|
||||
</p>
|
||||
<ul class="list-disc list-inside text-sm mt-2 space-y-1">
|
||||
<li><strong>en-US:</strong> {{ t(key="hello-world", lang="en-US") }}</li>
|
||||
<li><strong>de-DE:</strong> {{ t(key="hello-world", lang="de-DE") }}</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<!-- 5. MORE -->
|
||||
<section class="rounded-xl border border-gray-200 bg-white p-6 shadow-sm mt-4 mb-8">
|
||||
<h2 class="text-xl font-semibold">5 · Also wired up (CLI-generated when you need them)</h2>
|
||||
<ul class="list-disc list-inside text-sm mt-2 space-y-1">
|
||||
<li>Background workers — <code class="bg-gray-100 px-1 rounded">cargo loco generate worker <name></code></li>
|
||||
<li>Scheduled / one-off tasks — <code class="bg-gray-100 px-1 rounded">cargo loco generate task <name></code></li>
|
||||
<li>Mailers — <code class="bg-gray-100 px-1 rounded">cargo loco generate mailer <name></code> (the auth flow already uses one)</li>
|
||||
<li>Inspect every route — <code class="bg-gray-100 px-1 rounded">cargo loco routes</code></li>
|
||||
</ul>
|
||||
</section>
|
||||
{% endblock content %}
|
||||
|
||||
{% block js %}
|
||||
{% raw %}
|
||||
<script>
|
||||
const show = (id, status, body) => {
|
||||
document.getElementById(id).textContent =
|
||||
'HTTP ' + status + '\n' + (body && body.length ? body : '(empty body)');
|
||||
};
|
||||
|
||||
let jwt = sessionStorage.getItem('jwt') || '';
|
||||
const renderToken = () => {
|
||||
document.getElementById('token-box').textContent = jwt ? jwt : '(none yet — log in)';
|
||||
};
|
||||
|
||||
async function doRegister(e) {
|
||||
e.preventDefault();
|
||||
const fd = new FormData(e.target);
|
||||
const res = await fetch('/api/auth/register', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ name: fd.get('name'), email: fd.get('email'), password: fd.get('password') })
|
||||
});
|
||||
const body = await res.text();
|
||||
show('register-out', res.status, body || '(empty body = account created; welcome email queued)');
|
||||
}
|
||||
|
||||
async function doLogin(e) {
|
||||
e.preventDefault();
|
||||
const fd = new FormData(e.target);
|
||||
const res = await fetch('/api/auth/login', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ email: fd.get('email'), password: fd.get('password') })
|
||||
});
|
||||
const body = await res.text();
|
||||
if (res.ok) {
|
||||
try {
|
||||
jwt = JSON.parse(body).token;
|
||||
sessionStorage.setItem('jwt', jwt);
|
||||
renderToken();
|
||||
} catch (err) { /* non-JSON body */ }
|
||||
}
|
||||
show('login-out', res.status, body);
|
||||
}
|
||||
|
||||
async function doCurrent() {
|
||||
if (!jwt) {
|
||||
document.getElementById('current-out').textContent = 'Log in first to obtain a JWT.';
|
||||
return;
|
||||
}
|
||||
const res = await fetch('/api/auth/current', {
|
||||
headers: { 'Authorization': 'Bearer ' + jwt }
|
||||
});
|
||||
show('current-out', res.status, await res.text());
|
||||
}
|
||||
|
||||
renderToken();
|
||||
</script>
|
||||
{% endraw %}
|
||||
{% endblock js %}
|
||||
Reference in New Issue
Block a user