Listing all reservations

templates/admin-all-reservations.page.tmpl

@@ -1,12 +1,53 @@
 {{template "admin" .}}
 
+{{define "css"}}
+<link href="https://cdn.jsdelivr.net/npm/simple-datatables@latest/dist/style.css" rel="stylesheet" type="text/css">
+{{end}}
+
 {{define "page-title"}}
 All Reservations
 {{end}}
 
 {{define "content"}}
 <div class="col-md-12">
-  All Reservations content
+    {{$res := index .Data "reservations"}}
+    <table class="table table-striped table-hover" id="all-res">
+        <thead>
+            <tr>
+                <th>ID</th>
+                <th>Last Name</th>
+                <th>Room</th>
+                <th>Arrival</th>
+                <th>Departure</th>
+            </tr>
+        </thead>
+        <tbody>
+            {{range $res}}
+            <tr>
+                <td>{{ .ID}}</td>
+                <td>
+                    <a href="/admin/reservations/all/{{.ID}}">
+                        {{ .LastName}}
+                    </a>
+                </td>
+                <td>{{ .Room.RoomName}}</td>
+                <td>{{humanDate .StartDate}}</td>
+                <td>{{humanDate .EndDate}}</td>
+            </tr>
+            {{end}}
+        </tbody>
+    </table>
 </div>
 {{end}}
 
+{{define "js"}}
+<script src="https://cdn.jsdelivr.net/npm/simple-datatables@latest" type="text/javascript"></script>
+<script>
+document.addEventListener("DOMContentLoaded", function() {
+    const dataTable = new simpleDatatables.DataTable("#all-res", {
+        select: 3, sort: "desc",
+    });
+})
+</script>
+{{end}}
+

templates/admin.layout.tmpl

@@ -18,6 +18,11 @@
   <!-- endinject -->
   <link rel="shortcut icon" href="/static/admin/images/favicon.png" />
 
+  <style>
+      .content-wrapper {
+      background-color: white;
+      }
+  </style>
   {{block "css" .}}
 
   {{end}}