diff --git a/erpnext/e_commerce/product_query.py b/erpnext/e_commerce/product_query.py index c186a05282..9e675e54d4 100644 --- a/erpnext/e_commerce/product_query.py +++ b/erpnext/e_commerce/product_query.py @@ -22,7 +22,7 @@ class ProductQuery: def __init__(self): self.settings = frappe.get_doc("E Commerce Settings") self.page_length = self.settings.products_per_page or 20 - self.fields = ['wi.name', 'wi.item_name', 'wi.item_code', 'wi.website_image', 'wi.variant_of', + self.fields = ['wi.web_item_name', 'wi.name', 'wi.item_name', 'wi.item_code', 'wi.website_image', 'wi.variant_of', 'wi.has_variants', 'wi.item_group', 'wi.image', 'wi.web_long_description', 'wi.description', 'wi.route', 'wi.website_warehouse'] self.conditions = "" diff --git a/erpnext/e_commerce/product_view.js b/erpnext/e_commerce/product_view.js new file mode 100644 index 0000000000..660db66021 --- /dev/null +++ b/erpnext/e_commerce/product_view.js @@ -0,0 +1,124 @@ +erpnext.ProductView = class { + /* Options: View Type */ + constructor(options) { + Object.assign(this, options); + this.render_view_toggler(); + this.get_item_filter_data(); + this.render_list_view(); + this.render_grid_view(); + } + + render_view_toggler() { + ["btn-list-view", "btn-grid-view"].forEach(view => { + let icon = view === "btn-list-view" ? "list" : "image-view"; + this.products_section.append(` +
+ +
`); + }); + + $("#list").click(function() { + let $btn = $(this); + $btn.removeClass('btn-primary'); + $btn.addClass('btn-primary'); + $(".btn-grid-view").removeClass('btn-primary'); + }) + + $("#image-view").click(function() { + let $btn = $(this); + $btn.removeClass('btn-primary'); + $btn.addClass('btn-primary'); + $(".btn-list-view").removeClass('btn-primary'); + }); + + this.products_area = this.products_section.append(` +

+
+ `); + } + + get_item_filter_data() { + // Get Items and Discount Filters to render + let me = this; + const filters = frappe.utils.get_query_params(); + let {field_filters, attribute_filters} = filters; + + field_filters = field_filters ? JSON.parse(field_filters) : {}; + attribute_filters = attribute_filters ? JSON.parse(attribute_filters) : {}; + + frappe.call({ + method: 'erpnext.www.all-products.index.get_product_filter_data', + args: { + field_filters: field_filters, + attribute_filters: attribute_filters, + item_group: me.item_group + }, + callback: function(result) { + if (!result.exc) { + me.render_filters(result.message[1]); + + // Append pre-rendered products + // TODO: get products as is and style via js + me.products = result.message; + $("#products-area").append(result.message[0]); + + } else { + $("#products-area").append(` +
+ ${__('No products found')} +
`); + + } + } + }); + } + + render_filters(filter_data) { + this.get_discount_filter_html(filter_data.discount_filters); + } + + get_discount_filter_html(filter_data) { + if (filter_data) { + $("#product-filters").append(` +
+
${__("Discounts")}
+
+ `); + + let html = `
`; + filter_data.forEach(filter => { + html += ` +
+ +
+ `; + }); + html += `
`; + + $("#discount-filters").append(html); + } + } + + render_list_view() { + // loop over data and add list html to it + } + + render_grid_view() { + // loop over data and add grid html to it + } + +} \ No newline at end of file diff --git a/erpnext/public/build.json b/erpnext/public/build.json index 6fa3fb9fc3..aa8ef6df6d 100644 --- a/erpnext/public/build.json +++ b/erpnext/public/build.json @@ -66,5 +66,8 @@ "js/hierarchy-chart.min.js": [ "public/js/hierarchy_chart/hierarchy_chart_desktop.js", "public/js/hierarchy_chart/hierarchy_chart_mobile.js" + ], + "js/e-commerce.min.js": [ + "e_commerce/product_view.js" ] } diff --git a/erpnext/public/js/shopping_cart.js b/erpnext/public/js/shopping_cart.js index b57862b93a..331d04eb43 100644 --- a/erpnext/public/js/shopping_cart.js +++ b/erpnext/public/js/shopping_cart.js @@ -2,8 +2,8 @@ // License: GNU General Public License v3. See license.txt // shopping cart -frappe.provide("erpnext.shopping_cart"); -var shopping_cart = erpnext.shopping_cart; +frappe.provide("e_commerce.shopping_cart"); +var shopping_cart = e_commerce.shopping_cart; var getParams = function (url) { var params = []; @@ -214,7 +214,7 @@ $.extend(shopping_cart, { this.animate_add_to_cart($btn); const item_code = $btn.data('item-code'); - erpnext.shopping_cart.update_cart({ + e_commerce.shopping_cart.update_cart({ item_code, qty: 1 }); diff --git a/erpnext/public/js/wishlist.js b/erpnext/public/js/wishlist.js index 6bcb6b14e2..11dae355cb 100644 --- a/erpnext/public/js/wishlist.js +++ b/erpnext/public/js/wishlist.js @@ -1,8 +1,8 @@ -frappe.provide("erpnext.wishlist"); -var wishlist = erpnext.wishlist; +frappe.provide("e_commerce.wishlist"); +var wishlist = e_commerce.wishlist; -frappe.provide("erpnext.shopping_cart"); -var shopping_cart = erpnext.shopping_cart; +frappe.provide("e_commerce.shopping_cart"); +var shopping_cart = e_commerce.shopping_cart; $.extend(wishlist, { set_wishlist_count: function() { @@ -79,7 +79,7 @@ $.extend(wishlist, { let me = this; let success_action = function() { - erpnext.wishlist.set_wishlist_count(); + e_commerce.wishlist.set_wishlist_count(); }; if ($wish_icon.hasClass('wished')) { diff --git a/erpnext/public/scss/shopping_cart.scss b/erpnext/public/scss/shopping_cart.scss index 04bf9838a6..acd97add8d 100644 --- a/erpnext/public/scss/shopping_cart.scss +++ b/erpnext/public/scss/shopping_cart.scss @@ -68,7 +68,6 @@ body.product-page { .item-card-group-section { .card { - height: 400px; align-items: center; justify-content: center; @@ -779,3 +778,7 @@ body.product-page { padding: 6px; font-size: 14px; } + +#toggle-view { + float: right; +} diff --git a/erpnext/setup/doctype/item_group/item_group.py b/erpnext/setup/doctype/item_group/item_group.py index d944509482..18236802fe 100644 --- a/erpnext/setup/doctype/item_group/item_group.py +++ b/erpnext/setup/doctype/item_group/item_group.py @@ -65,37 +65,14 @@ class ItemGroup(NestedSet, WebsiteGenerator): self.delete_child_item_groups_key() def get_context(self, context): - context.show_search=True + context.show_search = True context.page_length = cint(frappe.db.get_single_value('E Commerce Settings', 'products_per_page')) or 6 - context.e_commerce_settings = frappe.get_cached_doc('E Commerce Settings', 'E Commerce Settings') context.search_link = '/product_search' - if frappe.form_dict: - search = frappe.form_dict.search - field_filters = frappe.parse_json(frappe.form_dict.field_filters) - attribute_filters = frappe.parse_json(frappe.form_dict.attribute_filters) - start = frappe.parse_json(frappe.form_dict.start) - else: - search = None - attribute_filters = None - field_filters = {} - start = 0 - - if not field_filters: - field_filters = {} - - # Ensure the query remains within current item group - field_filters['item_group'] = self.name - - engine = ProductQuery() - context.items, discounts = engine.query(attribute_filters, field_filters, search, start) - filter_engine = ProductFiltersBuilder(self.name) context.field_filters = filter_engine.get_field_filters() context.attribute_filters = filter_engine.get_attribute_filters() - if discounts: - context.discount_filters = filter_engine.get_discount_filters(discounts) context.update({ "parents": get_parent_item_groups(self.parent_item_group), @@ -124,6 +101,7 @@ class ItemGroup(NestedSet, WebsiteGenerator): context.no_breadcrumbs = False context.title = self.website_title or self.name + context.name = self.name return context diff --git a/erpnext/templates/generators/item/item_add_to_cart.html b/erpnext/templates/generators/item/item_add_to_cart.html index 1da4d15e32..d42453dacd 100644 --- a/erpnext/templates/generators/item/item_add_to_cart.html +++ b/erpnext/templates/generators/item/item_add_to_cart.html @@ -143,7 +143,7 @@ const $btn = $(e.currentTarget); $btn.prop('disabled', true); const item_code = $btn.data('item-code'); - erpnext.shopping_cart.update_cart({ + e_commerce.shopping_cart.update_cart({ item_code, qty: 1, callback(r) { @@ -170,11 +170,11 @@ }; let success_action = function() { $btn.prop('disabled', false); - erpnext.wishlist.set_wishlist_count(); + e_commerce.wishlist.set_wishlist_count(); $('.btn-add-to-wishlist, .btn-view-in-wishlist').toggleClass('hidden'); }; - erpnext.wishlist.add_remove_from_wishlist("add", args, success_action, failure_action); + e_commerce.wishlist.add_remove_from_wishlist("add", args, success_action, failure_action); }); $('.page_content').on('click', '.offer-details', (e) => { diff --git a/erpnext/templates/generators/item/item_configure.js b/erpnext/templates/generators/item/item_configure.js index 5cb5d15501..d7b8d328c3 100644 --- a/erpnext/templates/generators/item/item_configure.js +++ b/erpnext/templates/generators/item/item_configure.js @@ -247,7 +247,7 @@ class ItemConfigure { const additional_notes = Object.keys(this.range_values || {}).map(attribute => { return `${attribute}: ${this.range_values[attribute]}`; }).join('\n'); - erpnext.shopping_cart.update_cart({ + e_commerce.shopping_cart.update_cart({ item_code, additional_notes, qty: 1 diff --git a/erpnext/templates/generators/item_group.html b/erpnext/templates/generators/item_group.html index a27b566cf3..3ae9a89136 100644 --- a/erpnext/templates/generators/item_group.html +++ b/erpnext/templates/generators/item_group.html @@ -16,7 +16,8 @@ {% endblock %} {% block page_content %} -
+
{% if slideshow %} {{ web_block( @@ -33,7 +34,7 @@ {% endif %}
-
+
{% if sub_categories %}
{{ _('Sub Categories') }}
@@ -48,15 +49,9 @@ {% endfor %}
{% endif %} -
- {% if items %} - {% for item in items %} - {% include "erpnext/www/all-products/item_row.html" %} - {% endfor %} - {% else %} - {% include "erpnext/www/all-products/not_found.html" %} - {% endif %} -
+ + +
@@ -70,10 +65,6 @@ {{ attribute_filter_section(attribute_filters) }} - - {% if discount_filters %} - {{ discount_range_filters(discount_filters) }} - {% endif %}
-
+ + + +