@extends('layouts.main')

@section('isi')
<style>
    table, th, td
    {
        border: 1px solid rgb(235, 227, 227) !important;
        padding: 10px !important;
    }
    
    th
    {
        background-color: #01a096e6 !important;
        color: rgb(244, 243, 243) !important;
    }
    
    tr:nth-child(odd)
    {
        background-color: #f5f9fa !important;
    }

    .center-text {
        text-align: center;
    }
</style>

    <!--begin::Content container-->
    <div id="kt_app_content_container" class="app-container container-fluid">
        <div class="row g-5 g-xl-10 mb-5 mb-xl-10">
            <div class="col-lg-12">
                <div class="card shadow-sm">
                    <div class="card-header">
                        <h3 class="card-title">Data Mahasiswa</h3>
                    </div>
                   
                    <div class="card-body">
                        <div class="d-flex justify-content-end" data-kt-customer-table-toolbar="base">
                            <a class="btn btn-warning btn-sm" href="{{ route('penilaian-pelatihan-mhs.showMatakuliah') }}?thakad={{ $transaksiPelatihan->first()->jadwal->thakad }}&stspel={{ $transaksiPelatihan->first()->jadwal->stspel }}">
                                <span class="indicator-label"><i class="fas fa-long-arrow-left"></i> Kembali</span>
                            </a>
                            &nbsp;
                           
                            <button type="button" class="btn btn-info btn-sm" id="validasi-nilai-button"
                                data-id-jadwal="{{ $transaksiPelatihan->first()->jadwal->id_jadwal }}"
                                data-thakad="{{ $transaksiPelatihan->first()->jadwal->thakad }}">
                            <span class="indicator-label">Validasi Nilai</span>
                            </button>
                            &nbsp;
            
                            @if ($transaksiPelatihan->first()->jadwal->status_validasi_tutor == 1)
                                <a class="btn btn-primary btn-sm" href="{{ route('penilaian-pelatihan-mhs.downloadNilai', ['id_jadwal' => $transaksiPelatihan->first()->jadwal->id_jadwal, 'thakad' => $transaksiPelatihan->first()->jadwal->thakad]) }}">
                                    <span class="indicator-label"><i class="fas fa-cloud-download"></i>  Download PDF</span>
                                </a>
                            @else
                                <a class="btn btn-danger btn-sm" href="#">
                                    <span class="indicator-label"><i class="fas fa-cloud-download"></i>  Download PDF</span>
                                </a>
                            @endif
                          
                        </div>
                         <!--begin::Stats-->
                         <div class="d-flex flex-wrap">
                            <!--begin::Stat-->
                            <div class="border border-gray-300 border-dashed rounded min-w-125px py-3 px-4 me-6 mb-3">
                                <!--begin::Number-->
                                <div class="d-flex align-items-center">
                                    <div class="fs-4 fw-bold">Kode MK</div>
                                </div>
                                <!--end::Number-->
                                <!--begin::Label-->
                                <div class="fw-semibold fs-6" style="color: rgb(17, 165, 69);">{{ $transaksiPelatihan->first()->jadwal->kd_mppel }}</div>
                                <!--end::Label-->
                            </div>
                            <!--end::Stat-->
                            <!--begin::Stat-->
                            <div class="border border-gray-300 border-dashed rounded min-w-125px py-3 px-4 me-6 mb-3">
                                <!--begin::Number-->
                                <div class="d-flex align-items-center">
                                    <div class="fs-4 fw-bold">Matakuliah</div>
                                </div>
                                <!--end::Number-->
                                <!--begin::Label-->
                                <div class="fw-semibold fs-6" style="color: rgb(17, 165, 69);">{{ $transaksiPelatihan->first()->jadwal->matakuliahpelatihan->nmpel }}l</div>
                                <!--end::Label-->
                            </div>
                            <!--end::Stat-->

                            <!--begin::Stat-->
                            <div class="border border-gray-300 border-dashed rounded min-w-125px py-3 px-4 me-6 mb-3">
                                <!--begin::Number-->
                                <div class="d-flex align-items-center">
                                    <div class="fs-4 fw-bold">Kelas</div>
                                </div>
                                <!--end::Number-->
                                <!--begin::Label-->
                                <div class="fw-semibold fs-6" style="color: rgb(17, 165, 69);">{{ $transaksiPelatihan->first()->jadwal->kelas. $transaksiPelatihan->first()->jadwal->klsdefault }}</div>
                                <!--end::Label-->
                            </div>
                            <!--end::Stat-->

                          <!--begin::Stat-->
                            <div class="border border-dashed rounded min-w-125px py-3 px-4 me-6 mb-3
                            {{ $transaksiPelatihan->first()->jadwal->status_validasi_tutor == 1 ? 'border-success bg-light-success' : 'border-danger bg-light-danger' }}">
                            <!--begin::Number-->
                            <div class="d-flex align-items-center">
                                <div class="fs-4 fw-bold text-dark">
                                    Status Validasi Nilai
                                </div>
                            </div>
                            <!--end::Number-->
                            <!--begin::Label-->
                            <div class="fw-semibold fs-6
                                {{ $transaksiPelatihan->first()->jadwal->status_validasi_tutor == 1 ? 'text-success' : 'text-danger' }}">
                                @if ($transaksiPelatihan->first()->jadwal->status_validasi_tutor == 1)
                                    Sudah di validasi
                                @else
                                    Belum di validasi
                                @endif
                            </div>
                            <!--end::Label-->
                            </div>
                            <!--end::Stat-->
                        </div>
                        <!--end::Stats-->

                        @php
                            $status_validasi_tutor = $transaksiPelatihan->first()->jadwal->status_validasi_tutor;
                        @endphp

                        @if ($status_validasi_tutor == 1)
                     
                        <div class="table-responsive">
                            <table class="table table-bordered">
                                <thead>
                                    <tr class="fw-bold fs-6 text-gray-800">
                                        <th style="text-align:center;">No</th>
                                        <th style="text-align:left;">NIM</th>
                                        <th style="text-align:left;">Nama Mhs</th>
                                        <th style="text-align:center;">Tugas ({{ $transaksiPelatihan->first()->jadwal->tugas }} %)</th>
                                        <th style="text-align:center;">UTS ({{ $transaksiPelatihan->first()->jadwal->uts }} %)</th>
                                        <th style="text-align:center;">UAS ({{ $transaksiPelatihan->first()->jadwal->uas }} %)</th>
                                        <th style="text-align:center;">N.Angka</th>
                                        <th style="text-align:center;">N.Huruf</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($transaksiPelatihan as $item)
                                        <tr>
                                            <td style="text-align:center;">{{ $loop->iteration }}</td>
                                            <td style="text-align:left;">{{ $item->nim }}
                                                <input type="hidden" name="nim_{{ $loop->iteration }}" id="nim_{{ $loop->iteration }}" value="{{ $item->nim }}" />
                                            </td>
                                            <td style="text-align:left;">{{ $item->mahasiswa->nama_mhs }}</td>
                                            <td style="text-align:center;">
                                                <input type="text" class="form-control form-control-light center-text" name="tugas_{{ $item->idtranspel }}" id="tugas_{{ $item->idtranspel}}" value="{{ $item->nilai_tugas }}" disabled>
                                            </td>
                                            <td style="text-align:center;">
                                                <input type="text" class="form-control form-control-light center-text" name="uts_{{ $item->idtranspel }}" id="uts_{{ $item->idtranspel}}" value="{{ $item->nilai_uts }}" disabled>
                                            </td>
                                            <td style="text-align:center;">
                                                <input type="text" class="form-control form-control-light center-text" name="uas_{{ $item->idtranspel }}" id="uas_{{ $item->idtranspel}}" value="{{ $item->nilai_uas }}" disabled>
                                            </td>
                                            <td style="text-align:center;" id="nilai_angka_{{ $item->idtranspel }}">{{ $item->nilai_angka }}</td>
                                            <td style="text-align:center;" id="nilai_huruf_{{ $item->idtranspel }}">{{ $item->nilai_huruf }}</td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                        @else
                        <!-- Jika stsvalnl != 1, input akan aktif -->
                        <div class="table-responsive">
                            <table class="table table-bordered">
                                <thead>
                                    <tr class="fw-bold fs-6 text-gray-800">
                                        <th style="text-align:center;">No</th>
                                        <th style="text-align:left;">NIM</th>
                                        <th style="text-align:left;">Nama Mhs</th>
                                        <th style="text-align:center;">Tugas ({{ $transaksiPelatihan->first()->jadwal->tugas }} %)</th>
                                        <th style="text-align:center;">UTS ({{ $transaksiPelatihan->first()->jadwal->uts }} %)</th>
                                        <th style="text-align:center;">UAS ({{ $transaksiPelatihan->first()->jadwal->uas }} %)</th>
                                        <th style="text-align:center;">N.Angka</th>
                                        <th style="text-align:center;">N.Huruf</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($transaksiPelatihan as $item)
                                        <tr>
                                            <td style="text-align:center;">{{ $loop->iteration }}</td>
                                            <td style="text-align:left;">{{ $item->nim }}
                                                <input type="hidden" name="nim_{{ $loop->iteration }}" id="nim_{{ $loop->iteration }}" value="{{ $item->nim }}" />
                                            </td>
                                            <td style="text-align:left;">{{ $item->mahasiswa->nama_mhs }}</td>
                                            <td style="text-align:center;">
                                                <input type="text" class="form-control form-control-light center-text" 
                                                    name="tugas_{{ $item->idtranspel }}" 
                                                    id="tugas_{{ $item->idtranspel}}" 
                                                    value="{{ $item->nilai_tugas }}"
                                                    onchange="simpanTugas({{ $item->idtranspel }}, this.value)"
                                                    onkeydown="handleKeyDown(event, 'tugas', {{ $item->idtranspel }}, this.value)">
                                            </td>
                                            <td style="text-align:center;">
                                                <input type="text" class="form-control form-control-light center-text" name="uts_{{ $item->idtranspel }}" id="uts_{{ $item->idtranspel}}" value="{{ $item->nilai_uts }}" 
                                                onchange="simpanUts({{ $item->idtranspel }}, this.value)"
                                                onkeydown="handleKeyDown(event, 'uts', {{ $item->idtranspel }}, this.value)">
                                            </td>
                                            <td style="text-align:center;">
                                                <input type="text" class="form-control form-control-light center-text" name="uas_{{ $item->idtranspel }}" id="uas_{{ $item->idtranspel}}" value="{{ $item->nilai_uas }}" 
                                                onchange="simpanUas({{ $item->idtranspel }}, this.value)"
                                                onkeydown="handleTab(event, this, {{ $item->idtranspel }}, 'uas')"
                                                onkeydown="handleKeyDown(event, 'uas', {{ $item->idtranspel }}, this.value)">
                                            </td>
                                            <td style="text-align:center;" id="nilai_angka_{{ $item->idtranspel }}">{{ $item->nilai_angka }}</td>
                                            <td style="text-align:center;" id="nilai_huruf_{{ $item->idtranspel }}">{{ $item->nilai_huruf }}</td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                        @endif

                    </div>
                </div>
            </div>
        </div>
    </div>

    @endsection

