@extends('layouts.vertical')

@section('css')
<link href="{{ Helper::assets('assets/libs/select2/select2.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/sweetalert/sweetalert.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/datatables/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
@endsection

@php
    $selected_child = $selected_room = "";
    if(app('request')->input('child')){
        $selected_child = app('request')->input('child');
    }
    if(app('request')->input('room')){
        $selected_room = app('request')->input('room');
    }
@endphp

@section('breadcrumb')
<div class="row page-title align-items-center">
    <div class="col-md">
        <h4 class="m-0 font-weight-medium">NCS forms</h4>
    </div>
    <div class="col-md-auto">
        <div class="form-inline float-md-right mt-3 mt-md-0">
            <div class="my-2 my-md-0">
                <a href="javascript:void(0);" class="font-weight-semibold text-pink mr-3 remind-parent">Remind all parents who have not signed</a>
            </div>
            <div class="">
                <a href="{{route('school.ncs-forms.create')}}" data-url="{{route('school.ncs-forms.create', ['room' => '_room', 'child' => '_child'])}}" class="btn btn-success btn-min-width btn-add-form">Add new form</a>
            </div>
        </div>
    </div>
</div>
@endsection

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="card mb-0">
            <div class="card-body">
                <div class="row">
                    <div class="col-md-6 col-xl-4 form-group">
                        {{-- <label>Select room</label> --}}
                        <select class="form-control wide single-arrow" data-plugin="customselect" name="room" id="room" data-placeholder="Select room">
                            @if(isset($rooms) && !empty($rooms))
                                @foreach ($rooms as $key => $room)
                                    @if(isset($room->childList) && !empty($room->childList))
                                        <option value="{{ $room->_id }}" {{ (!empty($selected_room) && $selected_room == $room->_id) || ($key== 0) ? 'selected' : ''}}>{{ $room->name }}</option>
                                    @endif
                                @endforeach
                            @endif
                        </select>
                    </div>
                    <div class="col-md-6 col-xl-4 form-group">
                        {{-- <label>Select children</label> --}}
                        <select class="form-control wide select2-custom" name="child" id="children" data-placeholder="Select child">
                            <option value="-1" data-count="0" {{ !isset($filter['child']) ? 'selected' : ''}}>All children</option>
                            @if(isset($rooms) && !empty($rooms))
                                @foreach ($rooms as $key => $room)
                                    @if(isset($room->childList) && !empty($room->childList))
                                        @foreach ($room->childList as $child)
                                            <option value="{{ $child->_id }}" {{ (!empty($selected_child) && $selected_child == $child->_id) ? 'selected' : ''}} {{ (!empty($selected_room) && $selected_room == $room->_id) || ($key== 0) ? '' : 'disabled'}} data-room="{{ $room->_id }}" data-image="{{ $child->profileImage }}">{{ $child->name }}</option>
                                        @endforeach
                                    @endif
                                @endforeach
                            @endif
                        </select>
                    </div>
                </div>
                <div class="position-relative">
                    <div class="child-loader" style="display:none;">Loading...</div>
                    <div class="children-found">
                        <div class="font-size-16 pb-3 table-title" style="display: none">List of all forms</div>
                        <table id="datatable" class="table table-striped table-merging-rows dt-responsive">
                            <thead>
                                <tr>
                                    <th>Child name</th>
                                    <th>Parent name</th>
                                    <th>Parent signature</th>
                                    <th>Services</th>
                                    <th>From date</th>
                                    <th>To date</th>
                                    <th>Shared on</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<form id="download-form" action="{{ route('school.ncs-forms.download') }}" method="POST" style="display: none;">
    @csrf
    <input type="hidden" name="id" class="id" value="">
    <input type="hidden" name="child" class="child" value="">
    <input type="hidden" name="utcOffset" class="utcOffset" value="">
</form>
@endsection

@section('script-bottom')
<script type="text/javascript"> 
var filterUrl = "{{ route('school.ncs-forms.filter') }}", removeUrl = "{{ route('school.ncs-forms.delete') }}", reminderUrl = "{{ route('school.ncs-forms.reminder') }}";
</script>
<script defer src="{{ Helper::assets('assets/libs/moment/moment.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/jquery.dataTables.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/dataTables.responsive.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/dataTables.bootstrap4.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/select2/select2.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/sweetalert/sweetalert.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/js/pages/ncs-forms.js') }}" type="text/javascript"></script>
@endsection