forked from M3-Academy/m3-academy-template-checkout
feat: adiciona função remove slick carrinho vazio
This commit is contained in:
parent
b09f8ba7a0
commit
ad706045a6
@ -3,21 +3,20 @@ import { waitElement } from "m3-utils";
|
||||
export default class Footer {
|
||||
constructor() {
|
||||
this.init();
|
||||
|
||||
}
|
||||
|
||||
|
||||
async init() {
|
||||
await this.selectors();
|
||||
this.onUpdate();
|
||||
// this.onUpdate();
|
||||
this.showPrateleira();
|
||||
this.addCarrossel();
|
||||
// this.addCarrossel();
|
||||
this.displaySlick();
|
||||
}
|
||||
|
||||
async selectors() {
|
||||
//Para verificar se o carrinho está vazio e remover a prateleira de produtos:
|
||||
// vocês devem olhar a doc fornecida no Desafio para aprender a usar o waitElement
|
||||
this.footerPratileira = await waitElement(".footerCheckout__prateleira");
|
||||
this.footerPrateleira = await waitElement(".footerCheckout__prateleira");
|
||||
this.footerStamps = await waitElement(".footerCheckout__stamps");
|
||||
this.footerAddress = await waitElement(".footerCheckout__address");
|
||||
this.footerDevelopedBy = await waitElement(".footerCheckout__developedBy");
|
||||
@ -40,16 +39,13 @@ export default class Footer {
|
||||
observer.observe(target, config);
|
||||
}
|
||||
|
||||
|
||||
|
||||
showPrateleira() {
|
||||
let pratileira = this.footerPratileira;
|
||||
pratileira.innerHTML = `
|
||||
let prateleira = this.footerPrateleira;
|
||||
prateleira.innerHTML = `
|
||||
|
||||
<h2 class="prateleira-title"> Você também pode gostar:</h2>
|
||||
<ul class=" container-carrossel-item"></ul>
|
||||
|
||||
`
|
||||
`;
|
||||
|
||||
fetch("https://m3academy.myvtex.com/api/catalog_system/pub/products/search/?fq=productClusterIds:319")
|
||||
|
||||
@ -74,11 +70,8 @@ export default class Footer {
|
||||
</div>
|
||||
|
||||
<button class="prateleira-button"> ver produto</button>
|
||||
|
||||
|
||||
`
|
||||
pratileira.children[1].appendChild(li)
|
||||
// console.log(pratileira)
|
||||
prateleira.children[1].appendChild(li)
|
||||
|
||||
});
|
||||
|
||||
@ -127,6 +120,27 @@ export default class Footer {
|
||||
`;
|
||||
}
|
||||
|
||||
async displaySlick() {
|
||||
const orderForm = await window.vtexjs.checkout.getOrderForm();
|
||||
const items = orderForm.items.length;
|
||||
|
||||
$(window).on("orderFormUpdated.vtex", (evt, oF) => {
|
||||
if (oF.items.length <= 0) {
|
||||
this.footerPrateleira.style.display = "none";
|
||||
} else {
|
||||
this.addCarrossel();
|
||||
this.footerPrateleira.style.display = "block";
|
||||
}
|
||||
if (window.location.hash === "#/shipping" || window.location.hash === "#/payment") {
|
||||
this.footerPrateleira.style.display = "none";
|
||||
}
|
||||
});
|
||||
if (items === 0) {
|
||||
this.footerPrateleira.style.display = "none";
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async addCarrossel() {
|
||||
const elemento = await waitElement(".container-carrossel-item");
|
||||
$(elemento).slick({
|
||||
|
Loading…
x
Reference in New Issue
Block a user