@extends('layouts.app')

@section('content')

<link rel="stylesheet" href="{{asset('css/form.css')}}">
@php
    use App\Models\User;
    $users = User::where('role', 'coordo')->get();
@endphp


<div style="max-width: 800px; margin: 0 auto; width: 100%; padding: 0 15px;">
    <div class="card shadow-sm border-0" style="text-align: center; align-items: center; display: flex; flex-direction: column;">
        <div class="card-header bg-white text-center">
            <h2 class="mb-1" style="text-align: center">Gestion des coordinateurs</h2>
            <p class="text-muted mb-0" style="text-align: center">
                Liste des utilisateurs ayant le rôle <strong>coordo</strong>
            </p>
        </div>

        <div class="card-body">
            @if ($users->isEmpty())
                <div class="alert alert-info text-center mb-0">
                    Aucun coordinateur n'est enregistré.
                </div>
            @else
                <table style="align-content: center; align-items: center; margin: 0 auto;">
                    <thead class="table-light">
                        <tr>
                            <th>ID</th>
                            <th>Email</th>
                            <th>Rôle</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($users as $coordo)
                            <tr>
                                <td>{{ $coordo->id }}</td>
                                <td>{{ $coordo->email }}</td>
                                <td>
                                    <span class="badge bg-secondary">{{ $coordo->role }}</span>
                                </td>
                                <td>
                                    <form method="POST"
                                          action="{{ route('delete_coordo', ['id' => $coordo->id]) }}"
                                          onsubmit="return confirm('Supprimer ce coordinateur ?');">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="btn btn-danger btn-sm">
                                            Supprimer
                                        </button>
                                    </form>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            @endif

            <h2 class="mt-4 text-center">Ajouter un coordinateur</h2>

            <form method="POST" action="{{ route('create_coordo') }}" class="mt-4">
                @csrf
                <input type="hidden" name="role" value="coordo">

                <div class="input-group mb-3">
                    <input
                        type="email"
                        name="email"
                        class="form-control"
                        placeholder="Email du coordinateur"
                        required
                    >
                    <input
                        type="password"
                        name="password"
                        class="form-control"
                        placeholder="Mot de passe"
                        required
                    >
                     <input
                        type="password"
                        name="password_confirmation"
                        class="form-control"
                        placeholder="Confirmer le mot de passe"
                        required
                    >
                </div>
                    <button class="btn btn-primary" type="submit">
                        Ajouter
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection