@extends(layoutTenant())

@section('content')
    <div class="container" style="padding: 30px;">
    <section id="image-gallery" class="card">
        <div class="card-header">
            <h4 class="card-title">Usuario</h4>
            <a class="heading-elements-toggle"><i class="la la-ellipsis-v font-medium-3"></i></a>
            <div class="heading-elements">
                <ul class="list-inline mb-0">
                    <li><a data-action="collapse"><i class="ft-minus"></i></a></li>
                    <li><a data-action="reload"><i class="ft-rotate-cw"></i></a></li>
                    <li><a data-action="expand"><i class="ft-maximize"></i></a></li>
                    <li><a data-action="close"><i class="ft-x"></i></a></li>
                </ul>
            </div>
        </div>
        <div class="card-content collapse show">

            <div class="card-body  my-gallery" itemscope="" itemtype="https://schema.org/ImageGallery" data-pswp-uid="1">


                <div class="card card border-teal border-lighten-2">
                    <div class="text-center">
                        <div class="card-body">
                            <img src="{{asset($categorie->foto)}}" class="rounded-circle  height-150" alt="Card image">
                        </div>
                        <div class="card-body">
                            <h4 class="card-title">{{$categorie->name}}</h4>
                            <h6 class="card-subtitle text-muted">{{$categorie->role}}</h6>
                        </div>

                    </div>
                    <div class="list-group list-group-flush">
                        <div href="#" class="list-group-item">Telefone:  {{$categorie->telefone}}</div>
                        <div href="#" class="list-group-item">Email:  {{$categorie->email}}</div>
                        <div href="#" class="list-group-item">Tipo:  {{$categorie->tipo}}</div>
                        <div href="#" class="list-group-item">Status:
                            @if($categorie->status == 1) <a class="btn btn-success white">Ativo</a> @endif
                            @if($categorie->status == 0) <a class="btn btn-danger white">Desativado</a> @endif

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


            </div>

        </div>

    </section>

    </div>




 @endsection
@section('post-script')


    <script>

        $(document).ready(function(){
            $('a[data-confirm]').click(function(ev){
                var href = $(this).attr('href');
                if(!$('#confirm-delete').length){
                    $('body').append('<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" ' +
                        'aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog">' +
                        '<div class="modal-content"><div class="modal-header bg-danger text-white">DELETAR USUARIO' +
                        '<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 de que deseja Deletar o Usuario ?</div><div class="modal-footer">' +
                        '<button type="button" class="btn btn-success" data-dismiss="modal">Cancelar' +
                        '</button><a class="btn btn-danger text-white" id="dataComfirmOK">Deletar</a><' +
                        '/div></div></div></div>');
                }
                $('#dataComfirmOK').attr('href', href);
                $('#confirm-delete').modal({show: true});
                return false;

            });



        });


    </script>

@endsection