ViniciusDeniz/m3-academy-template-checkout
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feature/footer #4

Merged
ViniciusDeniz merged 3 commits from feature/footer into main 2022-12-19 02:35:14 +00:00
Conversation 0 Commits 3 Files Changed 5 +23 -28
1 changed files with 23 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit fb3b5ddb5b - Show all commits

51
checkout/src/arquivos/js/components/Footer.js
View File

@ -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)