@extends('layouts.dashboard')

@section('title','Lista firmas')

@section('breadcrumb')
<x-breadcrumb :items="[
        ['name' => 'Inicio', 'url' => route('home')],
        ['name' => 'Reportes', 'url' => route('reportes.index')],
        ['name' => 'Conductores', 'url' => route('reportes.conductores')],
        ['name' => 'Firmas equipaje'],
    ]" />
<br>
@endsection
    
@section('content')
<div class="container-fluid tableContainer p-0 border rounded sidebar-dark-primary" style="min-height:150px">
    <div class="border rounded-top d-flex justify-content-between align-items-center px-4 bg-primary-subtle">
        <span class="text-left text-light fs-5 fw-medium py-1">Resultado firma equipaje</span>
        <a class="btn fw-bold my-2 btn-warning" href="{{ route('reportes.conductores') }}">Volver</a>
    </div>

    <div class="botonBoostrapTable">
         <button id="exportar" 
            onclick="exportarExcel('exportar', `{{ route('firmaEquipaje.cargarData') }}` , 'Firmas_Conductores_Politica_Equipaje')"
            class="btn fw-bold ms-4 mt-4 bg-success"> 
            Descargar Excel 
        </button>
    </div>
   
    <div style="padding:1.5em">
        <table
            id="reporteFirmaEquipaje"
            class="table table-sm table-striped"
            data-page-size="25"
            data-toggle="table"
            data-locale="es-ES"
            data-search="true"
            data-pagination="true"
            data-detail-view="true"
            data-detail-formatter="detalleReporteFirmaEquipaje"
            data-check-on-init="true"
            data-url="{{ route('firmaEquipaje.cargarData') }}">   
            <thead class="table-primary">
                <tr class="bg-primary">
                    <th data-field="nombre_completo" data-sortable="true">Nombre Completo</th>
                    <th data-field="identificacion" data-sortable="true">Identificación</th>
                    <th data-field="codigo" data-sortable="true">Codigo</th>
                    <th class="text-center" data-field="fecha_registro" data-sortable="true">Fecha firma</th>
                    <th class="text-center" data-field="hora_registro" data-sortable="true">Hora firma</th>
                </tr>
            </thead>
        </table>
    </div>
</div>
@endsection 

@pushOnce('script')
    @vite(['resources/js/cargarModal.js'])
    <script>
        document.addEventListener("DOMContentLoaded", () => {
        initTablaBootstrapTable(
            '#reporteFirmaEquipaje', 
            { protegidas: ['NomCon'] }, 
            'detalleReporteFirmaEquipaje'
        );
    });
    </script>
@endpushOnce