// LAZY FOOTER ARTICLE lazy_load_group.push( { id: 'js-artilce-product-detail', target: '#js-artilce-product-detail', loadFn: function () { getArticleProductDetail(); }, }, ) //FANCYBOX // SWIPER GALLERY - PRODUCT function swiperThumbnails() { const galleryThumbs = new Swiper(".gallery-thumbs", { spaceBetween: 8, slidesPerView: 5, slideToClickedSlide: true, freeMode: true, watchSlidesProgress: true, centerInsufficientSlides: true, navigation: { nextEl: ".swiper-button-next-gallery", prevEl: ".swiper-button-prev-gallery", }, }); const galleryTop = new Swiper(".gallery-top", { spaceBetween: 16, slidesPerView: 1, thumbs: { swiper: galleryThumbs, }, // AUTO SILDED AT FISRT AND END on: { slideChange: function () { let activeIndex = this.activeIndex + 1; let activeSlide = document.querySelector( `.gallery-thumbs .swiper-slide:nth-child(${activeIndex})` ); let nextSlide = document.querySelector( `.gallery-thumbs .swiper-slide:nth-child(${activeIndex + 1})` ); let prevSlide = document.querySelector( `.gallery-thumbs .swiper-slide:nth-child(${activeIndex - 1})` ); if ( nextSlide && !nextSlide.classList.contains("swiper-slide-visible") ) { this.thumbs.swiper.slideNext(); } else if ( prevSlide && !prevSlide.classList.contains("swiper-slide-visible") ) { this.thumbs.swiper.slidePrev(); } }, }, }); } swiperThumbnails(); function fancyBox() { Fancybox.bind('[data-fancybox="gallery"]', { Toolbar: { display: [ { id: "counter", position: "center", }, "zoom", "slideshow", "fullscreen", "thumbs", "close", ], }, //click: "unset", on: { initLayout: (fancybox) => { // Create left column const $leftCol = document.createElement("div"); $leftCol.classList.add("fancybox__leftCol"); while (fancybox.$container.firstChild) { $leftCol.appendChild(fancybox.$container.firstChild); } // Add elements to DOM fancybox.$container.appendChild(fancybox.$backdrop); fancybox.$container.appendChild($leftCol); fancybox.$leftCol = $leftCol; }, "Carousel.ready Carousel.change": (fancybox, carousel, slideIndex) => { // Get index of the current gallery item slideIndex = slideIndex === undefined ? carousel.options.initialPage : slideIndex; // console.log(slideIndex); // Get link related to current item const $trigger = fancybox.items[slideIndex].$trigger; // Get data from `data-info` attribute const data = $trigger.dataset.info || ""; }, }, }); } fancyBox(); function callForMe(){ var error = ""; var number_regex1 = /^[0]\d{9}$/i; var number_regex2 = /^[0]\d{10}$/i; var glPro = "{{ page.product_info.productName}}"; var check_name = 'Khách hàng yêu cầu gọi lại'; var check_email = ''; var check_tel = document.getElementById('phone-now').value; var check_message = "Khách hàng yêu cầu gọi lại sản phẩm: " + glPro; if(check_tel.length < 8) error += "- Bạn chưa nhập số điện thoại\n"; else{ if(number_regex1.test(check_tel) == false && number_regex2.test(check_tel) == false) error += "- Số điện thoại chưa chính xác\n"; } if (error == "") { var params = { action : "customer", action_type: "contact", type: "contact", info: { name: check_name, email: check_email, tel: check_tel, title : 'Khách hàng yêu cầu gọi lại sản phẩm: ' + glPro, message: check_message, }, }; Hura.Ajax.post("customer", params).then(function (data) { alert( "Bạn đã gửi liên hệ thành công\nChúng tôi đã nhận được thông tin và sẽ liên hệ với quý khách trong thời gian sớm nhất" ); location.reload(); }); } else alert(error); return false; } $("#js-showmore").click(function(){ $("#js-summary").toggleClass("active"); var text = $(this).find("span").html(); if (text == 'Xem thêm') { $(this).find("span").text("Thu gọn"); } else if (text == 'Thu gọn') { $(this).find("span").text("Xem thêm"); } }) function _showProductDescription() { let height_container = $("#js-product-desc").height(); $("#js-desc-showmore").css("display","block"); $("#js-desc-showmore").click(function(){ $("#js-product-desc").addClass("active"); $("#js-desc-showless").css("display","block"); $(this).hide(); }); $("#js-desc-showless").click(function(){ $("#js-product-desc").removeClass("active"); $("#js-desc-showmore").css("display","block"); $(this).hide(); $('html, body').animate({ scrollTop: $("#js-product-desc").offset().top - 140 },800); }); } _showProductDescription(); // ADD PRODUCT TO CART - PRODUCT DETAILS function addProductToCart(product_id, variant_id_fake, props) { const props_quantity = parseInt($(".js-buy-quantity-temp").attr("value")); const stockQuantity = parseInt($(".bk-check-out-of-stock").attr("value")); //console.log(props_quantity); var variant_id = 0; var data = $('.js-variant-option-container input[type="hidden"]').val(); if (data) { var newData = JSON.parse(data) variant_id = newData.variant_id; } if (stockQuantity) { var product_props = { quantity: props_quantity, buyer_note: "", }; Hura.Cart.Product.add(product_id, variant_id, product_props).then(function ( response ) { // Error response if (response.status === "error") { if (response.error_type == "item-in-cart") { alert("Sản phẩm đã trong giỏ hàng"); } else if (response.error_type == "invalid-item-id") alert("ID sản phẩm không đúng"); else alert(response.message); } // Success response else { modalSuccess(); change_cart_amount(); } }); } else { alert("Sản phẩm không có sẵn. Vui lòng liên hệ. Xin cảm ơn!") } } // BUY NOW function buyNow(product_id, variant_id_fake, props) { addProductToCart(product_id, variant_id_fake, props); const stockQuantityCheck = parseInt($(".bk-check-out-of-stock").attr("value")); if (stockQuantityCheck) { setTimeout(function () { window.location.href = "./cart"; }, 1500); } } // BUY NOW function buyPayInstall(product_id, variant_id_fake, props) { addProductToCart(product_id, variant_id_fake, props); const stockQuantityCheck = parseInt($(".bk-check-out-of-stock").attr("value")); if (stockQuantityCheck) { setTimeout(function () { window.location.href = "./cart?show=tragop"; }, 1500); } } // LANG NGHE THAY DOI SO LUONG SP function listenQuantityBuy() { const $track_change = $(".js-quantity-change"); //thay doi so luong sp mua, neu nhap so luong $track_change.on("change", function (e) { $(".js-buy-quantity-temp").attr("value", e.target.value); }); //thay doi so luong sp theo - hoac + $track_change.on("click", function (e) { if (e.target.nodeName === "INPUT") return; let quantity_change = parseInt(this.getAttribute("data-value")); let $row = $(this).closest(".cart-quantity-select"); let current_quantity = parseInt($row.find(".js-buy-quantity").val()); //loai bo so luong vo ly if (current_quantity < 0) { $row.find(".js-buy-quantity").val(0); return; } let totalQuantity = current_quantity + quantity_change; $row.find(".js-buy-quantity").val(totalQuantity); $(".js-buy-quantity-temp").attr("value", totalQuantity); }); } listenQuantityBuy(); function renReplyReview(new_replies){ var html = ''; new_replies.forEach(function(value,item){ var check_user = ` `+value.user_name+` `+value.user_name+``; if (value.is_user_admin == 1) { check_user = ` `+value.user_name+` QTV` } if(value.is_user_admin == 1 || value.approved == 1){ html += `
Bạn đang đăng nhập là Admin
Gửi bình luậnBạn đang đăng nhập là Admin
`; } else if ( is_admin_login == 'no' && customer_info.length > 0 ) { formReply = ` `; } else formReply = `Sản phẩm đang cập nhập
`) } resetBottomBoxDetails(); }); } getRelativeProduct(); // GET PRODUCT HISTORY function getProductHistory() { Hura.Ajax.post('user', { action_type: 'product-view-history' }).then(function (data) { var target = '#js-bottom-product-box'; var html = Hura.Template.parse(productTpl, data.list); Hura.Template.render(target, html); resetBottomBoxDetails(); tooltip(); }) } function resetBottomBoxDetails() { $(".swiper-wrapper").css("display", "none"); setTimeout(function () { $(".swiper-wrapper").css("display", "flex"); }, 100) } resetBottomBoxDetails(); // SWIPER BOTTOM PRODUCT BOX function productBottomBoxSwiper() { new Swiper(".bottom-product-box-swiper", { slidesPerView: 5, spaceBetween: 20, rewind: true, navigation: { nextEl: ".swiper-button-next", prevEl: ".swiper-button-prev", }, breakpoints: { // when window width is >= 1600px 1600: { slidesPerView: 6, }, }, }); } productBottomBoxSwiper(); // CẤU HÌNH : KÍCH THƯỚC, DUNG LƯỢNG, MÀU SẮC function _setVariantColor() { $('#js-variant-holder .js-variant-option-value').each(function () { var variant_key = $(this).attr('data-key'); if (variant_key === 'mau-sac') { $(this).addClass('js-variant-color'); } }); $('.js-variant-color').each(function () { var data_color = $(this).attr('data-value').substring(0, 7); $(this).css('background', data_color) }); } _setVariantColor(); function _changePriceVariant() { $('.js-variant-option-value').click(function () { setTimeout(function () { var data = JSON.parse($('#js-variant-holder input[type="hidden"]').val()); var price = parseInt(data.current_price); var marketPrice = parseInt($('.bk-product-marketPrice').attr("value")); var variantStock = data.current_stock; var variantValue = data.label; //console.log(data, price, marketPrice, variantValue) $('.js-variant-label').attr("data-label", variantValue); getVariantLabel(); var variantName = $('.js-variant-label').html(); $('.bk-check-out-of-stock').attr("value", variantStock); if (variantStock > 0) { $('.js-variant-price').html(formatCurrency(price) + ' đ'); $('.bk-product-price').html(price); } else { $('.js-variant-price').html("Hết hàng"); } $('.bk-product-property').val(variantName) $('.js-variant-name').html(' - (' + variantName + ')'); if (marketPrice > price && price > 0) { var price_off = 100 - price / marketPrice * 100; $('.js-price-off').html('(-' + formatCurrency(price_off) + '%)'); $('.js-variant-marketPrice').show(); } else { $('.js-variant-marketPrice').hide(); $('.js-price-off').hide(); } // change image let variant_image = data.image; //console.log(variant_image); if (variant_image != '') { $('.gallery-thumbs .swiper-slide').each(function (index) { var slideThumbsSrc = $(this).children().attr("src"); if (variant_image === slideThumbsSrc) { //console.log(index); galleryTop.slideTo(index, 500, true); } }); } }, 100); }); //$('.js-variant-option-value:first-child').click(); } _changePriceVariant();