@extends('adminlte::page')
@section('title', 'Ajuste de Inventario')
@section('plugins.Datatables', true)
@section('content_header')
    <h1>Ajuste de Inventario</h1>
@stop

@section('content')


    <a href="#" class="btn btn-primary mb-3" data-bs-toggle="modal" data-bs-target="#addProductModal">Agregar Producto</a>



    <div class="card">
        <div class="card-body">
            <table id="inventoriesTable" class="table table-bordered">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Tipo Ingreso</th>
                        <th>Presentación</th>
                        <th>Tipo</th>
                        <th>Cantidad Pollos</th>
                        <th>Total Peso</th>
                        <th>Cantidad a aumentar</th>
                        <th>Kg a aumentar</th>
                        <th>Cantidad a reducir</th>
                        <th>Kg a reducir</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($inventarios as $inventory)
                        <tr data-id="{{ $inventory->id }}">
                            <td>{{ $inventory->id }}</td>
                            <td>{{ $inventory->tipo_ingreso_description() }}</td>
                            <td>{{ $inventory->presentacion_pollo_descripcion }}</td>
                            <td>{{ $inventory->tipo_pollo_descripcion }}</td>
                            <td>{{ $inventory->total_pollos }}</td>
                            <td>{{ $inventory->total_peso }}</td>
                            <td> <input type="text" value="0" class="cantidad_a_aumentar"> </td>
                            <td> <input type="text" value="0" class="kg_a_aumentar"> </td>
                            <td> <input type="text" value="0" class="cantidad_a_reducir"> </td>
                            <td> <input type="text" value="0" class="kg_a_reducir"> </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>


            <br><br>
            <button class="btn btn-success mr-3" id="updateInventoryBtn">Actualizar Inventario</button>
            <a href="{{ route('inventarios.index') }}" class="btn btn-info">Inventario</a>

        </div>
    </div>


    <!-- Modal Add Producto-->
    <div class="modal fade" id="addProductModal" tabindex="-1" aria-labelledby="addProductModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="addProductModalLabel">Agregar Producto</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <!-- Formulario para agregar producto -->
                    <form action="{{ route('inventarios.store') }}" method="POST">
                        @csrf
                        <div class="mb-3">
                            <label for="fecha_despacho">Tipo de Ingreso</label>
                            <select class="form-control" id="tipo_ingreso" name="tipo_ingreso">
                                <option value="1">CAMION</option>
                                <option value="2">POR STOCK</option>
                                {{-- <option value="3">MERMA</option> --}}
                                <option value="4">BENEFICIADO</option>
                            </select>
                        </div>


                        <div class="mb-3">
                            <label for="presentacion_pollo_id">Presentacion de Pollo:</label>
                            <select id="presentacion_pollo_id" name="presentacion_pollo_id" class="form-control">
                                @foreach ($presentacionPollos as $presentacionPollo)
                                    <option value="{{ $presentacionPollo->id }}"> {{ $presentacionPollo->descripcion }}
                                    </option>
                                @endforeach
                            </select>
                        </div>

                        <div class="mb-3">
                            <label for="tipo_pollo">Tipo de Pollo:</label>
                            <select id="tipo_pollo_id" name="tipo_pollo_id" class="form-control">
                                @foreach ($tipoPollos as $tipo)
                                    <option value="{{ $tipo->id }}"> {{ $tipo->descripcion }} </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="mb-3">
                            <label for="total_peso" class="form-label">Total Peso</label>
                            <input type="number" class="form-control" id="total_peso" name="total_peso" step="any"
                                required value="0">
                        </div>
                        <div class="mb-3">
                            <label for="total_pollos" class="form-label">Total Pollos</label>
                            <input type="number" class="form-control" id="total_pollos" name="total_pollos" required
                                value="0">
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
                            <button type="submit" class="btn btn-primary">Registrar Producto</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>


@stop

@section('css')
    <link rel="stylesheet" href="{{ asset('vendor/adminlte/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css') }}">
@stop

@section('js')
    <!-- Agregar Bootstrap JS y Popper.js -->
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <script>
        $(document).ready(function() {


            // Formulario de agregar producto
            $('form').submit(function(e) {
                e.preventDefault(); // Prevenir el comportamiento por defecto del formulario

                // Obtener los datos del formulario
                var formData = $(this).serialize();

                // Realizar la solicitud AJAX
                $.ajax({
                    url: $(this).attr('action'), // URL de la ruta
                    method: 'POST',
                    data: formData,
                    success: function(response) {
                        // Comprobar el estado de la respuesta
                        if (response.status == 'success') {
                            // Mostrar mensaje de éxito
                            alert(response.message);
                            // Aquí puedes hacer alguna acción, como cerrar el modal
                            $('#addProductModal').modal('hide');
                        } else {
                            // Mostrar mensaje de error
                            alert(response.message);
                        }
                    },
                    error: function(xhr, status, error) {
                        // Manejar errores en la solicitud AJAX
                        alert('Hubo un error al procesar la solicitud. Intenta de nuevo.');
                    }
                });
            });





             // Evento para hacer clic en el botón "Actualizar Inventario"
            $('#updateInventoryBtn').click(function() {
                // Crear un array para almacenar los datos a actualizar
                var dataToUpdate = [];

                // Recorrer todas las filas de la tabla para obtener los datos ingresados
                $('#inventoriesTable tbody tr').each(function() {
                    var inventoryId = $(this).data('id'); // Obtener el ID de inventario de la fila
                    var cantidad_a_aumentar = $(this).find('.cantidad_a_aumentar').val(); // Valor del input "Cantidad a aumentar"
                    var kg_a_aumentar = $(this).find('.kg_a_aumentar').val(); // Valor del input "Kg a aumentar"
                    var cantidad_a_reducir = $(this).find('.cantidad_a_reducir').val(); // Valor del input "Cantidad a reducir"
                    var kg_a_reducir = $(this).find('.kg_a_reducir').val(); // Valor del input "Kg a reducir"

                    // Agregar los datos al array
                    dataToUpdate.push({
                        id: inventoryId,
                        cantidad_a_aumentar: cantidad_a_aumentar,
                        kg_a_aumentar: kg_a_aumentar,
                        cantidad_a_reducir: cantidad_a_reducir,
                        kg_a_reducir: kg_a_reducir
                    });
                });

                // Enviar los datos al servidor a través de AJAX
                $.ajax({
                    url: '{{ route('inventarios.update') }}',  // Ruta para actualizar el inventario
                    method: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}', // Token CSRF para proteger la solicitud
                        inventories: dataToUpdate
                    },
                    success: function(response) {
                        // Mostrar un mensaje de éxito si todo fue bien
                        if (response.status === 'success') {
                            alert(response.message);
                        } else {
                            alert(response.message);
                        }
                    },
                    error: function(xhr, status, error) {
                        // Mostrar un mensaje si algo salió mal
                        alert('Hubo un error al actualizar el inventario. Intente nuevamente.');
                    }
                });
            });


        });
    </script>
@stop