Fix the event popover behavior after updating to the latest bootstrap.

This commit is contained in:
Alex Tselegidis 2022-09-14 10:14:47 +02:00
parent b6cc72cd06
commit f92d43b407
2 changed files with 36 additions and 22 deletions

View file

@ -27,6 +27,7 @@ App.Utils.CalendarDefaultView = (function () {
const $footer = $('#footer');
const $notification = $('#notification');
const $calendarToolbar = $('#calendar-toolbar');
let $popoverTarget;
const FILTER_TYPE_ALL = 'all';
const FILTER_TYPE_PROVIDER = 'provider';
const FILTER_TYPE_SERVICE = 'service';
@ -45,10 +46,8 @@ App.Utils.CalendarDefaultView = (function () {
$reloadAppointments.on('click', () => {
const calendarView = fullCalendar.view;
const $popovers = $('.popover');
if ($popovers.length) {
$popovers.popover('dispose');
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
refreshCalendarAppointments(
@ -65,8 +64,10 @@ App.Utils.CalendarDefaultView = (function () {
*
* Hides the open popover element.
*/
$calendarPage.on('click', '.close-popover', (event) => {
$(event.target).parents('.popover').popover('dispose');
$calendarPage.on('click', '.close-popover', () => {
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
});
/**
@ -77,9 +78,9 @@ App.Utils.CalendarDefaultView = (function () {
* @param {jQuery.Event} event
*/
$calendarPage.on('click', '.edit-popover', (event) => {
const $target = $(event.target);
$target.closest('.popover').popover('dispose');
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
let startMoment;
let endMoment;
@ -190,9 +191,9 @@ App.Utils.CalendarDefaultView = (function () {
* @param {jQuery.Event} event
*/
$calendarPage.on('click', '.delete-popover', (event) => {
const $target = $(event.target);
$target.parents('.popover').popover('dispose');
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
if (lastFocusedEventData.extendedProps.data.workingPlanException) {
const providerId = $selectFilterItem.val();
@ -360,7 +361,9 @@ App.Utils.CalendarDefaultView = (function () {
function onEventClick(info) {
const $target = $(info.el);
$calendarPage.find('.popover').popover('dispose'); // Close all open popovers.
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
let $html;
let displayEdit;
@ -721,7 +724,9 @@ App.Utils.CalendarDefaultView = (function () {
lastFocusedEventData = info.event;
$target.popover('toggle');
$target.popover('show');
$popoverTarget = $target;
// Fix popover position.
const $popover = $calendarPage.find('.popover');
@ -1022,7 +1027,9 @@ App.Utils.CalendarDefaultView = (function () {
// Remove all open popovers.
$('.close-popover').each((index, closePopoverButton) => {
$(closePopoverButton).parents('.popover').popover('dispose');
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
});
// Add new popovers.

View file

@ -32,6 +32,7 @@ App.Utils.CalendarTableView = (function () {
let $filterProvider;
let $filterService;
let $selectDate;
let $popoverTarget;
const moment = window.moment;
let lastFocusedEventData;
@ -145,7 +146,9 @@ App.Utils.CalendarTableView = (function () {
* Hides the open popover element.
*/
$calendar.on('click', '.close-popover', (event) => {
$(event.target).parents('.popover').popover('dispose');
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
});
/**
@ -154,7 +157,9 @@ App.Utils.CalendarTableView = (function () {
* Enables the edit dialog of the selected table event.
*/
$calendar.on('click', '.edit-popover', (event) => {
$(event.target).parents('.popover').popover('dispose');
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
let startMoment;
let endMoment;
@ -263,7 +268,9 @@ App.Utils.CalendarTableView = (function () {
* deletion then an ajax call is made to the server and deletes the appointment from the database.
*/
$calendar.on('click', '.delete-popover', (event) => {
$(event.target).parents('.popover').popover('dispose'); // Hide the popover.
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
// If id_role parameter exists the popover is an working plan exception.
if (lastFocusedEventData.extendedProps.data.hasOwnProperty('id_roles')) {
@ -1119,9 +1126,9 @@ App.Utils.CalendarTableView = (function () {
* @param {Object} info
*/
function onEventClick(info) {
const $popover = $('.popover');
$popover.popover('dispose'); // Close all open popovers.
if ($popoverTarget) {
$popoverTarget.popover('dispose');
}
let $html;
let displayEdit;
@ -1469,7 +1476,7 @@ App.Utils.CalendarTableView = (function () {
lastFocusedEventData = info.event;
$target.popover('toggle');
$target.popover('show');
// Fix popover position.
const $newPopover = $calendar.find('.popover');