@php
    $user_role = Auth::User()->role();
@endphp
<div class="overflow-x-auto">
    <table class="w-full table-auto">
        <thead>
            <tr class="bg-primary-100 text-gray-500 text-xs tracking-wider">
                <th class="py-3 px-6">#</th>
                <th class="py-3 px-6">
                    <a class="flex"
                        href="{{ request()->fullUrlWithQuery(['order_by' => 'activity_id', 'sort_order' => $nextOrder]) }}">
                        <span>AID</span>
                        <span class="ml-1">
                            @include('backend.project.items.sort-icon', [
                                'sort_order' => $nextOrder,
                            ])
                        </span>
                    </a>
                </th>
                <th class="py-3 px-6">
                    <a class="flex"
                        href="{{ request()->fullUrlWithQuery(['order_by' => 'project_code', 'sort_order' => $nextOrder]) }}">
                        <span>MLIP</span>
                        <span class="ml-1">
                            @include('backend.project.items.sort-icon', [
                                'sort_order' => $nextOrder,
                            ])
                        </span>
                    </a>
                </th>
                <th class="py-3 px-6">Providership</th>
                <th class="py-3 px-6">Accred.</th>
                <th class="py-3 px-6">JP/EP</th>
                <th class="py-3 px-6 whitespace-nowrap">
                    <a class="flex"
                        href="{{ request()->fullUrlWithQuery(['order_by' => 'jp_cr_code', 'sort_order' => $nextOrder]) }}">
                        <span>JP/EP CR Code</span>
                        <span class="ml-1">
                            @include('backend.project.items.sort-icon', [
                                'sort_order' => $nextOrder,
                            ])
                        </span>
                    </a>
                </th>
                <th class="py-3 px-6">
                    <a class="flex"
                        href="{{ request()->fullUrlWithQuery(['order_by' => 'start_date', 'sort_order' => $nextOrder]) }}">
                        <span>RELEASE</span>
                        <span class="ml-1">
                            @include('backend.project.items.sort-icon', [
                                'sort_order' => $nextOrder,
                            ])
                        </span>
                    </a>
                </th>
                <th class="py-3 px-6">
                    <a class="flex"
                        href="{{ request()->fullUrlWithQuery(['order_by' => 'expiration_date', 'sort_order' => $nextOrder]) }}">
                        <span>EXPIRE</span>
                        <span class="ml-1">
                            @include('backend.project.items.sort-icon', [
                                'sort_order' => $nextOrder,
                            ])
                        </span>
                    </a>
                </th>
                <th class="py-3 px-6">
                    <a class="flex"
                        href="{{ request()->fullUrlWithQuery(['order_by' => 'activity_type', 'sort_order' => $nextOrder]) }}">
                        <span>Type</span>
                        <span class="ml-1">
                            @include('backend.project.items.sort-icon', [
                                'sort_order' => $nextOrder,
                            ])
                        </span>
                    </a>
                </th>
                <th class="py-3 px-6">PM</th>
                <th class="py-3 px-6">O/R</th>
                <th class="py-3 px-6 whitespace-nowrap">
                    <a class="flex"
                        href="{{ request()->fullUrlWithQuery(['order_by' => 'updated_at', 'sort_order' => $nextOrder]) }}">
                        <span>Last Updated</span>
                        <span class="ml-1">
                            @include('backend.project.items.sort-icon', [
                                'sort_order' => $nextOrder,
                            ])
                        </span>
                    </a>
                </th>
                <th class="py-3 px-6">Action</th>
            </tr>
        </thead>
        <tbody class="text-gray-600 text-xs">
            @if ($projects->count())
                @foreach ($projects as $index => $project)
                    <tr
                        class="border-b border-gray-100 font-normal @if ($project->is_ats_form_ready == 2) bg-yellow-50 hover:bg-yellow-100 @else hover:bg-gray-100 @endif">
                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ $index + $projects->firstItem() }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ $project->activity_id }}

                            </div>
                            <div class="flex justify-center">
                                <span
                                    class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium
                        bg-green-100 text-green-800">{{ $project->project_status->name }}</span>
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ $project->project_code }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ $project->providership }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ $project->accreditation_type_4_ipce }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                @if (isset($project->joint_provider->jp_code))
                                    {{ $project->joint_provider->jp_code }}
                                @else
                                    NA
                                @endif
                                /
                                @if (isset($project->educational_partner_1->ep_code))
                                    {{ $project->educational_partner_1->ep_code }}
                                @else
                                    NA
                                @endif
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ $project->jp_cr_code ?: 'NA' }} / {{ $project->ep_cr_code_1 ?: 'NA' }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ date('m/d/Y', strtotime($project->start_date)) }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ date('m/d/Y', strtotime($project->expiration_date)) }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <x-utilities.tooltip text="{{ $project->activity_type }}">
                                <div class="flex justify-start">
                                    {!! Str::words($project->activity_type, 1, ' ....') !!}
                                </div>
                            </x-utilities.tooltip>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                @if (isset($project->managedby->initials))
                                    {{ $project->managedby->initials }}
                                @else
                                @endif
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ $project->outcome_received_date ? 'Yes' : 'No' }}
                            </div>
                        </td>

                        <td class="py-2 text-left whitespace-nowrap">
                            <div class="flex justify-center">
                                {{ date('m/d/Y', strtotime($project->updated_at)) }}
                            </div>
                        </td>

                        <td class="py-2 text-left">
                            <div class="flex justify-center">
                                @include('backend.project.items.action-button')
                            </div>
                        </td>
                    </tr>
                @endforeach
            @else
                <tr class="text-gray-700 ">
                    <td colspan="5" class="px-4 py-3 text-center">
                        No Data Found
                    </td>
                </tr>
            @endif
        </tbody>
    </table>
    @include('backend.share.pagination', ['data' => $projects])
</div>