// Модуль для работы с модальным окном // импорт компонента Modal из bootstrap import {Modal} from 'bootstrap'; import {cntrls, imagePlaceholder} from './lines-ui'; // поиск модального окна на странице const modal = document.getElementById('items-update'); // если он найден, то создается экземпляр компонента Modal // для программного управления модальным окном const myModal = modal ? new Modal(modal, {}) : null; // поиск тега с заголовком модального кона для его смены const modalTitle = document.getElementById('items-update-title'); // обнуление значений модального окна, т. к. // используется одно окно для всех операций // eslint-disable-next-line require-jsdoc function resetValues() { cntrls.lineId.value = ''; cntrls.itemsType.value = ''; cntrls.name_book.value = ''; cntrls.author.value = ''; cntrls.price.value = parseFloat(0).toFixed(2); cntrls.isbn.value = 0; cntrls.image.value = ''; cntrls.text.value = ''; cntrls.imagePreview.src = imagePlaceholder; } // функция для показа модального окна // перед показом происходит заполнение формы для редактирования // если объект item не пуст // eslint-disable-next-line require-jsdoc export function showUpdateModal(item) { modalTitle.innerHTML = item === null ? 'Добавить' : 'Изменить'; console.info(item); if (item) { cntrls.lineId.value = item.id; cntrls.itemsType.value = item.itemsId; cntrls.name_book.value = item.name_book; cntrls.author.value = item.author; cntrls.price.value = item.price; cntrls.isbn.value = item.isbn; // заполнение превью // Если пользователь выбрал изображение, то оно загружается // в тэг image с id image - preview // иначе устанавливается заглушка, адрес которой указан в imagePlaceholder cntrls.imagePreview.src = item.image ? item.image : imagePlaceholder; } else { resetValues(); } myModal.show(); } // функция для скрытия модального окна // eslint-disable-next-line require-jsdoc export function hideUpdateModal() { resetValues(); // удаление класса was-validated для скрытия результатов валидации cntrls.form.classList.remove('was-validated'); myModal.hide(); }