@props(['deans'])
<div class="p-3 border fs-3 fw-bold text-secondary table-hover table-striped">
    <span class="fas fa-list"></span> LIST OF DEANS
</div>
<div class="table-responsive">
    <table class="table tablebordered table-primary">
        <thead>
            <tr>
                <th>Names</th>
                <th>Faculty</th>
                <th>Date</th>
                <th>Status</th>
            </tr>
        </thead>
        @forelse ($deans as $i=>$dean)
            <tr>
                <th>{{ ++$i }}</th>
                <td class="text-uppercase">{{ $dean->staff->fname }} {{ $dean->staff->mname }} {{ $dean->staff->lname }}</td>
                <td>{{ $dean->faculty->name }}</td>
                <td>
                    <form action="" class="deanstatus" method="POST" onsubmit="event.preventDefault();">
                        @csrf
                        @method('put')
                        <span class="status">{{ $dean->active?'Active':'Inactive' }}</span>
                        <span onclick="$.fn.ConfirmV2(event,$(this).parents('form.deanstatus'),$(this).parents('form.deanstatus').find('span.status'),'',$(this).next(),'/dean/update-status/{{ $dean->dean_id }}','','','','',false,false,'');" class="fas fa-refresh p-1 border border-danger bg-danger rounded-circle" title="Change status" style="cursor: pointer;"></span>
                        <x-notify/>
                    </form>
                    
                </td>
            </tr>
        @empty
            <tr>
                <th colspan="4">
                    <span class="fas fa-info-circel text-danger fs-1"></span> The list is empty (Not found)!
                </th>
            </tr>
        @endforelse
    </table>
</div>