@extends('admin.layouts.container')
@section('css')
 <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
@endsection
@section('content')
<div class="side-title">
    <h3>{{ $head ?? '' }}</h3>
</div>

<div class="border-item">
    <form class="form-row" method="post" >
        <div class="form-group col-lg-6">
            <label>من</label>
            <input type="date" class="form-control" id="start" onchange="dateSelect(this)" />
        </div>       
          <div class="form-group col-lg-6">
            <label>الي</label>
            <input type="date" class="form-control" id="end" onchange="dateSelect(this)"/>
        </div>       


    <div class="col-lg-12">
         <h5 class="text-uppercase font-weight-bold">الجلسات</h5>
        <div class="new-users border-item  table-responsive no-padding">
        <table class="table table-bordered table-hover" style="text-align:center">
            <thead>
                
                <th>#</th>
                <th>المريض</th>
                <th>الطبيب</th>
                <th>التكنكال</th>
                <th>قبل</th>
                <th>بعد</th>
                <th>المنطقة</th>
                <th>التاريخ</th>
            </thead>
            
            <tbody id="rows">
                @foreach($sessions as $key=>$row)
                <tr>
                    <td>{{$key+1}}</td>
                    <td>{{$row->patient->name}}</td>
                    <td>{{$row->doctor->name}}</td>
                    <td>{{$row->technical->name}}</td>
                    <td>{{$row->beforing}}</td>
                    <td>{{$row->aftering}}</td>
                    <td>{{$row->area}}</td>
                    <td>{{$row->dating}}</td>
                </tr>
                @endforeach
               
            </tbody>
        </table>
  
    </div>
    </div>



    </form>
</div>

@endsection

@section('inner_js')
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(document).ready(function() {
    $('.js-example-basic-single').select2({maximumSelectionLength: 1,placeholder: 'ادخل الاسم',});
    $('.select2-search__field').css('font-size','14px');
    $('.selection').attr('class', 'form-control');
});
    function addketo(elem){
        $("#ketos").css("display", "block");
        var num = $(elem).attr('data-id');
       
       var newrow = parseInt(num)+1; 
        $(elem).attr('data-id', newrow);
        
         $.ajax({
          url : urls+'/'+num,
          type : 'GET',
          data : 'nothing',
          success:function(data)
          {
            $('#ketos').append(data);
          }
        })
    }
     function dateSelect(elem){
        
        var start = $('#start').val();
        var end = $('#end').val();
       
       
         $.ajax({
          url : urls+'/'+{!! json_encode($id) !!}+','+start+','+end,
          type : 'GET',
          data : 'nothing',
          success:function(data)
          {
            $('#rows').html(data);
          }
        })
    }
    function showdata(elem){
        let data = $(elem).val();
        if ($('input.checkbox_check').is(':checked')) {
            $('#ketoshow').css('display','block');
        }
        else{
            
            $('#ketoshow').css('display','none');
        }
    } 
     function remove(elem){
            $(elem).closest('.row').remove();
        }
        </script>
    <!-- Editor JS files -->
{{--    <script src="{{ asset('/assets/admin/js/lib/tinymce.min.js') }}"></script>--}}
            <script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
    <script>
        let route_prefix = "{{ url(config('lfm.prefix')) }}",
            url = "{{url('/')}}/",
            urls = "{{url('/')}}/admin/datesessions",
            url_question = "{{url('/')}}/admin/questiondata",
            imagePath = "{{asset('')}}";
    </script>
    <script src="{{ asset('assets/admin/js/editor.js') }}"></script>
    <script src="{{ asset('assets/admin/js/lfm.js') }}"></script>
@endsection