{{-- resources/views/public/guru/absensi_kbm_show.blade.php --}}
@php
    $user = auth()->user();
    $guru = \App\Models\Kepegawaian\Guru::where('email', $user->email)->first();
    $absensiStatuses = \App\Models\Akademik\AbsensiStatus::all();
    
    $jurnals = \App\Models\Kepegawaian\GuruAbsensiKbm::with(['statusAbsensi', 'tugas'])
                ->where('tanggal', $selectedDate)
                ->where('kelas_id', $kela->id)
                ->where('guru_id', $guru->id)
                ->get()->keyBy('mapel_id');
@endphp

@extends('layouts.app')
@section('title', 'Isi Absensi KBM - ' . ($setting->web_name ?? 'Sekolah'))

@section('content')
@include('public.guru._hero', ['user' => $user, 'guru' => $guru])

<section class="section light-background pt-3 pb-5">
    <div class="container" data-aos="fade-up">
        
        <div class="d-flex align-items-left align-items-md-center flex-column flex-md-row pt-2 pb-4">
            <div>
                <h3 class="fw-bold mb-1 text-dark">
                    <i class="fas fa-clipboard-check text-warning me-2"></i> Rombel: {{ $kela->rombel?->levelKelas?->level_kelas ?? '-' }} - {{ $kela->rombel?->rombel ?? '-' }} 
                    ({{ ($kela->rombel?->jenkel ?? '') == 'L' ? 'Putra' : 'Putri' }})
                </h3>
                <h6 class="op-7 mb-2 text-muted">Manajemen Jurnal Mengajar & Absensi Siswa. Semester {{ $kela->semester?->semester ?? '-' }}</h6>
            </div>
            <div class="ms-md-auto py-2 py-md-0">
                <a href="{{ route('guru.absensi_kbm') }}" class="btn btn-secondary btn-sm btn-round shadow-sm">
                    <i class="fa fa-arrow-left me-1"></i> Kembali ke Daftar Kelas
                </a>
            </div>
        </div>

        <ul class="nav nav-pills mb-4 bg-white p-2 rounded-4 shadow-sm" role="tablist">
            <li class="nav-item">
                <a class="nav-link {{ $activeTab == 'harian' ? 'active bg-warning text-dark fw-bold' : 'text-dark' }}" href="{{ request()->fullUrlWithQuery(['tab' => 'harian']) }}">
                    <i class="fa fa-edit me-1"></i> Input Harian
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{ $activeTab == 'minggu' ? 'active bg-warning text-dark fw-bold' : 'text-dark' }}" href="{{ request()->fullUrlWithQuery(['tab' => 'minggu']) }}">
                    <i class="fa fa-calendar-week me-1"></i> Rekap Mingguan
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{ $activeTab == 'bulan' ? 'active bg-warning text-dark fw-bold' : 'text-dark' }}" href="{{ request()->fullUrlWithQuery(['tab' => 'bulan']) }}">
                    <i class="fa fa-calendar-alt me-1"></i> Rekap Bulanan
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{ $activeTab == 'semester' ? 'active bg-warning text-dark fw-bold' : 'text-dark' }}" href="{{ request()->fullUrlWithQuery(['tab' => 'semester']) }}">
                    <i class="fa fa-book-open me-1"></i> Rekap Semester
                </a>
            </li>
        </ul>

        @if(session('success'))
            <div class="alert alert-success alert-dismissible fade show shadow-sm border-0 rounded-4" role="alert">
                <i class="fa fa-check-circle me-2"></i> {{ session('success') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        @endif

        @if($activeTab == 'harian')
            @php 
                $groupedJadwals = $jadwals->groupBy('mapel_id'); 
                $allJurnalFilled = ($groupedJadwals->count() > 0 && $groupedJadwals->count() == $jurnals->count());
            @endphp
            
            @if($groupedJadwals->count() > 0)
                @foreach($groupedJadwals as $mapelId => $jadwalGroup)
                    @php
                        $firstJadwal = $jadwalGroup->first();
                        $jurnalTersimpan = $jurnals->get($mapelId);
                        
                        $levelId = $kela->level_kelas_id ?? optional($kela->rombel)->level_kelas_id;
                        $masterMapelId = optional($firstJadwal->mapel)->mapel_nama_id ?? $firstJadwal->mapel_id;
                        
                        $kurikulum = \App\Models\Akademik\Kurikulum::where('tahun_ajaran_id', $kela->tahun_ajaran_id)
                                        ->where('level_kelas_id', $levelId)
                                        ->where('mapel_id', $masterMapelId)->first();
                        
                        $materiOptions = [];
                        if($kurikulum) {
                            $cpIds = \App\Models\Akademik\KurikulumCp::where('kurikulum_id', $kurikulum->id)->pluck('id');
                            $atps = \App\Models\Akademik\KurikulumAtp::whereIn('kurikulum_cp_id', $cpIds)->orderBy('id', 'asc')->get();
                            $urutan = 1;
                            foreach($atps as $atp) {
                                $matArr = json_decode($atp->materi, true);
                                if(is_array($matArr)) {
                                    foreach($matArr as $mat) {
                                        $cleanM = strip_tags($mat);
                                        if(!empty($cleanM)) { $materiOptions[] = ['no' => $urutan++, 'text' => $cleanM]; }
                                    }
                                } else {
                                    $cleanM = strip_tags($atp->materi);
                                    if(!empty($cleanM) && $cleanM != 'null') { $materiOptions[] = ['no' => $urutan++, 'text' => $cleanM]; }
                                }
                            }
                        }
                    @endphp

                    <div class="card card-round shadow-sm border-0 border-start border-warning border-5 mb-4 rounded-4">
                        <div class="card-body p-4">
                            <h5 class="fw-bold text-dark mb-1">
                                <i class="fas fa-chalkboard-teacher text-warning me-2"></i> Jurnal Mengajar: <span class="text-primary">{{ $firstJadwal->mapel->mapelNama->nama_mapel ?? '-' }}</span>
                            </h5>
                            
                            <div class="text-muted small mb-3">
                                <i class="far fa-calendar-check me-1"></i> Hari/Tanggal: <strong>{{ $namaHari }}, {{ \Carbon\Carbon::parse($selectedDate)->translatedFormat('d F Y') }}</strong>
                            </div>
                            
                            <div class="mb-4 d-flex flex-wrap align-items-center gap-2">
                                <span class="small fw-bold text-muted">Sesi Pembelajaran:</span>
                                @foreach($jadwalGroup as $j)
                                    @php
                                        $jamKe = optional($j->jamPelajaran)->jam_ke ?? '-';
                                        $waktu = $j->jamPelajaran ? date('H:i', strtotime($j->jamPelajaran->waktu_mulai)) . ' - ' . date('H:i', strtotime($j->jamPelajaran->waktu_selesai)) : '';
                                    @endphp
                                    <span class="badge bg-light text-dark border px-2 py-1 shadow-sm"><i class="far fa-clock text-muted me-1"></i>Jam ke-{{ $jamKe }} ({{ $waktu }})</span>
                                @endforeach
                            </div>
                            
                            <form action="{{ route('guru.absensi_kbm.jurnal') }}" method="POST" enctype="multipart/form-data">
                                @csrf
                                <input type="hidden" name="tanggal" value="{{ $selectedDate }}">
                                <input type="hidden" name="kelas_id" value="{{ $kela->id }}">
                                <input type="hidden" name="mapel_id" value="{{ $mapelId }}">
                                <input type="hidden" name="mapel_jadwal_id" value="{{ $firstJadwal->id }}">
                                <input type="hidden" name="guru_id" value="{{ $guru->id }}">
                                <input type="hidden" name="jumlah_jp" value="{{ $jadwalGroup->count() }}">

                                <div class="row g-3 mb-4">
                                    <div class="col-md-3">
                                        <label class="form-label small fw-bold text-muted mb-1">Status Kehadiran Guru</label>
                                        <select name="status_id" class="form-select border-primary-subtle" required>
                                            <option value="">-- Pilih --</option>
                                            @foreach($absensiStatuses as $st)
                                                <option value="{{ $st->id }}" {{ ($jurnalTersimpan && $jurnalTersimpan->status_id == $st->id) ? 'selected' : '' }}>{{ $st->nama_status }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    
                                    <div class="col-md-3">
                                        <label class="form-label small fw-bold text-muted mb-1">Bentuk Pembelajaran</label>
                                        <select name="bentuk_pembelajaran" class="form-select border-primary-subtle" required>
                                            <option value="">-- Pilih --</option>
                                            @foreach(['Tatap Muka', 'Online', 'Penugasan', 'Praktek'] as $bentuk)
                                                <option value="{{ $bentuk }}" {{ ($jurnalTersimpan && $jurnalTersimpan->bentuk_pembelajaran == $bentuk) ? 'selected' : '' }}>{{ $bentuk }}</option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label small fw-bold text-muted mb-1">Materi Pembelajaran (Dari ATP)</label>
                                        <select name="materi_pembelajaran" class="form-select border-primary-subtle" required>
                                            <option value="">-- Pilih Materi dari ATP --</option>
                                            @forelse($materiOptions as $opt)
                                                <option value="{{ $opt['text'] }}" {{ ($jurnalTersimpan && $jurnalTersimpan->materi_pembelajaran == $opt['text']) ? 'selected' : '' }}>
                                                    #{{ $opt['no'] }} - {{ \Illuminate\Support\Str::limit($opt['text'], 60) }}
                                                </option>
                                            @empty
                                                <option value="Materi Bebas" {{ ($jurnalTersimpan && $jurnalTersimpan->materi_pembelajaran == 'Materi Bebas') ? 'selected' : '' }}>Data ATP Kosong - Isi Manual / Bebas</option>
                                            @endforelse
                                        </select>
                                    </div>
                                </div>

                                <div class="row g-3 mb-4 mt-4 border border-secondary-subtle bg-light rounded-4 p-3">
                                    <div class="col-12 mb-1">
                                        <h6 class="fw-bold mb-0 text-primary"><i class="fa fa-folder-open me-2"></i> Lampiran Materi (Opsional)</h6>
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label small fw-bold text-muted mb-1">Upload File Materi (PDF/Doc/PPT)</label>
                                        <input type="file" name="file_materi" class="form-control border-primary-subtle" accept=".pdf,.doc,.docx,.ppt,.pptx,.xls,.xlsx,.zip,.rar">
                                        @if($jurnalTersimpan && $jurnalTersimpan->file_materi)
                                            <small class="text-success d-block mt-2"><i class="fa fa-check-circle"></i> Tersimpan: <a href="{{ asset('storage/materi/'.$jurnalTersimpan->file_materi) }}" target="_blank" class="fw-bold text-success text-decoration-underline">Lihat File</a></small>
                                        @endif
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label small fw-bold text-muted mb-1">Link Eksternal (Youtube / GDrive)</label>
                                        <input type="url" name="link_materi" class="form-control border-primary-subtle" placeholder="https://..." value="{{ $jurnalTersimpan->link_materi ?? '' }}">
                                    </div>
                                </div>

                                <div class="row g-3 mb-3 border border-warning pt-3 p-3 rounded-3 mt-1 tugas-wrapper-{{ $mapelId }}" style="background-color: #fffdf5;">
                                    <div class="col-12 mb-1">
                                        <h6 class="fw-bold mb-0 text-warning text-dark"><i class="fa fa-tasks me-2"></i> Pengaturan Tugas & Deadline (Opsional)</h6>
                                        <p class="small text-muted mb-0">Isi bagian ini <strong>HANYA JIKA</strong> Anda ingin memberikan tugas/PR pada pertemuan ini.</p>
                                    </div>
                                    <div class="col-md-5">
                                        <label class="form-label small fw-bold text-muted mb-1">Judul Tugas</label>
                                        <input type="text" name="judul_tugas" class="form-control border-warning-subtle" value="{{ $jurnalTersimpan->tugas->judul_tugas ?? '' }}" placeholder="Contoh: Merangkum Bab 1">
                                    </div>
                                    <div class="col-md-3">
                                        <label class="form-label small fw-bold text-muted mb-1">Batas Waktu</label>
                                        <input type="datetime-local" name="batas_waktu" class="form-control border-warning-subtle" value="{{ ($jurnalTersimpan && $jurnalTersimpan->tugas) ? date('Y-m-d\TH:i', strtotime($jurnalTersimpan->tugas->batas_waktu)) : '' }}">
                                    </div>
                                    <div class="col-md-4">
                                        <label class="form-label small fw-bold text-muted mb-1">Upload File Soal/Tugas</label>
                                        <input type="file" name="file_tugas" class="form-control border-warning-subtle">
                                        @if($jurnalTersimpan && optional($jurnalTersimpan->tugas)->file_tugas)
                                            <small class="text-success d-block mt-1"><i class="fa fa-check-circle"></i> Tersimpan: <a href="{{ asset('storage/tugas/'.$jurnalTersimpan->tugas->file_tugas) }}" target="_blank" class="fw-bold text-success text-decoration-underline">Lihat Tugas</a></small>
                                        @endif
                                    </div>
                                    <div class="col-12 mt-2">
                                        <label class="form-label small fw-bold text-muted mb-1">Instruksi Detail Tugas</label>
                                        <textarea name="deskripsi_tugas" class="form-control border-warning-subtle" rows="2" placeholder="Ketikan petunjuk pengerjaan tugas di sini...">{{ $jurnalTersimpan->tugas->deskripsi_tugas ?? '' }}</textarea>
                                    </div>
                                </div>

                                <div class="text-end pt-2">
                                    <button type="submit" class="btn {{ $jurnalTersimpan ? 'btn-outline-success' : 'btn-warning text-dark' }} fw-bold shadow-sm px-4">
                                        <i class="fa {{ $jurnalTersimpan ? 'fa-check-circle' : 'fa-save' }} me-1"></i> {{ $jurnalTersimpan ? 'Update Jurnal & Tugas' : 'Simpan Jurnal Mengajar' }}
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>
                @endforeach
            @else
                <div class="alert alert-warning text-center py-4 rounded-4 border-0 shadow-sm">
                    <i class="fa fa-info-circle fa-2x mb-3 text-warning opacity-75"></i>
                    <h5 class="fw-bold">Tidak Ada Jadwal</h5>
                    <p class="mb-0">Tidak ada jadwal KBM di kelas ini pada hari yang dipilih.</p>
                </div>
            @endif
            
            @include('public.guru.absensi_kbm_show_siswa')

        @else
            
            @include('public.guru.absensi_kbm_show_rekap')

        @endif
    </div>
</section>

@push('scripts')
@if($activeTab == 'harian')
<script>
document.addEventListener("DOMContentLoaded", function() {
    var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
    var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
        return new bootstrap.Tooltip(tooltipTriggerEl)
    });

    document.querySelectorAll('.btn-save-row').forEach(btn => {
        btn.addEventListener('click', function() {
            const sId = this.dataset.siswa;
            const mId = this.dataset.mapel; 
            const row = document.getElementById(`row-${sId}-${mId}`);
            
            const statInput = row.querySelector('.input-status:checked');
            const stat = statInput ? statInput.value : '';
            
            if(!stat) {
                swal({ title: "Status Kosong", text: "Silakan pilih status kehadiran terlebih dahulu!", icon: "warning", });
                return;
            }

            this.classList.replace('btn-primary', 'btn-warning');
            
            const formData = new FormData();
            formData.append('_token', '{{ csrf_token() }}');
            formData.append('tanggal', document.getElementById('globalTanggal').value);
            formData.append('kelas_id', document.getElementById('globalKelasId').value);
            formData.append(`absensi[${sId}][${mId}][jadwal_ids]`, row.querySelector('.input-jadwals').value);
            formData.append(`absensi[${sId}][${mId}][mapel_id]`, row.querySelector('.input-mapel').value);
            formData.append(`absensi[${sId}][${mId}][guru_id]`, row.querySelector('.input-guru').value);
            formData.append(`absensi[${sId}][${mId}][status]`, stat);
            formData.append(`absensi[${sId}][${mId}][keterangan]`, row.querySelector('.input-ket').value);

            fetch('{{ route("guru.absensi_kbm.store") }}', { 
                method: 'POST', 
                headers: {'X-Requested-With': 'XMLHttpRequest'}, 
                body: formData 
            })
            .then(async r => {
                const d = await r.json();
                if (!r.ok) throw new Error(d.message || 'Terjadi kesalahan sistem.');
                return d;
            })
            .then(d => {
                this.classList.replace('btn-warning', 'btn-success');
                setTimeout(() => { this.className = 'btn btn-icon btn-sm btn-primary btn-round btn-save-row shadow-sm'; }, 2000);
                swal({ title: "Berhasil!", text: d.message || "Status kehadiran siswa telah diperbarui.", icon: "success", timer: 1500, buttons: false });
            })
            .catch(error => {
                this.classList.replace('btn-warning', 'btn-danger');
                setTimeout(() => { this.className = 'btn btn-icon btn-sm btn-primary btn-round btn-save-row shadow-sm'; }, 2000);
                swal({ title: "Gagal Menyimpan", text: error.message, icon: "error", dangerMode: true, });
            });
        });
    });
});
</script>
@endif
<style>
    #header { background-color: #263351 !important; }
    #header.header-scrolled { background-color: rgba(38, 51, 81, 0.95) !important; }
    
    .btn-group-status .btn {
        min-width: 32px;
        font-weight: bold;
    }
</style>
@endpush
@endsection