@extends('layouts.app')

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.min.css">


@section('content')
<div class="container">
    <div class="row">
        <div>
            <div class="panel panel-primary">

            	<div class="panel-heading">Clientes (Cuarentena)</div>
                <div class="panel-body">                 

                        <table id="tabla" class="table table-striped table-bordered dt-responsive" style="width:100% !important" cellspacing="0">
                            <thead>
                                <tr>                                    
                                    <th>Codigo</th> 
                                    <th>Cliente</th>
                                    <th>IP</th>       
                                    <th>Acciones</th>                 
                                </tr>
                            </thead>

                            <tbody id =bodyLista>
                            </tbody>
                        </table>
                </div>

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


@endsection


@section('scripts')
    <script>

    $('#tabla').DataTable( {
        "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "Todos"]],
        "order": [[ 1, "asc" ]],
        stateSave: true,
        "ajax":{
        "url": "/clientes/permiso_especial/list",
        "type": "GET"
        },


        "columns": [
            {"data":"codigo"},
            {"data":"nombre"},
            {"data":"ip"},
            {
                "orderable":false,  
                "targets" : 3,                 
                "render": function ( data, type, row ) {  
                        if (row.permiso == 0) {
                            return '<div align="center" id='+row.codigo+'><input type="button" class="btn btn-success" value="Habilitar" onclick=habilitar("'+row.codigo+'")></div>';
                        }
                        else{
                            return '<div align="center" id='+row.codigo+'><input type="button" class="btn btn-danger" value="Deshabilitar" onclick=deshabilitar("'+row.codigo+'")></div>';
                        }
                }   
            }, 
                 
        ],

   
        "language": {
            "url":"/js/Spanish.json"
        },
         
    });
     
    
    function habilitar(cod){


        bootbox.confirm({
            message: "Está a punto de habilitar un servicio por cuarentena a este cliente. ¿Desea continuar?",
            buttons: {
                confirm: {
                    label: 'Si',
                    className: 'btn-success'
                },
                cancel: {
                    label: 'No',
                    className: 'btn-danger'
                }
            },

            callback: function (result) {
                if(result){
                    $.ajax({
                        url: '/clientes/permiso_especial/insert/' + cod,
                        type: 'POST'                       
                    })
                    .done(function() {
                        console.log("success");
                        $("#" + cod).html("<input type='button' class='btn btn-danger' value='Deshabilitar' onclick='deshabilitar(&quot;"+cod+"&quot;)'>")
                    })
                    .fail(function() {
                        console.log("error");
                    });
                }
            }
        });
        
    }

    /*function habilitar(cod){
      
        $.ajax({
            url: '/clientes/permiso_especial/insert/' + cod,
            type: 'POST'                       
        })
        .done(function() {
            console.log("success");
            location.reload();
        })
        .fail(function() {
            console.log("error");
        });

    };*/

    function deshabilitar(cod){


        bootbox.confirm({
            message: "Está a punto de deshabilitar un servicio por cuarentena a este cliente. ¿Desea continuar?",
            buttons: {
                confirm: {
                    label: 'Si',
                    className: 'btn-success'
                },
                cancel: {
                    label: 'No',
                    className: 'btn-danger'
                }
            },

            callback: function (result) {
                if(result){
                    $.ajax({
                        url: '/clientes/permiso_especial/delete/' + cod,
                        type: 'DELETE'                     
                    })
                    .done(function() {
                        console.log("success");
                        $("#" + cod).html("<input type='button' class='btn btn-success' value='Habilitar' onclick='habilitar(&quot;"+cod+"&quot;)'>")
                    })
                    .fail(function() {
                        console.log("error");
                    });
                }
            }
        });

        
    }
    </script>


@endsection