@extends('layouts.pro-logged-in')
@section('content')

<div class="d-flex mb-2">
    <div><i class="fa fa-users" aria-hidden="true"></i> Pros</div>
    <div class="ml-auto">
        <a class="btn btn-primary btn-sm" href="{{route('pro-create')}}">
            <i class="fa fa-plus-circle" aria-hidden="true"></i>
            Add new
        </a>
    </div>
</div>

<div class="table-responsive p-0">
<table class="table table-hover text-nowrap">
    <thead>
        <tr>
            <th>#</th>
            <th>cell_number</th>

            <th>email_address</th>

            <th>name_credential</th>
            <th>name_display</th>
            <th>name_first</th>
            <th>name_last</th>
            <th>name_middle</th>
            <th>name_prefix</th>
            <th>name_suffix</th>
            <th>is_active</th>
        </tr>
    </thead>
    <tbody>
        @foreach($pros as $pro)
        <tr>
            <td>{{$pro->id}}</td>

            <td><a href="{{route('pro-show', $pro->uid)}}">{{$pro->cell_number}}</a></td>

            <td><a href="{{route('pro-show', $pro->uid)}}">{{$pro->email_address}}</a></td>

            <td>{{$pro->name_credential}}</td>
            <td>{{$pro->name_display}}</td>
            <td>{{$pro->name_first}}</td>
            <td>{{$pro->name_last}}</td>
            <td>{{$pro->name_middle}}</td>
            <td>{{$pro->name_prefix}}</td>
            <td>{{$pro->name_suffix}}</td>

            <td>{{$pro->is_active}}</td>
        </tr>
        @endforeach
    </tbody>
</table>
</div>

@endsection