@extends('layouts.app')
@section('content')
    <div class="card">
        <div class="card-header d-flex justify-content-between">
            <div class="header-title">
                <h4 class="card-title">Recibir Mercancía - {{ $orden->folio }}</h4>
            </div>
        </div>
        <div class="card-body">
            <form action="#" method="POST" id="form-recepcion">
                @csrf
                <div class="table-responsive">
                    <table class="table table-bordered">
                        <thead class="table-light">
                            <tr>
                                <th>Producto</th>
                                <th class="text-end">Cantidad Ordenada</th>
                                <th class="text-end">Ya Recibida</th>
                                <th class="text-end">Pendiente</th>
                                <th class="text-center">Recibir Ahora</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($orden->detalles as $detalle)
                                @php
                                    $pendiente = $detalle->cantidad - $detalle->cantidad_recibida;
                                @endphp
                                <tr>
                                    <td>{{ $detalle->producto->alias ?? '-' }}</td>
                                    <td class="text-end">{{ number_format($detalle->cantidad, 2) }}</td>
                                    <td class="text-end">{{ number_format($detalle->cantidad_recibida, 2) }}</td>
                                    <td class="text-end">{{ number_format($pendiente, 2) }}</td>
                                    <td style="width: 150px;">
                                        <input type="number" class="form-control form-control-sm text-end"
                                               name="cantidades[{{ $detalle->id }}]"
                                               min="0" max="{{ $pendiente }}" step="0.01" value="0"
                                               {{ $pendiente <= 0 ? 'disabled' : '' }}>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
                <div class="mt-3">
                    <button type="submit" class="btn btn-success">Registrar Recepción</button>
                    <a href="{{ route('orden_compra.show', $orden->id) }}" class="btn btn-secondary">Cancelar</a>
                </div>
            </form>
        </div>
    </div>
@endsection
@push('javascript')
    <script>
        $('#form-recepcion').on('submit', function(e) {
            e.preventDefault();
            var parameters = new FormData(this);
            submit_with_ajax("{{ route('ordenCompra.registrarRecepcion', $orden->id) }}", 'POST', parameters,
                function(data) {
                    Swal.fire({
                        title: 'Alerta',
                        text: data.message,
                        icon: 'success',
                        timer: 1000,
                        onClose: () => {
                            location.href = "{{ route('orden_compra.show', $orden->id) }}";
                        }
                    });
                });
        });
    </script>
@endpush