@extends('metronic.base')
@section('extracss')
@endsection
@section('extrajs')
@endsection
@section('titulo')
    Orden de Producción
@endsection

@section('content')
    @include('sessions')
    @if (count($requisicionOP) <= 0)
        <div class="card shadow-sm mb-3">
            <div class="card-header">
                <h3 class="card-title">Agregar detalles a la orden</h3>
            </div>
            <div class="card-body">
                <form action="{{ Route('produccion.ordenProduccion-store-detail', $orderP->id) }}" method="POST"
                    enctype="multipart/form-data">
                    @csrf
                    <div class="row mb-6">
                        <div class="form-group col-sm-6 mb-5">
                            <label for="exampleFormControlInput1" class="required form-label">Producto</label>
                            <select class="form-select form-select-solid" data-control="select2" name="product_id"
                                id="product_id" aria-label="Select example" required>
                                <option selected disabled>Seleccione...</option>
                                @foreach ($productos as $producto)
                                    <option value="{{ $producto->id }}">{{ $producto->producto }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group col-sm-6 mb-5">
                            <label for="exampleFormControlInput1" class="required form-label">Unidad</label>
                            <select class="form-select form-select-solid" name="unidad_medida_id" id="unidad_medida_id"
                                aria-label="Select example" required>
                                <option selected disabled>Seleccione...</option>
                                @foreach ($unidadMedida as $unidad)
                                    <option value="{{ $unidad->id }}">{{ $unidad->unidad }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group col-sm-6 mb-5">
                            <label for="exampleFormControlInput1" class="required form-label">Cantidad</label>
                            <input type="number" class="form-control form-control-solid" name="cantidad" id="cantidad"
                                placeholder="Ingrese la cantidad" required />
                        </div>
                        <div class="form-group col-sm-6 mb-5">
                            <label for="exampleFormControlInput1" class="required form-label">Número de prioridad</label>
                            <input type="number" class="form-control form-control-solid" name="priority_number"
                                id="priority_number" placeholder="Ingrese el número de prioridad" required />
                        </div>
                    </div>
                    <div class="text-center">
                        <button type="submit" class="btn btn-primary"><i class='ki-outline ki-check-circle fs-2'></i> Guardar</button>
                    </div>
                </form>
            </div>
        </div>
    @endif
    <div class="card shadow-sm mb-3">
        <div class="card-header">
            <h3 class="card-title">Listado detalles a la orden</h3>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table class="table">
                    <thead>
                        <tr class="fw-bold fs-6 text-gray-800">
                            <th>Producto</th>
                            <th>U. Medida</th>
                            <th>Cantidad</th>
                            <th># Prioridad</th>
                            @if (count($requisicionOP) <= 0)
                                <th>Acciones</th>
                            @endif
                        </tr>
                    </thead>
                    <tbody>
                        @if (count($detalles) > 0)
                            @foreach ($detalles as $detalle)
                                <tr>
                                    <td>{{ $detalle->productos->producto }}</td>
                                    <td>{{ $detalle->unidades->unidad }}</td>
                                    <td>{{ $detalle->cantidad }}</td>
                                    <td>
                                        <!-- Botón para abrir el modal de cambio de prioridad -->
                                        <button type="button" class="btn btn-link p-0 m-0 align-baseline" data-bs-toggle="modal" data-bs-target="#priorityModal" data-priority="{{ $detalle->priority_number }}" data-product="{{ $detalle->productos->producto }}" data-id="{{ $detalle->id }}" style="background-color:none;" title="Editar prioridad">
                                            {{ $detalle->priority_number }}
                                        </button>
                                    </td>
                                    @if (count($requisicionOP) <= 0)
                                        <td>
                                            <div class="d-flex">
                                                <button id="btnListDetail"
                                                    class="btn btn-icon btn-sm btnListDetail"
                                                    data-id="{{ $detalle->id }}"
                                                    title="Mostrar matriz">
                                                    <i class="ki-outline ki-eye fs-2x text-primary mx-2"></i>
                                                </button>
                                                <form method="post"
                                                    action="{{ route('produccion.ordenProduccion-delete-detail', $detalle->id) }}">
                                                    @method('delete')
                                                    @csrf
                                                    <button type="submit" class="btn btn-icon btn-sm" title="Eliminar"><i
                                                            class="ki-outline ki-trash fs-2x text-danger mx-2"></i>
                                                    </button>
                                                </form>
                                            </div>
                                        </td>
                                    @endif
                                </tr>
                                
                                <script>
                                    document.querySelectorAll('.btnListDetail').forEach(function(button) {
                                        button.addEventListener('click', function() {
                                            // Obtén el ID del detalle desde el atributo de datos
                                            var detalleId = button.getAttribute('data-id');
                                            // Construye la URL con el ID
                                            var url = '/produccion/orden/show-detail/' + detalleId;
                                            var screenWidth = window.screen.width;
                                            var screenHeight = window.screen.height;
                                            var left = (screenWidth - 800) / 2;
                                            var top = (screenHeight - 600) / 2;
                                            window.open(url, 'Ventana Detalles', 'width=800,height=600,left=' + left + ',top=' + top);
                                        });
                                    });
                                </script>
                            @endforeach
                        @else
                        <tr>
                            <td colspan="5" class="text-center">No hay detalles que mostrar</td>
                        </tr>
                        @endif

                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Modal cambiar prioridad-->
    <div class="modal fade" id="priorityModal" tabindex="-1" aria-labelledby="priorityModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="priorityModalLabel">Producto: <span id="productName"></span></h5>
                    <button type="button" class="btn btn-icon btn-sm btn-active-light-danger ms-2" data-bs-dismiss="modal" aria-label="Close">
                        <i class="ki-outline ki-cross fs-1"></i>
                    </button>
                </div>
                <div class="modal-body">
                    Prioridad actual: <span id="priorityNumber"></span>
                    <br/>
                    <br/>
                    <form id="changePriorityForm" method="post">
                        @csrf
                        <div class="mb-3">
                            <label for="newPriority" class="form-label">Cambiar a nueva prioridad</label>
                            <input type="number" class="form-control" id="newPriority" name="newPriority" required>
                        </div>
                        <button type="submit" class="btn btn-primary">Guardar cambios</button>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
                </div>
            </div>
        </div>
    </div>

    <div class="card shadow-sm">
        <div class="card-header">
            <h3 class="card-title">Cuadro Resumen</h3>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <form action="{{ route('produccion.ordenProduccion-requisicion', $orderP->id) }}" method="post"
                    enctype="multipart/form-data">
                    @csrf
                    <table class="table table-bordered">
                        <thead>
                            <tr class="fw-bold fs-6 text-gray-800">
                                <th>Prioridad</th>
                                <th>Código</th>
                                <th>Producto</th>
                                <th>Cantidad OP</th>
                                <th>Cantidad disponible a fabricar</th>
                                <th>Cantidad de producción real</th>
                            </tr>
                        </thead>
                        <tbody>
                            {{-- @dd(count($cantidadBodegaReceta)) --}}
                            @if (count($cantidadBodegaReceta) > 0)
                                @foreach ($cantidadBodegaReceta as $item)
                                    <tr>
                                        <td>{{ $item['prioridad'] }}</td>
                                        <td>{{ $item['codigo'] }}</td>
                                        <td>{{ $item['producto'] }}</td>
                                        <td>{{ $item['cantidadOP'] }}</td>
                                        <td>
                                            @if ($item['cantidad_inv_bodega'] != null and $item['cantidad_inv_bodega'] >= $item['cantidadOP'])
                                                {{ $item['cantidadOP'] }}
                                            @elseif($item['cantidad_inv_bodega'] != null and $item['cantidad_inv_bodega'] < $item['cantidadOP'])
                                                {{ $item['cantidad_inv_bodega'] }}
                                            @elseif ($item['cantidad_inv_bodega'] == null)
                                                <span class="badge badge-secondary">Este producto no posee una matriz de
                                                    componentes</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if (count($requisicionOP) > 0)
                                                {{ $item['cantidad_real_produccion'] }}
                                            @else
                                                @if ($item['cantidad_inv_bodega'] != null)
                                                    <input type="text" class="form-control"
                                                        name="cantidad_a_producir[{{ $item['order_production_detail'] }}][{{ $item['cantidad_inv_bodega'] != null && $item['cantidad_inv_bodega'] >= $item['cantidadOP'] ? $item['cantidadOP'] : ($item['cantidad_inv_bodega'] != null && $item['cantidad_inv_bodega'] < $item['cantidadOP'] ? $item['cantidad_inv_bodega'] : '')   }}]"
                                                        value="{{ $item['cantidad_inv_bodega'] >= $item['cantidadOP'] ? $item['cantidadOP'] : $item['cantidad_inv_bodega'] }}">
                                                @else
                                                    <input type="text" class="form-control"
                                                        name="cantidad_a_producir[{{ $item['order_production_detail'] }}][{{ $item['cantidad_inv_bodega'] != null && $item['cantidad_inv_bodega'] >= $item['cantidadOP'] ? $item['cantidadOP'] : ($item['cantidad_inv_bodega'] != null && $item['cantidad_inv_bodega'] < $item['cantidadOP'] ? $item['cantidad_inv_bodega'] : '')   }}]"
                                                        value="0" readonly>
                                                @endif
                                            @endif
                                        </td>
                                    </tr>
                                @endforeach
                            @else
                                <tr>
                                    <td colspan="6" class="text-center">No hay resumen que mostrar</td>
                                </tr>
                            @endif

                        </tbody>
                    </table>
                    <input type="hidden" name="order_production_id" value="{{ $orderP->id }}">
                    <div class="text-center">
                        @if (count($requisicionOP) > 0)
                            <span class="badge badge-success">Ya se generó una requisición para esta orden</span>
                        @elseif (count($cantidadBodegaReceta) > 0)
                            <button type="submit" class="btn btn-primary">Generar requisición</button>
                        @endif
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script>
        document.getElementById('changePriorityForm').addEventListener('submit', function(event) {
        var newPriorityInput = document.getElementById('newPriority');
        var newPriorityValue = newPriorityInput.value;

        if (!Number.isInteger(Number(newPriorityValue))) {
            alert('Por favor, ingresa un número entero válido.');
            event.preventDefault(); // Evitar que el formulario se envíe si no se añade un entero
        }
    });

    var priorityModal = document.getElementById('priorityModal');
    priorityModal.addEventListener('show.bs.modal', function (event) {
        var button = event.relatedTarget; // Botón para activar modal
        //Extraer los datos relacionados al producto para el modal
        var priority = button.getAttribute('data-priority'); 
        var product = button.getAttribute('data-product'); 
        var id = button.getAttribute('data-id'); 

        var modalTitle = priorityModal.querySelector('#productName'); // Actualizar el nombre del producto en el encabezado del modal
        var modalBodyPriority = priorityModal.querySelector('#priorityNumber'); // Actualizar el número de prioridad en el cuerpo del modal
        var form = priorityModal.querySelector('#changePriorityForm'); // Obtener el formulario para cambiar la prioridad
        
        modalTitle.textContent = product; // Establecer el nombre del producto en el encabezado del modal
        modalBodyPriority.textContent = priority; // Establecer la prioridad actual en el cuerpo del modal
        form.action = '/produccion/orden/change-priority/' + id; // Establecer la acción del formulario para enviar la solicitud de actualización
    });
    </script>
@endsection
@section('extrajs')
@endsection