From b5e7f04b33f3fddd2f9344fddcd538bb058fc2f0 Mon Sep 17 00:00:00 2001 From: marination Date: Mon, 12 Jul 2021 03:28:33 +0530 Subject: [PATCH] chore: UI refresh for grid/list view and search - enhanced UI for grid/list view, actions visible on hover only - enhanced search UI - Added indicator to show if item is in cart - Moved search with view togglers --- .../doctype/item_review/item_review.py | 4 +- .../doctype/website_item/website_item.json | 4 +- erpnext/e_commerce/product_grid.js | 69 ++++-- erpnext/e_commerce/product_list.js | 84 ++++--- erpnext/e_commerce/product_query.py | 39 +++- erpnext/e_commerce/product_search.js | 99 ++++---- erpnext/e_commerce/product_view.js | 65 ++++-- erpnext/public/js/shopping_cart.js | 18 +- erpnext/public/js/wishlist.js | 4 +- erpnext/public/scss/shopping_cart.scss | 219 +++++++++++++++--- .../setup/doctype/item_group/item_group.py | 1 + erpnext/templates/generators/item_group.html | 13 +- erpnext/www/all-products/index.html | 15 +- erpnext/www/all-products/index.js | 2 - 14 files changed, 440 insertions(+), 196 deletions(-) diff --git a/erpnext/e_commerce/doctype/item_review/item_review.py b/erpnext/e_commerce/doctype/item_review/item_review.py index 772da049cc..f7437f6bb6 100644 --- a/erpnext/e_commerce/doctype/item_review/item_review.py +++ b/erpnext/e_commerce/doctype/item_review/item_review.py @@ -61,7 +61,7 @@ def add_item_review(web_item, title, rating, comment=None): doc.published_on = datetime.today().strftime("%d %B %Y") doc.insert() -def get_customer(): +def get_customer(silent=False): user = frappe.session.user contact_name = get_contact_name(user) customer = None @@ -75,5 +75,7 @@ def get_customer(): if customer: return frappe.db.get_value("Customer", customer) + elif silent: + return None else: frappe.throw(_("You are not verified to write a review yet. Please contact us for verification.")) \ No newline at end of file diff --git a/erpnext/e_commerce/doctype/website_item/website_item.json b/erpnext/e_commerce/doctype/website_item/website_item.json index bf0f4f105d..a321584c78 100644 --- a/erpnext/e_commerce/doctype/website_item/website_item.json +++ b/erpnext/e_commerce/doctype/website_item/website_item.json @@ -310,7 +310,7 @@ { "description": "Short Description for List View", "fieldname": "short_description", - "fieldtype": "Data", + "fieldtype": "Small Text", "label": "Short Website Description" } ], @@ -318,7 +318,7 @@ "image_field": "image", "index_web_pages_for_search": 1, "links": [], - "modified": "2021-07-08 19:25:15.115746", + "modified": "2021-07-11 20:49:45.415421", "modified_by": "Administrator", "module": "E-commerce", "name": "Website Item", diff --git a/erpnext/e_commerce/product_grid.js b/erpnext/e_commerce/product_grid.js index c0e5ffa845..d29f62f937 100644 --- a/erpnext/e_commerce/product_grid.js +++ b/erpnext/e_commerce/product_grid.js @@ -22,7 +22,7 @@ erpnext.ProductGrid = class { this.items.forEach(item => { let title = item.web_item_name || item.item_name || item.item_code || ""; - title = title.length > 50 ? title.substr(0, 50) + "..." : title; + title = title.length > 90 ? title.substr(0, 90) + "..." : title; html += `
`; html += me.get_image_html(item, title); @@ -60,13 +60,20 @@ erpnext.ProductGrid = class { get_card_body_html(item, title, settings) { let body_html = ` -
+
`; - body_html += this.get_title_with_indicator(item, title, settings); + body_html += this.get_title(item, title); + + // get floating elements + if (!item.has_variants) { + if (settings.enable_wishlist) { + body_html += this.get_wishlist_icon(item); + } + if (settings.enabled) { + body_html += this.get_cart_indicator(item); + } - if (!item.has_variants && settings.enable_wishlist) { - body_html += this.get_wishlist_icon(item); } body_html += `
`; // close div on line 50 @@ -76,29 +83,28 @@ erpnext.ProductGrid = class { body_html += this.get_price_html(item); } + body_html += this.get_stock_availability(item, settings); body_html += this.get_primary_button(item, settings); body_html += `
`; // close div on line 49 return body_html; } - get_title_with_indicator(item, title, settings) { + get_title(item, title) { let title_html = `
${ title || '' } +
+ `; - if (item.in_stock && settings.show_stock_availability) { - title_html += ``; - } - title_html += `
`; return title_html; } get_wishlist_icon(item) { let icon_class = item.wished ? "wished" : "not-wished"; return ` - `; - - if (settings.enable_wishlist || settings.enabled) { + if (settings.enabled) { title_html += `
`; - if (!item.has_variants && settings.enable_wishlist) { - title_html += this.get_wishlist_icon(item); - } title_html += this.get_primary_button(item, settings); title_html += `
`; } @@ -96,12 +95,12 @@ erpnext.ProductList = class { return title_html; } - get_item_details(item) { + get_item_details(item, settings) { let details = `

- Item Code : ${ item.item_code } + ${ item.item_group } | Item Code : ${ item.item_code }

-
+
${ item.short_description || '' }
@@ -110,24 +109,33 @@ erpnext.ProductList = class { if (item.formatted_mrp) { details += ` - - ${ item.formatted_mrp } + + ${ item.formatted_mrp ? item.formatted_mrp.replace(/ +/g, "") : "" } - + ${ item.discount } OFF `; } + + details += this.get_stock_availability(item, settings); details += `
`; return details; } + get_stock_availability(item, settings) { + if (!item.has_variants && !item.in_stock && settings.show_stock_availability) { + return `
Out of stock`; + } + return ``; + } + get_wishlist_icon(item) { let icon_class = item.wished ? "wished" : "not-wished"; return ` -