@extends('layouts.app')

@section('content')
    <div class="text-center mt-3">
        <h1 class="mb-5">Control de Trazabilidad</h1>
    </div>

    @if (session('success'))
        <div class="alert alert-success">
            {{ session('success') }}
        </div>
    @endif

    <form action="{{ route('trazabilidades.filtrarTrazabilidades') }}" method="GET" class="mb-2 form-filter">
        <div class="row">

            <div class="col-md-2">
                <label for="tipo_movimiento" style="margin-left: 15px;">Tipo de Movimiento:</label>
                <select name="tipo_movimiento" id="tipo_movimiento" class="form-select">
                    <option value="" disabled {{ !request()->filled('tipo_movimiento') ? 'selected' : '' }}>Seleccione
                    </option>
                    <option value="Ingreso" {{ request('tipo_movimiento') === 'Ingreso' ? 'selected' : '' }}>Ingreso
                    </option>
                    <option value="Egreso" {{ request('tipo_movimiento') === 'Egreso' ? 'selected' : '' }}>Egreso</option>
                </select>
            </div>

            <div class="col-md-2">
                <label for="articulo">Artículo:</label>
                <select name="articulo" id="articulo" class="form-select">
                    <option value="" disabled {{ !request()->filled('articulo') ? 'selected' : '' }}>Seleccione
                    </option>
                    @foreach ($articulos as $id => $articulo)
                        <option value="{{ $id }}" {{ (string) $id === request('articulo') ? 'selected' : '' }}>
                            {{ $articulo }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-2">
                <label for="rubro">Rubro:</label>
                <select name="rubro" id="rubro" class="form-select">
                    <option value="" disabled {{ !request()->filled('rubro') ? 'selected' : '' }}>Seleccione </option>
                    @foreach ($rubros as $id => $nombre)
                        <option value="{{ $id }}" {{ (string) $id === request('rubro') ? 'selected' : '' }}>
                            {{ $nombre }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-2">
                <label for="subrubro">SubRubro:</label>
                <select name="subrubro" id="subrubro" class="form-select">
                    <option value="" disabled {{ !request()->filled('subrubro') ? 'selected' : '' }}>Seleccione
                    </option>
                    @foreach ($subrubros as $id => $nombre)
                        <option value="{{ $id }}" {{ (string) $id === request('subrubro') ? 'selected' : '' }}>
                            {{ $nombre }}
                        </option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-2">
                <label for="numeroSerie">Nº de serie:</label>
                <input type="text" name="numeroSerie" id="numeroSerie" class="form-control"
                    value="{{ request('numeroSerie') }}">
            </div>
            <div class="col-md-2">
                <label for="fecha_movimiento">Fecha del movimiento:</label>
                <input type="date" name="fecha_movimiento" id="fecha_movimiento" class="form-control"
                    value="{{ request('fecha_movimiento') }}">
            </div>

            <div class="col-md-3 mt-4">
                <button type="submit" class="btn btn-primary mb-1 mr-2"><i class="fas fa-filter"></i> Filtrar</button>
                <a href="{{ route('trazabilidades.index') }}" class="btn btn-success mb-1"><i class="fas fa-eraser"></i>
                    Limpiar filtro</a>
            </div>
        </div>
    </form>

    <div class="d-flex justify-content-center align-items-center" style="min-height: 30vh;">
        @if (count($trazabilidades) > 0)
            <div class="table-responsive" style="width: 90%;">
                <table class="table table-striped text-center" style="margin-top: 20px;">
                    <thead class="thead-light">
                        <tr>
                            <th>Movimiento</th>
                            <th>Artículo trazable</th>
                            <th>Numero de serie</th>
                            <th>Prefijo</th>
                            <th>Secuencia</th>
                            <th>Fecha del movimiento</th>
                            <th>Tipo Operacion</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($trazabilidades as $trazabilidad)
                            <tr>
                                <td>{{ $trazabilidad->movimiento->tipo_movimiento }}</td>
                                <td>{{ $trazabilidad->articuloTrazable->articulo->articulo }}</td>
                                <td>{{ $trazabilidad->articuloTrazable->numeroSerie }}</td>
                                <td>{{ $trazabilidad->articuloTrazable->prefijo->prefijo }}</td>
                                <td>{{ $trazabilidad->articuloTrazable->secuencia }}</td>
                                <td>{{ date('d/m/Y', strtotime($trazabilidad->movimiento->fecha_carga)) }}</td>
                                <td>{{ $trazabilidad->movimiento->tipoOpciones->tipoOpcion }}</td>
                                <td>
                                    <button type="button" class="btn btn-dark" data-toggle="modal"
                                        data-target="#detalleTrazabilidad{{ $trazabilidad->id }}"><i
                                            class="fas fa-info-circle"></i>
                                    </button>
                                </td>

                                <!-- Modal -->
                                <div class="modal fade" id="detalleTrazabilidad{{ $trazabilidad->id }}" tabindex="-1"
                                    role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">

                                    <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">Detalles de la Trazabilidad
                                                </h5>

                                                <button type="button" class="close" data-dismiss="modal"
                                                    aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>

                                            <div class="modal-body">
                                                <p>Movimiento: {{ $trazabilidad->movimiento->tipo_movimiento }}</p>
                                                <p>Cantidad: {{ $trazabilidad->movimiento->cantidad }}</p>
                                                <p>Nombre Articulo Trazable:
                                                    {{ $trazabilidad->articuloTrazable->articulo->articulo }}</p>
                                                <p>Fecha del movimiento:
                                                    {{ date('d/m/Y', strtotime($trazabilidad->movimiento->fecha_carga)) }}
                                                </p>
                                                <p>Tipo Operación:
                                                    {{ $trazabilidad->movimiento->tipoOpciones->tipoOpcion }}
                                                </p>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-secondary"
                                                    data-dismiss="modal">Cerrar</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @else
            <div class="alert alert-warning text-center">
                No se encontraron resultados.
            </div>
        @endif
    </div>
@endsection