2023-11-16 13:21:52 +04:00

95 lines
2.6 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

// модуль с логикой
import {
getAllLines
} from "./lines-rest-api";
import rememberIdOfBook from "./page"
export const cntrls = {
button: document.getElementById("items-add"),
table: document.getElementById("body"),
form: document.getElementById("items-form"),
id: document.getElementById("id"),
name: document.getElementById("name-book"),
autor: document.getElementById("autor"),
annotation: document.getElementById("annotation"),
info: document.getElementById("info")
};
export async function drawCardsCatalog(){
console.info("Try to load data");
const data = await getAllLines();
let catalog = document.getElementById("catalog")
catalog.innerHTML = "";
let catalogHTML = ""
console.log(data)
data.forEach((item, index) => {
console.log(index)
catalogHTML +=
createCard(
item,
index,
)
});
catalogHTML += `<div class="row justify-content-evenly mt-4">
<div class="col-md-3 col-6 align-self-end col-bott">
<div class="card" style="width: 100%;">
<a href="/pageAdmin.html"> <img src="/src/covers/addbook1.png" class="card-img-top" alt="..." ></a>
<div class="card-body">
<p class="card-title mt-0 mb-0">???</p>
<p class="card-text">?????</p>
<a href="#" class="btn btn-catalog btn-primary rounded-0 mt-1 border ">Добавить книгу</a>
</div>
</div>
</div>
</div>`
catalog.innerHTML = catalogHTML
console.log(catalogHTML)
}
export function createCard(item, index) {
let card = `
<div class="col-md-3 col-6 mb-sm-0 align-self-end ">
<div class="card" style="width: 100%;">
<a href="/pageOfBook1.html"> <img src="/src/covers/image${item.id}book.png" class="card-img-top" alt="..." lowsrc=></a>
<div class="card-body">
<p class="card-title mt-0 mb-0">${item.name}</p>
<p class="card-text ">${item.autor}</p>
<a href="/pageOfBook1.html"><div class="btn btn-catalog btn-primary rounded-0 mt-1 border" onclick="rememberId(${item.id});" >Добавить в корзину</div></a>
</div>
</div>
</div>
`
if ((index)% 3 == 0){
card = `<div class="row justify-content-evenly mt-4">
` + card
}
if (Number(index - 2) % 3 == 0){
card += `</div>
`
}
return card;
}
let tempId = 0
export function rememberId(id){
rememberIdOfBook(id)
console.log("F")
}
export default drawCardsCatalog