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

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">
                    <h1 class="card-title">Editar Pedido</h1>
                </div>
                <div class="card-body">
                    <form action="{{ route('pedidos.store') }}" method="POST">

                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="">Fecha de pedido</label>
                                    <input type="hidden" id="pedidoId" value="{{ $pedido->id }}">
                                    <input type="date" name="fecha_pedido" id="fecha_pedido" class="form-control"
                                        value="{{ $pedido->fecha_pedido }}">
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="">Seleccionar Lista</label>
                                    <select name="tipo_lista" id="tipo_lista" class="form-control">
                                        <option value="0" {{ $pedido->lista_pedido == 0 ? 'selected' : '' }}>Pollo Vivo
                                        </option>
                                        <option value="1" {{ $pedido->lista_pedido == 1 ? 'selected' : '' }}>Pollo
                                            Beneficiado</option>
                                    </select>
                                </div>
                            </div>

                        </div>

                        <div class="row mb-3">

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="">Seleccionar cliente</label>
                                    <select name="cliente_id" id="cliente_id" class="form-control select2">
                                        @foreach ($clientes as $cliente)
                                            <option value="{{ $cliente->id }}"> {{ $cliente->nombre_comercial }} </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                        </div>

                        <div class="row">


                            <!-- Fila para Pollo Brasa y Promedio Brasa -->
                            <div class="col-md-2 mb-1">
                                <div class="form-group">
                                    <label for="cantidad_brasa">Pollo Hembra (Brasa)</label>
                                    <input type="number" name="cantidad_brasa" id="cantidad_brasa" class="form-control"
                                        value="0">
                                </div>
                            </div>

                            <div class="col-md-1 mb-1">
                                <div class="form-group">
                                    <label for="promedio_brasa" class="text-red">Promedio</label>
                                    <input type="number" name="promedio_brasa" id="promedio_brasa"
                                        class="form-control text-red" value="0">
                                </div>
                            </div>


                            <!-- Fila para Pollo Presa y Promedio Presa -->
                            <div class="col-md-2 mb-1">
                                <div class="form-group">
                                    <label for="cantidad_presa">Pollo Macho (Presa)</label>
                                    <input type="number" name="cantidad_presa" id="cantidad_presa" class="form-control"
                                        value="0">
                                </div>
                            </div>

                            <div class="col-md-1 mb-1">
                                <div class="form-group">
                                    <label for="promedio_presa" class="text-red">Promedio</label>
                                    <input type="number" name="promedio_presa" id="promedio_presa"
                                        class="form-control text-red" value="0">
                                </div>
                            </div>



                            <!-- Fila para Pollo Tipo y Promedio Tipo -->
                            <div class="col-md-2 mb-1">
                                <div class="form-group">
                                    <label for="cantidad_tipo">Pollo Tipo</label>
                                    <input type="number" name="cantidad_tipo" id="cantidad_tipo" class="form-control"
                                        value="0">
                                </div>
                            </div>

                            <div class="col-md-1 mb-1">
                                <div class="form-group">
                                    <label for="promedio_tipo" class="text-red">Promedio</label>
                                    <input type="number" name="promedio_tipo" id="promedio_tipo"
                                        class="form-control text-red" value="0">
                                </div>
                            </div>

                            <!-- Fila para Pollo Brasero y Promedio Brasero -->
                            <div class="col-md-2 mb-1">
                                <div class="form-group">
                                    <label for="cantidad_pollada">Pollo Brasero</label>
                                    <input type="number" name="cantidad_pollada" id="cantidad_pollada" class="form-control"
                                        value="0">
                                </div>
                            </div>

                            <div class="col-md-1 mb-1">
                                <div class="form-group">
                                    <label for="promedio_pollada" class="text-red">Promedio</label>
                                    <input type="number" name="promedio_pollada" id="promedio_pollada"
                                        class="form-control text-red" value="0">
                                </div>
                            </div>

                            <!-- Fila para Observación -->
                            <div class="col-lg-6 col-md-12 mb-4">
                                <div class="form-group">
                                    <label for="comentario">Observación</label>
                                    <textarea id="comentario" class="form-control" rows="3" placeholder="Escribe alguna observación aquí..."></textarea>
                                </div>
                            </div>



                        </div>

                        <div class="row">
                            <!-- Botón de Envío -->
                            <div class="col-lg-4 col-md-6">
                                <div class="form-group text-center">
                                    <button type="button" class="btn btn-success btn-block" id="btnAddDetail">AGREGAR A
                                        LISTA DE PEDIDOS</button>
                                </div>
                            </div>
                        </div>


                        <hr>
                        <h3 class="text-red font-weight-bold">DETALLES DEL PEDIDO</h3> <br>

                        <table class="table" id="detailsPedido" style="width: 100%">
                            <thead>
                                <tr>
                                    <th>#</th>
                                    <th>Cliente</th>
                                    <th>C. Brasa</th>
                                    <th class="text-red">Promedio</th>
                                    <th>C. Presa</th>
                                    <th class="text-red">Promedio</th>
                                    <th>C. Tipo</th>
                                    <th class="text-red">Promedio</th>
                                    <th>C. Brasero</th>
                                    <th class="text-red">Promedio</th>
                                    <th>Comentario</th>
                                    <th>Acción</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($detalles as $detalle)
                                    <tr>
                                        <td class="cliente_id">{{ $detalle->cliente_id }}</td>
                                        <td>{{ $detalle->cliente->razon_social }}</td>
                                        <td class="cantidadBrasa"> <input type="text" class="form-control" value="{{ $detalle->cantidad_brasa }}"> </td>
                                        <td class="promedioBrasa"> <input type="text" class="form-control" value="{{ $detalle->promedio_brasa }}"> </td>
                                        <td class="cantidadPresa"> <input type="text" class="form-control" value="{{ $detalle->cantidad_presa }}"> </td>
                                        <td class="promedioPresa"> <input type="text" class="form-control" value="{{ $detalle->promedio_presa }}"> </td>
                                        <td class="cantidadTipo"> <input type="text" class="form-control" value="{{ $detalle->cantidad_tipo }}"> </td>
                                        <td class="promedioTipo"> <input type="text" class="form-control" value="{{ $detalle->promedio_tipo }}"> </td>
                                        <td class="cantidadPollada"> <input type="text" class="form-control" value="{{ $detalle->cantidad_pollada }}"> </td>
                                        <td class="promedioPollada"> <input type="text" class="form-control" value="{{ $detalle->promedio_pollada }}"> </td>
                                        <td class="comentario">
                                            <textarea rows="1" class="form-control"> {{ $detalle->comentario }}  </textarea>
                                        </td>
                                        <td>
                                            <form action="" method="POST">
                                                @csrf
                                                @method('DELETE')
                                                <button type="button" class="btn btn-xs btn-danger btnEliminar mr-2"
                                                    data-cliente-id="{{ $detalle->cliente_id }}"
                                                    data-pedido-id="{{ $pedido->id }}">Eliminar</button>
                                                <a class="btn btn-info btn-xs btnEditDetail"
                                                    data-cliente-id="{{ $detalle->cliente_id }}"
                                                    data-pedido-id="{{ $pedido->id }}">Editar</a>
                                            </form>

                                        </td>
                                    </tr>
                                @endforeach
                                {{-- crear desde jquery --}}
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th>-</th>
                                    <th>-</th>
                                    <th id="totalBrasa">0</th>
                                    <th id="promedioBrasa">-</th>
                                    <th id="totalPresa">0</th>
                                    <th id="promedioPresa">-</th>
                                    <th id="totalTipo">0</th>
                                    <th id="promedioTipo">-</th>
                                    <th id="totalPollada">0</th>
                                    <th id="promedioPollada">-</th>
                                </tr>
                            </tfoot>
                        </table>

                        <div class="form-group mt-5">
                            @csrf
                            @method('PUT')
                            <button type="button" id="btnEditar" class="btn btn-success mr-1">Editar Lista de
                                pedidos</button>
                            <a type="button" href="{{ route('pedidos.index') }}" class="btn btn-warning">Lista de
                                pedidos</a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@stop

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

