View | Details | Raw Unified | Return to bug 34440
Collapse All | Expand All

(-)a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss (+12 lines)
Lines 871-876 $dayTrailBackground: #fcdcb3 !default; Link Here
871
    &.trailRangeEnd {
871
    &.trailRangeEnd {
872
        border-radius: 0 50px 50px 0;
872
        border-radius: 0 50px 50px 0;
873
    }
873
    }
874
875
    &.leadDisable {
876
        color: #aaa !important;  /* Gray out the text */
877
        background: #f5f5f5 !important;  /* Light background */
878
        cursor: not-allowed !important;
879
    }
880
881
    &.trailDisable {
882
        color: #aaa !important;  /* Gray out the text */
883
        background: #f5f5f5 !important;  /* Light background */
884
        cursor: not-allowed !important;
885
    }
874
}
886
}
875
887
876
.input-warning {
888
.input-warning {
(-)a/koha-tmpl/intranet-tmpl/prog/js/modals/place_booking.js (-5 / +34 lines)
Lines 389-394 $("#placeBookingModal").on("show.bs.modal", function (e) { Link Here
389
                    periodPicker.config.disable.push(function dateDisable(
389
                    periodPicker.config.disable.push(function dateDisable(
390
                        date
390
                        date
391
                    ) {
391
                    ) {
392
392
                        // set local copy of selectedDates
393
                        // set local copy of selectedDates
393
                        let selectedDates = periodPicker.selectedDates;
394
                        let selectedDates = periodPicker.selectedDates;
394
395
Lines 813-820 $("#placeBookingModal").on("show.bs.modal", function (e) { Link Here
813
                            );
814
                            );
814
                            const startDate = periodPicker.selectedDates[0]
815
                            const startDate = periodPicker.selectedDates[0]
815
                                ? dayjs(periodPicker.selectedDates[0]).startOf(
816
                                ? dayjs(periodPicker.selectedDates[0]).startOf(
816
                                      "day"
817
                                    "day"
817
                                  )
818
                                )
818
                                : null;
819
                                : null;
819
820
820
                            const leadStart = startDate
821
                            const leadStart = startDate
Lines 824-829 $("#placeBookingModal").on("show.bs.modal", function (e) { Link Here
824
                            const trailStart = hoverDate;
825
                            const trailStart = hoverDate;
825
                            const trailEnd = hoverDate.add(trailDays, "day");
826
                            const trailEnd = hoverDate.add(trailDays, "day");
826
827
828
                            let leadDisable = false;
829
                            let trailDisable = false;
827
                            periodPicker.calendarContainer
830
                            periodPicker.calendarContainer
828
                                .querySelectorAll(".flatpickr-day")
831
                                .querySelectorAll(".flatpickr-day")
829
                                .forEach(function (dayElem) {
832
                                .forEach(function (dayElem) {
Lines 838-844 $("#placeBookingModal").on("show.bs.modal", function (e) { Link Here
838
                                    dayElem.classList.toggle(
841
                                    dayElem.classList.toggle(
839
                                        "leadRange",
842
                                        "leadRange",
840
                                        elemDate.isSameOrAfter(leadStart) &&
843
                                        elemDate.isSameOrAfter(leadStart) &&
841
                                            elemDate.isBefore(leadEnd)
844
                                        elemDate.isBefore(leadEnd)
842
                                    );
845
                                    );
843
                                    dayElem.classList.toggle(
846
                                    dayElem.classList.toggle(
844
                                        "leadRangeEnd",
847
                                        "leadRangeEnd",
Lines 851-867 $("#placeBookingModal").on("show.bs.modal", function (e) { Link Here
851
                                    dayElem.classList.toggle(
854
                                    dayElem.classList.toggle(
852
                                        "trailRange",
855
                                        "trailRange",
853
                                        elemDate.isAfter(trailStart) &&
856
                                        elemDate.isAfter(trailStart) &&
854
                                            elemDate.isSameOrBefore(trailEnd)
857
                                        elemDate.isSameOrBefore(trailEnd)
855
                                    );
858
                                    );
856
                                    dayElem.classList.toggle(
859
                                    dayElem.classList.toggle(
857
                                        "trailRangeEnd",
860
                                        "trailRangeEnd",
858
                                        elemDate.isSame(trailEnd)
861
                                        elemDate.isSame(trailEnd)
859
                                    );
862
                                    );
863
                                    // If we're overlapping a disabled date, disable our hoverDate
864
                                    if (dayElem.classList.contains("flatpickr-disabled")) {
865
                                        if (elemDate.isSameOrAfter(leadStart) && elemDate.isBefore(leadEnd)) {
866
                                            leadDisable = true;
867
                                        }
868
                                        if (elemDate.isAfter(trailStart) &&
869
                                            elemDate.isSameOrBefore(trailEnd)) {
870
                                            trailDisable = true;
871
                                        }
872
                                    }
873
                                    dayElem.classList.remove("leadDisable");
874
                                    dayElem.classList.remove("trailDisable");
875
                                    dayElem.removeEventListener('click', disableClick, true);
860
                                });
876
                                });
877
878
                            if (leadDisable) {
879
                                target.classList.add("leadDisable");
880
                            }
881
                            if (trailDisable) {
882
                                target.classList.add("trailDisable");
883
                            }
884
                            if (trailDisable || leadDisable) {
885
                                target.addEventListener('click', disableClick, true);
886
                            }
861
                        }
887
                        }
862
                    }
888
                    }
863
                );
889
                );
864
890
891
                function disableClick(e) {
892
                    e.stopImmediatePropagation();
893
                }
894
865
                // Enable flatpickr now we have date function populated
895
                // Enable flatpickr now we have date function populated
866
                periodPicker.redraw();
896
                periodPicker.redraw();
867
897
868
- 

Return to bug 34440