mannpatel/Poll-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update: Few issues to resolve see readme

Browse Source 
this push will conclude the majority of pulls. this repos will now, not be actively be managed or any further code pushes will not be frequent.
This commit is contained in:
Mann Patel
2025-09-11 16:54:30 -06:00
parent 144436bbf3
commit b21e76eed0
19 changed files with 1953 additions and 1442 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
app/internal/templates/volunteer_schedule.html Normal file
View File

@@ -0,0 +1,134 @@
{{ define "content" }}
<div class="flex-1 flex flex-col overflow-hidden">
<!-- Toolbar -->
<div class="bg-white border-b border-gray-200 px-4 md:px-6 py-4 flex justify-between items-center">
<h1 class="text-lg font-semibold text-gray-900">My Schedule</h1>
<button
onclick="openAddAvailabilityPanel()"
class="px-4 py-2 bg-blue-500 text-white text-sm font-medium rounded-lg hover:bg-blue-600 transition-colors"
>
<i class="fas fa-plus mr-2"></i> Add Availability
</button>
</div>
<!-- Table Container -->
<div class="flex-1 p-4 md:p-6 overflow-auto">
<div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden">
<!-- Desktop Table -->
<div class="hidden lg:block overflow-x-auto">
<table class="w-full min-w-full">
<thead class="bg-gray-50 border-b border-gray-200">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider whitespace-nowrap">Day</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider whitespace-nowrap">Start Time</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider whitespace-nowrap">End Time</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider whitespace-nowrap">Actions</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-100">
{{ range .Availability }}
<tr class="hover:bg-gray-50">
<td class="px-6 py-4 text-sm text-gray-900">{{ .DayOfWeek }}</td>
<td class="px-6 py-4 text-sm text-gray-900">{{ .StartTime }}</td>
<td class="px-6 py-4 text-sm text-gray-900">{{ .EndTime }}</td>
<td class="px-6 py-4">
<form method="POST" action="/volunteer/schedule/delete" class="inline-block">
<input type="hidden" name="id" value="{{.AvailabilityID}}" />
<button type="submit" class="text-red-500 hover:text-red-700 p-1" title="Delete">
<i class="fas fa-trash"></i>
</button>
</form>
</td>
</tr>
{{ else }}
<tr>
<td colspan="4" class="px-6 py-8 text-center text-gray-500">
No availability set yet
</td>
</tr>
{{ end }}
</tbody>
</table>
</div>
<!-- Mobile Cards -->
<div class="lg:hidden p-4 space-y-4">
{{ range .Availability }}
<div class="bg-white border border-gray-200 rounded-lg shadow-sm p-4 space-y-3">
<div class="flex justify-between">
<span class="text-sm font-semibold text-gray-900">{{ .DayOfWeek }}</span>
<form method="POST" action="/volunteer/schedule/delete">
<input type="hidden" name="id" value="{{.AvailabilityID}}" />
<button type="submit" class="text-red-500 hover:text-red-700">
<i class="fas fa-trash"></i>
</button>
</form>
</div>
<div class="flex justify-between text-sm text-gray-600">
<span>Start</span>
<span class="font-medium text-gray-900">{{ .StartTime }}</span>
</div>
<div class="flex justify-between text-sm text-gray-600">
<span>End</span>
<span class="font-medium text-gray-900">{{ .EndTime }}</span>
</div>
</div>
{{ else }}
<div class="text-center py-8 text-gray-500">No availability set yet</div>
{{ end }}
</div>
</div>
</div>
</div>
<!-- Add Availability Drawer -->
<div id="addAvailabilityOverlay" class="fixed inset-0 bg-black bg-opacity-50 hidden z-40"></div>
<div id="addAvailabilityPanel" class="fixed top-0 right-0 h-full w-full max-w-md bg-white shadow-xl transform translate-x-full transition-transform duration-300 ease-in-out z-50 flex flex-col">
<!-- Panel Header -->
<div class="flex justify-between items-center px-6 py-4 border-b border-gray-200 bg-gray-50">
<h2 class="text-lg font-semibold text-gray-900">Add Availability</h2>
<button onclick="closeAddAvailabilityPanel()" class="text-gray-400 hover:text-gray-600">
<i class="fas fa-times text-xl"></i>
</button>
</div>
<!-- Panel Body -->
<form method="POST" id="assignForm" action="/volunteer/schedule/post" class="flex-1 p-6 space-y-6">
<div>
<label class="block text-sm font-medium text-gray-700 mb-2">Day</label>
<input type="date" name="day" required class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500" />
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-2">Start Time</label>
<input type="time" name="start_time" required class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500" />
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-2">End Time</label>
<input type="time" name="end_time" required class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500" />
</div>
</form>
<!-- Panel Footer -->
<div class="flex justify-end gap-3 px-6 py-4 border-t border-gray-200 bg-gray-50">
<button type="button" onclick="closeAddAvailabilityPanel()" class="px-6 py-2 border border-gray-300 text-gray-700 bg-white rounded-lg hover:bg-gray-50">Cancel</button>
<button type="submit" form="assignForm" class="px-6 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
<i class="fas fa-check mr-2"></i> Save
</button>
</div>
</div>
<script>
function openAddAvailabilityPanel() {
document.getElementById("addAvailabilityOverlay").classList.remove("hidden");
document.getElementById("addAvailabilityPanel").classList.remove("translate-x-full");
}
function closeAddAvailabilityPanel() {
document.getElementById("addAvailabilityOverlay").classList.add("hidden");
document.getElementById("addAvailabilityPanel").classList.add("translate-x-full");
}
document.getElementById("addAvailabilityOverlay").addEventListener("click", closeAddAvailabilityPanel);
document.addEventListener("keydown", function (e) {
if (e.key === "Escape") closeAddAvailabilityPanel();
});
</script>
{{ end }}