@extends('adminlte::page')
@section('title', 'Devoluciones Producto')
@section('plugins.Datatables', true)
@section('plugins.Select2', true)
@section('content_header')
    <h1>Devoluciones</h1>
@stop

@section('content')

    <a href="#" class="btn btn-primary mb-3 mr-3" data-toggle="modal" data-target="#devolucionModal">Nueva devolucion</a>



   <div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header">
                <h1 class="card-title">Devoluciones</h1>
            </div>

            <card class="card-body">

                <div class="row mb-3">
                    <div class="col-md-3">
                        <label for="searchDate">Buscar por Fecha:</label>
                        <input type="date" id="searchDate" class="form-control">
                    </div>
                    <div class="col-md-1">
                        <button id="filterButton" class="btn btn-primary" style="margin-top: 2.3rem;">Buscar</button>
                    </div>
                </div>


                <table class="table" id="table-devoluciones">
                    <thead>
                        <th>#</th>
                        <th>Cliente</th>
                        <th>Tipo de producto</th>
                        <th>Cantidad Aves</th>
                        <th>Peso Neto</th>
                        <th>Sub Total</th>
                        <th>Fecha</th>
                        <th>Acción</th>
                    </thead>
                    <tbody>
                        @foreach ($almacen as $item)
                            <tr>
                                <td>{{ $item->id }}</td>
                                <td>{{ $item->cliente->razon_social }}</td>
                                <td>{{ $item->tipo_pollo->descripcion }}</td>
                                <td>{{ $item->cantidad }}</td>
                                <td>{{ $item->peso_neto }}</td>
                                <td>{{ $item->subtotal }}</td>
                                <td>{{ $item->fecha }}</td>
                                <td>
                                    <form action="{{ route('devoluciones.destroy', $item->id ) }}">
                                        @csrf
                                        @method('delete')
                                        <button class="btn btn-danger btnDestroyDevolucion btn-sm" data-id="{{ $item->id }}"> <i class="fa fa-trash"></i> Eliminar</button>
                                    </form>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </card>
        </div>
    </div>
   </div>


    <!-- Modal devolucion -->
    <div class="modal fade" id="devolucionModal" tabindex="-1" role="dialog" aria-labelledby="devolucionModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="devolucionModalLabel">Registrar Devolución por Venta</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('devoluciones.store') }}" method="POST">
                        @csrf

                        <!-- Selección del cliente -->
                        <div class="form-group">
                            <div class="row">
                                <div class="col-md-10 mb-3">
                                    <label for="cliente_id">Cliente</label> <br>
                                    <select id="cliente_id" name="cliente_id"  class="form-control selectpicker" required data-live-search="true">
                                        <option value="">Seleccione un cliente</option>
                                        @foreach ($clientes as $cliente)
                                            <option value="{{ $cliente->id }}">{{ $cliente->nombre_comercial }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-md-2 mb-3">
                                    <label for="">Ventas</label>
                                    <button class="btn btn-primary" id="btnBuscar"> <i class="fa fa-search"></i> Buscar</button>
                                </div>
                            </div>
                        </div>

                        <table class="table">
                            <thead>
                                <th>#</th>
                                <th>Serie Venta</th>
                                <th>Total</th>
                                <th>Peso Neto</th>
                                <th>Total Pendiente</th>
                                <th>Precio</th>
                                <th></th>
                            </thead>
                            <tbody class="TableVenta">
                                <!--datos jquery-->
                            </tbody>
                        </table>

                        <!-- Selección del tipo de pollo -->
                        <div class="form-group">
                            <label for="tipo_pollo_id">Tipo de Pollo</label>
                            <select class="form-control" id="tipo_pollo_id" name="tipo_pollo_id" required>
                                <option value="">Seleccione un tipo de pollo</option>
                                @foreach ($tiposPollo as $tipoPollo)
                                    <option value="{{ $tipoPollo->id }}">{{ $tipoPollo->descripcion }}</option>
                                @endforeach
                            </select>
                        </div>

                        <!-- Campo cantidad -->
                        <div class="form-group">
                            <label for="cantidad">Cantidad de Pollos</label>
                            <input type="number" class="form-control" id="cantidad" name="cantidad" required
                                min="1" placeholder="Ingrese la cantidad de pollos" value="0">
                        </div>

                        <div class="row">
                            <div class="col">
                                <!-- Campo peso neto -->
                                <div class="form-group">
                                    <label for="peso_neto">Peso Neto</label>
                                    <input type="number" class="form-control" id="peso_neto" name="peso_neto" required
                                        min="0.01" step="any" placeholder="Ingrese el peso neto">
                                </div>
                            </div>
                            <div class="col">
                                <!-- Campo precio -->
                                <div class="form-group">
                                    <label for="precio">Precio</label>
                                    <input type="number" class="form-control" id="precio" name="precio" required
                                        min="0.01" step="any" placeholder="Ingrese precio del producto">
                                </div>
                            </div>
                        </div>

                        <!-- Campo subtotal -->
                        <div class="form-group">
                            <label for="subtotal">Subtotal</label>
                            <input type="number" class="form-control" id="subtotal" name="subtotal" required
                                min="0.01" step="any" placeholder="Ingrese el subtotal">
                        </div>

                        <div class="form-group">
                            <label for="Motivo">Motivo</label>
                            <textarea name="motivo" id="motivo" cols="30" rows="4" class="form-control"></textarea>
                        </div>


                        <!-- Campo fecha -->
                        <div class="form-group">
                            <label for="fecha">Fecha</label>
                            <input type="date" class="form-control" id="fecha" name="fecha"
                                value="{{ \Carbon\Carbon::now()->format('Y-m-d') }}" required>
                        </div>

                        <!-- Botón para registrar la devolución -->
                        <button type="button" id="btnAddDevolucion" class="btn btn-primary">Registrar
                            Devolución</button>
                    </form>
                </div>
            </div>
        </div>
    </div>


@stop

@section('css')
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.1/dist/css/bootstrap-select.min.css">
    <style>
        .select2-selection {
            height: 40px !important;
            width: 350px !important;
        }
    </style>
@stop

@section('js')
    <script src="https://cdn.jsdelivr.net/npm/moment@2.29.1/moment.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.1/dist/js/bootstrap-select.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        $(document).ready(function() {
            // Inicializa DataTables
            var table = $('#table-devoluciones').DataTable({
                language: {
                    "url": "/js/spanish.json"
                },
                pageLength: 25
            });


            $('#subtotal').focus(function(e) {
                e.preventDefault();
                const peso = $('#peso_neto').val();
                const precio = $('#precio').val() ?? 0;
                const subTotal = peso * precio;
                $('#subtotal').val(subTotal.toFixed(2));
            });


            $('#btnAddDevolucion').click(function(e) {
                e.preventDefault();


                // Crear un objeto FormData con los datos del formulario
                var formData = new FormData($('#devolucionModal form')[0]);
                // Obtener el valor de venta_id de la tabla
                var ventaId = $('#venta_id').text();  // Obtenemos el valor de la celda
                // Agregar el valor de venta_id al FormData
                formData.append('venta_id', ventaId);

                // formData.forEach(function(value, key) {
                //     console.log(key + ": " + value);
                // });
                // Enviar los datos al controlador usando AJAX
                $.ajax({
                    url: '{{ route('devoluciones.store') }}', // URL a la que se enviará el formulario
                    type: 'POST',
                    data: formData,
                    contentType: false, // Esto es necesario para que FormData funcione correctamente
                    processData: false, // No procesar los datos
                    success: function(response) {
                        // Si la solicitud fue exitosa
                        if (response.success) {
                            // Cerrar el modal
                            $('#devolucionModal').modal('hide');

                            // Mostrar mensaje de éxito o redirigir
                            Swal.fire({
                                icon: 'success',
                                title: 'Éxito',
                                text: 'Devolución registrada correctamente',
                                showConfirmButton: false,
                                timer: 1000
                            }).then(() => {
                                location.reload(); // Recarga la página después de mostrar la alerta
                            });
                        } else {
                            // Si hubo un error, mostrar el mensaje
                            Swal.fire({
                                icon: 'error',
                                title: 'Éxito',
                                text: 'Hubo un error al registrar la devolución',
                                confirmButtonText: 'Ok'
                            })
                        }
                    },
                    error: function(xhr, status, error) {
                        // Manejo de errores
                        Swal.fire({
                                title: 'Información',
                                icon: 'error',
                                text: 'Hubo un error al registrar la devolución',
                                confirmButtonText: 'Ok'
                            })
                    }
                });
            });

            //Metodos:

            $('#devolucionModal').on('shown.bs.modal', function () {
                // Inicializa Select2 en el select dentro del modal
                // $('.selectpicker').selectpicker();
                $('.selectpicker').selectpicker('refresh');
                $('.TableVenta').empty();
            });

            // $('#devolucionModal').on('hidden.bs.modal', function () {
            //     // $('.selectpicker').selectpicker('destroy').val(null).trigger('change');
            //     $('.selectpicker').selectpicker('destroy').val(null);
            //     location.reload();
            // });

            // Filtrar cuando se hace clic en el botón de búsqueda Table
            $('#filterButton').on('click', function() {
                var selectedDate = $('#searchDate').val();
                if (selectedDate) {
                    var formattedDate = moment(selectedDate).format('DD/MM/YYYY');
                    table.column(6).search('^' + formattedDate + '$', true, false).draw();
                } else {
                    table.column(6).search('').draw();
                }
            });

            //funciones::

            $('#btnBuscar').click(function (e) {
                e.preventDefault();

                const clienteId = $('.selectpicker').val();  // Obtenemos el cliente seleccionado

                $.ajax({
                    type: "GET",
                    url: "/devoluciones/ventas/" + clienteId,  // URL para obtener las ventas
                    dataType: "Json",
                    success: function (response) {
                        // Limpiar la tabla antes de agregar los nuevos datos
                        $('.TableVenta').empty();

                        if (response.ventas.length > 0) {
                            // Si hay ventas, las mostramos en la tabla
                            response.ventas.forEach(function(venta) {
                                const precio = (venta.peso_neto > 0) ? (venta.monto_total / venta.peso_neto).toFixed(2) : 0;
                                const row = `
                                    <tr>
                                        <td id="venta_id">${venta.id}</td>
                                        <td>${venta.serie_venta}</td>
                                        <td>${venta.monto_total}</td>
                                        <td>${venta.peso_neto}</td>
                                        <td>${venta.monto_pendiente}</td>
                                        <td>${precio}</td>
                                        <td><button type="button" class="btn btn-xs btn-danger btnDelete">Eliminar</button></td>
                                    </tr>
                                `;
                                $('.TableVenta').append(row); // Agregar fila a la tabla
                            });
                        } else {
                            // Si no hay ventas, mostramos un mensaje
                            console.log('Este cliente no tiene ventas registradas en el día de hoy.');
                        }
                    },
                    error: function(xhr, status, error) {
                        $('.TableVenta').empty();  // Limpiar la tabla en caso de error

                        // Verificar si la respuesta contiene un mensaje de error
                        const errorMessage = xhr.responseJSON && xhr.responseJSON.message ? xhr.responseJSON.message : 'Hubo un problema al obtener las ventas.';

                        // Mostrar el mensaje de error usando SweetAlert
                        Swal.fire({
                            icon: 'error',
                            title: 'Error',
                            text: errorMessage,
                        });

                        console.log('Hubo un problema al obtener las ventas: ' + errorMessage);
                    }
                });

            });


            $('.btnDestroyDevolucion').click(function (e) {
                e.preventDefault();  // Prevenir el comportamiento por defecto del botón

                // Confirmación antes de eliminar la devolución
                Swal.fire({
                    title: "CONFIRMACIÓN",
                    text: "¿Está seguro de eliminar la devolución?",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#3085d6",
                    cancelButtonColor: "#d33",
                    confirmButtonText: "Sí, eliminarla!",
                }).then((result) => {
                    if (result.isConfirmed) {
                        // Obtener el ID de la devolución a eliminar
                        var devolucionId = $(this).data('id');  // Asumimos que el ID de la devolución está en un atributo 'data-id'

                        // Enviar solicitud AJAX para eliminar la devolución
                        $.ajax({
                            type: 'DELETE',  // Usamos el método DELETE
                            url: '/devoluciones/' + devolucionId,  // URL de la API para eliminar la devolución (ajusta la URL)
                            dataType: 'json',
                            success: function(response) {
                                if (response.success) {
                                    Swal.fire({
                                        icon: 'success',
                                        title: 'Devolución eliminada',
                                        text: response.message,
                                    });

                                    // Opcional: Actualizar la tabla o interfaz de usuario después de eliminar la devolución
                                    // Por ejemplo, puedes eliminar la fila de la tabla donde se encontraba la devolución
                                    // $('#devolucion-' + devolucionId).remove();  // Asumiendo que cada fila tiene un ID como 'devolucion-ID'
                                    location.reload();
                                } else {
                                    Swal.fire({
                                        icon: 'error',
                                        title: 'Error',
                                        text: response.message,
                                    });
                                }
                            },
                            error: function(xhr, status, error) {
                                Swal.fire({
                                    icon: 'error',
                                    title: 'Error',
                                    text: 'Hubo un problema al eliminar la devolución. Intenta nuevamente.',
                                });
                            }
                        });
                    }
                });
            });




            //Eliminar, solo afectar a la venta indicada
            $('.TableVenta').on('click', '.btnDelete', function() {
                // Eliminar la fila correspondiente al botón de eliminar
                $(this).closest('tr').remove();
            });



        });
    </script>
@stop