// модуль для работы с элементами управления // объект для удобного получения элементов // при обращении к атрибуту объекта вызывается // нужная функция для поиска элемента export const cntrls = { button: document.getElementById("items-add"), table: document.querySelector("#items-table tbody"), form: document.getElementById("items-form"), lineId: document.getElementById("items-line-id"), itemsType: document.getElementById("item"), price: document.getElementById("price"), year: document.getElementById("year"), image: document.getElementById("image"), imagePreview: document.getElementById("image-preview"), itemdescrition: document.getElementById("itemdescrition"), cardsALLik: document.getElementById("cardsALL"), }; // Дефолтное превью export const imagePlaceholder = "https://via.placeholder.com/200"; // функция создает тег option для select // export function createItemsOption(name, value = "", isSelected = false) { const option = document.createElement("option"); option.value = value || ""; option.selected = isSelected; option.text = name; return option; } // функция создает ссылку (a) для таблицы // содержимое тега a заполняется необходимой иконкой (icon) // при нажатии вызывается callback // ссылка "оборачивается" тегом td // function createTableAnchor(icon, callback) { const i = document.createElement("i"); i.classList.add("fa-solid", icon); const a = document.createElement("a"); a.href = "#"; a.appendChild(i); a.onclick = (event) => { // чтобы в URL не добавлялась решетка event.preventDefault(); event.stopPropagation(); callback(); }; const td = document.createElement("td"); td.appendChild(a); return td; } // функция создает колонку таблицы с текстом value // value function createTableColumn(value) { const td = document.createElement("td"); td.textContent = value; return td; } // функция создает строку таблицы // // index + 1 // item.items.name // parseFloat(item.price).toFixed(2)) // item.count // parseFloat(item.sum).toFixed(2)) // // // // export function createTableRow(item, index, editCallback, editPageCallback, deleteCallback) { const rowNumber = document.createElement("th"); rowNumber.scope = "row"; rowNumber.textContent = index + 1; const row = document.createElement("tr"); row.id = `line-${item.id}`; row.appendChild(rowNumber); row.appendChild(createTableColumn(item.items.name)); row.appendChild(createTableColumn(item.price)); row.appendChild(createTableColumn(item.year)); row.appendChild(createTableColumn()); // редактировать на странице page-edit row.appendChild(createTableAnchor("fa-pencil", editPageCallback)); // удаление row.appendChild(createTableAnchor("fa-trash", deleteCallback)); return row; } export function createCardItem(item) { const col = document.createElement("div"); col.className = 'col-md-6 col-lg-6 col-xl-4 col-xxl-3 mb-4'; const card = document.createElement("div"); card.className = 'card h-100'; const imgDiv = document.createElement("div"); imgDiv.className = 'd-flex justify-content-center mb-4'; const img = document.createElement("img"); img.src = item.image; img.className = 'card-img-top'; img.alt = 'car'; img.width = '100'; img.height = '300'; const cardBody = document.createElement("div"); cardBody.className = 'card-body'; const namek = document.createElement("h5"); namek.className = 'card-title'; const namekValue = item.items.name; namek.textContent = `${namekValue}`; const title = document.createElement("p"); title.className = 'card-text'; title.textContent = item.itemdescrition; const price = document.createElement("p"); price.className = 'btn btn-primary'; price.textContent = `${item.price} Руб.`; cardBody.appendChild(img); cardBody.appendChild(namek); cardBody.appendChild(title); cardBody.appendChild(price); card.appendChild(cardBody); col.appendChild(card); return col; }