72 lines
3.1 KiB
JavaScript
72 lines
3.1 KiB
JavaScript
export default {
|
|
renderBooks(books, container) {
|
|
container.innerHTML = "";
|
|
books.forEach((book) => {
|
|
const div = document.createElement("div");
|
|
div.className = "col border border-dark bg-light border-3 h-100 col-5 col-md-6 col-lg-5 p-1 m-2";
|
|
div.innerHTML = `
|
|
<a href="book.html" class="text-decoration-none d-block mb-2 w-100">
|
|
<img src="img/test.jpg" class="img-fluid mx-auto" alt="Обложка книги" />
|
|
<p class="text-center" style="margin:0">${book.name}</p>
|
|
<p class="text-center">${book.author}</p>
|
|
<p class="text-center">${book.genre}</p>
|
|
</a>
|
|
<div class="d-flex flex-row justify-content-between">
|
|
<button data-id="${book.id}" class="btn btn-sm btn-danger delete">Удалить</button>
|
|
<button data-id="${book.id}" class="btn btn-sm btn-warning update">
|
|
<i class="bi bi-pencil-fill"></i>
|
|
</button>
|
|
</div>`;
|
|
container.appendChild(div);
|
|
});
|
|
},
|
|
|
|
bindAddForm(callback) {
|
|
document.getElementById("formAddBook").addEventListener("submit", (e) => {
|
|
e.preventDefault();
|
|
const name = document.getElementById("bookTitle").value;
|
|
const author_id = document.getElementById("authorName").value;
|
|
const genre_id = document.getElementById("genre-select").value;
|
|
callback({ name, author_id, genre_id });
|
|
e.target.reset();
|
|
});
|
|
},
|
|
|
|
bindDeleteButton(callback) {
|
|
document.getElementById("bookListContent").addEventListener("click", (e) => {
|
|
if (e.target.classList.contains("delete")) {
|
|
const id = e.target.getAttribute("data-id");
|
|
callback(id);
|
|
}
|
|
});
|
|
},
|
|
bindUpdateButton(callback) {
|
|
document.getElementById("bookListContent").addEventListener("click", (e) => {
|
|
if (e.target.classList.contains("update")) {
|
|
e.preventDefault();
|
|
const id = e.target.getAttribute("data-id");
|
|
callback(id);
|
|
}
|
|
});
|
|
},
|
|
bindSaveButton(callback) {
|
|
const form = document.getElementById("formRedact");
|
|
form.addEventListener("submit", (e) => {
|
|
e.preventDefault();
|
|
const params = new URLSearchParams(window.location.search);
|
|
const updatedBook = {
|
|
id: params.get("id"),
|
|
name: document.getElementById("redactTitle").value,
|
|
author_id: document.getElementById("redactAuthorName").value,
|
|
genre_id: document.getElementById("redact-genre-select").value,
|
|
};
|
|
callback(updatedBook);
|
|
});
|
|
},
|
|
fillFormForEditing(book) {
|
|
document.getElementById("redactTitle").value = book.name;
|
|
document.getElementById("redactAuthorName").value = book.author_id;
|
|
document.getElementById("redact-genre-select").value = book.genre_id;
|
|
},
|
|
};
|