@@ -40,6 +40,46 @@ document.addEventListener("DOMContentLoaded", function () {
40
40
} ) ;
41
41
} ) ;
42
42
43
+ const AppStateProxy = new Proxy ( AppState , {
44
+ set ( target , property , value ) {
45
+ console . log ( `Setting ${ property } to ${ value } ` )
46
+ // Check if the property being changed is 'isCreating'
47
+ if ( value === true ) {
48
+ attachEventListeners ( ) ; // Attach event listeners if isCreating becomes true
49
+ // (didn't check if property is isCreating, since AppStateProxy is only set with it)
50
+ }
51
+ target [ property ] = value ; // Set the property value
52
+ return true ; // Indicate successful setting
53
+ }
54
+ } ) ;
55
+
56
+ function attachEventListeners ( ) {
57
+ // Checks if the DOM is already loaded
58
+ if ( document . readyState === "complete" || document . readyState === "interactive" ) {
59
+ // DOM is already ready, attach event listeners directly
60
+ attachEventListenersToDropdown ( ) ;
61
+ } else {
62
+ // If the DOM is not yet ready, then wait for the DOMContentLoaded event
63
+ document . addEventListener ( 'DOMContentLoaded' , function ( ) {
64
+ attachEventListenersToDropdown ( ) ;
65
+ } ) ;
66
+ }
67
+ }
68
+
69
+ function attachEventListenersToDropdown ( ) {
70
+ const staffDropdown = document . getElementById ( 'staffSelect' ) ;
71
+ if ( staffDropdown && ! staffDropdown . getAttribute ( 'listener-attached' ) ) {
72
+ staffDropdown . setAttribute ( 'listener-attached' , 'true' ) ;
73
+ staffDropdown . addEventListener ( 'change' , async function ( ) {
74
+ const selectedStaffId = this . value ;
75
+ const servicesDropdown = document . getElementById ( 'serviceSelect' ) ;
76
+ const services = await fetchServicesForStaffMember ( selectedStaffId ) ;
77
+ updateServicesDropdown ( servicesDropdown , services ) ;
78
+ } ) ;
79
+ }
80
+ }
81
+
82
+
43
83
function initializeCalendar ( ) {
44
84
const formattedAppointments = formatAppointmentsForCalendar ( appointments ) ;
45
85
const calendarEl = document . getElementById ( 'calendar' ) ;
@@ -285,7 +325,7 @@ function closeModal() {
285
325
cancelButton . style . display = "none" ;
286
326
287
327
// Reset the editing flag
288
- AppState . isEditingAppointment = false ;
328
+ AppStateProxy . isEditingAppointment = false ;
289
329
290
330
// Close the modal
291
331
$ ( '#eventDetailsModal' ) . modal ( 'hide' ) ;
@@ -419,6 +459,32 @@ async function populateStaffMembers(selectedStaffId, isEditMode = false) {
419
459
return selectElement ;
420
460
}
421
461
462
+ // Function to fetch services for a specific staff member
463
+ async function fetchServicesForStaffMember ( staffId ) {
464
+ const url = `${ fetchServiceListForStaffURL } ?staff_id=${ staffId } ` ;
465
+ try {
466
+ const response = await fetch ( url ) ;
467
+ if ( ! response . ok ) throw new Error ( 'Network response was not ok' ) ;
468
+ const data = await response . json ( ) ;
469
+ return data . services_offered || [ ] ;
470
+ } catch ( error ) {
471
+ console . error ( "Error fetching services: " , error ) ;
472
+ return [ ] ; // Return an empty array in case of error
473
+ }
474
+ }
475
+
476
+ // Function to update services dropdown options
477
+ function updateServicesDropdown ( dropdown , services ) {
478
+ // Clear existing options
479
+ dropdown . innerHTML = '' ;
480
+
481
+ // Populate with new options
482
+ services . forEach ( service => {
483
+ const option = new Option ( service . name , service . id ) ; // Assuming service object has id and name properties
484
+ dropdown . add ( option ) ;
485
+ } ) ;
486
+ }
487
+
422
488
function getCSRFToken ( ) {
423
489
const metaTag = document . querySelector ( 'meta[name="csrf-token"]' ) ;
424
490
if ( metaTag ) {
@@ -510,14 +576,17 @@ function createNewAppointment(dateInput) {
510
576
511
577
async function showCreateAppointmentModal ( defaultStartTime , formattedDate ) {
512
578
const servicesDropdown = await populateServices ( null , false ) ;
513
- const staffDropdown = await populateStaffMembers ( null , false ) ;
579
+ let staffDropdown = null ;
580
+ if ( isUserSuperUser ) {
581
+ staffDropdown = await populateStaffMembers ( null , false ) ;
582
+ }
514
583
servicesDropdown . id = "serviceSelect" ;
515
584
servicesDropdown . disabled = false ; // Enable dropdown
516
585
517
586
document . getElementById ( 'eventModalBody' ) . innerHTML = prepareCreateAppointmentModalContent ( servicesDropdown , staffDropdown , defaultStartTime , formattedDate ) ;
518
587
519
588
adjustCreateAppointmentModalButtons ( ) ;
520
- AppState . isCreating = true ;
589
+ AppStateProxy . isCreating = true ;
521
590
$ ( '#eventDetailsModal' ) . modal ( 'show' ) ;
522
591
}
523
592
@@ -581,7 +650,10 @@ async function showEventModal(eventId = null, isEditMode, isCreatingMode = false
581
650
if ( ! appointment ) return ;
582
651
583
652
const servicesDropdown = await getServiceDropdown ( appointment . service_id , isEditMode ) ;
584
- const staffDropdown = await getStaffDropdown ( appointment . staff_id , isEditMode ) ;
653
+ let staffDropdown = null ;
654
+ if ( isUserSuperUser ) {
655
+ staffDropdown = await getStaffDropdown ( appointment . staff_id , isEditMode ) ;
656
+ }
585
657
586
658
document . getElementById ( 'eventModalBody' ) . innerHTML = generateModalContent ( appointment , servicesDropdown , isEditMode , staffDropdown ) ;
587
659
adjustModalButtonsVisibility ( isEditMode , isCreatingMode ) ;
@@ -608,11 +680,11 @@ function adjustModalButtonsVisibility(isEditMode, isCreatingMode) {
608
680
function toggleEditMode ( ) {
609
681
const modal = document . getElementById ( "eventDetailsModal" ) ;
610
682
const appointment = appointments . find ( app => Number ( app . id ) === Number ( AppState . eventIdSelected ) ) ;
611
- AppState . isCreating = false ; // Turn off creating mode
683
+ AppStateProxy . isCreating = false ; // Turn off creating mode
612
684
613
685
// Proceed only if an appointment is found
614
686
if ( appointment ) {
615
- AppState . isEditingAppointment = ! AppState . isEditingAppointment ; // Toggle the editing state
687
+ AppStateProxy . isEditingAppointment = ! AppState . isEditingAppointment ; // Toggle the editing state
616
688
updateModalUIForEditMode ( modal , AppState . isEditingAppointment ) ;
617
689
} else {
618
690
console . error ( "Appointment not found!" ) ;
0 commit comments