@extends('layouts.plantillageneraltd')

        @section('title', 'Activación Garantias')

        @section('styles')
        <!-- Bootstrap CSS -->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
        <!-- Styles -->
        <link rel="stylesheet" href="assets/plugins/garanties/infoGarantias.css">
        @endsection

    @section('content')
        <div id="titleGarantias" class="container mt-3">
            <h1 style="font-family: 'HK Grotesk', sans-serif; margin-top: 1%; font-weight:bold;">Reporte Garantias</h1>
        </div>
        <div id="main-container" class="container-fluid">
            <div class="dropdown">
                <button class="btn btn-primary mb-3" data-bs-toggle="modal" data-bs-target="#columnSelectionModal">Seleccionar Columnas</button>
                <button class="btn btn-primary dropdown-toggle" id="exportar-data">Exportar Seleccionados</button>
                    <ul class="dropdown-menu" id="dropdownMenu" aria-labelledby="exportar-data">
                        <li><a class="dropdown-item" href="#" id="exportPdf">Exportar como PDF</a></li>
                        <li><a class="dropdown-item" href="#" id="exportExcel">Exportar como Excel</a></li>
                    </ul>
                <button class="btn btn-primary mb-3" id="showAll">Mostrar Todo</button>
                <button class="btn btn-primary mb-3" id="restoreView">Restaurar</button>
            </div>
                <div class="table-responsive">
                    <meta name="csrf-token" content="{{ csrf_token() }}">
                    <form id="filtroGarantias" method="POST" action="{{ route('mostrarGarantias.post') }}">
                        @csrf
                        <label for="fecha_inicio" class="label-filter">Fecha de Inicio:</label>
                        <input type="date" name="fecha_inicio" id="fecha_inicio" class="date-filter" required>

                        <label for="fecha_fin" class="label-filter">Fecha de Fin:</label>
                        <input type="date" name="fecha_fin" id="fecha_fin" class="date-filter" required>

                        <button class="btn-darks" type="submit">Filtrar</button>
                    </form>
                <table id="actGarantia" class="baterias-table" style="width:100%">
                    <thead>
                        <tr>
                            <th><input type="checkbox" class="input-checked" id="selectAll-data"></th>
                            <th>Id Activación Garantía</th>
                            <th>Código Garantía</th>
                            <th>Tipo de Batería</th>
                            <th>Modelo de Batería</th>
                            <th>Fecha de Activación</th>
                            <th>Estado</th>
                            <th>Linea de Vehículo</th>
                            <th>Marca Vehiculo</th>
                            <th>Modelo Vehiculo</th>
                            <th>Año Vehículo</th>
                            <th>Número de Placa</th>
                            <th>Kilometraje</th>
                            <th>Cant. Kilomentros por Garantia</th>
                            <th>Cant. Meses por Garantia</th>
                            <th>Fecha de Expiracion</th>
                            <th>Ced. Cliente</th>
                            <th>Nombre</th>
                            <th>Telefono</th>
                            <th>Correo</th>
                            <th>Terminos</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($garantias as $garantia)
                            <tr>
                                <td><input type="checkbox" class="select-row"></td>
                                <td>{{ $garantia->id_activacion_garantia }}</td>
                                <td>{{ $garantia->codigo_garantia }}</td>
                                <td>{{ $garantia->tipo_bateria }}</td>
                                <td>{{ $garantia->modelo }}</td>
                                <td>{{ $garantia->garantia_fecha_inicio }}</td>
                                <td>
                                    @if ($garantia->estado == 1)
                                        Activo
                                    @else
                                        Inactivo
                                    @endif
                                </td>
                                <td>{{ $garantia->tipo_linea }}</td>
                                <td>{{ $garantia->nombre_marca }}</td>
                                <td>{{ $garantia->nombre_modelo }}</td>
                                <td>{{ $garantia->nro_anio }}</td>
                                <td>{{ $garantia->placa }}</td>
                                <td>{{ $garantia->kilometraje }}</td>
                                <td>{{ $garantia->garantia_total_km }}</td>
                                <td>{{ (int)$garantia->meses_restantes }}</td>
                                <td>{{ $garantia->garantia_fecha_fin }}</td>
                                <td>{{ $garantia->cedula }}</td>
                                <td>{{ $garantia->nombres }}</td>
                                <td>{{ $garantia->telefono }}</td>
                                <td>{{ $garantia->correo }}</td>
                                <td>@if ($garantia->acepta_terminos == 1)
                                        Aceptado
                                    @else
                                        Rechazado
                                    @endif
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>

        @include('layouts_info_garantias.modalSeleccionarCampos')
    @endsection
    @section('scripts')
        <!-- jQuery -->
        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <script src="{{asset('/js/core/popper.min.js')}}"></script>
        <script src="{{asset('/js/core/bootstrap.min.js')}}"></script>
        <script src="{{asset('/js/plugins/perfect-scrollbar.min.js')}}"></script>
        <script src="{{asset('/js/plugins/smooth-scrollbar.min.js')}}"></script>
        <script src="{{asset('/js/plugins/chartjs.min.js')}}"></script>
        <script src="{{asset('js/core/bootstrap.bundle.min.js') }}"></script>
        <script async defer src="https://buttons.github.io/buttons.js"></script>
        <script src="https://kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script>
        <!-- Bootstrap JS -->
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.7/dist/umd/popper.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.5.21/jspdf.plugin.autotable.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.17.0/xlsx.full.min.js"></script>
        <!-- DataTables JS -->
        <script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
        <script src="{{ asset('js/infoGarantias.js') }}"></script>
        <script>  const mostrarGarantiasUrl = "{{ route('mostrarGarantias.post') }}";</script>
    @endsection