Диалоги¶
Вместо стандартных JS-функций alert(), prompt() и confirm() можно использовать следующие функции (входят в стандартную поставку "Первой Формы"):
| Функция | Описание |
|---|---|
| dialogs.alert ( \'Заголовок\', \'Текст\', function()) | Окно с сообщением и кнопкой подтверждения, по клику на которую вызывается function() |
| dialogs.prompt (\'Заголовок\', \'Текст\', НачальноеЗначение, function(val)) | Окно с полем для ввода и двумя кнопками для подтверждения и отмены. По умолчанию в поле для ввода заносится НачальноеЗначение. По клику на любую кнопку вызывается function(). Если была нажата кнопка подтверждения, в функцию передается значение из поля ввода, а если была нажата кнопка отмены — в функцию передается false |
| dialogs.custom (\'Заголовок\', \'Текст\', {параметры окна}, function(val)) | Окно с сообщением и двумя кнопками. В функцию передается параметр, равный true если нажата кнопка ОК и false если нажата кнопка Отмена. Параметры окна можно посмотреть здесь |
| dialogs.error (\'Заголовок\', \'Текст\', function()) | Окно с иконкой , сообщением и кнопкой, по клику на которую вызывается function() |
| dialogs.success (\'Заголовок\', \'Текст\', function()) | Окно с иконкой , сообщением и кнопкой, по клику на которую вызывается function() |
ℹ️ Если заголовок или текст не нужен, вместо них в функцию передается null.
В заголовке и тексте можно задавать CSS-стили. Если функция не задана, никаких действий по нажатию на кнопку не выполняется. Пример с сообщением и кнопкой подтверждения:
Если задача находится в статусе "Ожидание обратной связи", то кнопка перехода скрывается, а при открытии задачи выдается сообщение. По нажатию кнопки "ОК" выполняется переход в следующий статус (ID перехода = 1234).
(window).addEventListener('MTFMainLoadFinished', function() {
// кнопка перехода по маршруту скрывается
document.getElementById('stepBtnUnderTaskText1234').hide();
if (document.getElementById('fieldState').innerText=='Ожидание обратной связи') {
dialogs.alert(
null,
'Действие выполнено',
function(){ document.getElementById('stepBtnUnderTaskText1234').click() }
)
};
});
Пример с двумя кнопками и параметрами окна:
По клику на кнопку перехода c ID перехода = 1234 (в данном примере это отклонение задачи) открывается окно с кнопками "Да" и "Нет", по клику на кнопку "Да" выполняется переход.
(window).addEventListener('MTFMainLoadFinished', function() {
var step = new TaskStepAPI(1234);
step.cancelDefaultAction();
step.click(function() {
dialogs.custom(
'Внимание!',
'Вы точно хотите отклонить задачу?',
{cancelButtonText: 'Нет', confirmButtonText: 'Да'},
function(isConfirm) { if (isConfirm) { step.makeStep(); } }
);
});
})
Пример с обработкой поля для ввода:
Если задача находится в статусе "Проверка данных", то по кнопке перехода не выполняется стандартный переход, а сначала запрашивается текст комментария. Если пользователь вводит комментарий, по нажатию кнопки "Отправить" выполняется переход с ID = 1234, а текст комментария записывается в ДП с ID = 999. По нажатию кнопки "Отмена" переход не выполняется. Если пользователь не вводит комментарий, переход также не выполняется.
(window).addEventListener('MTFMainLoadFinished', function() {
var ep999 = new ExtParam(999);
var inputValue = '';
if (document.getElementById('fieldState').innerText == 'Ожидание обратной связи') {
// определяем новую функцию для кнопки перехода
document.getElementById('stepBtnUnderTaskText1234').onclick = function() {
dialogs.prompt(
'Комментарий к неверным данным',
'В поле ниже укажите, какие данные неверны',
null,
function (inputValue) {
if (inputValue === '' || inputValue === false) {
dialogs.error(null, 'Обязательно заполните причину!');
} else {
dialogs.success(
'Сообщение о неверных данных отправлено!',
'Вы указали: ' + inputValue,
function () {
var func = function(event) { ChangeStep(1234, '', '', false); };
if( func(event) ){
WebForm_DoPostBackWithOptions(
new WebForm_PostBackOptions('', '', false, '', '', false, false)
);
__doPostBack('','');
}
ep999.val(inputValue);
}
);
}
}
);
}
}
});
Полезные ссылки
Описание параметров окна dialogs.custom (соответстуют параметрам функции SweetAlert)