@extends('layout.master')
@section('parentPageTitle', 'Areas')
@section('title', 'Boxs')
@section('page-style')
<link rel="stylesheet" href="{{asset('assets/plugins/jquery-datatable/dataTables.bootstrap4.min.css')}}">
<link rel="stylesheet" href="{{asset('assets/jquery-ui.css')}}">
<link rel="stylesheet" href="{{asset('assets/bootstrap.min.css')}}">
@stop

@section('content')


<meta name="csrf-token" content="{{ csrf_token() }}">

    <div class="row clearfix">
        <div class="col-md-12">
            <div class="card patients-list">
                <!-- <div class="header">
                    <h2><strong>Listado de boxs: {{$dataSucursales[0]->nombre}} - {{$dataAreas[0]->nombre}}</strong> </h2>
                    <ul class="header-dropdown">
                        <li class="dropdown"> <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <i class="zmdi zmdi-more"></i> </a>
                            <ul class="dropdown-menu dropdown-menu-right slideUp">
                                <li><a href="ingresar">Nuevo</a></li>
                            </ul>
                        </li> 
                        <li><a href="ingresar" class="btn btn-info">+ Nuevo</a></li>
                        
                        <li><a href="../areas/listado" class="btn btn-primary">Listado de areas</a></li>
                        <li><a href="../sucursales/listado" class="btn btn-primary">Listado de sucursales</a></li>
                        <li class="remove">
                            <a role="button" class="boxs-close"><i class="zmdi zmdi-close"></i></a>
                        </li>
                    </ul>
                </div> -->
                <div class="body">
                    <!-- Nav tabs -->

                    
                    <div class="row">
                        <div class="col-md-4">                            
                            <h5>{{$dataSucursales[0]->nombre}}: {{$dataAreas[0]->nombre}}</h5>
                        </div>
                        <div class="col-md-8" align="right">
                            <a href="ingresar" class="btn btn-primary btn-round">Nuevo box</a>
                            <a href="../areas/listado" class="btn btn-primary btn-round">Listado de areas</a>
                            <a href="../sucursales/listado" class="btn btn-primary btn-round">Listado de sucursales</a>
                        </div>
                    </div>
                    
          
                        
                    <!-- Tab panes -->
                    <div class="tab-content m-t-10">
                        <div class="tab-pane table-responsive active" id="All">
                            <table class="table m-b-0 table-hover" id="tabla1" name="tabla1">
                                <thead>
                                    <tr class="ui-widget-header">                                       
                                        <th>Nombre</th>
                                        <th>Acciones</th>
                                    </tr>
                                </thead>
                                <tbody>
                                	@foreach ($dataBoxs as $box)
                                    <tr>
                                        <td>{{ $box->nombre }}</td>
                                        <td>
                                              
                                            <a href="{{ $box->id }}" class="btn btn-primary btn-round">Editar</a> 
                                            <button type="button" class="btn btn-danger btn-round" onclick="eliminar('{{$box->id}}')">Eliminar</button>
                                        </td>
                                    </tr>
                                    @endforeach                                                                          
                                </tbody>
                            </table>
                        </div>


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

@stop

@section('page-script')

    <script>



        function eliminar(id){
            var r = confirm("Confirma eliminar");
            if (r == true) {
                var token = $('meta[name="csrf-token"]').attr('content');
                var url='eliminar';
                var data={"id" : id};

                $.ajax({
                    type:'POST',
                    url: url,
                    data: data,
                    headers: {
                        'X-CSRF-TOKEN': token
                    },
                    success:function(data){
                        window.location.href = "listado";
                    }
                });
            }                 
        }

        

        $(document).ready(function() {
            $('#tabla1').DataTable({
                "language": {
                    "lengthMenu": "Listar _MENU_ ",
                    "zeroRecords": "Aún no tiene registros",
                    "info": "Página _PAGE_ de _PAGES_",
                    "infoEmpty": "",
                    "Search": "Buscar",
                    "infoFiltered": "(filtered from _MAX_ total records)",
                    "search": "Buscar"
                },
                "order": [[ 1, "asc" ]]
            });
        } );

      
    </script>
@stop