@push('js-page')
<script>
    function simpanTugas(idtranspel, nilaiTugas) 
    {
        if ((nilaiTugas<0)) {
            toastr.error('Nilai tugas harus lebih dari 0');
            return;
        }

        $.ajax({
            url: '{{ route('penilaian-pelatihan-mhs.simpanTugas') }}',  
            method: 'POST',  
            data: {
                _token: '{{ csrf_token() }}',  
                idtranspel: idtranspel,
                nilai_tugas: nilaiTugas
            },
            success: function(response) {
                toastr.success(response.message);
                $('#nilai_angka_' + idtranspel).text(response.nilai_angka);
                $('#nilai_huruf_' + idtranspel).text(response.nilai_huruf);
            },
            error: function(xhr, status, error) {
                toastr.error('Terjadi kesalahan saat memperbarui nilai tugas');
            }
        });
    }

    function simpanUts(idtranspel, nilaiUts) 
    {
        if ((nilaiUts<0)) {
            toastr.error('Nilai UTS harus lebih dari 0');
            return;
        }

        $.ajax({
            url: '{{ route('penilaian-pelatihan-mhs.simpanUts') }}',  
            method: 'POST',  
            data: {
                _token: '{{ csrf_token() }}',  
                idtranspel: idtranspel,
                nilai_uts: nilaiUts
            },
            success: function(response) {
                toastr.success(response.message);
                $('#nilai_angka_' + idtranspel).text(response.nilai_angka);
                $('#nilai_huruf_' + idtranspel).text(response.nilai_huruf);
            },
            error: function(xhr, status, error) {
                toastr.error('Terjadi kesalahan saat memperbarui nilai UTS');
            }
        });
    }

    function simpanUas(idtranspel, nilaiUas) 
    {
        if ((nilaiUas<0)) {
            toastr.error('Nilai UAS harus lebih dari 0');
            return;
        }

        $.ajax({
            url: '{{ route('penilaian-pelatihan-mhs.simpanUas') }}',  
            method: 'POST',  
            data: {
                _token: '{{ csrf_token() }}',  
                idtranspel: idtranspel,
                nilai_uas: nilaiUas
            },
            success: function(response) {
                toastr.success(response.message);
                $('#nilai_angka_' + idtranspel).text(response.nilai_angka);
                $('#nilai_huruf_' + idtranspel).text(response.nilai_huruf);
            },
            error: function(xhr, status, error) {
                toastr.error('Terjadi kesalahan saat memperbarui nilai UAS');
            }
        });
    }

    function handleKeyDown(e, type, idtranspel, value) {
   if (e.key === 'Tab') {
       e.preventDefault();
       
       switch(type) {
           case 'tugas':
               simpanTugas(idtranspel, value);
               let utsInput = document.querySelector(`#uts_${idtranspel}`);
               if (utsInput) utsInput.focus();
               break;
           case 'uts':
               simpanUts(idtranspel, value);
               let uasInput = document.querySelector(`#uas_${idtranspel}`);
               if (uasInput) uasInput.focus(); 
               break;
           case 'uas':
               simpanUas(idtranspel, value);
               let nextRow = e.target.closest('tr').nextElementSibling;
               if (nextRow) {
                   let nextTugas = nextRow.querySelector('[id^=tugas_]');
                   if (nextTugas) nextTugas.focus();
               }
               break;
       }
   }
}

    // Pengaturan toastr
    toastr.options = {
        "closeButton": true,
        "debug": false,
        "newestOnTop": false,
        "progressBar": false,
        "positionClass": "toast-top-right",
        "preventDuplicates": true,
        "onclick": null,
        "showDuration": "300",
        "hideDuration": "1000",
        "timeOut": "5000",
        "extendedTimeOut": "1000",
        "showEasing": "swing",
        "hideEasing": "linear",
        "showMethod": "fadeIn",
        "hideMethod": "fadeOut"
    };
