@extends('backend.layouts.master')
@section('title')
    <title>Sınıf Listesi</title>
@endsection
@section('breadcrumb')
    <div class="subheader py-2 py-lg-4 subheader-solid" id="kt_subheader">
        <div class="container-fluid d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
            <!--begin::Info-->
            <div class="d-flex align-items-center flex-wrap mr-2">
                <h5 class="text-dark font-weight-bold my-1 mr-5"> Sınıf Liste |   {{ $classroom->name}} </h5>
                <div class="subheader-separator subheader-separator-ver mt-2 mb-2 mr-4 bg-gray-200">

                </div>
            </div>
            <div class="d-flex align-items-center">

            </div>
        </div>
    </div>
@endsection
@section('content')
    <div class="d-flex flex-column-fluid" style="min-height: 400px;">
        <div class="container">
            <div class="row">

                <div class="card card-custom gutter-b col-12">
                    <form method="POST" action="{{ route('classroom.student_roll') }}">
                        @csrf
                    <div class="card-body py-0">
                        <div class="card-header flex-wrap border-0 pt-6 pb-0">
                            <div class="card-title">
                                <a href="#"  data-toggle="modal" data-target="#modal-fullscreen-xl" class="btn btn-outline-success  col-sm-6 col-xs-6 col-md-2 col-xl-2 mb-5" style="float: right">
                                    <i class="ki ki-calendar"></i>
                                    Aylık Yoklama
                                </a>
                                <h4 class="card-label ">Tarih Seç
                                    <span class="text-muted pt-2 font-size-sm d-block">
                                    </span>
                                </h4>
                                <input name="select_date" value="{{ date('Y-m-d') }}" class="col-sm-6 col-xs-6 col-md-2 col-xl-2 form-control" type="date">
                            </div>

                        </div>
                        <!--begin::Table-->
                        <div class="table-responsive">
                            <table class="table table-head-custom table-vertical-center" id="kt_advance_table_widget_3">
                                <thead>
                                    <tr class="text-left text-uppercase">
                                        <th style="width: 20px"> Id</th>
                                        <th style="width: 50px">Görsel</th>
                                        <th style="min-width: 150px">Öğrenci Ad</th>
                                        <th style="min-width: 150px">Öğrenci Mail</th>
                                        <th style="min-width: 150px" class="pr-20 text-right">İşlemler</th>
                                    </tr>
                                </thead>
                                <tbody>

                                    @foreach ($students as $student)
                                        <tr id="item-{{$student->id}}">
                                            <td>
                                                {{ $student->id}}
                                            </td>
                                            <td class="pl-0">
                                                @if(!empty($student->images))
                                                <div class="symbol symbol-50 symbol-light mt-1">
                                                    <img class="image-input-wrapper" id="blah" src="/storage/avatars/{{$student->images}}">
                                                </div>
                                                @endif
                                            </td>
                                            <td class="pl-0">
                                                <a href="#"
                                                    class="text-dark-75 font-weight-bolder text-hover-primary mb-1 font-size-lg">
                                                    {{ $student->first_name}}   {{ $student->last_name }}
                                                </a>
                                            </td>
                                            <td>
                                                <span
                                                    class="text-dark-75 font-weight-bolder d-block font-size-lg">
                                                    {{ $student->email}}
                                                </span>

                                            </td>
                                            <td class="text-right " >
                                                <div class="row pr-10" style="width: 200px;float: right;">
                                                    <label class="radio radio-primary m-4">
                                                        <input  type="radio" name="{{ $student->user_id }}" value="true" checked="checked">
                                                        <span class="mr-2"></span>Geldi
                                                    </label>
                                                    <label class="radio radio-danger">
                                                        <input type="radio" name="{{ $student->user_id }}" value="false"  >
                                                        <span class="mr-2"></span>Gelmedi
                                                    </label>
                                                </div>

                                            </td>
                                        </tr>

                                    @endforeach
                                </tbody>

                            </table>
                            <div class="card-footer">
                                <button type="submit" class="btn btn-primary mr-2 mb-2" style="float: right">Yoklama Al</button>
                            </div>
                            <input type="hidden" name="classroom_id" value="{{$classroom->id}}">
                        </div>
                        <!--end::Table-->
                    </div>
                    <!--end::Body-->
                </form>

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

    </div>

        <div class="modal modal-fullscreen-xl" id="modal-fullscreen-xl" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-fullscreen">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title text-center" >Aylık Yoklama Çizergesi</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i aria-hidden="true" class="ki ki-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="table-responsive table-bordered">
                        @if(count($month_roll)>0)
                        <table class="table table-head-custom table-vertical-center" id="kt_advance_table_widget_3">
                            <thead>
                                <tr class="text-left text-uppercase">
                                    <th style="padding: 27px !important;"> Tarihi</th>
                                    @php $count=0; $count1=0; @endphp
                                    @foreach($month_roll as $key => $roll)
                                        @if($key == 0)
                                            @foreach(json_decode($roll->data) as $key1 => $student_id)
                                                @if($count >= 2)
                                                    <th style="">
                                                        {{ @helper_user(intval($key1))->first_name }}
                                                        {{ @helper_user(intval($key1))->last_name }}
                                                    </th>
                                                @endif
                                             @php $count++; @endphp
                                            @endforeach
                                        @endif
                                    @endforeach
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($month_roll as $roll)
                                <tr>
                                    <td >
                                        {{ @$roll->roll_date }}
                                    </td>
                                    @foreach(json_decode($roll->data) as $status)
                                        @if($count1 >= 2)
                                        <td>
                                            @if($status=="true")
                                            <i class="far fa-check-circle text-success"></i>
                                            @endif
                                            @if($status=="false")
                                            <i class="far fa-circle text-danger"></i>
                                            @endif
                                        </td>
                                        @endif
                                    @php $count1++; @endphp
                                    @endforeach
                                    @php $count1=0; @endphp
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    @else
                    <div class="alert alert-warning" role="alert">
                       Bu Ay Bu Sınıfda Yoklama Alınmadı.
                    </div>
                    @endif
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light-danger font-weight-bold" data-dismiss="modal">Pencere Kapat</button>
                </div>
            </div>
        </div>
    </div>
</div>

    @endsection
    @section('css')
    <style>
   @media (max-width: 575.98px) {
  .modal-fullscreen {
    padding: 0 !important;
  }
  .modal-fullscreen .modal-dialog {
    width: 100%;
    max-width: none;
    height: 100%;
    margin: 0;
  }
  .modal-fullscreen .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
  }
  .modal-fullscreen .modal-body {
    overflow-y: auto;
  }
}
@media (max-width: 767.98px) {
  .modal-fullscreen-sm {
    padding: 0 !important;
  }
  .modal-fullscreen-sm .modal-dialog {
    width: 100%;
    max-width: none;
    height: 100%;
    margin: 0;
  }
  .modal-fullscreen-sm .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
  }
  .modal-fullscreen-sm .modal-body {
    overflow-y: auto;
  }
}
@media (max-width: 991.98px) {
  .modal-fullscreen-md {
    padding: 0 !important;
  }
  .modal-fullscreen-md .modal-dialog {
    width: 100%;
    max-width: none;
    height: 100%;
    margin: 0;
  }
  .modal-fullscreen-md .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
  }
  .modal-fullscreen-md .modal-body {
    overflow-y: auto;
  }
}
@media (max-width: 1199.98px) {
  .modal-fullscreen-lg {
    padding: 0 !important;
  }
  .modal-fullscreen-lg .modal-dialog {
    width: 100%;
    max-width: none;
    height: 100%;
    margin: 0;
  }
  .modal-fullscreen-lg .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
  }
  .modal-fullscreen-lg .modal-body {
    overflow-y: auto;
  }
}
.modal-fullscreen-xl {
  padding: 0 !important;
}
.modal-fullscreen-xl .modal-dialog {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
}
.modal-fullscreen-xl .modal-content {
  height: 100%;
  border: 0;
  border-radius: 0;
}
.modal-fullscreen-xl .modal-body {
  overflow-y: auto;
}


.btn-open-modal {
  margin-bottom: 0.5em;
}
        </style>
    @endsection
    @section('js')
    @endsection