From fe71a9f84c8f6dbec2477fb36c6f554883e69be0 Mon Sep 17 00:00:00 2001
From: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Date: Thu, 25 Jul 2024 16:15:18 +0100
Subject: [PATCH] Bug 34440: Enforce lead/trail restrictions

This patch adds rule enforcement into the user interface. When
attempting to make a booking now, instead of just visually displaying
the lead and trail period and highlighting when an overlap appears, we
now block the ability to select a date when such an overlap case is
found.

Sponsored-by: Cuyahoga County Public Library <https://cuyahogalibrary.org/>
Signed-off-by: Kristi Krueger <KKRUEGER@cuyahogalibrary.org>
Signed-off-by: Paul Derscheid <paul.derscheid@lmscloud.de>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
---
 .../prog/css/src/staff-global.scss            | 12 +++++
 .../prog/js/modals/place_booking.js           | 52 +++++++++++++++++--
 2 files changed, 61 insertions(+), 3 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
index 94110ebcf1..2bc5c5db27 100644
--- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
+++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
@@ -890,6 +890,18 @@ $dayTrailBackground: #fcdcb3 !default;
     &.trailRangeEnd {
         border-radius: 0 50px 50px 0;
     }
+
+    &.leadDisable {
+        color: #aaa !important;  /* Gray out the text */
+        background: #f5f5f5 !important;  /* Light background */
+        cursor: not-allowed !important;
+    }
+
+    &.trailDisable {
+        color: #aaa !important;  /* Gray out the text */
+        background: #f5f5f5 !important;  /* Light background */
+        cursor: not-allowed !important;
+    }
 }
 
 .input-warning {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/modals/place_booking.js b/koha-tmpl/intranet-tmpl/prog/js/modals/place_booking.js
index e27948c4fb..4a168d107b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/modals/place_booking.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/modals/place_booking.js
@@ -26,7 +26,6 @@ function containsAny(integers1, integers2) {
 }
 
 $("#placeBookingModal").on("show.bs.modal", function (e) {
-
     // Get context
     let button = $(e.relatedTarget);
     let biblionumber = button.data("biblionumber");
@@ -143,10 +142,10 @@ $("#placeBookingModal").on("show.bs.modal", function (e) {
                 patron_category_id: booking_patron.category_id,
                 item_type_id: booking_itemtype_id,
                 library_id: pickup_library_id,
-                rules: 'bookings_lead_period,bookings_trail_period'
+                rules: "bookings_lead_period,bookings_trail_period",
             },
             success: function (response) {
-                let rules = response[0]
+                let rules = response[0];
                 leadDays = rules.bookings_lead_period;
                 trailDays = rules.bookings_trail_period;
 
@@ -824,6 +823,8 @@ $("#placeBookingModal").on("show.bs.modal", function (e) {
                             const trailStart = hoverDate;
                             const trailEnd = hoverDate.add(trailDays, "day");
 
+                            let leadDisable = false;
+                            let trailDisable = false;
                             periodPicker.calendarContainer
                                 .querySelectorAll(".flatpickr-day")
                                 .forEach(function (dayElem) {
@@ -857,11 +858,56 @@ $("#placeBookingModal").on("show.bs.modal", function (e) {
                                         "trailRangeEnd",
                                         elemDate.isSame(trailEnd)
                                     );
+                                    // If we're overlapping a disabled date, disable our hoverDate
+                                    if (
+                                        dayElem.classList.contains(
+                                            "flatpickr-disabled"
+                                        )
+                                    ) {
+                                        if (
+                                            !periodPicker.selectedDates[0] &&
+                                            elemDate.isSameOrAfter(leadStart) &&
+                                            elemDate.isBefore(leadEnd)
+                                        ) {
+                                            leadDisable = true;
+                                        }
+                                        if (
+                                            elemDate.isAfter(trailStart) &&
+                                            elemDate.isSameOrBefore(trailEnd)
+                                        ) {
+                                            trailDisable = true;
+                                        }
+                                    }
+                                    dayElem.classList.remove("leadDisable");
+                                    dayElem.classList.remove("trailDisable");
+                                    dayElem.removeEventListener(
+                                        "click",
+                                        disableClick,
+                                        true
+                                    );
                                 });
+
+                            if (leadDisable) {
+                                target.classList.add("leadDisable");
+                            }
+                            if (trailDisable) {
+                                target.classList.add("trailDisable");
+                            }
+                            if (trailDisable || leadDisable) {
+                                target.addEventListener(
+                                    "click",
+                                    disableClick,
+                                    true
+                                );
+                            }
                         }
                     }
                 );
 
+                function disableClick(e) {
+                    e.stopImmediatePropagation();
+                }
+
                 // Enable flatpickr now we have date function populated
                 periodPicker.redraw();