@section('js')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        document.addEventListener("DOMContentLoaded", function() {


            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });


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

                // Obtener los valores de los campos
                let idCliente = $('#cliente_id option:selected').val();
                let cliente = $('#cliente_id option:selected').text(); // Nombre del cliente
                let cantidadPresa = $('#cantidad_presa').val();
                let cantidadBrasa = $('#cantidad_brasa').val();
                let cantidadTipo = $('#cantidad_tipo').val();
                let cantidadPollada = $('#cantidad_pollada').val();

                //promedios
                let promedioPresa = $('#promedio_presa').val();
                let promedioBrasa = $('#promedio_brasa').val();
                let promedioTipo = $('#promedio_tipo').val();
                let promedioPollada = $('#promedio_pollada').val();
                let comentario = $('#comentario').val();

                // Verificar que los campos no estén vacíos
                if (cliente && cantidadPresa && cantidadBrasa) {
                    // Verificar si el cliente ya existe en la tabla
                    let clienteExistente = false;

                    // Iterar sobre las filas existentes en la tabla para verificar el cliente_id
                    $('#detailsPedido tbody tr').each(function() {
                        let clienteIdFila = $(this).find('.cliente_id')
                            .text(); // Obtener el cliente_id de la fila
                        if (clienteIdFila == idCliente) {
                            clienteExistente = true; // Si ya existe, marcar como existente
                            return false; // Salir del loop
                        }
                    });

                    // Si el cliente ya existe, mostrar un mensaje de advertencia
                    if (clienteExistente) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Cliente ya agregado',
                            text: 'Este cliente ya está en la lista de pedidos.',
                        });
                    } else {
                        // Crear una nueva fila para la tabla si el cliente no existe
                        var nuevaFila = `
                            <tr>
                                <td class="cliente_id">${idCliente}</td>
                                <td>${cliente}</td>
                                <td class="cantidadBrasa"> <input type="text" class="form-control" value="${cantidadBrasa}"> </td>
                                <td class="promedioBrasa"> <input type="text" class="form-control" value="${promedioBrasa}"> </td>
                                <td class="cantidadPresa"> <input type="text" class="form-control" value="${cantidadPresa}"> </td>
                                <td class="promedioPresa"> <input type="text" class="form-control" value="${promedioPresa}"> </td>
                                <td class="cantidadTipo"> <input type="text" class="form-control" value="${cantidadTipo}"> </td>
                                <td class="promedioTipo"> <input type="text" class="form-control" value="${promedioTipo}"> </td>
                                <td class="cantidadPollada"> <input type="text" class="form-control" value="${cantidadPollada}"> </td>
                                <td class="promedioPollada"> <input type="text" class="form-control" value="${promedioPollada}"> </td>
                                <td class="comentario"> <textarea rows="1" class="form-control"> ${comentario} </textarea> </td>
                                <td><button class="btn btn-danger btn-xs eliminar">Eliminar</button></td>
                            </tr>
                        `;

                        // Agregar la nueva fila a la tabla
                        $('table tbody').append(nuevaFila);

                        // Limpiar los campos del formulario
                        clearInputs();

                        // Actualizar totales si es necesario
                        updateTotals();
                    }
                } else {
                    // Si hay campos vacíos, mostrar un mensaje de error
                    Swal.fire({
                        icon: "error",
                        title: "Oops...",
                        text: "Por favor, complete todos los campos.",
                    });
                }

            });



            function clearInputs() {
                $('#cantidad_presa').val(0);
                $('#cantidad_brasa').val(0);
                $('#cantidad_tipo').val(0);
                $('#cantidad_pollada').val(0);
                $('#promedio_presa').val(0);
                $('#promedio_brasa').val(0);
                $('#promedio_tipo').val(0);
                $('#promedio_pollada').val(0);
                $('#comentario').val('');
            }



            // Eliminar fila de la tabla
            $('table').on('click', '.eliminar', function() {
                $(this).closest('tr').remove();
                updateTotals();
            });


            // Función para actualizar los totales
            function updateTotals() {
                let totalPresa = 0;
                let totalBrasa = 0;
                let totalTipo = 0;
                let totalPollada = 0;


                $('#detailsPedido tbody tr').each(function() {
                    totalPresa += parseInt($(this).find('.cantidadPresa input').val());
                    totalBrasa += parseInt($(this).find('.cantidadBrasa input').val());
                    totalTipo += parseInt($(this).find('.cantidadTipo input').val());
                    totalPollada += parseInt($(this).find('.cantidadPollada input').val());
                });

                $('#totalPresa').text(totalPresa);
                $('#totalBrasa').text(totalBrasa);
                $('#totalTipo').text(totalTipo);
                $('#totalPollada').text(totalPollada);
            }



            //Update controller Pedidos
            $('#btnEditar').on('click', function() {
                var detalles = [];

                $('#detailsPedido tbody tr').each(function() {
                    let clienteId = $(this).find('.cliente_id').text();
                    let cantidadPresa = $(this).find('.cantidadPresa input').val();
                    let cantidadBrasa = $(this).find('.cantidadBrasa input').val();
                    let cantidadTipo = $(this).find('.cantidadTipo input').val();
                    let cantidadPollada = $(this).find('.cantidadPollada input').val();
                    let promedioPresa = parseFloat($(this).find('.promedioPresa input').val());
                    let promedioBrasa = parseFloat($(this).find('.promedioBrasa input').val());
                    let promedioTipo = parseFloat($(this).find('.promedioTipo input').val());
                    let promedioPollada = parseFloat($(this).find('.promedioPollada input').val());
                    let comentario = $(this).find('.comentario').text();
                    detalles.push({
                        cliente_id: clienteId,
                        cantidad_presa: cantidadPresa,
                        cantidad_brasa: cantidadBrasa,
                        cantidad_tipo: cantidadTipo,
                        cantidad_pollada: cantidadPollada,
                        promedio_presa: promedioPresa,
                        promedio_brasa: promedioBrasa,
                        promedio_tipo: promedioTipo,
                        promedio_pollada: promedioPollada,
                        comentario: comentario
                    });
                });


                var data = {
                    fecha_pedido: $('#fecha_pedido').val(),
                    total_presa: $('#totalPresa').text(),
                    total_brasa: $('#totalBrasa').text(),
                    total_tipo: $('#totalTipo').text(),
                    total_pollada: $('#totalPollada').text(),
                    tipo_lista: $('#tipo_lista').val(),
                    detalle: detalles,
                    _token: $('input[name="_token"]').val(),
                };


                // Muestra confirmación antes de enviar el pedido
                Swal.fire({
                    title: '¿Estás seguro?',
                    text: "¡Vas a actualizar este pedido!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Sí, actualizar',
                    cancelButtonText: 'No, cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {

                        var pedidoId = $('#pedidoId').val();

                        $.ajax({
                            type: 'PUT',
                            url: `/pedidos/${pedidoId}`, // Cambia esto a la URL correcta
                            data: data,
                            success: function(response) {
                                // Mostrar mensaje de éxito con SweetAlert
                                Swal.fire(
                                    'Actualizado!',
                                    'El pedido se ha editado con éxito.',
                                    'success'
                                ).then(() => {
                                    window.location.href =
                                        '{{ route('pedidos.index') }}'; // Redirige después de éxito
                                });
                            },
                            error: function(xhr) {
                                // Verifica si hay un mensaje de error en la respuesta
                                let errorMessage =
                                    'No se pudo actualizar el pedido.'; // Mensaje por defecto
                                if (xhr.responseJSON && xhr.responseJSON.message) {
                                    errorMessage = xhr.responseJSON
                                        .message; // Mensaje personalizado del servidor
                                }

                                // Mostrar mensaje de error con SweetAlert
                                Swal.fire(
                                    'Error!',
                                    errorMessage,
                                    'error'
                                );
                                console.log(
                                    xhr); // Imprime la respuesta para depuración
                            }
                        });


                    }
                });
            });

            //update controller detalle pedidos

            $('.btnEditDetail').click(function(e) {
                e.preventDefault();
                const $fila = $(this).closest('tr');
                const pedidoId = $(this).data('pedido-id');
                const clienteId = $(this).data('cliente-id');


                let cantidadBrasa = $fila.find('td input').eq(0).val();
                let promedioBrasa = $fila.find('td input').eq(1).val();
                let cantidadPresa = $fila.find('td input').eq(2).val();
                let promedioPresa = $fila.find('td input').eq(3).val();
                let cantidadTipo = $fila.find('td input').eq(4).val();
                let promedioTipo = $fila.find('td input').eq(5).val();
                let cantidadPollada = $fila.find('td input').eq(6).val();
                let promedioPollada = $fila.find('td input').eq(7).val();
                let comentario = $fila.find('td.comentario textarea').val();

                var data = {
                    cantidad_presa: cantidadPresa,
                    promedio_presa: promedioPresa,
                    cantidad_brasa: cantidadBrasa,
                    promedio_brasa: promedioBrasa,
                    cantidad_tipo: cantidadTipo,
                    promedio_tipo: promedioTipo,
                    cantidad_pollada: cantidadPollada,
                    promedio_pollada: promedioPollada,
                    comentario: comentario,
                    _token: $('input[name="_token"]').val(),
                }

                // console.log(data);

                Swal.fire({
                    title: '¿Estás seguro?',
                    text: "¡Esta acción no se puede deshacer!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Sí, Editar',
                    cancelButtonText: 'No, cancelar'
                }).then((result) => {

                    if (result.isConfirmed) {

                        $.ajax({
                            url: `/detalle-pedidos/${pedidoId}/clientes/${clienteId}/update`,
                            type: "PUT",
                            data: data,
                            success: function(response) {
                                console.log(response);

                                Swal.fire(
                                    '¡Actualizado!',
                                    'El registro ha sido actualizado correctamente.',
                                    'success'
                                );
                                updateTotals();
                            },
                            error: function(xhr) {
                                Swal.fire(
                                    'Error!',
                                    'No se pudo editar el registro.',
                                    'error'
                                );
                            }
                        });
                    }

                });

            });

            //Delete controller detalle pedidos
            $('.btnEliminar').on('click', function() {
                const clienteId = $(this).data('cliente-id');
                const pedidoId = $(this).data('pedido-id');
                const row = $(this).closest('tr');

                Swal.fire({
                    title: '¿Estás seguro?',
                    text: "¡Esta acción no se puede deshacer!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Sí, eliminar',
                    cancelButtonText: 'No, cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        // Hacer la solicitud AJAX para eliminar el detalle
                        $.ajax({
                            url: `/detalle-pedidos/${pedidoId}/clientes/${clienteId}`, // Cambia esta URL según tu ruta
                            type: 'DELETE',
                            success: function(response) {
                                // Si la eliminación fue exitosa, eliminar la fila de la tabla
                                row.remove();

                                // Actualizar totales si es necesario
                                updateTotals();
                                Swal.fire(
                                    'Eliminado!',
                                    'El registro ha sido eliminado.',
                                    'success'
                                );
                            },
                            error: function(xhr) {
                                Swal.fire(
                                    'Error!',
                                    'No se pudo eliminar el registro.',
                                    'error'
                                );
                            }
                        });
                    }
                });
            });


            updateTotals();


            $(".select2").select2();
            $('#detailsPedido').DataTable({});

        });
    </script>
@stop