@extends('layouts.app')

@section('title', 'Permisos - Vacaciones')

@section('css')
    <style>
        #permisos thead {
            background-color: #343a40;
            color: white;
        }
    </style>
@endsection

@section('content')
    <div class="card mt-2">
        <div class="card-header d-flex justify-content-between">
            <h4>Lista de Solicitudes para Permisos y Vacaciones</h4>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table id="permisos" class="table table-striped table-bordered">
                    <thead class="table-dark">
                        <tr>
                            <th>Equipo</th>
                            <th>Apellidos y Nombres</th>
                            <th>Solicitado el:</th>
                            <th>Días Solicitados</th>
                            <th>Observación</th>
                            <th>Detalle</th>
                            <th>Nota</th>
                            <th>Acciones</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script>
        $(document).ready(function(){
            $('#permisos').DataTable({
                responsive: true,
                autoWidth: false,
                processing: true,
                serverSide: true,
                ajax: URLs+'/permisosvac',
                columns: [
                    { data: "equipo", name: 'equipo'},
                    { data: "apellidos_nombres", name: 'apellidos_nombres'},
                    { data: "solicitado", name: 'solicitado'},
                    { data: "dias_solicitados", name: 'dias_solicitados'},
                    { data: "observacion", name: 'observacion'},
                    { data: "detalle", name: 'detalle'},
                    { data: "nota", name: 'nota'},
                    { data: "action", "orderable": false, "searchable": false }
                ],
                "language": {
                    "lengthMenu": "Mostrar _MENU_ registros por página",
                    "zeroRecords": "Nada encontrado - disculpa",
                    "info": "Mostrando la página _PAGE_ de _PAGES_",
                    "infoEmpty": "No se encuentran registros",
                    "infoFiltered": "(filtrado de _MAX_ registros totales)",
                    "search": "Buscar:",
                    "paginate": {
                        'next': "Siguiente",
                        'previous': "Anterior"
                    }
                }
            });
        });

        /* function deleteColaborador(colaboradorId) {
            Swal.fire({
                title: '¿Estás seguro?',
                text: "No podrás revertir esto!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Sí, desactivarlo!'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: '/general/' + colaboradorId, // Asegúrate de que esta URL corresponda a tu ruta de "destroy"
                        type: 'DELETE',
                        data: {
                            "_token": "{{ csrf_token() }}", // Asegúrate de que tu archivo Blade genera correctamente este token
                        },
                        success: function(response) {
                            Swal.fire(
                                'Desactivado!',
                                response.success,
                                'success'
                            );
                            $('#colaborador').DataTable().ajax.reload(null, false); // Recarga la tabla sin perder la paginación
                        },
                        error: function(error) {
                            console.log(error);
                            Swal.fire(
                                'Error!',
                                'Algo salió mal al intentar desactivar el registro.',
                                'error'
                            );
                        }
                    });
                }
            });
        };

        function restoreColaborador(colaboradorId) {
            Swal.fire({
                title: '¿Estás seguro?',
                text: "Quieres restaurar este registro?",
                icon: 'question',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Sí, restaurarlo!'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: '/general/' + colaboradorId + '/restaurar',// Asegúrate de que esta URL corresponda a tu ruta de "restaurar"
                        type: 'POST', // Ajusta según el método HTTP esperado por tu ruta
                        data: {
                            "_token": $('meta[name="csrf-token"]').attr('content'),
                        },
                        success: function(response) {
                            Swal.fire(
                                'Restaurado!',
                                response.success,
                                'success'
                            );
                            $('#colaborador').DataTable().ajax.reload(null, false); // Recarga la tabla sin perder la paginación
                        },
                        error: function(error) {
                            console.log(error);
                            Swal.fire(
                                'Error!',
                                'Algo salió mal al intentar restaurar el registro.',
                                'error'
                            );
                        }
                    });
                }
            });
        }; */

        /* Codigo para mostrar alerta de confirmación */
        document.addEventListener('DOMContentLoaded', function() {
            // Verifica si hay un mensaje de éxito en la sesión
            @if(session('success'))
                Swal.fire({
                    title: '¡Éxito!',
                    text: '{{ session('success') }}',
                    icon: 'success',
                    confirmButtonText: 'OK'
                });
            @endif
        });
    </script>
@endsection