115 lines
3.4 KiB
HTML
115 lines
3.4 KiB
HTML
{{ define "content" }}
|
|
<div class="min-h-screen bg-gray-50">
|
|
<!-- Top Navigation -->
|
|
<div class="bg-white border-b border-gray-200 px-6 py-3">
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-center gap-2">
|
|
<i
|
|
class="{{if .PageIcon}}{{.PageIcon}}{{else}}fas fa-users{{end}} text-blue-600"
|
|
></i>
|
|
<span class="text-sm font-medium">Volunteer Management</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Main Content -->
|
|
<div class="p-6 space-y-6">
|
|
{{range .TeamLeads}} {{ $teamLeadID := .ID }}
|
|
<!-- store team lead ID -->
|
|
|
|
<div class="bg-white border border-gray-200 shadow-sm">
|
|
<!-- Team Lead Header -->
|
|
<div
|
|
class="flex justify-between items-center px-4 py-3 border-b border-gray-200"
|
|
>
|
|
<div class="flex items-center space-x-3">
|
|
<i class="fas fa-user-tie text-blue-600"></i>
|
|
<span class="font-semibold text-gray-900">{{.Name}}</span>
|
|
</div>
|
|
<form
|
|
action="/team_builder"
|
|
method="POST"
|
|
class="flex items-center space-x-3"
|
|
>
|
|
<input type="hidden" name="team_lead_id" value="{{.ID}}" />
|
|
|
|
<select
|
|
name="volunteer_id"
|
|
class="px-3 py-2 border border-gray-300 bg-white text-gray-700 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500"
|
|
>
|
|
<option value="">--Select Volunteer--</option>
|
|
{{range $.UnassignedVolunteers}}
|
|
<option value="{{.ID}}">{{.Name}}</option>
|
|
{{end}}
|
|
</select>
|
|
<button
|
|
type="submit"
|
|
class="px-4 py-2 bg-blue-600 text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 font-medium"
|
|
>
|
|
<i class="fas fa-plus mr-2"></i> Add
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Assigned Volunteers -->
|
|
<div class="px-6 py-4">
|
|
{{if .Volunteers}}
|
|
<ul class="space-y-2">
|
|
{{range .Volunteers}}
|
|
<li
|
|
class="flex items-center justify-between text-gray-800 border-b border-gray-200 py-2"
|
|
>
|
|
<div class="flex items-center space-x-2">
|
|
<i class="fas fa-user text-gray-500"></i>
|
|
<span>{{.Name}}</span>
|
|
</div>
|
|
<form
|
|
action="/team_builder/remove_volunteer"
|
|
method="POST"
|
|
class="flex-shrink-0"
|
|
>
|
|
<input
|
|
type="hidden"
|
|
name="team_lead_id"
|
|
value="{{ $teamLeadID }}"
|
|
/>
|
|
<input type="hidden" name="volunteer_id" value="{{.ID}}" />
|
|
<button
|
|
type="submit"
|
|
aria-label="Remove {{.Name}}"
|
|
class="px-3 py-1 bg-red-600 text-white hover:bg-red-700 focus:outline-none focus:ring-1 focus:ring-red-500"
|
|
>
|
|
<i class="fas fa-times"></i> Remove
|
|
</button>
|
|
</form>
|
|
</li>
|
|
{{end}}
|
|
</ul>
|
|
{{else}}
|
|
<p class="text-gray-500 italic">No volunteers assigned yet.</p>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
/* Square corners across UI */
|
|
* {
|
|
border-radius: 0 !important;
|
|
}
|
|
|
|
input,
|
|
select,
|
|
button {
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
button {
|
|
font-weight: 500;
|
|
letter-spacing: 0.025em;
|
|
}
|
|
</style>
|
|
{{ end }}
|