@extends(layoutTenant())
@section('title')
    <title>Usuarios - Papel zero </title>
    @if(isset($usuariostemporareo))
        @php $pagina = "usuariostempo"; @endphp
    @else

        @php $pagina = "usuarios"; @endphp
    @endif


@endsection
@section('content')

 <h4 style="padding: 20px 0 0px 40px; font-weight: bold; color:#6f2e04;">Usuarios</h4>




    <div class="content-wrapper">
        <div class="content-body">
            <section id="configuration">
                <div class="row">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header">





                                <a  href="{{ routeTenant('usuariosapp.create') }}" class="btn  btn-primary">Adicionar Novo Usuario</a>


                            </div>
                            <div class="card-content collapse show">
                                <div class="card-body card-dashboard">
                                    <div class="table-responsive">
                    <table class="table" id="users-table">
                        <thead class="bg-light">
                        <tr class="border-0">

                            <th class="border-0">ID</th>

                            <th class="border-0">Nome</th>
                            <th class="border-0">E-mail</th>
                            <th class="border-0">Telefone</th>
                            <th class="border-0">Tipo</th>


                            <th class="border-0">Funções</th>
                        </tr>
                        </thead>
                        <tbody>



                        </tbody>
                    </table>
                                    </div>     </div>    </div> </div>  </div> </div>
            </section>
        </div>
    </div>
    <!-- ============================================================== -->
    <!-- end recent orders  -->
 <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
     <div class="modal-dialog" role="document">
         <div class="modal-content">

                 <div class="modal-header bg-danger text-white">
                     <h5 class="modal-title text-white " id="exampleModalLabel">Deletar </h5>
                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                         <span aria-hidden="true">&times;</span>
                     </button>
                 </div>
                 <div class="modal-body">
                     Você tem certeza que Deseja Deletar?

                 </div>
                 <div class="modal-footer ">
                     <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                     <a href="#" class="btn btn-danger deletar" id="deletar">Deletar</a>
                 </div>

         </div>

     </div>

 </div>

 <div class="modal fade" id="exampleModal2" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
     <div class="modal-dialog" role="document">
         <div class="modal-content">

                 <div class="modal-header bg-success text-white">
                     <h5 class="modal-title text-white " id="exampleModalLabel">Desativar </h5>
                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                         <span aria-hidden="true">&times;</span>
                     </button>
                 </div>
                 <div class="modal-body">
                     Você tem certeza que Deseja Desativar?

                 </div>
                 <div class="modal-footer ">
                     <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                     <a href="#" class="btn btn-success deletar2" id="deletar2">Desativar</a>
                 </div>

         </div>

     </div>

 </div>

@endsection

@section('post-script')


    <script src="{{url('')}}/admin/app-assets/vendors/js/tables/datatable/datatables.min.js"></script>

    <script src="{{url('')}}/admin/app-assets/js/scripts/tables/datatables/datatable-basic.js"></script>


    <link rel="stylesheet" type="text/css" href="{{url('')}}/admin/app-assets/vendors/css/forms/toggle/bootstrap-switch.min.css">
    <link rel="stylesheet" type="text/css" href="{{url('')}}/admin/app-assets/vendors/css/forms/toggle/switchery.min.css">
    <link rel="stylesheet" type="text/css" href="{{url('')}}/admin/app-assets/css/core/colors/palette-switch.css">

    <script src="{{url('')}}/admin/app-assets/vendors/js/forms/toggle/bootstrap-switch.min.js"></script>
    <script src="{{url('')}}/admin/app-assets/vendors/js/forms/toggle/switchery.min.js"></script>
    <script src="{{url('')}}/admin/app-assets/vendors/js/forms/toggle/bootstrap-checkbox.min.js"></script>

    <script>


        $(document).ready(function() {



            $(function() {

                $('#users-table').DataTable({
                    "language": {
                        "url": '{{url('')}}/js/Portuguese-Brasil.json'
                    },
                    "order": [[ 0, "desc" ]],
                    processing: true,

                    serverSide: true,

                    ajax: '{!! routeTenant('usuario.get.data') !!}',

                    columns: [

                        { data: 'id', name: 'id',width: '5%' },

                        { data: 'name', name: 'name',width: '20%' },

                        { data: 'email', name: 'email',width: '15%' },
                        { data: 'telefone', name: 'telefone',width: '20%' },
                        { data: 'tipo', name: 'tipo',width: '10%' },

                        { data: 'funcao', name: 'funcao',width: '30%' },

                    ]

                });





            });


            'use strict';
            var $html = $('html');


            // For Bootstrap Checkbox

            $('.switch').checkboxpicker();


            // For Bootstrap Switches

            $('.switchBootstrap').bootstrapSwitch();


            // Switchery
            var i = 0;
            if (Array.prototype.forEach) {

                var elems = $('.switchery');
                $.each(elems, function (key, value) {
                    var $size = "",
                        $color = "",
                        $sizeClass = "",
                        $colorCode = "";
                    $size = $(this).data('size');
                    var $sizes = {
                        'lg': "large",
                        'sm': "small",
                        'xs': "xsmall"
                    };
                    if ($(this).data('size') !== undefined) {
                        $sizeClass = "switchery switchery-" + $sizes[$size];
                    } else {
                        $sizeClass = "switchery";
                    }

                    $color = $(this).data('color');
                    var $colors = {
                        'primary': "#967ADC",
                        'success': "#37BC9B",
                        'danger': "#DA4453",
                        'warning': "#F6BB42",
                        'info': "#3BAFDA"
                    };
                    if ($color !== undefined) {
                        $colorCode = $colors[$color];
                    } else {
                        $colorCode = "#37BC9B";
                    }

                    var switchery = new Switchery($(this)[0], {
                        className: $sizeClass,
                        color: $colorCode
                    });
                });
            } else {
                var elems1 = document.querySelectorAll('.switchery');

                for (i = 0; i < elems1.length; i++) {
                    var $size = elems1[i].data('size');
                    var $color = elems1[i].data('color');
                    var switchery = new Switchery(elems1[i], {
                        color: '#37BC9B'
                    });
                }
            }
            /*  Toggle Ends   */




            $('#exampleModal').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget) // Button that triggered the modal
                var recipient = button.data('whatever') // Extract info from data-* attributes
                // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
                // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
                var modal = $(this)


                var link = document.getElementById("deletar");
                link.setAttribute('href', recipient);
            })

            $('#exampleModal2').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget) // Button that triggered the modal
                var recipient = button.data('whatever') // Extract info from data-* attributes
                // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
                // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
                var modal = $(this)


                var link = document.getElementById("deletar2");
                link.setAttribute('href', recipient);
            })



        });



    </script>




@endsection