fix: Shopping Cart and Variant Selection

erpnext/e_commerce/doctype/website_item/website_item.py

@@ -12,8 +12,6 @@
 from frappe.website.website_generator import WebsiteGenerator
 
 from erpnext.e_commerce.doctype.item_review.item_review import get_item_reviews
-
-# SEARCH
 from erpnext.e_commerce.redisearch import (
 	delete_item_from_index,
 	insert_item_to_index,
@@ -138,10 +136,10 @@ def validate_website_image(self):
 			self.website_image = None
 
 	def make_thumbnail(self):
+		"""Make a thumbnail of `website_image`"""
 		if frappe.flags.in_import or frappe.flags.in_migrate:
 			return
 
-		"""Make a thumbnail of `website_image`"""
 		import requests.exceptions
 
 		if not self.is_new() and self.website_image != frappe.db.get_value(self.doctype, self.name, "website_image"):

erpnext/e_commerce/shopping_cart/cart.py

@@ -105,7 +105,7 @@ def place_order():
 			if is_stock_item:
 				item_stock = get_web_item_qty_in_stock(item.item_code, "website_warehouse")
 				if not cint(item_stock.in_stock):
-					throw(_("{1} Not in Stock").format(item.item_code))
+					throw(_("{0} Not in Stock").format(item.item_code))
 				if item.qty > item_stock.stock_qty[0][0]:
 					throw(_("Only {0} in Stock for item {1}").format(item_stock.stock_qty[0][0], item.item_code))
 
@@ -168,8 +168,10 @@ def update_cart(item_code, qty, additional_notes=None, with_items=False):
 		return {
 			"items": frappe.render_template("templates/includes/cart/cart_items.html",
 				context),
-			"taxes": frappe.render_template("templates/includes/order/order_taxes.html",
+			"total": frappe.render_template("templates/includes/cart/cart_items_total.html",
 				context),
+			"taxes_and_totals": frappe.render_template("templates/includes/cart/cart_payment_summary.html",
+				context)
 		}
 	else:
 		return {

erpnext/e_commerce/variant_selector/item_variants_cache.py

@@ -67,12 +67,16 @@ def build_cache(self):
 			as_list=1
 		)
 
-		disabled_items = set([i.name for i in frappe.db.get_all('Item', {'disabled': 1})])
+		unpublished_items = set([i.item_code for i in frappe.db.get_all('Website Item', filters={'published': 0}, fields=["item_code"])])
 
 		attribute_value_item_map = frappe._dict({})
 		item_attribute_value_map = frappe._dict({})
 
-		item_variants_data = [r for r in item_variants_data if r[0] not in disabled_items]
+		# dont consider variants that are unpublished
+		# (either have no Website Item or are unpublished in Website Item)
+		item_variants_data = [r for r in item_variants_data if r[0] not in unpublished_items]
+		item_variants_data = [r for r in item_variants_data if frappe.db.exists("Website Item", {"item_code": r[0]})]
+
 		for row in item_variants_data:
 			item_code, attribute, attribute_value = row
 			# (attr, value) => [item1, item2]

erpnext/public/js/shopping_cart.js

@@ -105,6 +105,8 @@ $.extend(shopping_cart, {
 	},
 
 	set_cart_count: function(animate=false) {
+		$(".intermediate-empty-cart").remove();
+
 		var cart_count = frappe.get_cookie("cart_count");
 		if(frappe.session.user==="Guest") {
 			cart_count = 0;
@@ -119,13 +121,20 @@ $.extend(shopping_cart, {
 
 		if(parseInt(cart_count) === 0 || cart_count === undefined) {
 			$cart.css("display", "none");
-			$(".cart-items").html('Cart is Empty');
 			$(".cart-tax-items").hide();
 			$(".btn-place-order").hide();
 			$(".cart-payment-addresses").hide();
+
+			let intermediate_empty_cart_msg = `
+				<div class="text-center w-100 intermediate-empty-cart mt-4 mb-4 text-muted">
+					${ __("Cart is Empty") }
+				</div>
+			`;
+			$(".cart-table").after(intermediate_empty_cart_msg);
 		}
 		else {
 			$cart.css("display", "inline");
+			$("#cart-count").text(cart_count);
 		}
 
 		if(cart_count) {
@@ -152,7 +161,10 @@ $.extend(shopping_cart, {
 			callback: function(r) {
 				if(!r.exc) {
 					$(".cart-items").html(r.message.items);
-					$(".cart-tax-items").html(r.message.taxes);
+					$(".cart-tax-items").html(r.message.total);
+					$(".payment-summary").html(r.message.taxes_and_totals);
+					shopping_cart.set_cart_count();
+
 					if (cart_dropdown != true) {
 						$(".cart-icon").hide();
 					}

erpnext/templates/includes/cart.js

@@ -57,7 +57,7 @@ $.extend(shopping_cart, {
 					callback: function(r) {
 						d.hide();
 						if (!r.exc) {
-							$(".cart-tax-items").html(r.message.taxes);
+							$(".cart-tax-items").html(r.message.total);
 							shopping_cart.parent.find(
 								`.address-container[data-address-type="${address_type}"]`
 							).html(r.message.address);
@@ -214,12 +214,15 @@ $.extend(shopping_cart, {
 	},
 
 	place_order: function(btn) {
+		shopping_cart.freeze();
+
 		return frappe.call({
 			type: "POST",
 			method: "erpnext.e_commerce.shopping_cart.cart.place_order",
 			btn: btn,
 			callback: function(r) {
 				if(r.exc) {
+					shopping_cart.unfreeze();
 					var msg = "";
 					if(r._server_messages) {
 						msg = JSON.parse(r._server_messages || []).join("<br>");
@@ -230,7 +233,6 @@ $.extend(shopping_cart, {
 						.html(msg || frappe._("Something went wrong!"))
 						.toggle(true);
 				} else {
-					$('.cart-container table').hide();
 					$(btn).hide();
 					window.location.href = '/orders/' + encodeURIComponent(r.message);
 				}
@@ -239,12 +241,15 @@ $.extend(shopping_cart, {
 	},
 
 	request_quotation: function(btn) {
+		shopping_cart.freeze();
+
 		return frappe.call({
 			type: "POST",
 			method: "erpnext.e_commerce.shopping_cart.cart.request_for_quotation",
 			btn: btn,
 			callback: function(r) {
 				if(r.exc) {
+					shopping_cart.unfreeze();
 					var msg = "";
 					if(r._server_messages) {
 						msg = JSON.parse(r._server_messages || []).join("<br>");
@@ -255,7 +260,6 @@ $.extend(shopping_cart, {
 						.html(msg || frappe._("Something went wrong!"))
 						.toggle(true);
 				} else {
-					$('.cart-container table').hide();
 					$(btn).hide();
 					window.location.href = '/quotations/' + encodeURIComponent(r.message);
 				}

erpnext/templates/includes/cart/cart_items_total.html

@@ -0,0 +1,10 @@
+<!-- Total at the end of the cart items -->
+<tr>
+	<th></th>
+	<th class="text-left item-grand-total" colspan="1">
+		{{ _("Total") }}
+	</th>
+	<th class="text-left item-grand-total totals" colspan="3">
+		{{ doc.get_formatted("total") }}
+	</th>
+</tr>

erpnext/templates/includes/cart/cart_payment_summary.html

@@ -1,62 +1,61 @@
 <!-- Payment -->
-<div class="mb-3 frappe-card p-5 payment-summary">
-	<h6>
-		{{ _("Payment Summary") }}
-	</h6>
-	<div class="card h-100">
-		<div class="card-body p-0">
-			<table class="table w-100">
-				<tr>
-					<td class="bill-label">{{ _("Net Total (") + frappe.utils.cstr(doc.items|len) + _(" Items)") }}</td>
-					<td class="bill-content net-total text-right">{{ doc.get_formatted("net_total") }}</td>
-				</tr>
+<h6>
+	{{ _("Payment Summary") }}
+</h6>
+<div class="card h-100">
+	<div class="card-body p-0">
+		<table class="table w-100">
+			<tr>
+				{% set total_items = frappe.utils.cstr(frappe.utils.flt(doc.total_qty, 0)) %}
+				<td class="bill-label">{{ _("Net Total (") + total_items + _(" Items)") }}</td>
+				<td class="bill-content net-total text-right">{{ doc.get_formatted("net_total") }}</td>
+			</tr>
 
-				<!-- taxes -->
-				{% for d in doc.taxes %}
-					{% if d.base_tax_amount %}
-						<tr>
-							<td class="bill-label">
-								{{ d.description }}
-							</td>
-							<td class="bill-content text-right">
-								{{ d.get_formatted("base_tax_amount") }}
-							</td>
-						</tr>
-					{% endif %}
-				{% endfor %}
-			</table>
+			<!-- taxes -->
+			{% for d in doc.taxes %}
+				{% if d.base_tax_amount %}
+					<tr>
+						<td class="bill-label">
+							{{ d.description }}
+						</td>
+						<td class="bill-content text-right">
+							{{ d.get_formatted("base_tax_amount") }}
+						</td>
+					</tr>
+				{% endif %}
+			{% endfor %}
+		</table>
 
-			<!-- TODO: Apply Coupon Dialog-->
-			<!-- {% set show_coupon_code = cart_settings.show_apply_coupon_code_in_website and cart_settings.enable_checkout %}
-			{% if show_coupon_code %}
-				<button class="btn btn-coupon-code w-100 text-left">
-					<svg width="24" height="24" viewBox="0 0 24 24" stroke="var(--gray-600)" fill="none" xmlns="http://www.w3.org/2000/svg">
-						<path d="M19 15.6213C19 15.2235 19.158 14.842 19.4393 14.5607L20.9393 13.0607C21.5251 12.4749 21.5251 11.5251 20.9393 10.9393L19.4393 9.43934C19.158 9.15804 19 8.7765 19 8.37868V6.5C19 5.67157 18.3284 5 17.5 5H15.6213C15.2235 5 14.842 4.84196 14.5607 4.56066L13.0607 3.06066C12.4749 2.47487 11.5251 2.47487 10.9393 3.06066L9.43934 4.56066C9.15804 4.84196 8.7765 5 8.37868 5H6.5C5.67157 5 5 5.67157 5 6.5V8.37868C5 8.7765 4.84196 9.15804 4.56066 9.43934L3.06066 10.9393C2.47487 11.5251 2.47487 12.4749 3.06066 13.0607L4.56066 14.5607C4.84196 14.842 5 15.2235 5 15.6213V17.5C5 18.3284 5.67157 19 6.5 19H8.37868C8.7765 19 9.15804 19.158 9.43934 19.4393L10.9393 20.9393C11.5251 21.5251 12.4749 21.5251 13.0607 20.9393L14.5607 19.4393C14.842 19.158 15.2235 19 15.6213 19H17.5C18.3284 19 19 18.3284 19 17.5V15.6213Z" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
-						<path d="M15 9L9 15" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
-						<path d="M10.5 9.5C10.5 10.0523 10.0523 10.5 9.5 10.5C8.94772 10.5 8.5 10.0523 8.5 9.5C8.5 8.94772 8.94772 8.5 9.5 8.5C10.0523 8.5 10.5 8.94772 10.5 9.5Z" fill="white" stroke-linecap="round" stroke-linejoin="round"/>
-						<path d="M15.5 14.5C15.5 15.0523 15.0523 15.5 14.5 15.5C13.9477 15.5 13.5 15.0523 13.5 14.5C13.5 13.9477 13.9477 13.5 14.5 13.5C15.0523 13.5 15.5 13.9477 15.5 14.5Z" fill="white" stroke-linecap="round" stroke-linejoin="round"/>
-					</svg>
-					<span class="ml-2">Apply Coupon</span>
-				</button>
-			{% endif %} -->
+		<!-- TODO: Apply Coupon Dialog-->
+		<!-- {% set show_coupon_code = cart_settings.show_apply_coupon_code_in_website and cart_settings.enable_checkout %}
+		{% if show_coupon_code %}
+			<button class="btn btn-coupon-code w-100 text-left">
+				<svg width="24" height="24" viewBox="0 0 24 24" stroke="var(--gray-600)" fill="none" xmlns="http://www.w3.org/2000/svg">
+					<path d="M19 15.6213C19 15.2235 19.158 14.842 19.4393 14.5607L20.9393 13.0607C21.5251 12.4749 21.5251 11.5251 20.9393 10.9393L19.4393 9.43934C19.158 9.15804 19 8.7765 19 8.37868V6.5C19 5.67157 18.3284 5 17.5 5H15.6213C15.2235 5 14.842 4.84196 14.5607 4.56066L13.0607 3.06066C12.4749 2.47487 11.5251 2.47487 10.9393 3.06066L9.43934 4.56066C9.15804 4.84196 8.7765 5 8.37868 5H6.5C5.67157 5 5 5.67157 5 6.5V8.37868C5 8.7765 4.84196 9.15804 4.56066 9.43934L3.06066 10.9393C2.47487 11.5251 2.47487 12.4749 3.06066 13.0607L4.56066 14.5607C4.84196 14.842 5 15.2235 5 15.6213V17.5C5 18.3284 5.67157 19 6.5 19H8.37868C8.7765 19 9.15804 19.158 9.43934 19.4393L10.9393 20.9393C11.5251 21.5251 12.4749 21.5251 13.0607 20.9393L14.5607 19.4393C14.842 19.158 15.2235 19 15.6213 19H17.5C18.3284 19 19 18.3284 19 17.5V15.6213Z" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+					<path d="M15 9L9 15" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+					<path d="M10.5 9.5C10.5 10.0523 10.0523 10.5 9.5 10.5C8.94772 10.5 8.5 10.0523 8.5 9.5C8.5 8.94772 8.94772 8.5 9.5 8.5C10.0523 8.5 10.5 8.94772 10.5 9.5Z" fill="white" stroke-linecap="round" stroke-linejoin="round"/>
+					<path d="M15.5 14.5C15.5 15.0523 15.0523 15.5 14.5 15.5C13.9477 15.5 13.5 15.0523 13.5 14.5C13.5 13.9477 13.9477 13.5 14.5 13.5C15.0523 13.5 15.5 13.9477 15.5 14.5Z" fill="white" stroke-linecap="round" stroke-linejoin="round"/>
+				</svg>
+				<span class="ml-2">Apply Coupon</span>
+			</button>
+		{% endif %} -->
 
-			<table class="table w-100 grand-total mt-6">
-				<tr>
-					<td class="bill-content net-total">{{ _("Grand Total") }}</td>
-					<td class="bill-content net-total text-right">{{ doc.get_formatted("grand_total") }}</td>
-				</tr>
-			</table>
+		<table class="table w-100 grand-total mt-6">
+			<tr>
+				<td class="bill-content net-total">{{ _("Grand Total") }}</td>
+				<td class="bill-content net-total text-right">{{ doc.get_formatted("grand_total") }}</td>
+			</tr>
+		</table>
 
-			{% if cart_settings.enable_checkout %}
-				<button class="btn btn-primary btn-place-order font-md w-100" type="button">
-					{{ _('Place Order') }}
-				</button>
-			{% else %}
-				<button class="btn btn-primary btn-request-for-quotation font-md w-100" type="button">
-					{{ _('Request for Quote') }}
-				</button>
-			{% endif %}
-		</div>
+		{% if cart_settings.enable_checkout %}
+			<button class="btn btn-primary btn-place-order font-md w-100" type="button">
+				{{ _('Place Order') }}
+			</button>
+		{% else %}
+			<button class="btn btn-primary btn-request-for-quotation font-md w-100" type="button">
+				{{ _('Request for Quote') }}
+			</button>
+		{% endif %}
 	</div>
 </div>
 

erpnext/templates/pages/cart.html

@@ -45,15 +45,7 @@
 
 					{% if cart_settings.enable_checkout or cart_settings.show_price_in_quotation %}
 						<tfoot class="cart-tax-items">
-							<tr>
-								<th></th>
-								<th class="text-left item-grand-total" colspan="1">
-									{{ _("Total") }}
-								</th>
-								<th class="text-left item-grand-total totals" colspan="3">
-									{{ doc.get_formatted("total") }}
-								</th>
-							</tr>
+							{% include "templates/includes/cart/cart_items_total.html" %}
 						</tfoot>
 					{% endif %}
 				</table>
@@ -110,7 +102,9 @@ <h5>{{ _("Terms and Conditions") }}</h5>
 				{% endif %}
 
 				{% if cart_settings.enable_checkout %}
-					{% include "templates/includes/cart/cart_payment_summary.html" %}
+					<div class="mb-3 frappe-card p-5 payment-summary">
+						{% include "templates/includes/cart/cart_payment_summary.html" %}
+					</div>
 				{% endif %}
 
 				{% include "templates/includes/cart/cart_address.html" %}
@@ -126,11 +120,11 @@ <h5>{{ _("Terms and Conditions") }}</h5>
 	</div>
 	<div class="cart-empty-message mt-4">{{ _('Your cart is Empty') }}</p>
 	{% if cart_settings.enable_checkout %}
-		<a class="btn btn-outline-primary" href="/orders">
+		<a class="btn btn-outline-primary" href="/orders" style="font-size: 16px;">
 			{{ _('See past orders') }}
 		</a>
 		{% else %}
-		<a class="btn btn-outline-primary" href="/quotations">
+		<a class="btn btn-outline-primary" href="/quotations" style="font-size: 16px;">
 			{{ _('See past quotations') }}
 		</a>
 	{% endif %}