Поиск:

Установить минимальное количество времени или дней для бронирования услуги

При включенной опции "Мультивремя" в настройках услуги и кода ниже можно задать минимальное количество выбираемых ячеек времени или дней для всех или только для конкретных услуг.

Первый вариант: блокировка кнопки "Перейти на следующий шаг" до тех пор, пока не будет выбрано указанное количество слотов.

В разделе Настройки -> Дополнительные CSS/JS -> JS разместите следующий код:

<script>
var minTime = 2;
var applyToAll = 0;
var relatedServicesIds = ["12345", "67890"];

$('body').on('click', function() {	
   setTimeout(function() {
     var tBtn = $('.time-checkbox:checked').length;
     if ( relatedServicesIds.some((el) => $('#service-data a[data-href].selected').attr('data-id').includes(el)) || applyToAll == 1 ) {
       $('.next-btn').hide();
       if (tBtn >= minTime) {
         $('.next-btn').addClass('active').css({display: 'inline-block'});
       } else {
         $('.next-btn').removeClass('active').hide();
       }
     }
   }, 10);
});

</script>

Второй вариант: отображение надписи "Для продолжения записи выберите слотов: 2"

<script>
var minTime = 2; // минимальное количество ячеек для бронирования
var applyToAll = 0; // применить ко всем услугам, 0 - нет, 1 - да
var relatedServicesIds = ["12345", "67890"]; // применить только к указанным услугам по их ID
var minTimeMessagePt1 = "Для продолжения записи выберите"; // подсказка выбора слотов
var minTimeMessagePt2 = "слотов"; // название слота в подсказке

var minTimeMsgAlert = document.createElement('div');
minTimeMsgAlert.id = 'minTimeAlert';
minTimeMsgAlert.style.setProperty("display", "inline-block");
$('body').on('change', '.time-checkbox', function() {
    setTimeout(function() {
        var tBtn = $('.time-checkbox:checked').length;
        var nextButton = $('.next-btn');
        var minTimeAlert = $('#minTimeAlert');
        if ( relatedServicesIds.some((el) => $('#service-data a[data-href].selected').attr('data-id').includes(el)) || applyToAll == 1 ) {
            nextButton.hide();
            if ($('#'+minTimeMsgAlert.id).length == 0) {
                $('.multitime').append(minTimeMsgAlert);
            }
            minTimeMsgAlert.innerHTML = minTimeMessagePt1 + ' еще ' + minTimeMessagePt2 + ': ' + (minTime - tBtn);
            minTimeMsgAlert.style.setProperty("color", '#FF0000');
            if (tBtn < minTime && tBtn >= 1) {
                nextButton.removeClass('active').hide();
                minTimeAlert.show();
            } else if (tBtn < 1) {
                nextButton.removeClass('active').hide();
                minTimeAlert.show();
                minTimeMsgAlert.innerHTML = minTimeMessagePt1 + ' ' + minTimeMessagePt2 + ': ' + (minTime - tBtn);
                minTimeMsgAlert.style.setProperty("color", '#009602');
            } else if (tBtn >= minTime) {
                nextButton.addClass('active').css({display: 'inline-block'});
                minTimeAlert.hide();
            }
        }
    }, 10);
});

$(document).ajaxComplete(function() { setTimeout(function() { $('.time-checkbox:first').trigger('change'); }, 15); });
</script>

Выделенные зеленым значения в коде замените на свои:

• 2 (переменная minTime) - необходимое количество ячеек времени или дней
• 0 (переменная applyToAll) - значение 1 будет применять minTime ко всем услугам, значение 0 - только к конкретным услугам, указанным в следующей строке

• "12345", "67890" - ID услуг (отображается в шапке окна редактирования услуги), к которым будет применяться minTime. Важно перечислять значения внутри скобок через запятую, каждый ID заключен в кавычки. Если нужно указать только одну услугу, ID прописывается в скобках, в кавычках, без запятой в конце. Например:

var relatedServicesIds = ["12345"];