@extends('layouts.frontend')

@section('title')
    @lang('frontend.add_session')
@endsection
 
 @section('vendor_css')
    <link rel="stylesheet" type="text/css" href="{{ URL('/temp_frontend/app-assets/vendors/css/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ URL('/temp_frontend/app-assets/vendors/css/forms/selects/select2.min.css') }}">
 
@endsection
 
@section('custom_css')
    <link rel="stylesheet" type="text/css" href="{{ URL('/temp_frontend/app-assets/vendors/css/forms/selects/select2.rtl.css') }}">
@endsection

@section('content')  
<div class="row mt-5 small_width page_header">
	<div class="col-12 col-md-12 col-lg-12">
		<h2 class="title mr-2">@lang('frontend.add_session')</h2> 
    </div>
</div> 

<div class="row mt-3 small_width ">
	<div class="col-12 col-md-12 col-lg-12">
 		<div class="card pt-2 pb-2 "> 
	        <div class="card-body">   
        		<form class="form-horizontal" method="POST" action="{{ route('frontend-store-session') }}">
                <div class="card-block">
                 @if(session('error'))
                  <div class="row mb-3">
                    <div class="col-12 col-lg-6 col-md-12 alert bg-danger"> 
                       {!! session('error') !!}
                    </div>
                  </div> 
                  @endif
                        <div class="row">
                            <div class="col-12 col-lg-4 col-md-4 mb-1">
                                <fieldset class="form-group form-group{{ $errors->has('hcp_clinic_id') ? ' has-error' : '' }}">
                                    <label for="hcp_clinic_id">@lang('frontend.specialty')</label>
                                    <select name='hcp_clinic_id' id='hcp_clinic_id' required="" class="select2 form-control p-1" >
                                        <option value="">@lang('frontend.chose')</option>
                                        @foreach ($clincis as $clinic) 
                                            <option value="{{ $clinic->id }}">{{ $clinic->name }}</option>
                                        @endforeach
                                    </select>
                                </fieldset> 
                            </div>

                            <div class="col-xl-4 col-lg-6 col-md-12 mb-1">
                                <fieldset class="form-group form-group{{ $errors->has('hcp_doctor_id') ? ' has-error' : '' }}">
                                    <label for="hcp_doctor_id">@lang('frontend.hcp_doctor')</label>
                                    <select name='hcp_doctor_id' id='hcp_doctor_id' class="select2 form-control"  required="" >
                                        <option value="">@lang('frontend.chose')</option>
                                        @foreach ($doctors as $doctor)
                                            <option data-val='{{ $doctor->clinic_id }}' value="{{ $doctor->id }}">{{ $doctor->name }}</option>
                                        @endforeach
                                    </select>
                                </fieldset>
                            </div>
                            

                            <div class="col-12 col-lg-4 col-md-4 mb-1">
                                <fieldset class="form-group form-group{{ $errors->has('rc_center_id') ? ' has-error' : '' }}">
                                    <label for="rc_center_id">متلقى الخدمة الطبية</label>
                                    <select name='rc_center_id'  class="select2 form-control">
                                        <option value="">الجميع</option>
                                        @foreach ($rc_centers as $center) 
                                            <option value="{{ $center->id }}">{{ $center->name }}</option>
                                        @endforeach
                                    </select>
                                </fieldset>
                            </div>

                            <div class="col-12 col-lg-4 col-md-4 mb-1 "> 
                                <fieldset class="form-group form-group{{ $errors->has('session_date') ? ' has-error' : '' }}">
                                    <label for="session-date">@lang('frontend.session_date') :</label>
                                    <input size="16" name="session_date" type="text" value="{{ date('Y-m-d H:i') }}" readonly class="form_datetime p-2 rounded border"  required="" >
                                </fieldset>
                            </div> 
                            
                            
                            <div class="col-12 col-lg-4 col-md-4 mb-1 "> 
                                <fieldset class="form-group form-group{{ $errors->has('session_duration') ? ' has-error' : '' }}">
                                    <label for="session_duration">@lang('frontend.session_duration') :</label>
                                    <select name='session_duration' id='session_duration' class="select2 form-control"  required="" > 
                                          <option value="{{ date('H:i',strtotime('00:30')) }}">{{date('H:i',strtotime('00:30')) }}</option> 
                                    </select> 
                                </fieldset>
                            </div>
                        </div>  
                    </div>
 

                    <div class="row">
                        <div class="col-xl-4 col-lg-6 col-md-12 mb-1"> 
                            <button type="submit" class="btn btn-outline-primary">@lang('frontend.add') <i class="fa fa-check-circle "></i></button>
                             
                        </div>
                    </div> 

                </div>   
                {{ csrf_field() }}
            </form> 
					</div>  
	    </div>
    </div>
</div>

@endsection

 @section('page_vendor_js') 
    <script src="{{ URL('/temp_frontend/app-assets/vendors/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js') }} " type="text/javascript"></script>
    <script src="{{ URL('/temp_frontend/app-assets/vendors/js/forms/select/select2.full.min.js') }} " type="text/javascript"></script>
@endsection

@section('page_level_js') 
<script src="{{ URL('/temp_frontend/app-assets/js/scripts/forms/select/form-select2.js') }}" type="text/javascript"></script>  
<script type="text/javascript">
    $('#rc_center_id').on("select2:select", function (e) { 
       var data = e.params.data.id; 
            if(data=='all'){
                $("#rc_center_id > option").prop("selected","selected");
                $("#rc_center_id > option.all").removeAttr("selected");
                $("#rc_center_id").trigger("change");
            }
    });

    var select = $('#hcp_doctor_id'),
    cache = $('#hcp_doctor_id').clone(); 
    $("#hcp_clinic_id").change(function() { 
        var id = $(this).val(),
            options = [];
        select.empty();
        select.append('<option value="">اختر</option>');
        cache.find('option').each(function () {
            if (id === 'all') {
                select.append($(this).clone());
            } else if ($(this).data('val') == id) {
                select.append($(this).clone());
            }
        });
    });
 

    var select3 = $('#rc_doctor_id'),
    cache3 = $('#rc_doctor_id').clone(); 
    $("#rc_clinic_id").change(function() { 
        var id = $(this).val(),
            options = [];
        select3.empty();
        select3.append('<option value="">اختر</option>');
        cache3.find('option').each(function () {
            if (id === 'all') {
                select3.append($(this).clone());
            } else if ($(this).data('val') == id) {
                select3.append($(this).clone());
            }
        });
    });
var date = new Date();
date.setDate(date.getDate()); 
    $(".form_datetime").datetimepicker({
        format: 'yyyy-mm-dd hh:ii',
        autoclose: true,
        orientation: "auto",
      startDate: date,
      clearBtn: false
    });

   
</script>
@endsection