@extends('layouts._includes.admin.Header')
    @section('titulo', 'Lista de Utilizador')

    @section('conteudo')
        <div class="card mb-2">
            <div class="card-body">
                <h2 class="h5 page-title">
                    Lista de Utilizador
                </h2>
            </div>
        </div>
        <div class="card shadow mb-4">
            <div class="card-body">
                <!-- sweetalert -->

                <div class="w-100 d-flex justify-content-end">
                    <a><i class="fe fe-plus-circle p-2" data-toggle="modal" data-target=".bd-example-modal-lg"
                            style="font-size: 20px; color:#003B76;"></i></a>
                </div>
                <table class="table datatables table-hover table-bordered" id="caps">
                    <thead class="thead-dark">
                        <tr class="text-center">
                            <th>ID</th>
                            <th>NOME</th>
                            <th>PERFIL</th>
                            <th>EMAIL</th>
                            <th>ACÇÕES</th>
                        </tr>
                    </thead>
                    <tbody class="bg-white">

                        @foreach ($user as $item)
                            <tr class="text-center">
                                <th>{{ $item->id }}</th>
                                <th>{{ $item->vc_primeiroNome . ' ' . $item->vc_ultimoNome }} </th>

                                <th>{{ $item->vc_perfil }}</th>
                                <th>{{ $item->email }}</th>
                                @csrf
                                @method('delete')
                                <td>
                                    <div class="dropdown">
                                        <button class="btn btn-dark btn-sm dropdown-toggle" type="button"
                                            id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true"
                                            aria-expanded="false">
                                            <i class=" fe fe-clone fa-sm" aria-hidden="true"></i>
                                        </button>
                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                            <a href="{{ route('admin.user.editar', $item->id) }}"
                                                class="dropdown-item">Editar</a>
                                            <a href="{{ route('admin.user.eliminar', $item->id) }}" class="dropdown-item"
                                                data-confirm="Tem certeza que deseja eliminar?">Eliminar</a>


                                        </div>
                                    </div>
                                </td>
                            </tr>
                        @endforeach

                    </tbody>
                </table>
                <script>
                    $(document).ready(function() {
                        //start delete
                        $('a[data-confirm]').click(function(ev) {
                            var href = $(this).attr('href');
                            if (!$('#confirm-delete').length) {
                                $('table').append(
                                    '<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog" role="document"><div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Eliminar os dados</h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body">Tem certeza que pretende elimnar?</div><div class="modal-footer"><button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button> <a  class="btn btn-info" id="dataConfirmOk">Eliminar</a> </div></div></div></div>'
                                );
                            }
                            $('#dataConfirmOk').attr('href', href);
                            $('#confirm-delete').modal({
                                shown: true
                            });
                            return false;
                        });
                        //end delete
                    });
                </script>
                <!-- Footer-->
            </div>
        </div>


        <div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Cadastrar Utilizador </h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <form action="{{ route('admin.user.store') }}" method="POST">
                            @include('forms._formUser.index')

                        </form>

                    </div>
                </div>
            </div>
        </div>

    @endsection