@extends('layouts.dashboard')

@section('css')
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/css/bootstrap.css">
  <link rel="stylesheet" href="https://cdn.datatables.net/1.11.3/css/dataTables.bootstrap4.min.css">
@endsection

@section('content')

<div class="container-fluid">
    <div class="row">
        <div class="col-12 col-md-12">
            <div class="card">
                <div class="card-header card-header-primary">
                    <h4 class="card-title">Servicios</h4>
                    <p class="card-category">Estado de los servicios a la fecha</p>
                      <a href="" class="user-add text-white">
                          <i class="material-icons">post_add</i>
                      </a>
                </div>
                <div class="card-body table-responsive">
                    <table class="table table-hover" id="table02">
                        <thead class="text-warning">
                          <th style="width:45px">ID</th>
                          <th style="width:380px">Servicio</th>
                          <th style="width:360px">Ministerio</th>
                          <th>Código</th>
                          <th>incentivo</th>
                          <th>Meta</th>
                          <th>Ejercicio 01</th>
                          <th>Ejercicio 02</th>
                          <th>Ejercicio 03</th>
                        </thead>
                        <tbody>
                            @foreach($services as $service)
                            <tr>
                                <td>{{$service->id}}</td>
                                <td>{{$service->name}}</td>
                                <td>{{$service->ministry->name}}</td>
                                <td>{{$service->code}}</td>
                                <td>{{$service->incentivo}}</td>
                                <td>{{$service->meta}}</td>
                                <td><a href="">Archivo_1</a></td>
                                <td><a href="">Archivo_2</a></td>
                                <td><a href="">Archivo_3</a></td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>        
    </div>
</div>

@endsection