feat(footer):adiciona funcao footer
This commit is contained in:
parent
29509d938a
commit
fb3b5ddb5b
@ -5,14 +5,16 @@ export default class Footer {
|
|||||||
this.init();
|
this.init();
|
||||||
}
|
}
|
||||||
|
|
||||||
async Init() {
|
async init() {
|
||||||
this.list = await this.fetchPrat();
|
this.list = await this.fetchPrateleira();
|
||||||
await this.selectors();
|
await this.selectors();
|
||||||
//this.onUpdate();
|
// this.onUpdate();
|
||||||
this.createPrat();
|
this.createPrateleira();
|
||||||
this.prateleira = await waitElement(".footerCheckout__carrossel-itens");
|
this.prateleira = await waitElement(".footerCheckout__carrossel-itens");
|
||||||
this.itensPrat();
|
this.itensPrateleira();
|
||||||
|
|
||||||
this.addCarrossel();
|
this.addCarrossel();
|
||||||
|
|
||||||
this.creditCardIconsHTML();
|
this.creditCardIconsHTML();
|
||||||
this.developedByIconsHTML();
|
this.developedByIconsHTML();
|
||||||
}
|
}
|
||||||
@ -26,29 +28,22 @@ export default class Footer {
|
|||||||
this.developedByIcons = await waitElement(".footerCheckout__developedBy");
|
this.developedByIcons = await waitElement(".footerCheckout__developedBy");
|
||||||
}
|
}
|
||||||
|
|
||||||
// onUpdate() {
|
onUpdate() {
|
||||||
// let target = this.checkoutVazio;
|
//Função qeu fará a verificação se o carrinho está vazio para remover a prateleira de produtos:
|
||||||
// let config = { childList: true, attributes: true };
|
// vocês devem olhar a doc fornecida no Desafio para aprender a usar a MutationObserver
|
||||||
// let observer = new MutationObserver((mutations) => {
|
// sempre que o carrinho estiver vazio o elemento chcekoutVazio fica display: none e isso pode ser usado como atributo para a MutationObserver
|
||||||
// let removeClassh3 = document.getElementById("removeClassh3");
|
let target = this.checkoutVazio;
|
||||||
// let removeClassul = document.getElementById("removeClassul");
|
letconfig = { childList: true, attributes: true };
|
||||||
// mutations.forEach(function (mutation) {
|
letobserver = new MutationObserver((mutations) => {
|
||||||
// const checkoutTarget = mutation.target.attributes.style.nodeValue;
|
mutations.forEach(function (mutation) {
|
||||||
// console.log(checkoutTarget);
|
console.log(mutation.type);
|
||||||
// if (checkoutTarget === "display: none;") {
|
});
|
||||||
// removeClassh3.classList.remove("displayNone");
|
});
|
||||||
// removeClassul.classList.remove("displayNone");
|
|
||||||
// } else if (checkoutTarget === "display: block;") {
|
|
||||||
// removeClassh3.classList.add("displayNone");
|
|
||||||
// removeClassul.classList.add("displayNone");
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// });
|
|
||||||
|
|
||||||
// observer.observe(target, config);
|
observer.observe(target, config);
|
||||||
// }
|
}
|
||||||
|
|
||||||
createPrat() {
|
createPrateleira() {
|
||||||
if (this.itensShelf) {
|
if (this.itensShelf) {
|
||||||
this.itensShelf.innerHTML = `
|
this.itensShelf.innerHTML = `
|
||||||
<div class="footerCheckout__prateleira-title">
|
<div class="footerCheckout__prateleira-title">
|
||||||
@ -59,7 +54,7 @@ export default class Footer {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async itensPrat() {
|
async itensPrateleira() {
|
||||||
letstructure = "";
|
letstructure = "";
|
||||||
|
|
||||||
this.list.forEach((response) => {
|
this.list.forEach((response) => {
|
||||||
@ -77,7 +72,7 @@ export default class Footer {
|
|||||||
this.prateleira.innerHTML = structure;
|
this.prateleira.innerHTML = structure;
|
||||||
}
|
}
|
||||||
|
|
||||||
async fetchPrat() {
|
async fetchPrateleira() {
|
||||||
constapi =
|
constapi =
|
||||||
"https://m3academy.myvtex.com/api/catalog_system/pub/products/search/?fq=productClusterIds:319";
|
"https://m3academy.myvtex.com/api/catalog_system/pub/products/search/?fq=productClusterIds:319";
|
||||||
return fetch(api)
|
return fetch(api)
|
||||||
|
Loading…
Reference in New Issue
Block a user