@extends('layouts.app')
@section('title', 'Officials | KDHC')
@section('content')
    <div class="container-fluid">
        @if (isset($officials) && count($officials) > 0)
            <div class="table-responsive">
                <table
                    class="table table-striped-columns
            table-hover
            table-bordered
            table-light
            align-middle">
                    <thead class="table-light">
                        <caption>Officials</caption>
                        <tr>
                            <th>#</th>
                            <th>Name</th>
                            <th>Phone number</th>
                            <th>Email</th>
                        </tr>
                    </thead>
                    <tbody class="table-group-divider">
                        @foreach ($officials as $key => $value)
                            <tr class="table-primary">
                                <td scope="row">{{ $key + 1 }}</td>
                                <td>{{ $value->name }}</td>
                                <td>{{ $value->contact }}</td>
                                <td>{{ $value->email }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                    <tfoot>

                    </tfoot>
                </table>
            </div>
        @else
            <div class="p-3">No officials registered</div>
        @endif
    </div>
@endsection