Initial commit
This commit is contained in:
Ronald Huynen
290
resources/views/livewire/reserve-button.blade.php
Normal file
290
resources/views/livewire/reserve-button.blade.php
Normal file
@@ -0,0 +1,290 @@
|
||||
<div>
|
||||
@if ($canReserve || $hasReserved || $isGuest)
|
||||
<div class="md:self-end">
|
||||
@if ($isGuest)
|
||||
<!-- Guest - Show Reserve Button with Login Redirect -->
|
||||
<div class="mb-3 text-sm">
|
||||
{{ __('Attendance') }}
|
||||
</div>
|
||||
<div class="flex gap-3">
|
||||
<button
|
||||
onclick="window.location.href = '{{ route('login') }}?redirect=' + encodeURIComponent(window.location.href)"
|
||||
class="inline-flex items-center px-4 py-2 bg-theme-brand border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-opacity-90 focus:bg-opacity-90 active:bg-opacity-90 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-25 transition ease-in-out duration-150"
|
||||
>
|
||||
{{ __('Reserve a spot') }}
|
||||
</button>
|
||||
</div>
|
||||
@if ($reservationCount >= timebank_config('reactions.reserve.count_public_threshold', 5))
|
||||
<div class="mt-2 text-sm text-theme-secondary">
|
||||
{{ $reservationCount }} {{ $reservationCount === 1 ? __('reservation') : __('reservations') }}
|
||||
</div>
|
||||
@endif
|
||||
@elseif ($hasReserved)
|
||||
<!-- Already Reserved - Show Cancel Button -->
|
||||
<div class="mb-3 text-sm">{{ __('You have reserved') }}</div>
|
||||
<div class="flex gap-3">
|
||||
<x-jetstream.secondary-button
|
||||
wire:click="openCancelModal"
|
||||
wire:loading.attr="disabled"
|
||||
>
|
||||
{{ __('Cancel your reservation') }}
|
||||
</x-jetstream.secondary-button>
|
||||
|
||||
@if($isOrganizer && $reservationCount > 0)
|
||||
<x-jetstream.secondary-button
|
||||
wire:click="openReservationsModal"
|
||||
wire:loading.attr="disabled"
|
||||
>
|
||||
{{ __('List') }}
|
||||
</x-jetstream.secondary-button>
|
||||
@endif
|
||||
</div>
|
||||
@else
|
||||
<!-- Not Reserved - Show Reserve Button -->
|
||||
<div class="mb-3 text-sm">
|
||||
{{ __('Attendance') }}
|
||||
</div>
|
||||
<div class="flex gap-3">
|
||||
<x-jetstream.button
|
||||
wire:click="openConfirmModal"
|
||||
wire:loading.attr="disabled"
|
||||
class="bg-theme-brand hover:bg-opacity-90"
|
||||
>
|
||||
{{ __('Reserve a spot') }}
|
||||
</x-jetstream.button>
|
||||
|
||||
@if($isOrganizer && $reservationCount > 0)
|
||||
<x-jetstream.secondary-button
|
||||
wire:click="openReservationsModal"
|
||||
wire:loading.attr="disabled"
|
||||
>
|
||||
{{ __('List') }}
|
||||
</x-jetstream.secondary-button>
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if ($reservationCount >= timebank_config('reactions.reserve.count_public_threshold', 5))
|
||||
<div class="mt-2 text-sm text-theme-secondary">
|
||||
{{ $reservationCount }} {{ $reservationCount === 1 ? __('reservation') : __('reservations') }}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!-- Reservation Confirmation Modal -->
|
||||
<x-jetstream.dialog-modal wire:model.live="showConfirmModal" maxWidth="2xl">
|
||||
<x-slot name="title">
|
||||
{{ __('Confirm reservation') }}
|
||||
</x-slot>
|
||||
|
||||
<x-slot name="content">
|
||||
<div class="space-y-4">
|
||||
<p class="text-theme-primary">{{ __('Are you sure you want to reserve a spot for this event?') }}</p>
|
||||
|
||||
@if($post && $post->translations->first())
|
||||
<div class="bg-theme-surface rounded-lg p-4 border">
|
||||
<table class="w-full">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Event') }}</td>
|
||||
<td class="py-2 text-theme-primary">{{ $post->translations->first()->title }}</td>
|
||||
</tr>
|
||||
|
||||
@if(isset($post->meeting))
|
||||
@if($post->meeting->venue)
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Location') }}</td>
|
||||
<td class="py-2 text-theme-primary">{{ $post->meeting->venue }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if($post->meeting->address)
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Address') }}</td>
|
||||
<td class="py-2 text-theme-primary">
|
||||
<a href="https://www.openstreetmap.org/search?query={{ urlencode($post->meeting->address) }}"
|
||||
target="_blank"
|
||||
class="underline hover:text-theme-secondary">
|
||||
{{ $post->meeting->address }}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if($post->meeting->from)
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Date & Time') }}</td>
|
||||
<td class="py-2 text-theme-primary">{{ \Illuminate\Support\Carbon::parse($post->meeting->from)->isoFormat('dddd D MMMM YYYY, H:mm') }} {{ __('hour') }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</x-slot>
|
||||
|
||||
<x-slot name="footer">
|
||||
<x-jetstream.secondary-button no-spinner wire:click="$set('showConfirmModal', false)">
|
||||
{{ __('Cancel') }}
|
||||
</x-jetstream.secondary-button>
|
||||
|
||||
<x-jetstream.button wire:click="confirmReservation" class="ml-3 bg-theme-brand">
|
||||
{{ __('Confirm reservation') }}
|
||||
</x-jetstream.button>
|
||||
</x-slot>
|
||||
</x-jetstream.dialog-modal>
|
||||
|
||||
<!-- Cancellation Confirmation Modal -->
|
||||
<x-jetstream.dialog-modal wire:model.live="showCancelModal" maxWidth="2xl">
|
||||
<x-slot name="title">
|
||||
{{ __('Cancel reservation') }}
|
||||
</x-slot>
|
||||
|
||||
<x-slot name="content">
|
||||
<div class="space-y-4">
|
||||
<p class="text-theme-primary">{{ __('Are you sure you want to cancel your reservation for this event?') }}</p>
|
||||
|
||||
@if($post && $post->translations->first())
|
||||
<div class="bg-theme-surface rounded-lg p-4 border">
|
||||
<table class="w-full">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Event') }}</td>
|
||||
<td class="py-2 text-theme-primary">{{ $post->translations->first()->title }}</td>
|
||||
</tr>
|
||||
|
||||
@if(isset($post->meeting))
|
||||
@if($post->meeting->venue)
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Location') }}</td>
|
||||
<td class="py-2 text-theme-primary">{{ $post->meeting->venue }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if($post->meeting->address)
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Address') }}</td>
|
||||
<td class="py-2 text-theme-primary">
|
||||
<a href="https://www.openstreetmap.org/search?query={{ urlencode($post->meeting->address) }}"
|
||||
target="_blank"
|
||||
class="underline hover:text-theme-secondary">
|
||||
{{ $post->meeting->address }}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
@if($post->meeting->from)
|
||||
<tr>
|
||||
<td class="py-2 pr-4 font-semibold text-theme-primary w-1/3">{{ __('Date & Time') }}</td>
|
||||
<td class="py-2 text-theme-primary">{{ \Illuminate\Support\Carbon::parse($post->meeting->from)->isoFormat('dddd D MMMM YYYY, H:mm') }} {{ __('hour') }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</x-slot>
|
||||
|
||||
<x-slot name="footer">
|
||||
<x-jetstream.secondary-button no-spinner wire:click="$set('showCancelModal', false)">
|
||||
{{ __('Keep reservation') }}
|
||||
</x-jetstream.secondary-button>
|
||||
|
||||
<x-jetstream.button wire:click="confirmCancellation" class="ml-3">
|
||||
{{ __('Cancel reservation') }}
|
||||
</x-jetstream.button>
|
||||
</x-slot>
|
||||
</x-jetstream.dialog-modal>
|
||||
|
||||
<!-- Reservations List Modal (Organizer Only) -->
|
||||
<x-jetstream.dialog-modal wire:model.live="showReservationsModal" maxWidth="2xl" closeButton="true">
|
||||
<x-slot name="title">
|
||||
{{ __('Reservations') }} ({{ $reservationCount }})
|
||||
</x-slot>
|
||||
|
||||
<x-slot name="content">
|
||||
<div class="space-y-4">
|
||||
@foreach(['App\\Models\\User' => __('Users'), 'App\\Models\\Organization' => __('Organizations'), 'App\\Models\\Bank' => __('Banks'), 'App\\Models\\Admin' => __('Admins')] as $type => $label)
|
||||
@php
|
||||
$reacters = $reservationsByType[$type] ?? [];
|
||||
@endphp
|
||||
@if(count($reacters) > 0)
|
||||
<div class="space-y-2">
|
||||
<h4 class="text-sm font-medium text-theme-secondary">{{ $label }} ({{ count($reacters) }})</h4>
|
||||
<div class="space-y-2">
|
||||
@foreach($reacters as $reacter)
|
||||
<div class="flex items-center space-x-3 py-2">
|
||||
@if($reacter->profile_photo_path)
|
||||
<img class="h-10 w-10 rounded-full profile-photo object-cover"
|
||||
src="{{ url(Storage::url($reacter->profile_photo_path)) }}"
|
||||
alt="{{ $reacter->name }}">
|
||||
@else
|
||||
<div class="h-10 w-10 rounded-full bg-theme-primary flex items-center justify-center text-white font-semibold">
|
||||
{{ substr($reacter->name, 0, 1) }}
|
||||
</div>
|
||||
@endif
|
||||
<div class="flex-1">
|
||||
<div class="text-sm font-medium text-theme-primary">
|
||||
<a href="{{ url(strtolower(class_basename($reacter)) . '/' . $reacter->id) }}"
|
||||
class="hover:underline">
|
||||
{{ $reacter->name }}
|
||||
</a>
|
||||
</div>
|
||||
@php
|
||||
$location = method_exists($reacter, 'getLocationFirst') ? $reacter->getLocationFirst() : null;
|
||||
@endphp
|
||||
@if($location && isset($location['name_short']))
|
||||
<div class="text-xs text-theme-secondary">{{ $location['name_short'] }}</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
@if($reservationCount > 0)
|
||||
<!-- Message All Reserved Participants -->
|
||||
<div class="mt-6 pt-6 border-t border-theme-primary">
|
||||
<h4 class="text-sm font-medium text-theme-secondary mb-3">{{ __('Send an update to all participants') }}</h4>
|
||||
<div class="space-y-3">
|
||||
<x-textarea
|
||||
wire:model.live="messageToReserved"
|
||||
rows="4"
|
||||
maxlength="300"
|
||||
placeholder="{{ __('Enter your message (max 300 characters)') }}"
|
||||
class="mt-1 block w-full border-gray-300 rounded-md shadow-sm"
|
||||
/>
|
||||
|
||||
<div class="flex justify-between items-center">
|
||||
<span class="text-xs text-theme-secondary">
|
||||
{{ strlen($messageToReserved ?? '') }}/300 {{ __('characters') }}
|
||||
</span>
|
||||
<x-jetstream.button
|
||||
wire:click="sendMessageToReserved"
|
||||
wire:loading.attr="disabled"
|
||||
class="bg-theme-brand"
|
||||
>
|
||||
{{ __('Send Message') }}
|
||||
</x-jetstream.button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</x-slot>
|
||||
|
||||
<x-slot name="footer">
|
||||
<x-jetstream.secondary-button no-spinner wire:click="$set('showReservationsModal', false)">
|
||||
{{ __('Close') }}
|
||||
</x-jetstream.secondary-button>
|
||||
</x-slot>
|
||||
</x-jetstream.dialog-modal>
|
||||
</div>
|
||||
Reference in New Issue
Block a user