Upload ai-search-fix.js

ai-search-fix.js

@@ -0,0 +1,216 @@
+/**
+ * FIX: AI Search Button - doAISearch() 
+ * =====================================
+ * Root cause: doAISearch() in index.html depended on window._vaiSearchContext
+ * from search-plus-boot.js?v=27 which DOES NOT EXIST in the repo (404).
+ * 
+ * Fix: Rewrite doAISearch() to use window.aiSearch() from ai-search.js which is
+ * properly loaded and contains full NL search logic.
+ * 
+ * Additional fix: Handle multi-product search (comma/semicolon separated codes).
+ */
+
+window.doAISearch = function() {
+  var input = document.getElementById('aiSearch');
+  var resultsDiv = document.getElementById('aiResults');
+  if (!input || !resultsDiv) return;
+  
+  var query = input.value.trim();
+  if (!query || query.length < 2) {
+    resultsDiv.style.display = 'block';
+    resultsDiv.innerHTML = '💡 Nhập mã SP hoặc mô tả: "bếp từ Grob dưới 10tr", "máy hút mùi Malloca"';
+    return;
+  }
+  
+  resultsDiv.style.display = 'block';
+  resultsDiv.innerHTML = '⏳ Đang tìm...';
+  
+  // Multi-product search: if query contains comma/semicolon, search by product codes
+  var queries = query.split(/[,;]+/).map(function(c) { return c.trim(); }).filter(function(c) { return c.length >= 2; });
+  
+  if (queries.length > 1) {
+    // Multi-code search mode
+    var allResults = [];
+    var normFn = function(s) { return String(s || '').toLowerCase().replace(/[.\- _\/]/g, '').replace(/đ/g, 'd'); };
+    
+    queries.forEach(function(q) {
+      var qNorm = normFn(q);
+      for (var i = 0; i < D.length && allResults.length < 30; i++) {
+        var p = D[i];
+        if (!p) continue;
+        var fields = [(p.sku || ''), (p.mod || ''), (p.model || ''), (p.slug || '')].map(normFn);
+        if (fields.some(function(f) { 
+          return f === qNorm || (f && qNorm.length >= 3 && (f.indexOf(qNorm) !== -1 || qNorm.indexOf(f) !== -1)); 
+        })) {
+          allResults.push(p);
+        }
+      }
+    });
+    
+    if (allResults.length > 0) {
+      _renderMultiCodeResults(allResults, resultsDiv, query);
+      return;
+    }
+  }
+  
+  if (typeof window.aiSearch === 'function' && typeof window.D !== 'undefined' && D.length > 0) {
+    var aiToken = (window.huggingface && window.huggingface.variables && window.huggingface.variables.VAISTUDIO) || '';
+    window.aiSearch(query, D, aiToken).then(function(aiResult) {
+      if (!aiResult || (!aiResult.results.length && !aiResult.aiAnswer)) {
+        _fallbackAISearch(query, resultsDiv);
+        return;
+      }
+      _renderAIResultsToDiv(aiResult, resultsDiv, query);
+    }).catch(function(err) {
+      _fallbackAISearch(query, resultsDiv);
+      console.error('AI Search error:', err);
+    });
+  } else {
+    _fallbackAISearch(query, resultsDiv);
+  }
+};
+
+// Render results for multi-product code search
+function _renderMultiCodeResults(products, container, query) {
+  var html = '<div style="font-size:.78rem;color:#64748b;margin-bottom:10px"><i class="fas fa-search" style="margin-right:4px"></i><strong>' + products.length + '</strong> sản phẩm tìm được cho "<strong>' + query + '</strong>"</div>';
+  html += '<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px">';
+  
+  products.forEach(function(p, i) {
+    var idx = window.D ? window.D.indexOf(p) : -1;
+    var brandColor = p.brand === 'Eurogold' ? '#c8102e' : (p.brand === 'Grob' ? '#2e7d32' : '#003f62');
+    var imgSrc = p.image || p.i || '';
+    var priceStr = p.price || (p.pn ? p.pn : 'Liên hệ');
+    var catStr = p.cat || '';
+    var catIcon = p.catIcon || 'fa-tag';
+    
+    html += '<div class="pc fade" onclick="showDetail(' + idx + ')" style="cursor:pointer;transition-delay:' + Math.min(i * 20, 300) + 'ms">' +
+      '<div class="pi" style="height:150px"><img src="' + imgSrc + '" alt="' + p.name + '" loading="lazy" onerror="this.style.display=\'none\'">' +
+      '<span class="pi-badge"><i class="fas ' + catIcon + '"></i> ' + catStr + '</span>' +
+      '<span style="position:absolute;top:8px;right:8px;background:' + brandColor + ';color:#fff;padding:3px 7px;border-radius:5px;font-size:.55rem;font-weight:700">' + (p.brand || '') + '</span></div>' +
+      '<div class="pb" style="padding:10px"><div style="font-size:.62rem;font-weight:600;color:' + brandColor + ';letter-spacing:.5px;margin-bottom:3px">' + (p.sku || p.mod || p.model || '') + '</div>' +
+      '<div class="pn" style="font-size:.76rem">' + p.name + '</div>' +
+      '<div class="pf" style="margin-top:6px"><span class="pp" style="font-size:.92rem">' + priceStr + '</span><i class="fas fa-chevron-right"></i></div></div></div>';
+  });
+  
+  html += '</div>';
+  container.innerHTML = html;
+  container.style.display = 'block';
+  
+  if (window.requestAnimationFrame) {
+    requestAnimationFrame(function() {
+      var fadeEls = container.querySelectorAll('.fade');
+      for (var j = 0; j < fadeEls.length; j++) {
+        fadeEls[j].classList.add('vis');
+      }
+    });
+  }
+}
+
+function _renderAIResultsToDiv(aiResult, container, query) {
+  var badges = '';
+  if (aiResult.categories && aiResult.categories.length > 0) {
+    badges += '<span style="display:inline-block;background:rgba(0,63,98,.08);color:#003f62;padding:4px 10px;border-radius:20px;font-size:.7rem;font-weight:600;margin-right:6px;margin-bottom:6px"><i class="fas fa-layer-group" style="margin-right:4px"></i>' + aiResult.categories.map(function(c) { return c.replace(/_/g, ' '); }).join(', ') + '</span>';
+  }
+  if (aiResult.constraints && aiResult.constraints.length > 0) {
+    aiResult.constraints.forEach(function(c) {
+      badges += '<span style="display:inline-block;background:rgba(219,152,21,.15);color:#8a6d0e;padding:4px 10px;border-radius:20px;font-size:.7rem;font-weight:600;margin-right:6px;margin-bottom:6px"><i class="fas fa-sliders" style="margin-right:4px"></i>' + c.label + '</span>';
+    });
+  }
+  if (aiResult.budget && aiResult.budget > 0) {
+    badges += '<span style="display:inline-block;background:rgba(46,125,50,.1);color:#2e7d32;padding:4px 10px;border-radius:20px;font-size:.7rem;font-weight:600;margin-right:6px;margin-bottom:6px"><i class="fas fa-wallet" style="margin-right:4px"></i>Tối đa ' + (aiResult.budget / 1000000).toFixed(0) + ' triệu</span>';
+  }
+  
+  var aiHtml = '';
+  if (aiResult.aiAnswer) {
+    aiHtml = '<div style="background:linear-gradient(135deg,rgba(0,63,98,.04),rgba(219,152,21,.06));border-radius:16px;padding:16px;margin-bottom:16px;border:2px solid #e2e8f0"><div style="display:flex;align-items:center;gap:8px;margin-bottom:10px"><div style="width:32px;height:32px;border-radius:50%;background:#003f62;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem"><i class="fas fa-robot"></i></div><span style="font-weight:700;color:#003f62;font-size:.85rem">V.AI STUDIO trả lời</span></div><div style="font-size:.85rem;color:#0f172a;line-height:1.7">' + aiResult.aiAnswer + '</div></div>';
+  }
+  
+  var comboHtml = '';
+  if (aiResult.combos && aiResult.combos.length > 0) {
+    comboHtml = '<div style="background:linear-gradient(135deg,rgba(219,152,21,.06),rgba(46,125,50,.04));border-radius:16px;padding:16px;margin-bottom:16px;border:2px solid rgba(219,152,21,.2)"><div style="display:flex;align-items:center;gap:8px;margin-bottom:12px"><div style="width:32px;height:32px;border-radius:50%;background:#db9815;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem"><i class="fas fa-gift"></i></div><span style="font-weight:700;color:#0f172a;font-size:.85rem">Gợi ý combo trong ngân sách</span></div>';
+    aiResult.combos.forEach(function(combo, i) {
+      var totalStr = combo.total > 0 ? (Number(combo.total).toLocaleString('vi-VN').replace(/,/g, '.') + 'đ') : 'Liên hệ';
+      comboHtml += '<div style="background:#fff;border-radius:12px;padding:12px;margin-bottom:8px;border:1px solid #e2e8f0"><div style="font-weight:600;font-size:.8rem;color:#003f62;margin-bottom:6px">Combo ' + (i + 1) + ' — Tổng: ' + totalStr + '</div>';
+      combo.items.forEach(function(item) {
+        var p = item.p;
+        comboHtml += '<div style="display:flex;align-items:center;gap:8px;padding:5px 0;font-size:.76rem;color:#64748b"><i class="fas fa-check-circle" style="color:#2e7d32;font-size:.6rem"></i>' + p.name + ' <span style="color:#003f62;font-weight:600;margin-left:auto">' + (p.price || 'LH') + '</span></div>';
+      });
+      comboHtml += '</div>';
+    });
+    comboHtml += '</div>';
+  }
+  
+  var items = aiResult.results || [];
+  var html = '<div style="margin-bottom:12px">' + badges + '</div>' + aiHtml + comboHtml;
+  
+  if (items.length > 0) {
+    html += '<div style="font-size:.78rem;color:#64748b;margin-bottom:10px"><i class="fas fa-search" style="margin-right:4px"></i><strong>' + items.length + '</strong> kết quả cho "<strong>' + query + '</strong>"</div>';
+    html += '<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px">';
+    html += items.map(function(r, i) {
+      var p = r.p;
+      var idx = (r.idx !== undefined && r.idx >= 0) ? r.idx : (window.D ? window.D.indexOf(p) : -1);
+      var brandColor = p.brand === 'Eurogold' ? '#c8102e' : (p.brand === 'Grob' ? '#2e7d32' : '#003f62');
+      var labels = (r.labels || []).map(function(l) {
+        return '<span style="display:inline-block;background:rgba(0,63,98,.06);padding:2px 6px;border-radius:4px;font-size:.58rem;color:#003f62;margin-right:3px;margin-bottom:3px">' + l + '</span>';
+      }).join('');
+      var imgSrc = p.image || p.i || '';
+      var priceStr = p.price || (window.formatPrice ? window.formatPrice(p.priceNum || p.pn) : (p.pn ? p.pn : 'Liên hệ'));
+      var catStr = p.cat || '';
+      var catIcon = p.catIcon || 'fa-tag';
+      
+      return '<div class="pc fade" onclick="showDetail(' + idx + ')" style="cursor:pointer;transition-delay:' + Math.min(i * 20, 300) + 'ms">' +
+        '<div class="pi" style="height:150px"><img src="' + imgSrc + '" alt="' + p.name + '" loading="lazy" onerror="this.style.display=\'none\'">' +
+        '<span class="pi-badge"><i class="fas ' + catIcon + '"></i> ' + catStr + '</span>' +
+        '<span style="position:absolute;top:8px;right:8px;background:' + brandColor + ';color:#fff;padding:3px 7px;border-radius:5px;font-size:.55rem;font-weight:700">' + (p.brand || '') + '</span></div>' +
+        '<div class="pb" style="padding:10px"><div style="font-size:.62rem;font-weight:600;color:' + brandColor + ';letter-spacing:.5px;margin-bottom:3px">' + (p.model || p.brand || '') + '</div>' +
+        '<div class="pn" style="font-size:.76rem">' + p.name + '</div>' +
+        (labels ? '<div style="margin-top:4px">' + labels + '</div>' : '') +
+        '<div class="pf" style="margin-top:6px"><span class="pp" style="font-size:.92rem">' + priceStr + '</span><i class="fas fa-chevron-right"></i></div></div></div>';
+    }).join('');
+    html += '</div>';
+  }
+  
+  container.innerHTML = html;
+  container.style.display = 'block';
+  
+  if (window.requestAnimationFrame) {
+    requestAnimationFrame(function() {
+      var fadeEls = container.querySelectorAll('.fade');
+      for (var j = 0; j < fadeEls.length; j++) {
+        fadeEls[j].classList.add('vis');
+      }
+    });
+  }
+}
+
+function _fallbackAISearch(query, container) {
+  if (typeof D === 'undefined' || !D.length) {
+    container.innerHTML = '⏳ Đang tải dữ liệu...';
+    return;
+  }
+  var qNorm = query.toLowerCase().normalize('NFD').replace(/[̀-ͯ]/g, '').replace(/đ/g, 'd');
+  var results = [];
+  for (var i = 0; i < D.length && results.length < 20; i++) {
+    var p = D[i];
+    if (!p) continue;
+    var nameNorm = (p.name || '').toLowerCase().normalize('NFD').replace(/[̀-ͯ]/g, '').replace(/đ/g, 'd');
+    var skuNorm = (p.sku || p.mod || '').toLowerCase();
+    if (nameNorm.indexOf(qNorm) !== -1 || (skuNorm && skuNorm.indexOf(qNorm) !== -1)) {
+      results.push(p);
+    }
+  }
+  if (!results.length) {
+    container.innerHTML = '❌ Không tìm thấy "' + query + '". Thử: "bếp từ", "máy hút mùi"';
+    return;
+  }
+  container.innerHTML = '<div style="font-size:.78rem;color:#64748b;margin-bottom:10px"><strong>' + results.length + '</strong> kết quả</div>' +
+    '<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px">' +
+    results.map(function(p, idx) {
+      var imgSrc = p.image || p.i || '';
+      var priceStr = p.price || (p.pn ? p.pn : 'Liên hệ');
+      return '<div class="pc fade" onclick="showDetail(' + idx + ')" style="cursor:pointer">' +
+        '<div class="pi" style="height:150px"><img src="' + imgSrc + '" alt="' + p.name + '" loading="lazy"></div>' +
+        '<div class="pb" style="padding:10px"><div class="pn" style="font-size:.76rem">' + p.name + '</div>' +
+        '<div class="pf" style="margin-top:6px"><span class="pp" style="font-size:.92rem">' + priceStr + '</span></div></div></div>';
+    }).join('') + '</div>';
+}