@extends('adminlte::page')
@section('plugins.Select2', true)
@section('title', 'Registrar Venta')
@section('content_header')
    <h1>Registrar Venta</h1>
@stop
@section('content')

    <div class="card">
        <div class="card-header">
            <h3 class="card-title">Venta</h3>
        </div>
        <div class="card-body">
            <form id="ventaForm" method="POST" action="{{ route('ventas.store') }}">
                @csrf
                <div class="row">

                    <!-- Serie de Venta -->
                    <div class="col-md-2">
                        <div class="form-group">
                            <label for="serie_venta">Serie de Venta</label>
                            <input type="text" id="serie_venta" name="serie_venta" class="form-control" required
                                value="{{ $serie->number }}-{{ $serie->serie }}" readonly>
                        </div>
                    </div>

                    <!-- Fecha de Venta -->
                    <div class="col-md-2">
                        <div class="form-group">
                            <label for="fecha_venta">Fecha de Venta</label>
                            <input type="date" id="fecha_venta" name="fecha_venta" class="form-control" required>
                        </div>
                    </div>

                    <!-- Select Cliente -->
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="cliente_id">Cliente</label>
                            <select id="cliente_id" name="cliente_id" class="form-control select2" required>
                                <option value="" disabled selected>Selecciona un cliente</option>
                                @foreach ($clientes as $cliente)
                                    <option value="{{ $cliente->id }}">{{ $cliente->nombre_comercial }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-1">
                        <button type="button" class="btn btn-primary" id="btnBuscarOrdenes" style="margin-top: 35px">Ver
                            Ordenes</button>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label for="saldo">Saldo a Favor del Cliente</label>
                            <input type="text" id="saldo" name="saldo" class="form-control" readonly
                                value="0">
                        </div>
                    </div>
                </div>

                <hr>
                <p><b>Ordenes:</b></p>
                <table id="tablaOrdenes" class="table table-bordered">
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>Serie Orden</th>
                            <th>Cantidad Pollos</th>
                            <th>Peso Bruto</th>
                            <th>Cantidad Jabas</th>
                            <th>Tara</th>
                            <th>Peso Neto</th>
                            <th>Precio</th>
                            <th>Subtotal</th>
                        </tr>
                    </thead>
                    <tbody id="ordenesTbody">
                        <!-- Las filas se añadirán dinámicamente con jQuery -->
                    </tbody>
                </table>

                <hr>


                <div class="row">

                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="comentario">Comentario</label>
                            <textarea class="form-control" placeholder="Escribir comentario sobre la venta" rows="4" id="comentario"></textarea>
                        </div>
                    </div>


                    <div class="col-md-6 transaccion" style="margin-top: -20px;">
                        <div class="mt-5 p-3">
                            <h4 class="mb-4 font-weight-bold">Resumen de Transacción</h4>

                            <table class="table table-bordered">
                                <tbody>
                                    <tr>
                                        <td><strong>PESO NETO TOTAL (KG):</strong></td>
                                        <td class="text-dark font-weight-bold" id="resumenPesoNeto"></td>
                                        <!-- Aquí se actualizará el peso neto total -->
                                    </tr>
                                    <tr>
                                        <td><strong>TOTAL DE VENTA S/:</strong></td>
                                        <td class="text-success font-weight-bold" id="resumenTotalVenta"></td>
                                        <!-- Aquí se actualizará el total de venta -->
                                    </tr>
                                    <tr>
                                        <td><strong>DEUDA ANTERIOR S/:</strong></td>
                                        <td class="text-danger font-weight-bold" id="resumenDeudaAnterior"></td>
                                        <!-- Aquí se actualizará la deuda anterior -->
                                    </tr>
                                    <tr>
                                        <td><strong>TOTAL A PAGAR S/:</strong></td>
                                        <td class="text-primary font-weight-bold" style="font-size: 1.2em;"
                                            id="resumenTotalPagar"></td> <!-- Aquí se actualizará el total a pagar -->
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>



                <hr>

                <!-- Botón de Enviar en el Footer -->
                <div class="text-right mt-4">
                    <button type="button" class="btn btn-success" id="btnGenerar"> <i class="fa fa-dollar-sign"></i>
                        Generar Orden de Pago</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal Add cliente -->
    @include('admin.clientes.modal')


    <!-- Modal Imprimir documentos -->
    <div class="modal fade" id="selectDocumentTypeModal" tabindex="-1" aria-labelledby="selectDocumentTypeModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="selectDocumentTypeModalLabel">Seleccionar Tipo de Documento</h5>
                    <!-- Button to close the modal -->
                    {{-- <button type="button" class="btn-close" id="btnCloseModal" aria-label="Close"></button> --}}
                </div>
                <div class="modal-body">
                    <p>Seleccione el tipo de documento que desea generar:</p>
                </div>
                <div class="modal-footer">
                    <a target="_blank" class="btn btn-primary" id="btnDocumentA4">Documento A4</a>
                    <a target="_blank" class="btn btn-secondary" id="btnDocumentTicket">Documento Ticket</a>
                    <!-- Button to close the modal and reload the page -->
                    <button type="button" class="btn btn-danger" id="btnReloadPage">Cerrar y Recargar</button>
                </div>
            </div>
        </div>
    </div>


@stop

@section('css')
    <style>
        .select2-selection {
            height: 40px !important;
        }

        .checkbox-label {
            display: flex;
            align-items: center;
            font-size: 16px;
            /* Tamaño del texto */
            cursor: pointer;
            /* Cambia el cursor al pasar sobre el texto */
        }

        .checkbox-label input[type="checkbox"] {
            width: 20px;
            /* Tamaño del checkbox */
            height: 20px;
            /* Tamaño del checkbox */
            margin-right: 10px;
            /* Espacio entre el checkbox y el texto */
            cursor: pointer;
            /* Cambia el cursor al pasar sobre el checkbox */
        }
    </style>
@endsection

@section('js')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <script>
        const tipo_pollos = @json($tipoPollos);
        const presentacion_pollos = @json($presentacionPollos);
        const prices = @json($prices);
        const clientes = @json($clientes);

        $(document).ready(function() {
            $('.select2').select2();
        });


        document.addEventListener('DOMContentLoaded', function() {

            const tipoPollo = {
                1: 'Pollo Presa',
                2: 'Pollo Brasa',
                3: 'Pollo Tipo',
                4: 'Pollo Especial'
            };

            const presentacionPollo = {
                1: 'Pollo vivo',
                2: 'Pollo beneficiado'
            };



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

                const clienteId = $('#cliente_id').val(); // Obtener el cliente ID del input

                $.ajax({
                    url: '/ordenes/consolidado/' + clienteId, // La URL de la API con el cliente ID
                    type: 'GET', // Tipo de solicitud
                    success: function(response) {
                        // Limpiar la tabla antes de agregar nuevas filas
                        $('#ordenesTbody').empty();

                        // Variables para los cálculos
                        let totalPesoNeto = 0;
                        let totalVenta = 0;
                        let deudaAnterior = 0; // Suponiendo que la deuda anterior es un valor que puedes obtener del cliente
                        let totalPagar = 0;
                        let saldo = parseFloat(response.saldo_total_ventas) || 0.00;

                        // console.log(response.ordenes);
                        // console.log(response.cliente);
                        // console.log(response.saldo_total_ventas);
                         // Recorre todas las órdenes y muestra los detalles
                        // response.ordenes.forEach(function(orden) {
                        //     console.log('Orden:', orden.serie_orden);  // Imprime la serie de la orden
                        //     console.log('Detalles de la orden:', orden.detalles);  // Imprime los detalles asociados a la orden

                        //     orden.detalles.forEach(element => {
                        //         console.log(element);
                        //     });

                        // });


                        // Verificar si hay órdenes en la respuesta
                        if (response.ordenes.length > 0) {
                            // Iterar sobre las órdenes y agregar filas a la tabla
                            response.ordenes.forEach(function(orden) {
                                // Calcular el peso neto y el subtotal de cada orden
                                totalPesoNeto += parseFloat(orden.peso_total_neto);
                                totalVenta += parseFloat(orden.subtotal);
                                let tiposPollo = [];
                                let presentacionesPollo = [];

                                orden.detalles.forEach(function(detalle) {
                                    // Verificar si el tipo de pollo no está ya en la lista
                                    const tipoPolloNombre = tipoPollo[detalle.tipo_pollo_id] || 'Desconocido';
                                    if (!tiposPollo.includes(tipoPolloNombre)) {
                                        tiposPollo.push(tipoPolloNombre);
                                    }

                                       // Verificar si la presentación del pollo no está ya en la lista
                                    const presentacionPolloNombre = presentacionPollo[detalle.presentacion_pollo_id] || 'Desconocido';
                                    if (!presentacionesPollo.includes(presentacionPolloNombre)) {
                                        presentacionesPollo.push(presentacionPolloNombre);
                                    }
                                });
                                const tiposPolloStr = tiposPollo.join(', ');
                                const presentacionesPolloStr = presentacionesPollo.join(', ');

                                // Crear una fila de la tabla con los datos de la orden
                                const fila = `
                                                <tr>
                                                    <td>${orden.id}</td>
                                                    <td>${orden.serie_orden}</td>
                                                    <td>${orden.cantidad_pollos}</td>
                                                    <td>${orden.peso_total_bruto}</td>
                                                    <td>${orden.cantidad_jabas}</td>
                                                    <td>${orden.tara}</td>
                                                    <td>${orden.peso_total_neto}</td>
                                                    <td> <input type="number" class="form-control" step="0.01" id="price"> </td>
                                                    <td class="subtotal">${orden.subtotal}</td>
                                                    <td> ${presentacionesPolloStr}</td>
                                                    <td> ${tiposPolloStr}</td>
                                                    <td>
                                                        <a href="/ordenes-de-despacho/${orden.id}/a4" target="_blank" class="btn btn-info">Detalles</a>
                                                    </td>
                                                    <td>
                                                        <button class="btn btn-danger btnEliminarOrden">Eliminar</button>
                                                    </td>
                                                </tr>
                                            `;
                                // Añadir la fila a la tabla
                                $('#ordenesTbody').append(fila);
                            });


                            deudaAnterior = parseFloat(response.cliente.deuda_anterior) || 0.00; // Usar valor de deuda anterior de la respuesta
                            // Calcular el total a pagar (total venta + deuda anterior)
                            totalPagar = (totalVenta + deudaAnterior) - saldo;

                            // Mostrar el total en el resumen de transacción
                            $('#resumenPesoNeto').text(totalPesoNeto.toFixed(2));
                            $('#resumenTotalVenta').text(totalVenta.toFixed(2));
                            $('#resumenDeudaAnterior').text(deudaAnterior.toFixed(2));
                            $('#resumenTotalPagar').text(totalPagar.toFixed(2));
                            $('#saldo').val(saldo);



                        } else {
                            // Si no hay órdenes, mostrar un mensaje
                            $('#ordenesTbody').append(
                                '<tr><td colspan="8" class="text-center">No se encontraron órdenes.</td></tr>'
                            );
                        }
                    },
                    error: function(xhr, status, error) {
                        console.log('Error:', error);
                    }
                });
            });


            $('#ordenesTbody').on('click', '.btnEliminarOrden', function() {
                // Eliminar la fila correspondiente al botón de eliminar
                $(this).closest('tr').remove();
                // Si necesitas actualizar algún cálculo después de eliminar la fila (como totalPesoNeto, totalVenta, etc.)
                recalcularTotales();
            });





            $(document).on('change', '#price', function() {
                // Obtener la fila en la que se encuentra el input de precio
                const fila = $(this).closest('tr');

                // Obtener el precio ingresado en el campo de entrada
                const precio = parseFloat($(this).val()) || 0;

                // Obtener el valor de pesoNeto de la misma fila, en la columna correspondiente (columna 7, índice 6)
                const pesoNeto = parseFloat(fila.find('td').eq(6).text()) || 0;

                // Calcular el subtotal
                const subtotal = precio * pesoNeto;

                // Mostrar el subtotal en la consola
                console.log("Subtotal calculado:", subtotal);

                // Actualizar el subtotal en la columna correspondiente de la misma fila (columna 9, índice 8)
                fila.find('td').eq(8).text(subtotal.toFixed(2)); // Actualizamos la columna Subtotal

                recalcularTotales();
            });

            // Función para recalcular los totales
            function recalcularTotales() {
                let totalPesoNeto = 0;
                let totalVenta = 0;
                let deudaAnterior = parseFloat($('#resumenDeudaAnterior').text()) || 0;
                let saldo = parseFloat($('#saldo').val()) || 0;
                let totalPagar = 0;

                // Recorremos todas las filas para sumar el peso neto y el subtotal
                $('#ordenesTbody tr').each(function() {
                    const pesoNeto = parseFloat($(this).find('td').eq(6).text()) || 0;
                    const subtotal = parseFloat($(this).find('.subtotal').text()) || 0;

                    totalPesoNeto += pesoNeto;
                    totalVenta += subtotal;
                });

                // Calcular el total a pagar (total venta + deuda anterior)
                totalPagar = (totalVenta + deudaAnterior) - saldo;

                // Mostrar los totales actualizados en el resumen
                $('#resumenPesoNeto').text(totalPesoNeto.toFixed(2));
                $('#resumenTotalVenta').text(totalVenta.toFixed(2));
                $('#resumenTotalPagar').text(totalPagar.toFixed(2));
            }




            // Función para obtener la fecha en formato YYYY-MM-DD en la zona horaria local
            function getLocalDateString() {
                const today = new Date();
                const year = today.getFullYear();
                const month = String(today.getMonth() + 1).padStart(2, '0'); // Meses empiezan en 0
                const day = String(today.getDate()).padStart(2, '0');
                return `${year}-${month}-${day}`;
            }
            // Establecer la fecha actual en el campo de entrada de fecha
            document.getElementById('fecha_venta').value = getLocalDateString();

            $('#btnGenerar').on('click', function(event) {
                event.preventDefault(); // Evita el envío inmediato del formulario

                const clienteId = $('#cliente_id').val();
                const serie_venta = $('#serie_venta').val();
                const fecha_venta = $('#fecha_venta').val();

                const selectedOrders = [];
                $('#ordenesTbody tr').each(function() {
                    const ordenId = $(this).find('td').eq(0)
                        .text(); // Obtener el ordenId de la primera celda (índice 0)

                    // Obtener los datos de la fila
                    const orden = {
                        id: ordenId,
                        subtotal: parseFloat($(this).find('td').eq(6)
                            .text()), // Obtienes el subtotal de la orden
                        pesoNeto: parseFloat($(this).find('td').eq(7)
                            .text()) // Obtienes el peso neto de la orden
                    };
                    selectedOrders.push(orden);
                });

                if (selectedOrders.length === 0) {
                    Swal.fire({
                        icon: 'error',
                        title: '¡Información!',
                        text: 'Por favor, seleccione al menos una orden.',
                    })
                    return;
                }

                // Capturar los valores de las celdas del resumen
                const totalPesoNeto = parseFloat($('#resumenPesoNeto').text());
                const totalVenta = parseFloat($('#resumenTotalVenta').text());
                const totalPagar = parseFloat($('#resumenTotalPagar').text());
                const deudaAnterior = parseFloat($('#resumenDeudaAnterior').text());
                const montoRecibido = 0;

                const comentario = $('#comentario').val();

                const ventaData = {
                    'cliente_id': clienteId,
                    'serie_venta': serie_venta,
                    'fecha_venta': fecha_venta,
                    'peso_neto': totalPesoNeto,
                    'forma_de_pago': 1,
                    'monto_total': totalVenta,
                    'monto_recibido': montoRecibido,
                    'monto_pendiente': totalPagar - montoRecibido,
                    'deuda_anterior': deudaAnterior,
                    'comentario': comentario,
                    'ordenes_despacho_ids': selectedOrders.map(orden => orden.id)
                }

                console.log(ventaData);


                Swal.fire({
                    title: "CONFIRMACIÓN",
                    text: "¿Está seguro de registrar la Orden de Venta?",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#3085d6",
                    cancelButtonText: "Cancelar",
                    cancelButtonColor: "#d33",
                    confirmButtonText: "Si, Registrar"
                    }).then((result) => {
                    if (result.isConfirmed) {
                        // Realizar la solicitud AJAX para registrar la venta
                        $.ajax({
                            url: '{{ route('ventas.store') }}', // Asegúrate de que esta URL sea la correcta
                            type: 'POST',
                            data: ventaData,
                            success: function(response) {
                                Swal.fire({
                                    icon: 'success',
                                    title: 'Éxito',
                                    text: 'Orden de venta genera correctamente.',
                                    showConfirmButton: false,
                                    timer: 1000
                                }).then(() => {
                                    location.reload(); // Recarga la página después de mostrar la alerta
                                });
                            },
                            error: function(xhr, status, error) {
                                console.log('Error:', error);

                                let errorMessage = 'Ocurrió un error al procesar la solicitud.';
                                if (xhr.responseJSON && xhr.responseJSON.message) {
                                    errorMessage = xhr.responseJSON.message; // Si el backend envía un mensaje de error específico
                                }

                                Swal.fire({
                                    icon: 'error',
                                    title: 'Error',
                                    text: errorMessage,
                                });
                            }
                        });
                    }
                });
            });

            //seleccionar la forma de pago 0 contado, 1 credito
            $('#forma_de_pago').change(function() {
                var selectedValue = $(this).val();
                var metodoPagoSelect = $('#metodo_pago_id');

                // Valor del método de pago para "Crédito"
                var metodoPagoCreditoValue =
                    '5'; // Asegúrate de que este valor coincida con el valor real para "Crédito"

                if (selectedValue == '1') { // Si se selecciona "Crédito"
                    metodoPagoSelect.val(metodoPagoCreditoValue); // Selecciona el método de pago "Crédito"

                    let saldo = $('#monto_total').val();

                    $('#monto_recibido').val('0.00');
                    $('#monto_recibido').prop('readonly', true);
                    $('#checkPagoCompleto').prop('readonly', true);
                    $('#saldo').val(saldo);
                    $('#checkPagoCompleto').prop('disabled', true);


                } else {
                    metodoPagoSelect.val(
                        '1'); // Selecciona un valor por defecto, o podrías dejarlo en blanco
                    $('#saldo').val('0.00');
                    $('#monto_recibido').prop('readonly', false);
                    $('#checkPagoCompleto').prop('disabled', false);
                }
            });

            //check calculo del monto completo
            $('#checkPagoCompleto').change(function() {
                if ($(this).is(':checked')) {
                    // Obtener el monto total a pagar
                    var montoTotal = parseFloat($('#monto_total').val()) || 0;

                    // Establecer el monto recibido igual al monto total a pagar
                    $('#monto_recibido').val(montoTotal);

                    // Calcular y mostrar el saldo
                    $('#saldo').val('0.00');
                } else {
                    // Si no está marcado, limpiar los campos
                    $('#monto_recibido').val('0.00');
                    $('#saldo').val('0.00');
                }
            });

            //calcular el monto recibido
            $('#monto_recibido').on('input', function() {
                var montoTotal = parseFloat($('#monto_total').val()) || 0;
                var montoRecibido = parseFloat($(this).val()) || 0;

                // Calcular y mostrar el saldo
                var saldo = montoTotal - montoRecibido;
                $('#saldo').val(saldo.toFixed(2));
            });


            //ruta de pdf
            // Variable global para guardar la URL del PDF
            let pdfUrl_a4 = '';
            let pdfUrl_ticket = ''

            // Suponiendo que la URL se obtiene cuando se registra el documento
            function setPrint(venta) {
                $('#btnDocumentA4').attr('href', venta.url_pdf);
                $('#btnDocumentTicket').attr('href', venta.url_ticket);
            }
            //btnReload pagina
            $('#btnReloadPage').click(function(e) {
                e.preventDefault();
                window.location.reload(); // Opcional: recargar la página
            });



        });
    </script>
@stop