@extends('layouts.main')

@push('styles')
    <link href="{{ asset('elite/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('elite/bower_components/select2/select2.min.css') }}" rel="stylesheet" />
@endpush

@section('content')

    <div class="row bg-title">
        <div class="col-md-6">
            <h4 class="page-title">{{ __('patients.create') }}</h4>
        </div>
        <div class="col-md-6">
            <ol class="breadcrumb">
                <li><a href="{{ route('home') }}">{{ __('patients.dashboard') }}</a></li>
                <li><a href="{{ url('/patients/follow_up') }}">{{ __('patients.appointments') }}</a></li>
                <li class="active">{{ __('patients.create') }}</li>
            </ol>
        </div>
    </div>

    @include('flash::message')

    @include('errors.list')

    <div class="row">
        <div class="col-sm-6">
            <div class="white-box">
                <h3 class="box-title m-b-0">{{ __('patients.patient_search') }}</h3>
                <div class="form-group">
                    <select class="patient_full_name form-control" style="width:100%;" name="patient_full_name" id="patient_full_name"></select>
                </div>
            </div>
        </div>

        <div class="col-sm-6">
            <div class="white-box">
                <h3 class="box-title m-b-0">{{ __('patients.patient_information') }}</h3>
                <div id="patient_information"></div>
            </div>
        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-body">
            {{ Form::open(['route' => 'patients.save_appointment']) }}

            {{ Form::hidden('patient_id', '', ['class' => 'patient_id', 'id' => 'patient_id']) }}

            <div class="row">
                <div class="col-md-6">
                    <div class="form-group">
                        {{ Form::label('clinic_allocation', __('patients.assign_clinic')) }}
                        {{ Form::select('clinic_allocation', $clinics, '', ['class' => 'form-control col-sm-12 compulsory search_criteria', 'id' => 'clinic_allocation']) }}
                    </div>

                    <div class="form-group">
                        {{ Form::label('in_charge', __('patients.assign_incharge')) }}
                        <select id="in_charge" class="form-control col-sm-12 compulsory search_criteria">
                            <option value="0">{{ __('patients.dont_assign_incharge') }}</option>
                            @foreach($users as $user)
                                <option value="{{ $user->id }}">{{ $user->first_name }} {{ $user->last_name }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-group">
                        {{ Form::label('appointment_date',__('patients.appointment_date')) }}
                        <div class="input-group">
                            {{ Form::text('appointment_date','',['class' => 'compulsory form-control','readonly','id'=>'appointment_date', 'required']) }}
                        </div>
                        <div class="help-block with-errors"></div>
                    </div>

                    <div class="form-group">
                        {{ Form::label('appointment_time',__('patients.appointment_time')) }}
                        {{ Form::time('appointment_time','',['class' => 'compulsory form-control','required']) }}
                        <div class="help-block with-errors"></div>
                    </div>
                </div>
            </div>

            <div class="form-group">
                {{ Form::label('comments',__('patients.comments')) }}
                {{ Form::textarea('comments','',['class' => 'form-control', 'data-error'=>'','id'=>'comments']) }}
                <div class="help-block with-errors"></div>
            </div>

            {{ Form::button(__('patients.submit'),['type'=>'submit','class'=>'btn btn-success waves-effect waves-light m-r-10', 'id' => 'submit_button']) }}
            {{ Form::button(__('patients.cancel'),['type'=>'reset','class'=>'btn btn-default waves-effect waves-light']) }}

            {{ Form::close() }}
        </div>
    </div>
@endsection

@push('scripts')
    <script src="{{ asset('elite/js/validator.js') }}"></script>
    <script src="{{ asset('elite/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.js') }}"></script>
    <script src="{{ asset('elite/bower_components/select2/select2.min.js') }}"></script>

    <script type="text/javascript">
        $('#appointment_date').datepicker({
            autoclose: true,
            todayHighlight: true,
            format: 'dd-mm-yyyy',
        });

        $('.patient_full_name').change(function() {
            let id = $('#patient_full_name').val();
            $('#patient_id').val(id);

            $.ajax({
                method: 'GET',
                url: "/patients/update_patient_info/" + id,
                success: function(response){
                    $('#patient_information').html(response).show();
                },
                error: function (error) {
                    //console.log(error);
                }
            });
        }).select2({
            placeholder: "<?php echo "Search by patient name or number" ?>",
            ajax: {
                url: '/patients/search_patient_by_name_number',
                dataType: 'json',
                delay: 250,
                processResults: function (data) {
                    return {
                        results:  $.map(data, function (item) {
                            return {
                                text: item.first_name + " " + item.last_name + " ("+ item.number + ") " + item.phone,
                                id: item.id
                            }
                        })
                    };
                },
                cache: true
            }
        });
    </script>
@endpush