auditionadmin/resources/views/admin/rooms/judge_assignments.blade.php

116 lines
6.7 KiB
PHP

<x-layout.app>
<ul class="grid md:grid-cols-4 gap-5">
@foreach($rooms as $room)
@if($room->id == 0)
@continue
@endif
<li class=" rounded-xl border border-gray-200 bg-gray-50 "> {{-- card wrapper --}}
<div class="flex items-center gap-x-4 border-b border-gray-900/5 bg-white pt-2 pb-6 px-6"> {{-- card header --}}
<div class="text-sm font-medium leading-6 text-gray-900">
<p class="text-sm font-medium leading-6 text-gray-900">{{ $room->name }}</p>
<p class="mt-1 text-xs leading-5 text-gray-500">{{ $room->description }}</p>
</div>
<div class="relative ml-auto" x-data="{ open: false }"> {{-- Auditions Dropdown --}}
<button type="button"
class="-m-2.5 block p-2.5 text-gray-400 hover:text-gray-500"
id="options-menu-0-button"
aria-expanded="false"
aria-haspopup="true"
x-on:click="open = ! open">
<span class="sr-only">Open details</span>
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path
d="M3 10a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zM8.5 10a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zM15.5 8.5a1.5 1.5 0 100 3 1.5 1.5 0 000-3z"/>
</svg>
</button>
<!--
Dropdown menu, show/hide based on menu state.
Entering: "transition ease-out duration-100"
From: "transform opacity-0 scale-95"
To: "transform opacity-100 scale-100"
Leaving: "transition ease-in duration-75"
From: "transform opacity-100 scale-100"
To: "transform opacity-0 scale-95"
-->
<div
class="absolute right-5 -top-4 z-10 mt-0.5 w-32 origin-top-right rounded-md bg-white py-0.5 shadow-lg ring-1 ring-gray-900/5 focus:outline-none overflow-y-auto max-h-64"
role="menu"
aria-orientation="vertical"
aria-labelledby="options-menu-0-button"
tabindex="-1"
x-show="open"
x-cloak>
<!-- Active: "bg-gray-50", Not Active: "" -->
@foreach($room->auditions as $audition)
<p class="block px-3 py-0.5 text-xs leading-6 text-gray-900">{{ $audition->name }}</p>
@endforeach
</div>
</div>
</div> {{-- End Card Header --}}
<dl class="-my-3 divide-y divide-gray-100 px-6 pb-4 pt-1 text-sm leading-6 bg-gray-50"> {{-- Judge Listing --}}
@foreach($room->judges as $judge)
<div class="flex justify-between items-center gap-x-4 py-1"> {{-- Judge Line --}}
<dt>
<p>
<span class="text-gray-700">{{ $judge->full_name() }}, </span>
<span class="text-gray-500 text-xs">{{ $judge->school->name }}</span>
</p>
<p class="text-gray-500 text-xs">{{ $judge->judging_preference }}</p>
</dt>
<dd class="text-gray-500 text-xs">
<form method="POST" action="/admin/rooms/{{ $room->id }}/judge" id="removeJudgeFromRoom{{ $room->id }}">
@csrf
@method('DELETE')
<input type="hidden" name="judge" value="{{ $judge->id }}">
<button>
<svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path stroke="#d1d5db" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m15 9-6 6m0-6 6 6m6-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"/>
</svg>
</button>
</form>
</dd>
</div>
@endforeach
<div class="pt-3"> {{-- Add Judge Form --}}
<form method="POST" action="/admin/rooms/{{ $room->id }}/judge" id="assignJudgeToRoom{{ $room->id }}">
@csrf
<select name="judge"
id="judge"
class="block w-full rounded-md border-0 py-1.5 pl-3 pr-10 text-gray-900 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-indigo-600 sm:text-sm sm:leading-6"
onchange="document.getElementById('assignJudgeToRoom{{ $room->id }}').submit()">
<option>Add a judge</option>
<optgroup label="Unassigned Judges">
@foreach($usersWithoutRooms as $judge) {{-- skip judges alrady assigned to this audition --}}
<option value="{{ $judge->id }}">{{ $judge->full_name() }}
- {{ $judge->judging_preference }}</option>
@endforeach
</optgroup>
<optgroup label="Judges with assignments">
@foreach($usersWithRooms as $judge)
@if($room->judges->contains($judge->id))
@continue
@endif
<option value="{{ $judge->id }}">{{ $judge->full_name() }}
- {{ $judge->judging_preference }}</option>
@endforeach
</optgroup>
</select>
</form>
</div>
</dl>
</li>
@endforeach
</ul>
</x-layout.app>