@extends('app')

{{-- Ponemos el script en la sección de contenido para que se cargue correctamente --}}
@section('content')
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<div class="container-fluid">
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <div class="panel panel-default">
                <div class="panel-heading"><center>Listado de Insumos</center></div>
                <div class="panel-body">
                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                        <ul class="nav navbar-nav navbar-right">				
                            <li><a href="{{ url('/admin') }}">Opciones</a></li> 
                            <li><a href="{{ url('/Mod_Insumos') }}"> Atras </a></li>
                        </ul>
                        <!-- Botón de agregar nuevo insumo -->
                        <div class="mb-3" style="margin-bottom: 20px;">
                            <a href="{{ route('insumos.create') }}" class="btn btn-success">
                                + Nuevo Insumo
                            </a>
                        </div>
                    </div>	
                    {!! Form::open(['route' => 'insumos.index', 'method' => 'GET', 'class' => 'form-inline', 'style' => 'margin-bottom: 20px;']) !!}
                        <div class="form-group">
                            {!! Form::label('idInsumo', 'Buscar por ID:') !!}
                            {{-- Usamos Request::get() para repoblar el campo con el valor de la búsqueda anterior --}}
                            {!! Form::text('idInsumo', Request::get('idInsumo'), ['class' => 'form-control', 'placeholder' => 'ID del Insumo']) !!}
                        </div>

                        <div class="form-group" style="margin-left: 15px;">
                            {!! Form::label('nombre_insumo', 'Buscar por Nombre:') !!}
                            {!! Form::text('nombre_insumo', Request::get('nombre_insumo'), ['class' => 'form-control', 'placeholder' => 'Nombre del Insumo']) !!}
                        </div>

                        <button type="submit" class="btn btn-primary" style="margin-left: 15px;">Buscar</button>
                        <a href="{{ route('insumos.index') }}" class="btn btn-default">Limpiar</a>
                    {!! Form::close() !!}

                    <!-- Tabla de insumos -->
                    <table class="table table-bordered table-striped">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>Nombre</th>
                                <th>Cantidad en Bodega</th>
                                <th>Cantidad Mínima</th>
                                <th>Estado</th>
                                <th>Acciones</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($insumos as $insumo)
                                <tr>
                                    <td>{{ $insumo->idInsumo }}</td>
                                    <td>{{ $insumo->nombre_insumo }}</td>
                                    <td>{{ $insumo->bodegaInsumo ? $insumo->bodegaInsumo->cantidad_bodega_insumo : '0' }}</td>
                                    <td>{{ $insumo->bodegaInsumo ? $insumo->bodegaInsumo->cantidad_minima_insumo : 'N/A' }}</td>
                                    <td>
                                        @if($insumo->estado == 0)
                                            <span class="label label-success">Activo</span>
                                        @else
                                            <span class="label label-danger">Inactivo</span>
                                        @endif
                                    </td>
                                    <td>
                                        <a href="{{ route('insumos.edit', $insumo->idInsumo) }}" class="btn btn-primary btn-sm">Editar</a>
                                        
                                        @if($insumo->estado == 0)
                                            {{-- Damos un ID único al formulario para identificarlo con JS --}}
                                            {!! Form::open(['route' => ['insumos.destroy', $insumo->idInsumo], 'method' => 'DELETE', 'style' => 'display:inline;', 'id' => 'form-inactivar-'.$insumo->idInsumo]) !!}
                                                {{-- Quitamos el onclick y añadimos una clase y un data-id --}}
                                                <button type="button" class="btn btn-danger btn-sm btn-inactivar" data-id="{{ $insumo->idInsumo }}">Inactivar</button>
                                            {!! Form::close() !!}
                                        @else
                                            {!! Form::open(['route' => ['insumos.restore', $insumo->idInsumo], 'method' => 'POST', 'style' => 'display:inline;', 'id' => 'form-activar-'.$insumo->idInsumo]) !!}
                                                <button type="button" class="btn btn-success btn-sm btn-activar" data-id="{{ $insumo->idInsumo }}">Activar</button>
                                            {!! Form::close() !!}
                                        @endif
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="6" class="text-center">No hay insumos registrados</td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>

                    <!-- Paginación -->
                    <div class="d-flex justify-content-center">
                        {!! $insumos->render() !!}
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>

{{-- SCRIPT PARA LAS ALERTAS --}}
<script>
    document.addEventListener('DOMContentLoaded', function() {
        
        // --- 1. ALERTA DE NOTIFICACIÓN (TOAST) ---
        // Revisa si hay un mensaje de éxito en la sesión
        @if (session('alert-success'))
            Swal.fire({
                toast: true,
                position: 'top-end',
                icon: 'success',
                title: "{{ session('alert-success') }}",
                showConfirmButton: false,
                timer: 3000,
                timerProgressBar: true
            });
        @endif

        // --- 2. ALERTA DE CONFIRMACIÓN PARA INACTIVAR ---
        // Selecciona todos los botones con la clase 'btn-inactivar'
        const inactivarBotones = document.querySelectorAll('.btn-inactivar');
        inactivarBotones.forEach(button => {
            button.addEventListener('click', function(event) {
                event.preventDefault(); // Previene el envío inmediato del formulario
                const insumoId = this.getAttribute('data-id');
                
                Swal.fire({
                    title: '¿Estás seguro?',
                    text: "¡El insumo será inactivado!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#d33',
                    cancelButtonColor: '#3085d6',
                    confirmButtonText: 'Sí, ¡inactivar!',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        // Si el usuario confirma, envía el formulario correspondiente
                        document.getElementById('form-inactivar-' + insumoId).submit();
                    }
                });
            });
        });

        // --- 3. ALERTA DE CONFIRMACIÓN PARA ACTIVAR ---
        const activarBotones = document.querySelectorAll('.btn-activar');
        activarBotones.forEach(button => {
            button.addEventListener('click', function(event) {
                event.preventDefault();
                const insumoId = this.getAttribute('data-id');

                Swal.fire({
                    title: '¿Estás seguro?',
                    text: "¡El insumo será activado!",
                    icon: 'info',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Sí, ¡activar!',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        document.getElementById('form-activar-' + insumoId).submit();
                    }
                });
            });
        });

    });
</script>
@endsection