@extends('organizations.layouts.default')
@section('content')
    <main>
        <div class="max-w-screen-2xl mx-auto p-2 md:p-2 2xl:p-4">
            <div class="flex justify-between m-0 p-0">
                @include('organizations.layouts.partials.breadcrumb')
                <div class="">
                    <button onclick="printDiv('printable')"
                        class="mt-4 bg-brandBlue text-white px-4 py-2 rounded-lg hover:bg-brandOrange">
                        <i class="bi bi-printer"></i> Print
                    </button>
                </div>
                <div class="py-2">
                    <a type="button"
                        class="text-white bg-brandOrange hover:bg-brandBlue focus:outline-none focus:ring-4 focus:ring-red-300 font-medium rounded-full text-md px-5 py-2.5 text-center me-2 mb-2 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900"
                        href="{{ url()->previous() }}">
                        <i class="bi bi-arrow-left me-2"></i>Back
                    </a>
                </div>
            </div>
            <div class="flex flex-col gap-10 mt-2" id="printable">
                <div
                    class="rounded-sm border border-stroke bg-white px-5 pt-6 pb-2.5 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5 xl:pb-1">
                    <div class="max-w-full overflow-x-auto">
                        @if (count($evaluation) > 0)
                            <table class="w-full table-auto">
                                @php
                                    $groupedEvaluation = $evaluation->groupBy('criteria_name');
                                    $uniqueEvaluators = $evaluation->pluck('evaluators.name', 'evaluator_id')->unique();
                                @endphp
                                <thead>
                                    <tr class="bg-gray-2 text-left dark:bg-meta-4">
                                        <th
                                            class="font-semibold text-black dark:text-white xl:pl-11 border border-[#eee] py-4 px-2 dark:border-strokedark">
                                            S.N
                                        </th>
                                        <th
                                            class="border border-[#eee] py-4 px-2 dark:border-strokedark font-semibold text-black dark:text-white">
                                            Criteria</th>
                                        <th
                                            class="border border-[#eee] py-4 px-2 dark:border-strokedark font-semibold text-black dark:text-white">
                                            Full Mark</th>
                                        @foreach ($uniqueEvaluators as $evaluatorName)
                                            <th
                                                class="border border-[#eee] py-4 px-2 dark:border-strokedark font-semibold text-black dark:text-white">
                                                <p class="text-center border-b border-[#eee] p-2 dark:border-strokedark">
                                                    {{ $evaluatorName }}</p>
                                                <div class="grid grid-cols-2 gap-4">
                                                    <div>Obt. Mark </div>
                                                    <div> Remark</div>
                                                </div>
                                            </th>
                                        @endforeach
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($groupedEvaluation as $criteria => $results)
                                        <tr class="text-left">
                                            <td
                                                class="border border-[#eee] py-4 px-2 dark:border-strokedark font-semibold text-black dark:text-white xl:pl-11">
                                                {{ nepali_number($loop->iteration) }}.</td>
                                            <td class="border border-[#eee] py-4 px-2 dark:border-strokedark">
                                                {{ $criteria }}</td>
                                            <td class="border border-[#eee] py-4 px-2 dark:border-strokedark">
                                                {{ $results->first()->full_marks }}</td>
                                            @foreach ($uniqueEvaluators as $evaluatorId => $evaluatorName)
                                                @php
                                                    $marks =
                                                        $results->where('evaluator_id', $evaluatorId)->first()
                                                            ->obtained_marks ?? '-';
                                                    $remarks =
                                                        $results->where('evaluator_id', $evaluatorId)->first()
                                                            ->remarks ?? '-';
                                                @endphp
                                                <td class="border border-[#eee] py-4 px-2 dark:border-strokedark">
                                                    <div class="grid grid-cols-2 gap-4">
                                                        <div class="">{{ $marks }}</div>
                                                        <div class="">{{ $remarks }}</div>
                                                    </div>
                                                </td>
                                            @endforeach
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        @else
                            <p class="text-lg text-brandOrange font-semibold print:hidden">
                                Result not ready !!!
                            </p>
                        @endif

                        <div class="py-2">
                            @foreach ($evaluation->unique('evaluator_id') as $key => $summary)
                                <p class="font-semibold text-lg"> {{ $loop->index + 1 }} . Summary by
                                    {{ $summary->evaluators['name'] }} :
                                </p>
                                <div class="py-2">
                                    {!! $summary->summary ?? null !!}
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>

    <script>
        function printDiv(divId) {
            var divContents = document.getElementById(divId).innerHTML;
            var originalContents = document.body.innerHTML;

            document.body.innerHTML = "<html><head><title>Print</title></head><body>" + divContents + "</body>";
            window.print();
            document.body.innerHTML = originalContents;
        }
    </script>
@endsection