@include('includes/header_start')

<link href="{{ asset('assets/plugins/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/plugins/select2/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker.min.css') }}" rel="stylesheet">
<!--Morris Chart CSS -->
<link rel="stylesheet" href="{{ asset('assets/plugins/morris/morris.css') }}">

@include('physicians/elements/header_end')

                            <!-- Page title -->
                            <ul class="list-inline menu-left mb-0">
                                <li class="list-inline-item">
                                    <button type="button" class="button-menu-mobile open-left waves-effect">
                                        <i class="ion-navicon"></i>
                                    </button>
                                </li>
                                <li class="hide-phone list-inline-item app-search">
                                    <h3 class="page-title">Schedule Call</h3>
                                </li>
                            </ul>

                            <div class="clearfix"></div>
                        </nav>

                    </div>
                    <!-- Top Bar End -->

                    <!-- ==================
                         PAGE CONTENT START
                         ================== -->

                    <div class="page-content-wrapper">

                        <div class="row">
                            <div class="col-md-6 col-sm-12">
                                <div class="card m-b-30">
                                    <h4 class="card-header mt-0">Schedule a Call</h4>
                                    <div class="card-body">
                                        <h4 class="card-title font-20 mt-0">Please choose a date and time below.</h4>
                                        <p class="card-text">With supporting text below as a natural lead-in to
                                            additional content.</p>

                                        <form action="{{ isset($id) ? route('calls.schedule.surgeon.store', ['id' => $id]) : route('calls.schedule.surgeon.store') }} " method="POST" enctype="multipart/form-data" autocomplete="off">
                                            @csrf

                                            <div class="row">


                                                <div class="col-md-4 col-sm-12 col-xs-12">
                                                    <div class="form-group">
                                                        <label class="control-label">Patient</label>

                                                        <select class="select2 form-control selectbox" id="patient_id" name="patient_id" data-placeholder="Choose ...">
                                                            <option value="">Select a patient</option>
                                                            @foreach($patients as $patient)
                                                                <option value="{{ $patient->id }}">{{ $patient->first_name }} {{ $patient->last_name }}</option>
                                                            @endforeach
                                                        </select>

                                                        @if ($errors->has('patient_id'))
                                                            <span class="badge badge-danger">{{ $errors->first('patient_id') }}</span>
                                                        @endif

                                                    </div>
                                                </div>

                                                <div class="col-md-4 col-sm-12 col-xs-12">
                                                    <div class="form-group">
                                                        <label>Date of Call</label>
                                                        <div>
                                                            <div class="input-group">
                                                                <input type="text" class="form-control" placeholder="Select from calendar" id="date" name="call_date">
                                                                <div class="input-group-append">
                                                                    <span class="input-group-text"><i class="mdi mdi-calendar"></i></span>
                                                                </div>
                                                            </div><!-- input-group -->

                                                            @if ($errors->has('call_date'))
                                                                <span class="badge badge-danger">{{ $errors->first('call_date') }}</span>
                                                            @endif
                                                        </div>
                                                    </div>
                                                </div>


                                                <div class="col-md-4 col-sm-12 col-xs-12">
                                                    <div class="form-group">
                                                        <label class="control-label">Call Time</label>

                                                        {{--                                                        <select class="select2 form-control selectbox" id="sedation" name="call_time" data-placeholder="Choose ...">--}}
                                                        {{--                                                            <option value="">Select from dropdown</option>--}}
                                                        {{--                                                            <option value="AM">AM</option>--}}
                                                        {{--                                                            <option value="PM">PM</option>--}}
                                                        {{--                                                        </select>--}}
                                                        <input class="form-control" type="time" value="13:00" id="" name="call_time">

                                                        @if ($errors->has('call_time'))
                                                            <span class="badge badge-danger">{{ $errors->first('call_time') }}</span>
                                                        @endif

                                                    </div>
                                                </div>

                                            </div>

                                            <button type="submit" class="btn btn-primary pull-right">Submit</button>
                                        </form>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6 col-sm-12">
                                @include('physicians.calls.elements.calls-panel')

                            </div>

                            <div class="col-md-6 col-sm-12">
                                <div class="card m-b-30">
                                    <h4 class="card-header mt-0">View Scheduled Calls</h4>
                                    <div class="card-body">
                                        <p class="text-muted m-b-30 font-14">

                                        </p>
                                        <div class="table-responsive">
                                            <table id="datatable-buttons" class="table table-striped table-bordered" cellspacing="0" width="100%">
                                                <thead>
                                                <tr>
                                                    <th>Patient Name</th>
                                                    <th>Date</th>
                                                    <th>Time</th>
                                                    <th>Status</th>
                                                </tr>
                                                </thead>


                                                <tbody>
                                                @foreach($callRequests as $call)
                                                <tr>
                                                    <td><a href="{{ route('patient.view', $call->patient->id) }}">{{ $patient->first_name }} {{ $patient->last_name }}</a></td>
                                                    <td>{{ date('m/d/Y', strtotime($call->call_date))  }}</td>
                                                    <td>{{ $call->call_time }}</td>
                                                    @if($call->status === 'Pending')
                                                        <td><span class="badge badge-warning">{{ $call->status }}</span></td>
                                                    @elseif($call->status === 'Physician Request Sent')
                                                        <td><span class="badge badge-warning">{{ $call->status }}</span></td>
                                                    @elseif($call->status === 'Physician Request Declined')
                                                        <td><span class="badge badge-danger">{{ $call->status }}</span></td>
                                                    @elseif($call->status === 'Accepted by Patient')
                                                        <td><span class="badge badge-success">{{ $call->status }}</span></td>
                                                    @elseif($call->status === 'Declined by Patient')
                                                        <td><span class="badge badge-danger">{{ $call->status }}</span></td>
                                                    @else()
                                                        <td></td>
                                                    @endif
                                                </tr>
                                                @endforeach
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>

                    </div> <!-- Page content Wrapper -->


@include('includes/footer_start')

<script src="{{ asset('assets/plugins/select2/js/select2.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js') }}"></script>

<script src="{{ asset('assets/plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('assets/pages/datatables.init.js') }}"></script>

<script>

    $(function () {
        $('#date').datepicker({
            format: "mm/dd/yyyy",
            language: "en"
        });

        $(".selectbox").select2();
    });
</script>
@include('includes/footer_end')