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

    <form id="card-search" class="card mt-3" method="POST" action="/presence/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-4">
                    <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->lesson->id }}" @if(session('s_lesson') == $rows->lesson->id) selected @endif>{{ $rows->lesson->name }}</option>
                                @endforeach
                            @endif
                        </select>
                    </div>
                </div> -->

                <div class="form-group col-md-4">
                    <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-4">
                    <label>Tanggal</label>
                    <div class="input-icon">
                        <input class="form-control datepicker" name="date" type="text" value="{{ session('s_date') }}" required>
                        <div class="input-icon-addon"><i class="fe fe-calendar" aria-hidden="true"></i></div>
                    </div>
                </div>

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

    @if(session('s_search_status'))
    <div class="card mt-3">
        <div class="card-body font-purple">
            <h2 class="card-title pb-3"><strong>{{ $class->name }}</strong> <small>{{ $class->year }}</small></h2>
            <h5 class="card-subtitle">Wali Kelas: {{ $class->wali->getName() }}</h5>
            @if(count($row))
            <a href="/presence/update" class="btn btn-sm btn-light float-right">Edit</a>
            @endif
        </div>
        <div class="tb-major card-body text-center" style="overflow:scroll;">
            @if(count($row))
            <table class="table card-table">
                <thead>
                    <tr>
                    <th scope="col">No</th>
                    <th scope="col">Nama Siswa</th>
                    <th scope="col">Absensi</th>
                    <th scope="col">Keterangan</th>
                    <!-- <th scope="col">Action</th> -->
                    </tr>
                </thead>
                <tbody>
                    @php $i = 1; @endphp
                    @foreach($row as $rows)
                    <tr>
                        <td>{{ $i }}</td>
                        <td>{{ $rows->name }}</td>
                        <td>{!! $rows->getStatus() !!}</td>
                        <td>{{ $rows->notes }}</td>
                        <!-- <td><a href="#" class="btn-update-presence" data-id="{{ $rows->id }}" data-status="{{ $rows->status }}" data-notes="{{ $rows->notes }}">EDIT</a></td> -->
                    </tr>
                    @php $i++; @endphp
                    @endforeach
                </tbody>
            </table>
            @else 
            <p>Belum ada data absensi</p>
            <a href="/presence/create" class="btn btn-primary"><i class="fe fe-plus"></i> Input Absensi</a>
            @endif
        </div>
    </div>
    @endif

    <!-- Modal Add -->
    <div class="modal fade" id="presenceModal" tabindex="-1" role="dialog" aria-hidden="true">
        <form class="modal-dialog" role="document" method="POST" action="/presence/update">
            {{ csrf_field() }}
            <input name="_method" type="hidden" value="PUT">
            <input type="hidden" name="id" id="id">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Edit Absensi</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="form-group col-md-12">
                    <label>Absensi</label>
                    <select class="form-control" name="status" id="status">
                        <option value="1">Hadir</option>
                        <option value="2">Sakit</option>
                        <option value="3">Izin</option>
                        <option value="4">Alpha</option>
                    </select>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="form-group col-md-12">
                            <label>Keterangan</label>
                            <input type="text" class="form-control" name="notes" value="" id="notes">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">Proses</button>
                </div>
            </div>
        </form>
    </div>
    
@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/select/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/select/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);
            }
        });
    }

    $('.btn-update-presence').click(function(){
      $('#id').val($(this).data("id"));
      $('#status').val($(this).data("status"));
      $('#notes').val($(this).data("notes"));
      $('#presenceModal').modal('show');        
  });
</script>
@endpush