Fix bogo bug

index.html

@@ -23,7 +23,7 @@
     <!-- Load JavaScript modules with cache busting -->
     <script>
         // Change this version number to bust cache for all JS files
-        const APP_VERSION = '1.1.1';
+        const APP_VERSION = '1.2.0';
         
         const scripts = [
             'js/services/api.js',
@@ -271,7 +271,6 @@
                                         </div>
                                         <button @click="toggleUpsell(u)"
                                             :class="isInCart(u.id) ? 'bg-slate-700' : 'bg-white'"
-                                            :disabled="isInCart(u.id)"
                                             class="text-red-500 px-4 py-2 rounded-xl font-black text-xs uppercase shadow-md hover:bg-red-50 transition disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap">
                                             <span x-text="isInCart(u.id) ? 'Toegevoegd' : ('+ €' + getYProductDiscountedPrice(u))"></span>
                                         </button>

js/components/cart.js

@@ -73,6 +73,12 @@ const CartComponent = {
                     const yDiscount = this.getYProductBogoDiscount(product);
                     
                     if (yDiscount) {
+                        // Check if we can add more discounted items (respect get_qty limit)
+                        if (!this.canAddYProductDiscount(product, yDiscount)) {
+                            alert('Maximum aantal kortingsproducten bereikt voor deze actie.');
+                            return;
+                        }
+                        
                         // Add with discounted price
                         const discountedPrice = this.getYProductDiscountedPrice(product);
                         const discountLabel = this.getYProductDiscountLabel(product);
@@ -314,6 +320,44 @@ const CartComponent = {
                 return null;
             },
 
+            /**
+             * Check if Y product discount can be added (respects get_qty limit)
+             * @param {Object} yProduct - The upsell product
+             * @param {Object} discount - The discount info from getYProductBogoDiscount
+             * @returns {boolean}
+             */
+            canAddYProductDiscount(yProduct, discount) {
+                if (!this.activeProduct || !discount) return false;
+                
+                // Find the matching rule from active product
+                const rule = this.activeProduct.bogo_rules?.find(r => r.rule_id === discount.rule_id);
+                if (!rule) return false;
+                
+                // Count how many of this Y product are already in cart with discount
+                const discountedCount = this.cart.filter(item =>
+                    parseInt(item.id) === parseInt(yProduct.id) &&
+                    item.isDiscounted &&
+                    item.ruleId === discount.rule_id
+                ).length;
+                
+                // Count how many of the X product (active product) are in cart
+                const xProductCount = this.cart.filter(item =>
+                    parseInt(item.id) === parseInt(this.activeProduct.id) && !item.isFree
+                ).length;
+                
+                // Calculate how many times the rule applies
+                let timesApplied = 1;
+                if (rule.recursive && xProductCount >= rule.buy_qty) {
+                    timesApplied = Math.floor(xProductCount / rule.buy_qty);
+                }
+                
+                // Maximum Y products allowed = timesApplied * get_qty
+                const maxAllowed = timesApplied * rule.get_qty;
+                
+                // Can add if we haven't reached the max
+                return discountedCount < maxAllowed;
+            },
+
             /**
              * Clear the cart
              */

js/services/bogo.js

@@ -122,8 +122,11 @@ const BogoService = {
         if (rule.type === 'buy_x_get_x') {
             // Same product is free or discounted
             if (rule.discount_type === 'free_product' || rule.discount_value >= 100) {
-                // Fully free - automatically add to cart
+                // Fully free - automatically add get_qty items to cart
                 result.discountAmount = freeQty * parseFloat(product.price);
+                
+                // Add get_qty free items (not just 1)
+                for (let i = 0; i < freeQty; i++) {
                     result.freeItems.push({
                         id: product.id,
                         name: product.name + ' (GRATIS)',
@@ -133,6 +136,7 @@ const BogoService = {
                         ruleId: rule.rule_id
                     });
                 }
+            }
             // For percentage and flat discounts, we DON'T automatically add items
             // These are handled manually via addBogoDiscountedItem() in cart.js
             // The user clicks a button to add the discounted item