@extends('backend.layout.master')
@include('backend.report.css')
@section('content')

    <!--Start Hero-->
      <section class="hero-section business-startup">
              <div class="container">
                <form method="post" action="{{route('report.pdf')}}">
                @csrf

                <div class="row">
                  <div class="col-md-4">
                    <div class="heading mb-3"><h2>Reports</h2></div>
                  </div>

                  <div class="col-md-2">
                    <div class="form-group">
                      <label class="control-label" for="select_kids"><h5>Student</h5>
                      </label>
                      <select class="form-control js-example-basic-single" id="select_kids"
                                                    name="select_kids" required>
                            <option value="" disabled selected>Select Kids</option>
                            @foreach($kids as $kidsName)
                                <option value="{{ $kidsName->id}}"
                                    {{ ($data['select_kids'] == $kidsName->id) ? ' selected ' : ' ' }}> {{ $kidsName->first_name }} {{ $kidsName->last_name }} </option>
                            @endforeach
                        </select>
                    </div>
                  </div>

                  <div class="col-md-2">
                    <div class="form-group">
                      <label class="control-label" for="select_month"><h5>Month</h5>
                      </label>
                      
                      <input class="datepicker-here form-control digits" type="text" data-language="en" data-min-view="months" data-view="months" data-date-format="yyyy-mm" name="select_month" id="select_month" autocomplete="off" required value="{{$data['select_month']}}">
                      
                    </div>
                  </div>

                  <div class="col-md-4 report-button-pedding d-flex align-items-center">
                    <button type="button" class="btn btn-light-primary round mr-1 mb-2" id="show_report" onclick="getKidsData();"><img src="{!! asset('images/Path 87.png')!!}">Show Report</button>
                    <button type="submit" id="get_pdf" class="btn btn-light-primary round mr-1 mb-2"><img src="{!! asset('images/Group 60.svg')!!}">Export Pdf</button>
                  </div>

                </div>
                </form>


                
                <div class="row">
                  <div class="col-md-12">
                    <div class="card shadow-0 border card_border_radius_admin">
                      <div class="card-body">
                        <div class="table-responsive display-report">
                          <table class="table bodyData" role="grid"
                           aria-describedby="responsive_info" id="basic-37">
                              <thead>
                                  <tr>
                                      <th class="no-sort">DATE</th>
                                      <th class="no-sort">DROP OFF</th>
                                      <th class="no-sort"></th>
                                      <th class="no-sort">PICK UP</th>
                                      <th class="no-sort"></th>
                                      
                                  </tr>
                              </thead>
                              <tbody>
                                  
                              </tbody>  
                          </table>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
      </section>
      <!--End Hero-->


@endsection
@include('backend.report.js')