@extends('siswa.layouts.app')

@section('content')
<div class="section">
  <div class="section-header">
    <h1>{{ $materi->judul }}</h1>
    <div class="section-header-breadcrumb">
      <div class="breadcrumb-item active"><a href="{{ route('siswa.dashboard') }}">Dashboard</a></div>
      <div class="breadcrumb-item">Materi</div>
    </div>
  </div>

  <div class="section-body">
    <ul class="nav nav-tabs" id="materiTab" role="tablist">
      <li class="nav-item">
        <a class="nav-link active" id="isi-tab" data-toggle="tab" href="#isi" role="tab" aria-controls="isi" aria-selected="true">
          Isi Materi
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" id="tugas-tab" data-toggle="tab" href="#tugas" role="tab" aria-controls="tugas" aria-selected="false">
          Tugas
        </a>
      </li>
    </ul>

    <div class="tab-content mt-3" id="materiTabContent">
      {{-- Isi Materi --}}
      <div class="tab-pane fade show active" id="isi" role="tabpanel" aria-labelledby="isi-tab">
        <div class="card card-primary">
          <div class="card-body">
            {!! $materi->isi !!}

            {{-- Tampilkan file materi jika tersedia --}}
            @if($materi->file)
              <hr>
              <h5><i class="fas fa-file-alt"></i> File Materi</h5>
              <a href="{{ asset('storage/' . $materi->file) }}" target="_blank" class="btn btn-outline-success mt-2">
                <i class="fas fa-download"></i> Lihat / Unduh File Materi
              </a>
            @endif
          </div>
        </div>
      </div>

      {{-- Tugas --}}
      <div class="tab-pane fade" id="tugas" role="tabpanel" aria-labelledby="tugas-tab">
        @if($tugas->count() > 0)
          @foreach($tugas as $item)
            <div class="card card-info mb-4 shadow-sm">
              <div class="card-header">
                <h4 class="mb-0">
                  <i class="fas fa-tasks"></i> {{ $item->judul }}
                </h4>
              </div>
              <div class="card-body">
                <div class="mb-3">
                  <h6><strong>📝 Deskripsi Tugas:</strong></h6>
                  <div>{!! $item->deskripsi !!}</div>
                </div>

                @if($item->file)
                  <a href="{{ asset('storage/' . $item->file) }}" target="_blank" class="btn btn-outline-primary mb-3">
                    <i class="fas fa-file-alt"></i> Lihat File Tugas
                  </a>
                @endif

                <p>
                  <span class="badge badge-danger">
                    <i class="far fa-clock"></i> Deadline: {{ \Carbon\Carbon::parse($item->deadline)->format('d M Y H:i') }}
                  </span>
                </p>
                <hr>

                <h5><i class="fas fa-paper-plane"></i> Kirim Jawaban</h5>

                @php
                  $jawaban = $jawabanTugas[$item->id] ?? null;
                @endphp

                @if(session('success'))
                  <div class="alert alert-success">{{ session('success') }}</div>
                @endif

                @if($errors->any())
                  <div class="alert alert-danger">
                    <ul class="mb-0">
                      @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                      @endforeach
                    </ul>
                  </div>
                @endif

                @if($jawaban)
                  <div class="alert alert-info"><strong>✅ Jawaban sudah dikirim.</strong></div>

                  @if($jawaban->jawaban)
                    <p><strong>📄 Jawaban Teks:</strong></p>
                    <div class="bg-light border p-2 rounded mb-3">
                      {{ $jawaban->jawaban }}
                    </div>
                  @endif

                  @if($jawaban->file)
                    <p><strong>📎 File Jawaban:</strong></p>
                    <a href="{{ asset('storage/' . $jawaban->file) }}" target="_blank" class="btn btn-sm btn-outline-primary mb-3">
                      <i class="fas fa-file-download"></i> Lihat File Jawaban
                    </a>
                  @endif

                  @if(!is_null($jawaban->nilai))
                    <div class="alert alert-success mt-3">
                      <strong>🎯 Nilai Anda: {{ number_format($jawaban->nilai, 2) }}</strong>
                    </div>
                  @else
                    <div class="alert alert-warning mt-3">
                      Nilai belum diberikan.
                    </div>
                  @endif

                @else
                  <form action="{{ route('siswa.tugas.store', ['materi' => $materi->id, 'tugas' => $item->id]) }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="form-group">
                      <label for="jawaban_{{ $item->id }}">Jawaban Teks (opsional)</label>
                      <textarea name="jawaban" id="jawaban_{{ $item->id }}" class="form-control" rows="4" placeholder="Ketik jawaban Anda di sini...">{{ old('jawaban') }}</textarea>
                    </div>
                    <div class="form-group mt-3">
                      <label for="file_{{ $item->id }}">Upload File Jawaban (opsional)</label>
                      <input type="file" name="file" id="file_{{ $item->id }}" class="form-control" accept=".pdf,.docx,.jpg,.png,.mp4,.mov">
                    </div>
                    <button type="submit" class="btn btn-primary mt-3">
                      <i class="fas fa-paper-plane"></i> Kirim Jawaban
                    </button>
                  </form>
                @endif
              </div>
            </div>
          @endforeach
        @else
          <div class="alert alert-info">📭 Belum ada tugas untuk materi ini.</div>
        @endif
      </div>
    </div>
  </div>
</div>
@endsection