Client dashboard now links to the new calendar

app/Http/Controllers/PatientController.php

@@ -209,7 +209,7 @@ class PatientController extends Controller
         return view('app.patient.manage-appointment', compact('patient', 'appointment'));
     }
 
-    public function calendar(Request $request, Client $patient) {
-        return view('app.patient.appointment-calendar', compact('patient'));
+    public function calendar(Request $request, Client $patient, Appointment $currentAppointment) {
+        return view('app.patient.appointment-calendar', compact('patient', 'currentAppointment'));
     }
 }

resources/views/app/patient/appointment-calendar.blade.php

@@ -57,6 +57,12 @@
     <link href='/fullcalendar-5.3.2/lib/main.css' rel='stylesheet' />
     <script src='/fullcalendar-5.3.2/lib/main.js'></script>
 
+    <?php
+    if(!$currentAppointment || !$currentAppointment->id) {
+        $currentAppointment = false;
+    }
+    ?>
+
     <div id="calendarApp">
         <div class="d-flex align-items-center mb-2">
             <h4 class="font-weight-bold m-0 font-size-16">
@@ -364,11 +370,11 @@
                     el: '#calendarApp',
                     data: {
                         client: {!! json_encode($patient) !!},
-                        eventTypes: 'BOTH',
+                        eventTypes: '{{ $currentAppointment ? 'BOTH_ALL' : 'BOTH' }}',
                         calendar: null,
                         proMeta: {!! json_encode($proMeta) !!},
                         proIds: ['{{ $pro->id }}'],
-                        timezone: 'EASTERN',
+                        timezone: '{{ $currentAppointment ? $currentAppointment->timezone : 'EASTERN' }}',
                         today: new Date('{{ date('Y-m-d 00:00:00') }}'),
 
                         // user clicks/selection
@@ -403,7 +409,8 @@
                         // availability
                         availability: {},
 
-                        inProgress: false
+                        inProgress: false,
+                        editHonored: false,
                     },
                     methods: {
                         // init
@@ -485,6 +492,12 @@
                         },
                         initCalendar: function () {
                             let self = this;
+                            <?php
+                            $initialDate = date('Y-m-d');
+                            if($currentAppointment) {
+                                $initialDate = trim(preg_replace("/ .*/", "", $currentAppointment->start_time));
+                            }
+                            ?>
                             this.calendar = new FullCalendar.Calendar($('.stag-fc-container')[0], {
                                 headerToolbar: {
                                     left: 'prev,next today',
@@ -492,7 +505,7 @@
                                     right: 'dayGridMonth,timeGridWeek,timeGridDay'
                                 },
                                 initialView: 'timeGridWeek',
-                                initialDate: '{{ date('Y-m-d') }}',
+                                initialDate: '{{ $initialDate }}',
                                 editable: true,
                                 selectable: true,
                                 navLinks: true,
@@ -557,6 +570,25 @@
                                             $('.fc .availability').each(function () {
                                                 $(this).parent('.fc-timegrid-event-harness').css('pointer-events', 'none');
                                             });
+
+                                            @if($currentAppointment)
+                                            if(!self.editHonored) {
+                                                window.setTimeout(function() {
+                                                    let allEvents = self.calendar.getEvents();
+                                                    if(allEvents) {
+                                                        let currentEvent = allEvents.filter(function(_ev) {
+                                                            return _ev.extendedProps.appointmentUid === '{{ $currentAppointment->uid }}';
+                                                        });
+                                                        if(currentEvent) currentEvent = currentEvent[0];
+                                                        if(currentEvent) {
+                                                            self.selectedEvent = currentEvent;
+                                                            self.showEditAppointmentModal();
+                                                            self.editHonored = true;
+                                                        }
+                                                    }
+                                                }, 250);
+                                            }
+                                            @endif
                                         }
                                         else {
                                             failureCallback('Unable to refresh appointments!');
@@ -577,6 +609,9 @@
                                     if (['CANCELLED', 'COMPLETED', 'ABANDONED'].indexOf(arg.event.extendedProps.status) !== -1) {
                                         classes.push('inactive-appointment');
                                     }
+                                    if (arg.event.extendedProps.type === 'appointment') {
+                                        classes.push('appointment-' + arg.event.extendedProps.appointmentUid);
+                                    }
                                     return classes;
                                 },
                                 loading: function(bool) {
@@ -764,6 +799,7 @@
                     },
                     mounted: function() {
                         this.init();
+                        @if(!$currentAppointment)
                         if(localStorage.stagCalendarTZ) {
                             this.timezone = localStorage.stagCalendarTZ;
                             Vue.nextTick(function() {
@@ -776,6 +812,7 @@
                                 $('#eventPros').trigger('change');
                             });
                         }
+                        @endif
                     }
                 });
             }

resources/views/app/patient/partials/appointments.blade.php

@@ -7,7 +7,7 @@
             @include('app/patient/partials/_appointment-form', ['appointment' => false])
         </div>--}}
         <span class="mx-2 text-secondary">|</span>
-        <a href="/patients/view/{{$patient->uid}}/manage-appointment">Add</a>
+        <a href="/patients/view/{{$patient->uid}}/calendar">Calendar</a>
     </div>
     <table class="table table-sm border-0 m-0">
         <tbody>
@@ -16,7 +16,7 @@
                 <td class="text-black p-0 border-0 pb-1">
                     <div class="pb-0 d-flex align-items-center flex-wrap">
                         <a class="on-hover-opaque mr-1"
-                           href="/patients/view/{{$patient->uid}}/manage-appointment/{{$appointment->uid}}"
+                           href="/patients/view/{{$patient->uid}}/calendar/{{$appointment->uid}}"
                            title="Update">
                             <i class="font-size-11 fa fa-edit text-primary"></i>
                         </a>

routes/web.php

@@ -115,7 +115,7 @@ Route::middleware('pro.auth')->group(function () {
         Route::get('manage-appointment/{appointment?}', 'PatientController@manageAppointment')->name('manage-appointment');
 
         // appointment calendar
-        Route::get('calendar', 'PatientController@calendar')->name('calendar');
+        Route::get('calendar/{currentAppointment?}', 'PatientController@calendar')->name('calendar');
     });
 
     // events for fc