@extends('layouts.teacher')

@section('title', 'Detail Tugas')
@section('header_title', 'Penilaian Tugas')


@section('content')
<div class="space-y-8">

    {{-- ================= DETAIL TUGAS ================= --}}
    <div class="bg-white rounded-xl shadow p-6">
        <h1 class="text-2xl font-bold mb-2">
            {{ $task->title }}
        </h1>

        <p class="text-gray-600 mb-4">
            {{ $task->description ?? '-' }}
        </p>

        <div class="grid grid-cols-2 gap-4 text-sm">
            <div>
                <span class="text-gray-500">Deadline</span><br>
                <strong>{{ \Carbon\Carbon::parse($task->deadline)->format('d M Y H:i') }}</strong>
            </div>

            <div>
                <span class="text-gray-500">Status</span><br>
                @if($task->is_active)
                    <span class="text-green-600 font-semibold">Aktif</span>
                @else
                    <span class="text-red-600 font-semibold">Nonaktif</span>
                @endif
            </div>
        </div>

        @if($task->attachment_path)
            <div class="mt-4">
                <a href="{{ $task->attachment_path }}"
                   class="inline-flex items-center gap-2 text-indigo-600 font-medium">
                    buka soal
                </a>
            </div>
        @endif
    </div>


        {{-- ================= MONITORING JAWABAN ================= --}}
        <div class="bg-white rounded-xl shadow p-6">
            <h2 class="text-xl font-bold mb-4">
                Monitoring Jawaban Siswa
            </h2>

            {{-- ================= ALERT ================= --}}
            @if(session('success'))
                <div class="mb-6 flex items-start gap-3 rounded-lg border border-green-200 bg-green-50 px-4 py-3 text-green-800">
                    <svg class="w-5 h-5 mt-0.5 text-green-600" fill="none" stroke="currentColor" stroke-width="2"
                        viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round"
                            d="M5 13l4 4L19 7" />
                    </svg>

                    <div class="text-sm font-medium">
                        {{ session('success') }}
                    </div>
                </div>
            @endif


            <form method="POST"
                action="{{ route('guru.tugas.feedback.bulk', $task->id) }}">
                @csrf

                <div class="overflow-x-auto">
                    <table class="w-full text-sm">
                        <thead class="bg-gray-100">
                            <tr>
                                <th class="p-3 text-left">Siswa</th>
                                <th class="p-3">Waktu Submit</th>
                                <th class="p-3">Status</th>
                                <th class="p-3">Jawaban</th>
                                <th class="p-3">Catatan</th>
                            </tr>
                        </thead>

                        <tbody>
                        @forelse($submissions as $s)
                            <tr class="border-b">
                                <td class="p-3 font-medium">{{ $s->name }}</td>

                                <td class="p-3 text-center">
                                    {{ $s->submitted_at
                                        ? \Carbon\Carbon::parse($s->submitted_at)->format('d M Y H:i')
                                        : '-' }}
                                </td>

                                <td class="p-3 text-center">
                                    @if($s->submitted_at)
                                        <span class="text-green-600 font-semibold">Terkirim</span>
                                    @else
                                        <span class="text-gray-400">Belum</span>
                                    @endif
                                </td>

                                <td class="p-3 text-center">
                                    @if($s->submission_link)
                                        <a href="{{ $s->submission_link }}"
                                        target="_blank"
                                        class="text-indigo-600 underline">
                                            Lihat Jawaban
                                        </a>
                                    @else
                                        -
                                    @endif
                                </td>

                                {{-- TEACHER_NOTE --}}
                                <td class="px-6 py-4">
                                    <input type="text"
                                        name="submissions[{{ $s->id }}][teacher_note]"
                                        value="{{ $s->teacher_note }}"
                                        class="w-full text-sm text-gray-600 border border-gray-300
                                                rounded-lg py-2 px-3 focus:ring-2
                                                focus:ring-indigo-500 outline-none"
                                        placeholder="Catatan untuk siswa">
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="5" class="p-4 text-center text-gray-500">
                                    Belum ada jawaban siswa
                                </td>
                            </tr>
                        @endforelse
                        </tbody>
                    </table>
                </div>

                {{-- TOMBOL SIMPAN --}}
                <div class="mt-6 flex justify-end">
                    <button type="submit"
                            class="px-6 py-2 bg-indigo-600 text-white rounded-lg
                                hover:bg-indigo-700 transition">
                        Simpan Catatan
                    </button>
                </div>
            </form>
        </div>


</div>
@endsection