@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">

            @if (session('status'))
                <div class="col-12 alert alert-success mb-5">
                    {{ session('status') }}
                </div>
            @endif

            @if (session('warning'))
                <div class="col-12 alert alert-warning mb-5">
                    {{ session('warning') }}
                </div>
            @endif

            <div class="card">
                <div class="card-header card-header-primary">
                    <h4 class="card-title">Usuarios</h4>
                    <p class="card-category">Información de los usuarios a la fecha</p>
                      <a href="{{route('usuarios.create')}}" 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">Nombre</th>
                          <th style="width:360px">E-mail</th>
                          <th>Servicio</th>
                          <th>Rol</th>
                          <th>Acciones</th>
                        </thead>
                        <tbody>
                            @foreach($users as $user)
                            <tr>
                                <td>{{$user->id}}</td>
                                <td>{{$user->name}}</td>
                                <td>{{$user->email}}</td>
                                @if($user->service == null )
                                <td>No aplica</td>
                                @else 
                                <td>{{$user->service->name}}</td>
                                @endif
                                <td>{{$user->profile->name}}</td>
                                <td class="td-actions text-right">
                                <a href="{{route('usuarios.edit', $user->id)}}" class="text-white">
                                  <button type="button" rel="tooltip" title="Edit Task" class="btn btn-primary btn-link btn-sm">
                                    <i class="material-icons">edit</i>
                                  </button>
                                </a>
                                <a href="{{route('usuarios.show', $user->id)}}" class="text-white">
                                  <button type="button" rel="tooltip" title="Remove" class="btn btn-danger btn-link btn-sm">
                                    <i class="material-icons">close</i>
                                  </button>
                                </a>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>        
    </div>
</div>

@endsection