@extends('layouts.index', ['subHeader' => 'Dashboard'])

@section('header')
    <a href="{{ route('home') }}" class="text-decoration-none text-dark">Dashboard / Home</a>
@endsection

@section('js')
    <script>
        $('#tabla_recursosd').DataTable({
            dom: `<'row d-flex align-items-center justify-content-between'
                        <'col-8 d-flex align-items-center'f>
                        <'col-4 d-flex align-items-center justify-content-end'B>>
                    <'table-responsive'tr>
                    <'row'<'col-sm-12 col-md-5 d-flex align-items-center justify-content-center justify-content-md-start'i><'col-sm-12 col-md-7 d-flex align-items-center justify-content-center justify-content-md-end'p>>`,
        })
    </script>
@endsection

@section('content')
<div>
    <div class="contanier">
        <div class="shadow-s p-4">
            <div class="table-responsive">
        <table id="tabla_recursosd" class="table table-striped table-hover" id="tablaRecursos">
            <thead>
                <tr>
                    <th scope="col" class="grayt">Consecutivo</th>
                    <th scope="col" class="grayt">Compañía Solicitante</th>
                    <th scope="col" class="grayt">Ceco</th>
                    <th scope="col" class="grayt">Proveedor</th>
                    <th scope="col" class="grayt">Área solicitante </th>
                    <th scope="col" class="grayt">Ciudad</th>
                    <th scope="col" class="grayt">Clase de Servicio</th>
                    <th scope="col" class="grayt">Analista Gestor</th>
                    <th scope="col" class="grayt">Estado del Servicio</th>
                    <th scope="col" class="grayt">Acciones</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($recursos as $recurso)
                    <tr>
                        <th scope="row">{{$recurso?->consecutivo ?? 'N/A'}}</th>
                        <td>{{$recurso?->entidad?->nombre ?? 'N/A'}}</td>
                        <td>{{$recurso?->ceco ?? 'N/A'}}</td>
                        <td>{{$recurso?->proveedor?->nombre ?? 'N/A'}}</td>
                        <td>{{$recurso?->area?->nombre ?? 'N/A'}}</td>
                        <td>{{$recurso?->ciudadOrigen?->nombre ?? 'N/A'}}</td>
                        <td>{{$recurso?->claseServicio->nombre ?? 'N/A'}}</td>
                        <td>{{$recurso?->analistaGestor?->nombre_personal ?? 'N/A'}}</td>
                        <td>{{$recursos_nombre_estado[$recurso?->estado_servicio] ?? 'N/A'}}</td>
                        <td>
                            <a type="button" href="{{ route('registros.edit', ['id' => $recurso?->id ?? 'N/A']) }}" class="btn btn-outline-p">
                                <i class="bi bi-eye-fill"></i>
                            </a>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    </div>
</div>
</div>
@endsection