@extends('layouts.main')

@section('breadcrumbs')
    {{ Breadcrumbs::render(request()->route()->getName()) }}
@endsection

@section('content')
    @push('styles')
        <style>
            .border-l-primary {
                border-left-color: #0d6efd !important;
            }
        </style>
    @endpush
    <div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
        <div class="card">
            <div class="card-header" id="advanced_settings_appearance">
                <h3 class="card-title">
                    Activity Permohonan
                </h3>
                <div class="flex items-center gap-2">
                    <a href="{{ route('activity.index') }}" class="btn btn-xs btn-info"><i class="ki-filled ki-exit-left"></i>
                        Back</a>
                </div>
            </div>
            <div class="card-body lg:py-7.5 grid grid-cols-3">
                <div class="mb-5">
                    <h3 class="text-md font-medium text-gray-900">
                        Nomor Register Permohonan:
                    </h3>
                    <span class="text-2sm text-gray-700">
                        {{ $permohonan->nomor_registrasi }}
                    </span>
                </div>

                <div class="mb-5">
                    <h3 class="text-md font-medium text-gray-900">
                        Pemohon:
                    </h3>
                    <span class="text-2sm text-gray-700">
                        {{ $permohonan->user->nik }} | {{ $permohonan->user->name }} | {{ $permohonan->user->branch->name }}
                    </span>
                </div>

                <div class="mb-5">
                    <h3 class="text-md font-medium text-gray-900">
                        Tujuan Permohonan:
                    </h3>
                    <span class="text-2sm text-gray-700">
                        {{ $permohonan->tujuanPenilaian->name }}
                    </span>
                </div>

            </div>
        </div>

        <div class="card grow" id="activity_2024">
            <div class="card-header">
                <h3 class="text-md font-medium text-gray-900">
                    Status Activity
                </h3>
            </div>
            <div class="card-body">
                <div class="flex flex-col">
                    @foreach ($status_permohonan as $index => $status)
                        {{-- Cek apakah status adalah "Revisi" dan status permohonan tidak sama, maka tidak ditampilkan --}}
                        @if (strtolower($status->name) == 'revisi' && strtolower($status->name) != strtolower($permohonan->status))
                            @continue
                        @endif

                        <div class="flex items-start relative">
                            @if ($index > 0)
                                <div
                                    class="w-9 left-0 top-9 absolute bottom-0 translate-x-1/2
                                    {{ strtolower($status->name) == strtolower($permohonan->status) ? 'border-l border-l-primary' : 'border-l border-l-gray-300' }}">
                                </div>
                            @endif

                            <div
                                class="flex items-center justify-center shrink-0 rounded-full
                                {{ strtolower($status->name) == strtolower($permohonan->status) ? 'btn-outline btn-primary' : 'bg-gray-100 border-gray-300 text-gray-600' }}
                                size-9">
                                @switch(strtolower($status->name))
                                    @case('order')
                                        <i class="ki-filled ki-handcart text-base"></i>
                                        @break

                                    @case('revisi')
                                        <i class="ki-filled ki-notepad-edit text-base"></i>
                                        @break

                                    @case('register')
                                        <i class="ki-filled ki-note-2 text-base"></i>
                                        @break

                                    @case('assign')
                                        <i class="ki-filled ki-file-added"></i>
                                        @break

                                    @case('survey')
                                        <i class="ki-filled ki-map text-base"></i>
                                        @break
                                    @case('proses laporan')
                                        <i class="ki-filled ki-paper-plane text-base"></i>
                                        @break
                                    @case('approved')
                                        <i class="ki-filled ki-check text-base"></i>
                                        @break
                                    @case('delivered')
                                        <i class="ki-filled ki-delivery-3 text-base"></i>
                                        @break
                                    @default
                                        <i class="ki-filled ki-information text-base"></i>
                                @endswitch

                            </div>
                            @include('lpj::activity.components.status')
                        </div>
                    @endforeach
                </div>
            </div>
            <div class="card-footer justify-center">
                <!-- Add footer content if necessary -->
            </div>
        </div>
    </div>
@endsection