Skip to content
Hotline:
0973.005.186
=============================================
(function(){
"use strict";
const root = document.getElementById("qgtv-page");
if(!root) return;
const products = [...root.querySelectorAll(".qgtv-product")];
const recipientButtons = [...root.querySelectorAll(".qgtv-choice")];
const budgetButtons = [...root.querySelectorAll(".qgtv-budget")];
const note = root.querySelector("#qgtv-filter-note");
let selectedRecipient = "customer";
let selectedBudget = "under100";
function applyFilters(){
let visible = 0;
products.forEach(card=>{
const recipients = (card.dataset.recipient || "").split(/\s+/);
const budgets = (card.dataset.budget || "").split(/\s+/);
const ok = recipients.includes(selectedRecipient) && budgets.includes(selectedBudget);
card.classList.toggle("is-hidden", !ok);
if(ok) visible++;
});
if(!visible){
// Không để giao diện trống: hiển thị sản phẩm theo đối tượng trước.
products.forEach(card=>{
const recipients = (card.dataset.recipient || "").split(/\s+/);
const ok = recipients.includes(selectedRecipient);
card.classList.toggle("is-hidden", !ok);
});
visible = products.filter(card=>!card.classList.contains("is-hidden")).length;
note.textContent = "Chưa có đủ mẫu ở đúng mức ngân sách; đang mở rộng gợi ý theo đối tượng bạn chọn.";
} else {
note.textContent = `Đang hiển thị ${visible} mẫu phù hợp với lựa chọn của bạn.`;
}
}
recipientButtons.forEach(btn=>{
btn.addEventListener("click",()=>{
recipientButtons.forEach(x=>x.classList.remove("active"));
btn.classList.add("active");
selectedRecipient = btn.dataset.filter;
applyFilters();
});
});
budgetButtons.forEach(btn=>{
btn.addEventListener("click",()=>{
budgetButtons.forEach(x=>x.classList.remove("active"));
btn.classList.add("active");
selectedBudget = btn.dataset.budget;
applyFilters();
});
});
// Smooth scroll chỉ trong page để tránh ảnh hưởng JS của Flatsome.
root.querySelectorAll('a[href^="#"]').forEach(a=>{
a.addEventListener("click",e=>{
const target = root.querySelector(a.getAttribute("href"));
if(target){
e.preventDefault();
target.scrollIntoView({behavior:"smooth",block:"start"});
}
});
});
// Demo form: không gửi dữ liệu đi đâu, tránh lỗi khi chưa nối plugin form.
const form = root.querySelector("#qgtv-form");
const formNote = root.querySelector("#qgtv-form-note");
if(form){
form.addEventListener("submit",e=>{
e.preventDefault();
formNote.textContent = "Đã nhận thông tin trên giao diện demo. Hãy nối form với Contact Form 7 / Fluent Forms / WPForms để gửi dữ liệu thực tế.";
formNote.style.color = "#ed1c24";
});
}
// Header nhỏ khi cuộn: thêm class cho hero.
const hero = root.querySelector(".qgtv-hero");
const updateScroll = ()=>{
hero && hero.classList.toggle("qgtv-scrolled", window.scrollY > 80);
};
window.addEventListener("scroll", updateScroll, {passive:true});
updateScroll();
applyFilters();
})();
