@extends('layouts.app')

@section('content')
    <div class="row">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h4 class="card-title mb-0">Historial de Movimientos - {{ $producto->alias }}</h4>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-sm table-striped">
                            <thead>
                                <tr>
                                    <th>Fecha</th>
                                    <th>Tipo</th>
                                    <th class="text-end">Cantidad</th>
                                    <th class="text-end">Stock Anterior</th>
                                    <th class="text-end">Stock Nuevo</th>
                                    <th>Referencia</th>
                                    <th>Usuario</th>
                                    <th>Comentario</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($movimientos as $mov)
                                    <tr>
                                        <td>{{ $mov->created_at->format('d/m/Y H:i') }}</td>
                                        <td>{!! $mov->tipo_badge !!}</td>
                                        <td class="text-end">{{ number_format($mov->cantidad, 2) }}</td>
                                        <td class="text-end">{{ number_format($mov->stock_anterior, 2) }}</td>
                                        <td class="text-end">{{ number_format($mov->stock_nuevo, 2) }}</td>
                                        <td>{{ $mov->referencia_tipo ?? '-' }}</td>
                                        <td>{{ $mov->user->name ?? '-' }}</td>
                                        <td>{{ $mov->comentario ?? '-' }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="8" class="text-center">No hay movimientos registrados</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title mb-0">Información del Producto</h5>
                </div>
                <div class="card-body">
                    <p class="mb-1"><strong>Producto:</strong> {{ $producto->alias }}</p>
                    <p class="mb-1"><strong>Clave:</strong> {{ $producto->clave_producto }}</p>
                    <p class="mb-1"><strong>Unidad:</strong> {{ $producto->unidad_medida ?? '-' }}</p>
                    <hr>
                    <p class="mb-1"><strong>Stock Actual:</strong>
                        <span class="badge {{ $producto->stock <= $producto->stock_minimo ? 'bg-danger' : 'bg-success' }}">
                            {{ number_format($producto->stock, 2) }}
                        </span>
                    </p>
                    <p class="mb-1"><strong>Stock Mínimo:</strong> {{ number_format($producto->stock_minimo, 2) }}</p>
                    <p class="mb-1"><strong>Precio:</strong> ${{ number_format($producto->precio, 2) }}</p>
                </div>
            </div>

            @can('inventario-editar')
                <div class="card mt-3">
                    <div class="card-header">
                        <h5 class="card-title mb-0">Actualizar Stock Mínimo</h5>
                    </div>
                    <div class="card-body">
                        <form id="form-minimos">
                            @csrf
                            <input type="hidden" name="producto_id" value="{{ $producto->id }}">
                            <div class="mb-3">
                                <label for="stock_minimo" class="form-label">Stock Mínimo</label>
                                <input type="number" class="form-control" name="stock_minimo" step="0.01" min="0" value="{{ $producto->stock_minimo }}">
                            </div>
                            <button type="submit" class="btn btn-primary w-100">Actualizar</button>
                        </form>
                    </div>
                </div>
            @endcan

            <div class="mt-3">
                <a href="{{ route('inventario.index') }}" class="btn btn-secondary w-100">Volver al Listado</a>
            </div>
        </div>
    </div>
@endsection
@push('javascript')
    <script>
        $('#form-minimos').on('submit', function(e) {
            e.preventDefault();
            var parameters = new FormData(this);
            parameters.append('_method', 'PUT');
            submit_with_ajax("{{ route('inventario.actualizarMinimos') }}", 'POST', parameters,
                function(data) {
                    Swal.fire({
                        title: 'Alerta',
                        text: data.message,
                        icon: 'success',
                        timer: 1000,
                        onClose: () => {
                            location.reload();
                        }
                    });
                });
        });
    </script>
@endpush