@extends("app.layout.base") @section("title") Aktiviteter @endsection @section("content") <style> div.card { margin-top: 1rem; margin-bottom: 30px; width: auto; heigt: auto; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } div.header { background-color: #00788a; color: white; padding: 8px; font-size: 10px; text-align: center; } div.container { padding: 8px; text-align: justify; line-height: 1.5; } ol { padding-right: 8px; } </style> <main> <h1 class="text-center sde-blue mb-0" style="margin-bottom: 2rem">{{__('msg.tilmeldteaktiviteter')}}</h1> {!! session()->get('eventunsubscribed') !!} @if(!$userevents->isEmpty()) @foreach($userevents as $userevent) <form method="post" action="{{ route("userevents.destroy", $userevent) }}"> @csrf @method("delete") <div class="card"> @if($userevent->resource_id !== null) <div class="header" style="background-size: cover; background-image: url('{{ asset(\App\Resource::query()->where("id", "=", $userevent->resource_id)->first()->filename) }}');"> <h3 style="text-shadow: 2px 2px 2px #00788A;">{{ $userevent->name }}</h3> <p style="text-shadow: 2px 2px 2px #00788A"; class="text-center mt-0">{{__('msg.af')}}: {{ $userevent->accountable }}</p> <p style="text-shadow: 2px 2px 2px #00788A"; class="text-center mt-0">{{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime($userevent->date))->format('d/m/Y \k\l\. H:i') }}</p> </div> @else <div class="header"> <h3>{{ $userevent->name }}</h3> <p class="text-center mt-0">{{__('msg.af')}}: {{ $userevent->accountable }}</p> <p class="text-center mt-0">{{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime($userevent->date))->format('d/m/Y \k\l\. H:i') }}</p> </div> @endif <div class="container"> <div class="row" style="justify-content: space-between;"> @if (count(\App\UserEvent::query()->where('event_id', '=', $userevent->id)->where('user_id', '=', Auth::user()->id)->get()) > 0) <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="javascript:void(0);" onclick="ajaxCall({{ $userevent->id }}, this)" id="t">{{__('msg.afmeld')}}</a> @else {{-- ^ If you're already participating in the event, then show a ´cancel´ button - v Else show a ´participate´ button --}} <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="javascript:void(0);" onclick="ajaxCall({{ $userevent->id }}, this)" >{{__('msg.tilmeld')}}</a> @endif <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="{{route("events.show", ["event" => $userevent->id ])}}">{{__('msg.læsmere')}}</a> <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="{{route("events.accountsignups", ["event" => $userevent->id ])}}">{{__('msg.sedeltagere')}}</a> </div> </div> </div> </form> @endforeach @else <p class="text-center">{{__('msg.duharikketilmeldtdignogenaktiviteter')}}!</p> @endif <a onclick="window.history.back()" type="submit" style="margin-top: auto" class="mt-2 btn text-center btn-sde-blue">{{__('msg.tilbage')}}</a> <div id="snackbar"></div> </main> @endsection @section("scripts") <script type="text/javascript"> function snackbar(data) { var x = document.getElementById("snackbar"); x.innerHTML = data; x.className = "show"; setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000); } function ajaxCall(event_id, el) { if(el.innerHTML === "{{__("msg.tilmeld")}}") { axios.post("{{ route("userevents.createajax") }}", { event_id: event_id } ).then(function (response) { var data = response.data; snackbar(data); el.innerHTML = "{{__("msg.afmeld")}}"; }).catch(function (error) { console.log(error); }); } else if(el.innerHTML === "{{__("msg.afmeld")}}"){ axios.post("{{ route("userevents.createajaxcancel") }}", { event_id: event_id } ).then(function (response) { var data = response.data; snackbar(data); el.innerHTML = "{{__("msg.tilmeld")}}"; }).catch(function (error) { console.log(error); }); } } </script> @endsection