1

templates/admin/rooms.html

@@ -0,0 +1,114 @@
+<div>
+
+    <div class="flex justify-between items-center mb-4">
+
+        <h2 class="text-2xl font-bold">
+            Rooms
+        </h2>
+
+    </div>
+
+    <div class="grid grid-cols-3 gap-4">
+
+        {% for r in rooms %}
+
+        <div class="bg-gray-900 p-4 rounded-xl border border-gray-800">
+
+            <div class="flex justify-between items-center">
+
+                <div>
+
+                    <div class="font-bold text-xl">
+                        {{ r.room }}
+                    </div>
+
+                    <div class="text-gray-400 text-sm">
+                        Current Occupancy:
+                        {{ r.count }}
+                    </div>
+
+                </div>
+
+                {% if r.bathroom %}
+                    <span class="bg-blue-700 px-2 py-1 rounded text-sm">
+                        Bathroom Tracking
+                    </span>
+                {% endif %}
+
+            </div>
+
+            <form
+                hx-post="/admin/room/update/{{ r.id }}"
+                hx-target="#content"
+                class="mt-4 space-y-3"
+            >
+
+                <!-- MAX OCCUPANCY -->
+
+                <div>
+
+                    <label class="block text-sm mb-1">
+                        Max Occupancy
+                    </label>
+
+                    <input
+                        type="number"
+                        name="max"
+                        value="{{ r.max }}"
+                        class="bg-gray-800 p-2 rounded w-full"
+                    >
+
+                </div>
+
+                <!-- BATHROOM GROUP -->
+
+                <div>
+
+                    <label class="block text-sm mb-1">
+                        Bathroom Group ID
+                    </label>
+
+                    <input
+                        type="text"
+                        name="bathroom_id"
+                        value="{{ r.bathroom_id }}"
+                        placeholder="example: floor2_west"
+                        class="bg-gray-800 p-2 rounded w-full"
+                    >
+
+                </div>
+
+                <!-- TRACK BATHROOM -->
+
+                <div class="flex items-center gap-2">
+
+                    <input
+                        type="checkbox"
+                        name="bathroom"
+                        {% if r.bathroom %}
+                            checked
+                        {% endif %}
+                        class="w-5 h-5"
+                    >
+
+                    <label>
+                        Track Bathroom Usage
+                    </label>
+
+                </div>
+
+                <button
+                    class="bg-blue-700 hover:bg-blue-600 px-4 py-2 rounded w-full"
+                >
+                    Save Room
+                </button>
+
+            </form>
+
+        </div>
+
+        {% endfor %}
+
+    </div>
+
+</div>