</script>

<script>
    $(document).ready(function() {
        $('#validasi-nilai-button').on('click', function() {
            var id_jadwal = $(this).data('id-jadwal');
            var thakad = $(this).data('thakad');

            Swal.fire({
                title: 'Apakah Anda yakin?',
                text: "Anda tidak dapat membatalkan aksi ini!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: 'Ya, validasi!',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    Swal.fire({
                        title: 'Memproses...',
                        text: 'Mohon tunggu sebentar.',
                        allowOutsideClick: false,
                        didOpen: () => {
                            Swal.showLoading();
                        }
                    });

                    $.ajax({
                        url: '{{ route("penilaian-pelatihan-mhs.validasiNilai") }}',
                        type: 'POST',
                        data: {
                            id_jadwal: id_jadwal,
                            thakad: thakad,
                            _token: '{{ csrf_token() }}'
                        },
                        success: function(response) {
                           
                            Swal.fire({
                                title: 'Berhasil!',
                                text: response.message,
                                icon: 'success',
                                confirmButtonText: 'OK'
                            }).then(() => {
                               
                                Swal.fire({
                                    title: 'Memuat ulang halaman...',
                                    allowOutsideClick: false,
                                    didOpen: () => {
                                        Swal.showLoading();
                                    }
                                });
                                
                                setTimeout(function() {
                                    location.reload();
                                }, 2000); 
                            });
                        },
                        error: function(xhr, status, error) {
                           
                            Swal.fire(
                                'Gagal!',
                                xhr.responseJSON ? xhr.responseJSON.message : 'Terjadi kesalahan.',
                                'error'
                            );
                        }
                    });
                }
            });
        });
    });
</script>

@endpush