@extends('index')
@section('content')

    <form id="card-search" class="card mt-3" method="POST" action="/transcript/search" autocomplete="off">
        {{ csrf_field() }}
        <div class="card-body">
            <div class="row"> 
                <div class="form-group col-md-4">
                    <label>Tahun Ajaran</label>
                    <div class="input-group mb-2">
                        <select class="form-control" name="year" id="year" required>
                            <option value="">Pilih</option>
                            @foreach($year as $rows)
                                <option value="{{ $rows->id }}"  @if(session('s_year') == $rows->id) selected @endif>{{ $rows->name }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="form-group col-md-4">
                    <label>Kelas</label>
                    <div class="input-group mb-3">
                        <select class="form-control" name="classroom" id="classroom" required>
                            <option value="">Pilih</option>
                            @if(session('s_search_status'))
                                @foreach($classroom as $rows)
                                    @if(Auth::user()->type == 2)
                                    @if(App\LessonDetail::where('active',1)->where('classroom_id',$rows->id)->where('user_id',Auth::id())->count())
                                    <option value="{{ $rows->id }}" @if(session('s_classroom') == $rows->id) selected @endif>{{ $rows->name }}</option>
                                    @endif
                                @else
                                    <option value="{{ $rows->id }}" @if(session('s_classroom') == $rows->id) selected @endif>{{ $rows->name }}</option>
                                @endif
                                @endforeach
                            @endif
                        </select>
                    </div>
                </div>

                <!-- <div class="form-group col-md-3">
                    <label>Semester</label>
                    <div class="input-group mb-2">
                        <select class="form-control" name="semester" id="semester">
                            <option value="1" @if(session('s_semester') == 1) selected @endif>Mid Semester 1</option>
                            <option value="2" @if(session('s_semester') == 2) selected @endif>Semester 1</option>
                            <option value="3" @if(session('s_semester') == 3) selected @endif>Mid Semester 2</option>
                            <option value="4" @if(session('s_semester') == 4) selected @endif>Semester 2</option>
                        </select>
                    </div>
                </div> -->

                <div class="form-group col-md-4">
                    <label>Mata Pelajaran</label>
                    <div class="input-group mb-2">
                        <select class="form-control" name="lesson" id="lesson" required>
                            <option value="">Pilih</option>
                            @if(session('s_search_status'))
                                @foreach($lesson as $rows)
                                <option value="{{ $rows->id }}" @if(session('s_lesson') == $rows->id) selected @endif>{{ $rows->name }}</option>
                                @endforeach
                            @endif
                        </select>
                    </div>
                </div>

                <div class="form-group col-md-9">
                    <label for="search">Nama Siswa/NISN</label>
                    <input type="text" class="form-control" name="search" placeholder="Nama Siswa/NISN" value="{{ session('s_search') }}">
                </div>

                <div class="form-group col-md-3">
                    <label></label>
                    <button type="submit" class="btn btn-primary float-right" style="padding-top:3px;padding-bottom:3px;margin-top:30px"><i class="fe fe-search"></i> Cari</button>
                </div>
            </div>
        </div>
    </form>

    @if(session('s_search_status'))
    <div class="card mt-3 font-purple">
        <table class="table card-table table-title pt-3">
            <tr class="no-background">
                <td width="150px" class="text-left">Kelas</td>
                <td width="10px">:</td>
                <td class="text-left"><strong>{{ $class->name }}</strong> <small>{{ $class->year }}</small></td>
            </tr>
            <tr class="no-background">
                <td width="150px" class="text-left">Semester</td>
                <td width="10px">:</td>
                <td class="text-left">{{ semester(session('s_semester')) }}</td>
            </tr>
            <tr class="no-background">
                <td width="150px" class="text-left">Wali Kelas</td>
                <td width="10px">:</td>
                <td class="text-left">{{ $class->wali->getName() }}</td>
            </tr>
        </table>
    </div>

    <form class="card mt-3" method="POST" action="/transcript" autocomplete="off">
        {{ csrf_field() }}
        <div class="tb-major card-body text-center" style="overflow:scroll;">
            @if(count($row))
                <table class="table card-table" style="width:1150px;">
                    <thead>
                        <tr>
                        <th scope="col">No</th>
                        <th scope="col">Nama Siswa</th>
                        <th scope="col">NIS</th>
                        <th scope="col" class="font-10" width="80px">Semester 1</th>
                        <th scope="col" class="font-10" width="80px">Semester 2</th>
                        <th scope="col" class="font-10" width="80px">Semester 3</th>
                        <th scope="col" class="font-10" width="80px">Semester 4</th>
                        <th scope="col" class="font-10" width="80px">Semester 5</th>
                        <th scope="col" class="font-10" width="80px">Semester 6</th>
                        <th scope="col" class="font-10" width="80px">Rata-rata</th>
                        <th scope="col" class="font-10" width="80px">Nilai Sekolah</th>
                        <th scope="col" class="font-10" width="80px">Nilai SKL</th>
                        <!-- <th scope="col" class="font-10" width="80px">Nilai UKK</th> -->
                        <th scope="col" class="font-10" width="80px">Nilai Akhir</th>
                        </tr>
                    </thead>
                    <tbody>
                        @php $i = 1; @endphp
                        @foreach($row as $rows)
                        @php 
                        if(session('s_semester') == 1 OR session('s_semester') == 3) {
                            $minkkm = 0;
                        } else {
                            /* $minkkm = $lessonselect->kkm; */
                            $minkkm = 0;
                        }
                        $les = session('s_lesson');
                        @endphp
                        <tr class="no-background">
                            <td class="bg-full-radius">
                                {{ $i }}
                            </td>
                            <td class="bg-left-radius">
                                {{ $rows->name }}
                            </td>
                            <td class="bg-right-radius">
                                {{ $rows->code }}
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="semester_one{{ $rows->id }}" value="{{ $rows->getTranscriptScore($les,1,2) }}" onchange="countAverageScore({{ $rows->id }})" onkeyup="countAverageScore({{ $rows->id }})">
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="semester_two{{ $rows->id }}" value="{{ $rows->getTranscriptScore($les,1,4) }}" onchange="countAverageScore({{ $rows->id }})" onkeyup="countAverageScore({{ $rows->id }})">
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="semester_three{{ $rows->id }}" value="{{ $rows->getTranscriptScore($les,2,2) }}" onchange="countAverageScore({{ $rows->id }})" onkeyup="countAverageScore({{ $rows->id }})">
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="semester_four{{ $rows->id }}" value="{{ $rows->getTranscriptScore($les,2,4) }}" onchange="countAverageScore({{ $rows->id }})" onkeyup="countAverageScore({{ $rows->id }})">
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="semester_five{{ $rows->id }}" value="{{ $rows->getTranscriptScore($les,3,2) }}" onchange="countAverageScore({{ $rows->id }})" onkeyup="countAverageScore({{ $rows->id }})">
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="semester_six{{ $rows->id }}" value="{{ $rows->getTranscriptScore($les,3,4) }}" onchange="countAverageScore({{ $rows->id }})" onkeyup="countAverageScore({{ $rows->id }})">
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="average_score{{ $rows->id }}" readonly>
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="school_score{{ $rows->id }}" onchange="countSklScore({{ $rows->id }})" onkeyup="countSklScore({{ $rows->id }})">
                            </td>
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="un_score{{ $rows->id }}" readonly>
                            </td>
                            <!-- <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="ukk_score{{ $rows->id }}" onchange="countFinalScore({{ $rows->id }})" onkeyup="countFinalScore({{ $rows->id }})">
                            </td> -->
                            <td class="bg-full-radius">
                                <input type="number" min="{{ $minkkm }}" max="100" style="width:70px;" class="form-control text-center" name="final_score{{ $rows->id }}" readonly>
                            </td>
                        </tr>
                        @php $i++; @endphp
                        @endforeach
                    </tbody>
                </table>
            @else 
            <p>Tidak ada data siswa untuk kelas {{ $class->name }} tahun ajaran {{ $class->year }}</a>
            @endif
        </div>
        @if(count($row))
        <div class="card-footer">
            <button type="submit" class="btn btn-primary float-right"><i class="fe fe-save"></i> Proses</button>
            <a href="/transcript/search" class="btn btn-light float-right mr-2">Kembali</a>
        </div>
        @endif
    </form>
    @endif
    
@endsection
@push('script')
<script type="text/javascript">

    $('#year').on('change', function(e) {
        $.fn.loadClass($(this).val());
    });

    $('#classroom').on('change', function(e) {
        $.fn.loadLesson($(this).val());
    });

    $.fn.loadClass = function(id = null) {
        $.ajax({
            type: "POST",
            trigger: 'manual',
            cache: false,
            url: "/classroom/transcript/ajax",
            data: {
                id: id
            },
            dataType: "html",
            beforeSend: function() {
                $('#classroom').html('<option value="">Loading...</option>');
            },
            complete: function() {},
            success: function(html) {
                $('#lesson').html('<option value="">Pilih</option>');
                $('#classroom').html('<option value="">Pilih</option>');
                $('#classroom').append(html);
            }
        });
    }

    $.fn.loadLesson = function(id = null) {
        $.ajax({
            type: "POST",
            trigger: 'manual',
            cache: false,
            url: "/lesson/transcript/ajax",
            data: {
                id: id
            },
            dataType: "html",
            beforeSend: function() {
                $('#lesson').html('<option value="">Loading...</option>');
            },
            complete: function() {},
            success: function(html) {
                $('#lesson').html('<option value="">Pilih</option>');
                $('#lesson').append(html);
            }
        });
    }

    function countAverageScore(id){
        var count = 0;
        var s1 = parseFloat($("input[name*='semester_one"+id+"']").val());
        var s2 = parseFloat($("input[name*='semester_two"+id+"']").val());
        var s3 = parseFloat($("input[name*='semester_three"+id+"']").val());
        var s4 = parseFloat($("input[name*='semester_four"+id+"']").val());
        var s5 = parseFloat($("input[name*='semester_five"+id+"']").val());
        var s6 = parseFloat($("input[name*='semester_six"+id+"']").val());

        if(s1) {
            count = count + 1;
        }
        if(s2) {
            count = count + 1;
        }
        if(s3) {
            count = count + 1;
        }
        if(s4) {
            count = count + 1;
        }
        if(s5) {
            count = count + 1;
        }
        if(s6) {
            count = count + 1;
        }

        var avg = Math.ceil((s1 + s2 + s3 + s4 + s5 + s6) / count);
        $("input[name*='average_score"+id+"']").val(avg);
        console.log(count);
    }

    function countSklScore(id){
        var average = parseFloat($("input[name*='average_score"+id+"']").val());
        var test = parseFloat($("input[name*='school_score"+id+"']").val());

        var knowledge = Math.ceil((average * 0.6) + (test * 0.4));
        $("input[name*='un_score"+id+"']").val(knowledge);
        this.countFinalScore(id);
    }

    function countFinalScore(id){
        var s1 = parseFloat($("input[name*='average_score"+id+"']").val());
        var s2 = parseFloat($("input[name*='school_score"+id+"']").val());
        var s3 = parseFloat($("input[name*='un_score"+id+"']").val());
        // var s4 = parseFloat($("input[name*='ukk_score"+id+"']").val());

        // var avg = Math.ceil((s1 + s2 + s3 + s4) / 4);
        var avg = Math.ceil((s1 + s2 + s3) / 3);
        $("input[name*='final_score"+id+"']").val(avg);
            
    }

    function checkSkill(id){
        var score = $("input[name*='skill_score"+id+"']").val();
        var ranking = this.checkRanking(score);
        $("input[name*='skill_ranking"+id+"']").val(ranking);
        $("#skill_ranking"+id).html(ranking);
    }

    function checkAttitude(id){
        var score = $("input[name*='attitude_score"+id+"']").val();
        var ranking = this.checkAttitudeRanking(score);
        $("input[name*='attitude_ranking"+id+"']").val(ranking);
        $("#attitude_ranking"+id).html(ranking);
    }

    function checkRanking(score){
        //if(score) {
            if(score >= 95 && score <= 100) {
                return 'A';
            } else if(score >= 90 && score <= 94) {
                return 'A-';
            } else if(score >= 85 && score <= 89) {
                return 'B+';
            } else if(score >= 80 && score <= 84) {
                return 'B';
            } else if(score >= 75 && score <= 79) {
                return 'B-';
            } else if(score >= 70 && score <= 74) {
                return 'C+';
            } else if(score >= 65 && score <= 69) {
                return 'C';
            } else if(score >= 60 && score <= 64) {
                return 'C-';
            } else if(score >= 55 && score <= 59) {
                return 'D+';
            } else if(score > 0 && score <= 54) {
                return 'D';
            } else {
                return '-';
            }
        //}
    }

    function checkAttitudeRanking(score){
        //if(score) {
            if(score >= 95 && score <= 100) {
                return 'SB';
            } else if(score >= 90 && score <= 94) {
                return 'SB';
            } else if(score >= 85 && score <= 89) {
                return 'B';
            } else if(score >= 80 && score <= 84) {
                return 'B';
            } else if(score >= 75 && score <= 79) {
                return 'B';
            } else if(score >= 70 && score <= 74) {
                return 'C';
            } else if(score >= 65 && score <= 69) {
                return 'C';
            } else if(score >= 60 && score <= 64) {
                return 'C';
            } else if(score >= 55 && score <= 59) {
                return 'K';
            } else if(score > 0 && score <= 54) {
                return 'K';
            } else {
                return '-';
            }
        //}
    }
</script>
@endpush