@extends('layouts.app')

@section('content')

<div class="container">
    <h1>Liste des utilisateurs</h1>
    @if(auth()->check() && auth()->user()->is_admin)
        <a href="{{ route('pages.users.create') }}" class="btn btn-success mb-3">Créer un utilisateur</a>
    @endif
    <table id="table" class="display table table-striped table-bordered" style="width:100%">
        <thead>
            <tr>
                <th>Actions</th>
                <th>Détails</th>
                <th>Nom d'utilisateur</th>
                <th>Email</th>
                <th>Nom de l'entreprise</th>
                <th>Numéro TVA</th>
                <th>Téléphone portable</th>
                <th>Téléphone fixe</th>

            </tr>
        </thead>
        <tbody>
            @foreach ($users as $user)
                <tr>
                    <td>
                        <!-- Modifier un utilisateur -->
                        <a href="{{ route('pages.users.edit', $user->id) }}">
                            <i class="fas fa-edit"></i>
                        </a>

                        <!-- Supprimer un utilisateur -->
                        <a href="javascript:void(0);" onclick="confirmDeletion({{ $user->id }});" class="btn btn-link text-danger">
                            <i class="fas fa-trash"></i>
                        </a>

                        <form id="delete-form-{{ $user->id }}" action="{{ route('pages.users.destroy', $user->id) }}" method="POST" style="display:none;">
                            @csrf
                            @method('DELETE')
                        </form>
                    </td>

                    <!-- Détails utilisateur -->
                    <td><a href="/details_user/{{ $user->id }}"><i class="far fa-eye"></i></a></td>
                    <td>{{ $user->user_name }}</td>
                    <td>{{ $user->user_email }}</td>
                    <td>{{ $user->company_name }}</td>
                    <td>{{ $user->vat_number }}</td>
                    <td>{{ $user->phone_mobile }}</td>
                    <td>{{ $user->phone_landline }}</td>
                </tr>
            @endforeach
        </tbody>

        <tfoot>
            <tr>
                <th>Actions</th>
                <th>Détails</th>
                <th>Nom d'utilisateur</th>
                <th>Email</th>
                <th>Nom de l'entreprise</th>
                <th>Numéro TVA</th>
                <th>Téléphone portable</th>
                <th>Téléphone fixe</th>
            </tr>
        </tfoot>
    </table>
</div>

<script>
    function confirmDeletion(userId) {
        Swal.fire({
            title: 'Êtes-vous sûr ?',
            text: "Cette action est irréversible !",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6',
            confirmButtonText: 'Oui, supprimer',
            cancelButtonText: 'Annuler'
        }).then((result) => {
            if (result.isConfirmed) {
                document.getElementById('delete-form-' + userId).submit();
            }
        });
    }
    $(document).ready(function() {
        // Initialiser DataTable
        var table = $('#usersTable').DataTable({
            "pageLength": 5,    // Afficher par 10 lignes
        });

    });

</script>

@endsection