@extends('layouts.phoenix')

@section('title', 'Questions')

@section('content')

@php
    $pull = App\Models\QuizQuestion::PULL;
    $categories = App\Models\QuizQuestion::CATEGORIES;
@endphp

<div class="d-flex justify-content-between align-items-center mb-6">
    <div>
        <h2 class="mb-2">Questions</h2>
        <p class="text-body-tertiary mb-0">
            Chaque partie tire {{ $pull[App\Models\QuizQuestion::CATEGORY_CM] }} question Crédit Mutuel
            et {{ $pull[App\Models\QuizQuestion::CATEGORY_OTHER] }} questions Autre, dans un ordre aléatoire.
        </p>
    </div>
    <a class="btn btn-primary" href="{{ url('/admin/questions/nouvelle') }}">
        <span class="me-2" data-feather="plus"></span>Nouvelle question
    </a>
</div>

@foreach($categories as $key => $label)
    @if($counts[$key] < $pull[$key])
        <div class="alert alert-subtle-warning" role="alert">
            Catégorie « {{ $label }} » : {{ $counts[$key] }} question(s) en base, il en faut au moins {{ $pull[$key] }} pour composer une partie.
        </div>
    @endif
@endforeach

<div class="row g-3">
    <div class="col-12 col-xl-4">
        <div class="card mb-3">
            <div class="card-header border-bottom border-translucent">
                <h4 class="mb-0">Répartition</h4>
            </div>
            <div class="card-body">
                @foreach($categories as $key => $label)
                    <div class="d-flex justify-content-between align-items-center py-2 {{ ! $loop->last ? 'border-bottom border-translucent' : '' }}">
                        <span>{{ $label }}</span>
                        <span class="fw-semibold">
                            {{ $counts[$key] }}
                            <span class="text-body-tertiary fs-10">/ {{ $pull[$key] }} par partie</span>
                        </span>
                    </div>
                @endforeach
            </div>
        </div>

        <div class="card">
            <div class="card-header border-bottom border-translucent">
                <h4 class="mb-0">Importer des questions</h4>
            </div>
            <div class="card-body">
                @include('partials.import-form', [
                    'action' => url('/admin/imports/questions'),
                    'format' => 'Question | Bonne réponse | Mauvaise réponse 1 | Mauvaise réponse 2 | Catégorie (creditmutuel ou autre)',
                ])
            </div>
        </div>
    </div>

    <div class="col-12 col-xl-8">
        <div class="card">
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table table-hover table-sm fs-9 mb-0">
                        <thead>
                            <tr>
                                <th class="ps-4" style="width: 60px;">#</th>
                                <th style="width: 130px;">Catégorie</th>
                                <th>Question</th>
                                <th>Réponses</th>
                                <th class="text-end pe-4" style="width: 180px;">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($questions as $question)
                                <tr>
                                    <td class="ps-4 align-middle text-body-tertiary">{{ $question->id }}</td>
                                    <td class="align-middle">
                                        <span class="badge badge-phoenix badge-phoenix-{{ $question->category === App\Models\QuizQuestion::CATEGORY_CM ? 'primary' : 'info' }}">
                                            {{ $categories[$question->category] ?? $question->category }}
                                        </span>
                                    </td>
                                    <td class="align-middle fw-semibold">{{ $question->title }}</td>
                                    <td class="align-middle">
                                        @foreach(($answers[$question->id] ?? []) as $answer)
                                            <span class="badge badge-phoenix badge-phoenix-{{ $answer->is_correct ? 'success' : 'secondary' }} me-1 mb-1">
                                                {{ $answer->title }}
                                            </span>
                                        @endforeach
                                        @if(! isset($answers[$question->id]))
                                            <span class="text-danger">Aucune réponse</span>
                                        @endif
                                    </td>
                                    <td class="text-end pe-4 align-middle">
                                        <a class="btn btn-sm btn-phoenix-secondary" href="{{ url('/admin/questions/'.$question->id) }}">Modifier</a>
                                        <form class="d-inline" method="POST" action="{{ url('/admin/questions/'.$question->id.'/supprimer') }}" onsubmit="return confirm('Supprimer cette question et ses réponses ?');">
                                            @csrf
                                            <button class="btn btn-sm btn-phoenix-danger" type="submit">Supprimer</button>
                                        </form>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td class="text-center text-body-tertiary py-5" colspan="5">
                                        Aucune question. Créez-en une ou importez un fichier Excel.
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection