@extends('adminlte::page')

@section('title', 'Inventario')
@section('plugins.Datatables', true)
@section('content_header')
    <h1>Detalle de Ajustes</h1>
@stop

@section('content')

    <div class="card">
        <div class="card-body">

            <div class="row mb-3">
                <div class="col-md-3">
                    <label for="searchDate">Buscar por Fecha:</label>
                    <input type="date" id="searchDate" class="form-control" value="{{ date('Y-m-d') }}">
                </div>
                <div class="col-md-2" style="margin-top: 30px">
                    <button id="filterButton" class="btn btn-primary mr-2">
                        <i class="fas fa-search"></i> Buscar
                    </button>
                    <button id="clearFilterButton" class="btn btn-secondary">
                        <i class="fas fa-times"></i> Limpiar
                    </button>
                </div>
            </div>

            <div class="table-responsive">

                <table class="table table-bordered" id="ajustesTable">
                    <thead>
                        <tr>
                            <th>Fecha</th>
                            <th>Usuario</th>
                            <th>Tipo de Ingreso</th>
                            <th>Tipo de Ajuste</th>
                            <th>Tipo de Pollo</th>
                            <th>Cantidad</th>
                            <th>Peso</th>
                            <th>Descripción</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($ajustes as $ajuste)
                            <tr>
                                <td>{{ $ajuste->created_at->format('d/m/Y') }}</td>
                                <td>{{ $ajuste->user->name }}</td>
                                <td>
                                    {{ $ajuste->tipo_ingreso_id == 1 ? 'CAMION' : 'STOCK' }}
                                </td>
                                <td>
                                    @if($ajuste->tipo_ajuste == 1)
                                        <span class="badge bg-success">Ingreso</span>
                                    @elseif($ajuste->tipo_ajuste == 2)
                                        <span class="badge bg-danger">Salida</span>
                                    @elseif($ajuste->tipo_ajuste == 3)
                                        <span class="badge bg-info">Transferencia</span>
                                    @else
                                        <span class="badge bg-secondary">Otro</span>
                                    @endif
                                </td>
                                <td>{{ $ajuste->tipoPollo->descripcion }}</td>
                                <td>{{ $ajuste->cantidad_pollos }}</td>
                                <td>{{ $ajuste->peso_neto }}</td>
                                <td>{{ $ajuste->descripcion }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            <div class="volver-lista-ajustes mt-3">
                <a href="{{ route('inventarios.index') }}" class="btn btn-warning">
                    <i class="fas fa-list"></i> Lista de Inventario</a>
            </div>
        </div>
    </div>
@stop

@section('css')

@stop

@section('js')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.4/moment.min.js"></script>

    <script>
        $(document).ready(function() {
            var table = $('#ajustesTable').DataTable({
                "language": {
                    "url": "/js/spanish.json"
                },
                "order": [
                    [0, 'desc']
                ],
                "lengthMenu": [
                    [10, 25, 50, -1],
                    [10, 25, 50, "Todos"]
                ],
                "columnDefs": [
                    {
                        "type": "date",
                        "targets": 0,
                        "render": function(data, type, row) {
                            if (type === 'sort' || type === 'type') {
                                // Para ordenamiento, usar formato ISO
                                return moment(data, 'DD/MM/YYYY').format('YYYY-MM-DD');
                            }
                            return data; // Para mostrar, mantener formato original
                        }
                    }
                ],
                "pageLength": 10
            });



            // Modificar el filtro para usar created_at
            $('#filterButton').on('click', function() {
                var selectedDate = $('#searchDate').val(); // Esto será '2025-04-28'

                if (selectedDate) {
                    // Convertimos al formato que usa la tabla: 'DD/MM/YYYY'
                    var formattedDate = moment(selectedDate).format('DD/MM/YYYY');

                    // Buscamos exactamente esa fecha en la columna (por ejemplo, la columna 0)
                    table.column(0).search('^' + formattedDate + '$', true, false).draw();
                } else {
                    table.column(0).search('').draw();
                }
            });

            // Limpiar filtro
            $('#clearFilterButton').on('click', function() {
                $('#searchDate').val('');
                table.column(0).search('').draw();
            });


        });
    </script>
@stop