anacarolinaduartecavalcante/m3-academy-template-checkout-ana-carolina-duarte-cavalcante
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'Entrega do Desafio' (#9) from feature/m3-academy-template-checkout into main

Browse Source 
Reviewed-on: #9
This commit is contained in:
Ana Carolina Duarte Cavalcante 2022-12-23 14:33:08 +00:00
commit 50d444d641
2 changed files with 26 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -125,49 +125,51 @@ export default class Footer {
}
async onUpdate() {
// if (window.location.hash == "#/cart") {
// this.titleCart.classList.add("disable");
// }
//Função qeu fará a verificação se o carrinho está vazio para remover a prateleira de produtos:
// vocês devem olhar a doc fornecida no Desafio para aprender a usar a MutationObserver
// sempre que o carrinho estiver vazio o elemento chcekoutVazio fica display: none e isso pode ser usado como atributo para a MutationObserver
let target = this.checkoutVazio;
if (window.location.hash == "#/cart") {
let target = this.checkoutVazio;
if (
window.location.href == "https://m3academy.myvtex.com/checkout/#/cart" &&
this.checkoutVazio.style.display == "none"
) {
this.sliderProducts.classList.remove("disable");
this.ListProducts();
} else {
this.sliderProducts.classList.add("disable");
this.titleCart.classList.add("disable");
}
window.addEventListener("hashchange", () => {
if (window.location.hash == "#/cart" && target.style.display == "none") {
this.titleCart.classList.remove("disable");
this.sliderProducts.classList.remove("disable");
this.sliderProducts.innerHTML = "";
this.ListProducts();
} else {
this.sliderProducts.classList.add("disable");
this.titleCart.classList.add("disable");
}
});
let observer = new MutationObserver((mutations) => {
mutations.forEach(() => {
if (target.style.display == "none") {
if (target.style.display == "none" && window.location.hash == "#/cart") {
this.sliderProducts.classList.remove("disable");
this.titleCart.classList.remove("disable");
this.sliderProducts.innerHTML = "";
this.ListProducts();
} else {
this.sliderProducts.classList.add("disable");
this.titleCart.classList.add("disable");
this.sliderProducts.innerHTML = "";
}
});
window.addEventListener("hashchange", () => {
if (window.location.hash == "#/cart") {
if (target.style.display == "none") {
this.titleCart.classList.remove("disable");
this.sliderProducts.classList.remove("disable");
this.ListProducts();
}
} else {
this.titleCart.classList.add("disable");
this.sliderProducts.classList.add("disable");
this.sliderProducts.innerHTML = "";
}
});
});
observer.observe(this.checkoutVazio, {
observer.observe(target, {
childList: true,
attributes: true,
});
}
}

2
checkout/src/arquivos/sass/checkout/_checkout-vazio.scss
View File

@ -3,7 +3,7 @@
&-content {
color: $color-black;
text-align: center;
margin-top: 15%;
@include mq(md, max) {
padding: 0 16px;
}