what does loco offers

ht_booking/assets/views/court/create.html

@@ -0,0 +1,37 @@
+{% 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 %}

ht_booking/assets/views/court/edit.html

@@ -0,0 +1,42 @@
+{% 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 %}

ht_booking/assets/views/court/list.html

@@ -0,0 +1,86 @@
+{% 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="[&amp;_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 [&amp;:has([role=checkbox])]:pr-0 [&amp;>[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 [&amp;:has([role=checkbox])]:pr-0 [&amp;>[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 [&amp;:has([role=checkbox])]:pr-0 [&amp;>[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 [&amp;:has([role=checkbox])]:pr-0 [&amp;>[role=checkbox]]:translate-y-[2px] w-[100px]">
+                           Actions
+                        </th>
+                    </tr>
+                </thead>
+                <tbody class="[&amp;_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 %}

ht_booking/assets/views/court/show.html

@@ -0,0 +1,22 @@
+{% 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 %}