@extends('layouts.master')

@section('title', 'Wedstrijden')

@section('content')
    <div class="container">
        <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-2">
            <h1 class="mb-0">Wedstrijden</h1>
            @auth
                @if (auth()->user()->role >= 2)
                    <a href="{{ route('game.new') }}" class="btn btn-success">➕ Nieuwe wedstrijd</a>
                @endif
            @endauth
        </div>

        @if(session('success'))
            <div class="alert alert-success">
                {{ session('success') }}
            </div>
        @endif

        <div class="table-responsive">
            <table class="table table-striped align-middle">
                <thead>
                    <tr>
                        <th>Datum</th>
                        <th>Tegenstander</th>
                        {{-- <th>Thuis?</th> --}}
                        <th>Uitslag</th>
                        <th>MVP</th>
                        <th>Statistieken</th>
                        <th>Actie</th>
                        @auth
                            @if (auth()->user()->role >= 2)
                                <th>Wedstrijd bewerken</th>
                            @endif
                        @endauth
                        @auth
                            @if (auth()->user()->role >= 2)
                                <th>Statistieken bewerken</th>
                            @endif
                        @endauth
                    </tr>
                </thead>
                <tbody>
                    @forelse($games as $game)
                        <tr>
                            <td>
                                <div class="d-flex flex-column">
                                    <span>{{ \Carbon\Carbon::parse($game->date)->format('d-m') }}</span>
                                    <small class="text-muted ms-sm-1">{{ \Carbon\Carbon::parse($game->date)->format('Y') }}</small>
                                </div>
                            </td>
                            <td>
                                <div class="d-flex flex-column">
                                    <span>{{ $game->opponentTeam->name ?? 'Onbekend' }}</span>
                                    <small class="text-muted ms-sm-1">{{ $game->home_game ? 'Thuis' : 'Uit' }}</small>
                                </div>
                            </td>
                            {{-- <td>
                                @if($game->home_game)
                                    <span class="badge bg-primary">Thuis</span>
                                @else
                                    <span class="badge bg-secondary">Uit</span>
                                @endif
                            </td> --}}
                            <td>{{ $game->result ?? '-' }}</td>
                            <td>{{ $game->mvp->name ?? '-' }}</td>
                            <td>
                                <a href="{{ route('match.stats.view', $game) }}" class="btn btn-sm btn-outline-secondary">
                                    Bekijken
                                </a>
                            </td>
                            @auth
                                <td>
                                    <form method="POST" action="{{ route('match.attendance.save', $game) }}">
                                        @csrf
                                        <input type="hidden" name="user_id" value="{{ auth()->id() }}">

                                        @php
                                            $attendee = $game->attendees->firstWhere('id', auth()->id());
                                            $isAttending = $attendee?->pivot->is_attending ?? false;
                                            $isDriver = $attendee?->pivot->is_driver ?? false;
                                        @endphp

                                        <div class="d-flex flex-column gap-1">
                                            <div class="form-check">
                                                <input class="form-check-input" type="checkbox" name="attending" value="1"
                                                    onchange="this.form.submit()" {{ $isAttending ? 'checked' : '' }}>
                                                <label class="form-check-label text-nowrap">Ik ben erbij</label>
                                            </div>

                                            @if(!$game->home_game)
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" name="driver" value="1"
                                                        onchange="this.form.submit()" {{ $isDriver ? 'checked' : '' }}>
                                                    <label class="form-check-label text-nowrap">Ik rij</label>
                                                </div>
                                            @endif
                                        </div>
                                    </form>
                                </td>
                            @endauth
                            @auth
                                @if (auth()->user()->role >= 2)
                                    <td>
                                        <a href="{{ route('game.edit', $game) }}" class="btn btn-sm btn-outline-primary">Bewerken</a>
                                    </td>
                                @endif
                            @endauth
                            @auth
                                @if (auth()->user()->role >= 2)
                                    <td>
                                        <a href="{{ route('match.stats.edit', $game) }}" class="btn btn-sm btn-outline-secondary">
                                            Bewerken
                                        </a>
                                    </td>
                                @endif
                            @endauth
                        </tr>
                    @empty
                        <tr>
                            <td colspan="8" class="text-center">Nog geen wedstrijden gevonden.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
@endsection