Acessórios
{
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.modal.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
},
async updateProductCard(productHandle = '') {
this.loading = true
if (productHandle != ''){
await fetch(`/products/${productHandle}?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}else {
await fetch(`/products/free-bolsa-jeans?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}
},
async updateVariant() {
const allSelected = this.selectedOptions.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptions[i] === opt)
) || null;
if (this.currentVariant) this.variant = this.currentVariant.id;
},
async updateModalVariant() {
const allSelected = this.selectedOptionsModal.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptionsModal[i] === opt)
) || null;
if (this.currentVariant) {
this.variant = this.currentVariant.id;
this.updateModalProduct();
}
},
handleAdd(type = 'add') {
if (!this.currentVariant) {
this.loading = false;
$dispatch('show-notification', {
type: 'error',
title: 'Carrinho',
description: 'Selecione as opções do produto antes de adicionar ao carrinho.'
});
return;
}
this.loading = true;
const items = [{ id: this.currentVariant.id, quantity: this.quantity }];
$store.cart.addItems(items, { showCart: (type == 'add') })
.then(response => {
this.loading = false;
$dispatch('cart-change');
$store.cart.fetchItems();
if (type == 'buy') window.location.href = '/checkout';
Log('Add to Cart:', response);
});
},
handleLabelAdd(element, type = 'add') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
const items = [{ id: this.currentVariant.id, quantity: this.quantity }]
$store.cart.addItems(items, { showCart: (type == 'add' ? true : false) })
.then(response => {
this.loading = false
$dispatch('cart-change')
$store.cart.fetchItems()
if (type == 'buy') {
window.location.href = '/checkout'
}
Log('Add to Cart:', response)
})
},
handleRedirectVariant(productHandle = '') {
this.loading = true
localStorage.setItem(
'savedProduct',
JSON.stringify(
{
productHandle,
value: this.currentVariant.title
}
),
);
window.location.href = '/products/' + productHandle;
},
handleRedirectVariantLabel(element, productHandle = '') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
this.handleRedirectVariant(productHandle)
},
}
"
x-init="$watch('selectedOptions', () => updateVariant());
$watch('selectedOptionsModal', () => updateModalVariant());
updateVariant();"
x-ref="productCard"
class="product-card card relative flex flex-col overflow-auto bg-white border-none "
>
Free Bolsa Jeans
R$ 49,90
R$ 0,00
Free Bolsa Jeans
R$ 49,90
R$ 0,00
{
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.modal.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
},
async updateProductCard(productHandle = '') {
this.loading = true
if (productHandle != ''){
await fetch(`/products/${productHandle}?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}else {
await fetch(`/products/free-bandeja-ceramica-elaz?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}
},
async updateVariant() {
const allSelected = this.selectedOptions.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptions[i] === opt)
) || null;
if (this.currentVariant) this.variant = this.currentVariant.id;
},
async updateModalVariant() {
const allSelected = this.selectedOptionsModal.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptionsModal[i] === opt)
) || null;
if (this.currentVariant) {
this.variant = this.currentVariant.id;
this.updateModalProduct();
}
},
handleAdd(type = 'add') {
if (!this.currentVariant) {
this.loading = false;
$dispatch('show-notification', {
type: 'error',
title: 'Carrinho',
description: 'Selecione as opções do produto antes de adicionar ao carrinho.'
});
return;
}
this.loading = true;
const items = [{ id: this.currentVariant.id, quantity: this.quantity }];
$store.cart.addItems(items, { showCart: (type == 'add') })
.then(response => {
this.loading = false;
$dispatch('cart-change');
$store.cart.fetchItems();
if (type == 'buy') window.location.href = '/checkout';
Log('Add to Cart:', response);
});
},
handleLabelAdd(element, type = 'add') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
const items = [{ id: this.currentVariant.id, quantity: this.quantity }]
$store.cart.addItems(items, { showCart: (type == 'add' ? true : false) })
.then(response => {
this.loading = false
$dispatch('cart-change')
$store.cart.fetchItems()
if (type == 'buy') {
window.location.href = '/checkout'
}
Log('Add to Cart:', response)
})
},
handleRedirectVariant(productHandle = '') {
this.loading = true
localStorage.setItem(
'savedProduct',
JSON.stringify(
{
productHandle,
value: this.currentVariant.title
}
),
);
window.location.href = '/products/' + productHandle;
},
handleRedirectVariantLabel(element, productHandle = '') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
this.handleRedirectVariant(productHandle)
},
}
"
x-init="$watch('selectedOptions', () => updateVariant());
$watch('selectedOptionsModal', () => updateModalVariant());
updateVariant();"
x-ref="productCard"
class="product-card card relative flex flex-col overflow-auto bg-white border-none "
>
Porta jóias de cerâmica exclusivo ELAZ
R$ 49,90
R$ 0,00
Porta jóias de cerâmica exclusivo ELAZ
R$ 49,90
R$ 0,00
{
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.modal.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
},
async updateProductCard(productHandle = '') {
this.loading = true
if (productHandle != ''){
await fetch(`/products/${productHandle}?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}else {
await fetch(`/products/free-bolsa-jeans?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}
},
async updateVariant() {
const allSelected = this.selectedOptions.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptions[i] === opt)
) || null;
if (this.currentVariant) this.variant = this.currentVariant.id;
},
async updateModalVariant() {
const allSelected = this.selectedOptionsModal.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptionsModal[i] === opt)
) || null;
if (this.currentVariant) {
this.variant = this.currentVariant.id;
this.updateModalProduct();
}
},
handleAdd(type = 'add') {
if (!this.currentVariant) {
this.loading = false;
$dispatch('show-notification', {
type: 'error',
title: 'Carrinho',
description: 'Selecione as opções do produto antes de adicionar ao carrinho.'
});
return;
}
this.loading = true;
const items = [{ id: this.currentVariant.id, quantity: this.quantity }];
$store.cart.addItems(items, { showCart: (type == 'add') })
.then(response => {
this.loading = false;
$dispatch('cart-change');
$store.cart.fetchItems();
if (type == 'buy') window.location.href = '/checkout';
Log('Add to Cart:', response);
});
},
handleLabelAdd(element, type = 'add') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
const items = [{ id: this.currentVariant.id, quantity: this.quantity }]
$store.cart.addItems(items, { showCart: (type == 'add' ? true : false) })
.then(response => {
this.loading = false
$dispatch('cart-change')
$store.cart.fetchItems()
if (type == 'buy') {
window.location.href = '/checkout'
}
Log('Add to Cart:', response)
})
},
handleRedirectVariant(productHandle = '') {
this.loading = true
localStorage.setItem(
'savedProduct',
JSON.stringify(
{
productHandle,
value: this.currentVariant.title
}
),
);
window.location.href = '/products/' + productHandle;
},
handleRedirectVariantLabel(element, productHandle = '') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
this.handleRedirectVariant(productHandle)
},
}
"
x-init="$watch('selectedOptions', () => updateVariant());
$watch('selectedOptionsModal', () => updateModalVariant());
updateVariant();"
x-ref="productCard"
class="product-card card relative flex flex-col overflow-auto bg-white border-none "
>
Free Bolsa Jeans
R$ 49,90
R$ 0,00
Free Bolsa Jeans
R$ 49,90
R$ 0,00
{
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.modal.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
},
async updateProductCard(productHandle = '') {
this.loading = true
if (productHandle != ''){
await fetch(`/products/${productHandle}?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}else {
await fetch(`/products/free-bandeja-ceramica-elaz?view=product-card&variant=${(this.currentVariant || this.defaultVariant).id}`)
.then(response => {
if (response.status !== 200) {
throw new Error(response.statusText)
} else {
return response.text()
}
})
.then(cartData => {
const html = new DOMParser().parseFromString(cartData, 'text/html')
const htmlString = html.querySelector('div').outerHTML
$refs.productCard.innerHTML = htmlString
this.loading = false
})
.catch((error) => {
console.error(error)
this.loading = false
})
}
},
async updateVariant() {
const allSelected = this.selectedOptions.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptions[i] === opt)
) || null;
if (this.currentVariant) this.variant = this.currentVariant.id;
},
async updateModalVariant() {
const allSelected = this.selectedOptionsModal.every(v => v !== null && v !== undefined && v !== '');
if (!allSelected) {
this.currentVariant = null;
return;
}
this.currentVariant =
this.productVariants.find(variant =>
variant.options.every((opt, i) => this.selectedOptionsModal[i] === opt)
) || null;
if (this.currentVariant) {
this.variant = this.currentVariant.id;
this.updateModalProduct();
}
},
handleAdd(type = 'add') {
if (!this.currentVariant) {
this.loading = false;
$dispatch('show-notification', {
type: 'error',
title: 'Carrinho',
description: 'Selecione as opções do produto antes de adicionar ao carrinho.'
});
return;
}
this.loading = true;
const items = [{ id: this.currentVariant.id, quantity: this.quantity }];
$store.cart.addItems(items, { showCart: (type == 'add') })
.then(response => {
this.loading = false;
$dispatch('cart-change');
$store.cart.fetchItems();
if (type == 'buy') window.location.href = '/checkout';
Log('Add to Cart:', response);
});
},
handleLabelAdd(element, type = 'add') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
const items = [{ id: this.currentVariant.id, quantity: this.quantity }]
$store.cart.addItems(items, { showCart: (type == 'add' ? true : false) })
.then(response => {
this.loading = false
$dispatch('cart-change')
$store.cart.fetchItems()
if (type == 'buy') {
window.location.href = '/checkout'
}
Log('Add to Cart:', response)
})
},
handleRedirectVariant(productHandle = '') {
this.loading = true
localStorage.setItem(
'savedProduct',
JSON.stringify(
{
productHandle,
value: this.currentVariant.title
}
),
);
window.location.href = '/products/' + productHandle;
},
handleRedirectVariantLabel(element, productHandle = '') {
this.loading = true
const optionIndex = element.getAttribute('data-index').replace('option', '') - 1
const value = element.getAttribute('value')
this.selectedOptions[optionIndex] = element.getAttribute('value');
this.productVariants.forEach((variant) => {
variant.options.forEach((option, index) => {
if(value == option){
this.currentVariant = variant
}
})
})
this.handleRedirectVariant(productHandle)
},
}
"
x-init="$watch('selectedOptions', () => updateVariant());
$watch('selectedOptionsModal', () => updateModalVariant());
updateVariant();"
x-ref="productCard"
class="product-card card relative flex flex-col overflow-auto bg-white border-none "
>
Porta jóias de cerâmica exclusivo ELAZ
R$ 49,90
R$ 0,00
Porta jóias de cerâmica exclusivo ELAZ
R$ 49,90
R$ 0,00