@extends('layouts.main')

@section('breadcrumbs')
    {{ Breadcrumbs::render('laporan-monitoring') }}
@endsection

@section('content')
    <div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
        <!-- Filter Card -->

        <!-- Data Table Card -->
        <div class="card border border-agi-100 card-grid min-w-full" data-datatable="false" data-datatable-page-size="10"
            data-datatable-state-save="false" id="laporan-hasil-penilaian-jaminan-internal-external-table"
            data-api-url="{{ route('laporan-hasil-penilaian-jaminan-internal-external.data') }}">
            <div class="card-header bg-agi-50 py-5 flex-wrap">
                <h3 class="card-title">
                    Rekap Progres Pengerjaan Laporan Penilai
                </h3>
            </div>

            <div class="card-body">
                <div class="scrollable-x-auto">
                    <table class="table table-auto table-border align-middle text-gray-700 font-medium text-sm"
                        data-datatable-table="true">
                        <thead>
                            <tr>
                                <th class="w-14">
                                    <input class="checkbox checkbox-sm" data-datatable-check="true" type="checkbox" />
                                </th>
                                <th class="min-w-[150px]" data-datatable-column="nama_penilai">
                                    <span class="sort"> <span class="sort-label"> Nama Penilai </span>
                                        <span class="sort-icon"> </span> </span>
                                </th>
                                <th class="min-w-[150px]" data-datatable-column="total_task">
                                    <span class="sort"> <span class="sort-label"> Total Task </span>
                                        <span class="sort-icon"> </span> </span>
                                </th>

                                <th class="min-w-[150px]" data-datatable-column="actions">
                                    <span class="sort"> <span class="sort-label"> Aksi </span>
                                        <span class="sort-icon"> </span> </span>
                                </th>
                            </tr>
                        </thead>
                        @php
                            $sortedTeamsActivity = $result['teamsActivity']->sortBy(function ($item) {
                                return $item->team->regions->penilaiTeam
                                    ->filter(function ($penilaiTeam) {
                                        $permohonan = optional($penilaiTeam->penilaian)->permohonan;
                                        return $permohonan !== null;
                                    })
                                    ->count();
                            });
                        @endphp
                        <tbody>
                            @foreach ($sortedTeamsActivity as $teamActivity)
                             @php
                        $totalTask = countPermohonanForUser($teamActivity->user->id);
                    @endphp
                                <tr>
                                    <td class="w-14">
                                        <input class="checkbox checkbox-sm" data-datatable-check="true" type="checkbox" />
                                    </td>
                                    <td class="min-w-[150px]">
                                        {{ $teamActivity->user->name }}
                                    </td>
                                    <td class="min-w-[150px]">
                                        {{ $totalTask }}
                                    </td>

                                    <td class="min-w-[150px]">
                                        <a href="{{ route('laporan-monitoring.show', $teamActivity->user->id) }}"
                                            class="btn btn-sm btn-primary">
                                            <i class="ki-outline ki-eye"></i>
                                            Lihat
                                        </a>
                                    </td>
                                </tr>
                            @endforeach

                        </tbody>


                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection