@extends('admin.layouts.master')
@section('page_title', __("Students Attendance"))
@section('breadcrumb')
	@include('admin.partials.breadcrumb', ['breads' => [__('Student Affairs Department'), __('Students Attendance')]])
@endsection

@section('content')
		<div class="row row-sm">
			<div class="col-xl-12">
				<div class="card mg-b-20">
					<div class="card-header pb-0">
						<div class="d-flex justify-content-between">
							<h4 class="card-title mg-b-0">{{__('Students Attendance')}}</h4>
							<i class="mdi mdi-dots-horizontal text-gray"></i>
						</div>
					</div>
					<div class="card-body">
						<table class="table table-bordered mg-b-0 text-md-nowrap">
							<tr>
		                        <th width="15%">{{__('Date & Time')}}</th><td>{{$session->session_date}}</td>
		                        <th width="15%">{{__('Group')}}</th><td>{{$session->group->name}}</td>
		                    </tr>
                            <tr>
		                        <th width="15%">{{__('Teacher')}}</th><td>{{$session->teacher->name}}</td>
		                        <th width="15%">{{__('Subject')}}</th><td>{{$session->subject->name}}</td>
		                    </tr>
		                    <tr>
		                        <th width="15%">{{__('Study Class')}}</th><td>{{$session->group->study_class->name}}</td>
		                        <th width="15%">{{__('Classroom')}}</th><td>{{$session->group->classroom->name}}</td>
		                    </tr>
		                </table>
						<form action="{{route(auth()->getDefaultDriver().'.group-sessions.student-attendance', $session->id)}}" method="POST" enctype="multipart/form-data" data-parsley-validate>
                            @csrf
                            <div class="row mb-20 m-0">
                                <div class=" form-group pr-3 ">
                                    <label class="profile-edit mb-20"></label>
                                    <div class="row pl-3">
                                        <div class="d-flex align-items-center mb-3 col-12 ">
                                            <label class="ckbox">
                                                <input name="checkAll" class="all" type="checkbox" {{$session->count_active==$session->student_attendance->count()?'checked':''}}>
                                                <span class="tx-13">{{__('Select All')}}</span>
                                            </label>
                                        </div>
                                        @foreach ($session->student_attendance as $student)
                                            <div class="d-flex align-items-center mb-3 col-xl-6 col-md-6 col-sm-6 col-12">
                                                <label class="ckbox">
                                                    <input name="student_id[]" value="{{$student->student_id}}" class="cc" type="checkbox" data-parsley-errors-container="#message-holder" {{$student->active?'checked':''}}>
                                                    <span class="tx-13">{{__($student->student->name)}}</span>
                                                </label>
                                            </div>
                                        @endforeach
                                    </div>
                                    <div class="form-group">
                                        <div id="message-holder"></div>
                                    </div>
                                </div>
                                <div class="col-12 row pr-4">
								    <button class="btn ripple btn-primary ml-3" type="submit" name="save" value="close">{{__('Save & Exit')}}</button>
								    <button class="btn ripple btn-success ml-3" type="submit" name="save" value="continue">{{__('Save & Continue')}}</button>
								</div>
                            </div>
                        </form>

					</div>
				</div>
			</div>
		</div>
	</div>
</div>
@endsection

@push('js')
    <script type="text/javascript">
        $('.all').on('click', function() {
            if (this.checked) {
                $('.cc').each(function() {
                    this.checked = true;
                    $('#error-checkbox2').html('');
                });
            } else {
                $('.cc').each(function() {
                    this.checked = false;
                });
            }
        });

        $('.cc').on('click', function() {
            if ($('.cc:checked').length === $('.cc').length) {
                $('.all').prop('checked', true);
            } else {
                $('.all').prop('checked', false);
            }
        });
    </script>
@endpush