@extends('layouts.master')

@section('content')

<div class="max-w-7xl mx-auto">

    <!-- HEADER -->
    <div class="bg-white shadow rounded-lg p-6 mb-6">

        <div class="flex justify-between items-start">

            <div>

                <h1 class="text-3xl font-bold text-gray-800">

                    Training Session Details

                </h1>

                <p class="text-gray-500 mt-1">

                    Safe Skill Services ERP

                </p>

            </div>

            <div class="flex gap-3">

                <a href="{{ route('participants.create') }}"
                   style="background:blue;color:white;padding:10px 20px;border-radius:5px;">

                    + Add Participant
                </a>    

            </div>

        </div>

    </div> <!-- Header closes-->

    <!-- SESSION DETAILS -->
    <div class="grid grid-cols-2 gap-6 mb-6">

        <div class="bg-white shadow rounded-lg p-6">

            <h2 class="text-xl font-bold mb-4">

                Session Information

            </h2>

            <div class="space-y-3">

                <p>

                    <strong>Company:</strong>

                    {{ $training_session->company->company_name ?? '' }}

                </p>

                <p>

                    <strong>Training Subject:</strong>

                    {{ $training_session->trainingSubject->subject_name ?? '' }}

                </p>

                <p>

                    <strong>Training Date:</strong>

                    {{ $training_session->training_date }}

                </p>

                <p>

                    <strong>Training Location / Company:</strong>

                    {{ $training_session->venue }}

                </p>

                <p>

                    <strong>Trainer:</strong>

                    {{ $training_session->trainer?->trainer_name ?? $training_session->trainer_name }}

                </p>

                <p>

                    <strong>Site Name:</strong>

                    {{ $training_session->site_name }}

                </p>

            </div>

        </div>

        <!-- QUICK ACTIONS -->
        <div class="bg-white shadow rounded-lg p-6">

            <h2 class="text-xl font-bold mb-4">

                Quick Actions

            </h2>

            <div class="grid grid-cols-2 gap-4">
                           <a href="{{ route('training-sessions.preview-certificates',$training_session) }}"
                            class="bg-blue-600 text-white py-3 rounded text-center">

                            Preview Draft Certificates

                            </a>
                         <a href="{{ route('training-sessions.generate-certificates',$training_session) }}"
                            class="bg-orange-500 text-white py-3 rounded text-center">

                                Generate Final Certificates

                            </a>

                            @if($training_session->certificates_finalized)

                            <div class="col-span-2 mt-2 text-green-700 font-semibold">

                                ✔ Certificate numbers have been finalized.
                                Regenerating certificates will reuse the same numbers.

                            </div>

                            @endif
                        <a href="{{ route('training-session-documents.index',$training_session) }}"
                        class="bg-purple-600 text-white py-3 rounded text-center">

                            Manage Documents

                        </a>
                <a href="{{ route('training-sessions.download-template',$training_session->id) }}"

                class="bg-indigo-600 text-white py-3 px-4 rounded text-center hover:bg-indigo-700">

                    Download Excel Template

                </a>
                <form action="{{ route('training-sessions.import-participants',$training_session->id) }}"

                method="POST"

                enctype="multipart/form-data"

                class="col-span-2">

                @csrf

                <div class="flex gap-3">

                    <input type="file"
                        name="excel_file"
                        required
                        class="border p-2 rounded w-full">

                    <button type="submit"
                            class="bg-emerald-600 text-white px-5 rounded">

                        Upload Excel

                    </button>

                </div>

            </form>

            </div>

        </div>

    </div>

    <!-- PARTICIPANTS -->
    <div class="bg-white shadow rounded-lg p-6">

        <div class="flex justify-between items-center mb-4">

            <h2 class="text-2xl font-bold">

                Participants

            </h2>

            <span class="bg-blue-100 text-blue-700 px-4 py-1 rounded-full">

                Total:
                {{ $training_session->participants->count() }}

            </span>

        </div>

        <div class="overflow-x-auto">

            <table class="min-w-full">

                <thead class="bg-gray-100">

                    <tr>

                        <th class="px-4 py-3">ID</th>

                        <th class="px-4 py-3">Participant Name</th>

                        <th class="px-4 py-3">Designation</th>

                        <th class="px-4 py-3">Certificate No</th>

                        <th class="px-4 py-3">Issue Date</th>

                        <th class="px-4 py-3">Certificate</th>

                    </tr>

                </thead>

                <tbody>

                    @forelse($training_session->participants as $participant)

                        <tr class="border-b">

                            <td class="px-4 py-3">

                                {{ $participant->id }}

                            </td>

                            <td class="px-4 py-3">

                                {{ $participant->participant_name }}

                            </td>

                            <td class="px-4 py-3">

                                {{ $participant->designation }}

                            </td>

                            <td class="px-4 py-3">

                               @if($participant->certificate_no)

                                    {{ $participant->certificate_no }}

                                @else

                                <span class="bg-yellow-200 text-yellow-800 px-2 py-1 rounded">

                                Draft

                                </span>

                                @endif

                            </td>
                            <td class="px-4 py-3">

                            <div class="flex gap-2">

                                <a href="{{ route('participants.certificate-preview',$participant->id) }}"
                                target="_blank"
                                class="bg-blue-600 text-white px-3 py-1 rounded">

                                    Preview

                                </a>

                                <a href="{{ route('participants.certificate',$participant->id) }}"
                                class="bg-green-600 text-white px-3 py-1 rounded">

                                    Certificate

                                </a>

                            </div>

                        </td>

                            <td class="px-4 py-3">

                                {{ $participant->certificate_issue_date }}

                            </td>

                        </tr>

                    @empty

                        <tr>

                            <td colspan="6"
                                class="text-center py-10 text-gray-500">

                                No Participants Added

                            </td>

                        </tr>

                    @endforelse

                </tbody>

            </table>

        </div>

    </div>

</div>

@endsection