feat: Product View toggling
- Added fully functional list and grid view toggling
- Added ProductGrid and ProductList controllers
- Moved html snippets, rendered via JS now
- Item Group page also rendered via common controller
- Paging section rendered via JS
- Minor style changes
diff --git a/erpnext/templates/generators/item_group.html b/erpnext/templates/generators/item_group.html
index 3ae9a89..20ad7fb 100644
--- a/erpnext/templates/generators/item_group.html
+++ b/erpnext/templates/generators/item_group.html
@@ -35,24 +35,9 @@
</div>
<div class="row">
<div id="product-listing" class="col-12 order-2 col-md-9 order-md-2 item-card-group-section">
- {% if sub_categories %}
- <div class="sub-category-container">
- <div class="heading"> {{ _('Sub Categories') }} </div>
- </div>
- <div class="sub-category-container scroll-categories">
- {% for row in sub_categories%}
- <a href="{{ row.route or '#' }}" style="text-decoration: none;">
- <div class="category-pill">
- {{ row.name }}
- </div>
- </a>
- {% endfor %}
- </div>
- {% endif %}
-
<!-- Products Rendered in all-products/index.js-->
-
</div>
+
<div class="col-12 order-1 col-md-3 order-md-1">
<div class="collapse d-md-block mr-4 filters-section" id="product-filters">
<div class="d-flex justify-content-between align-items-center mb-5 title-section">
@@ -87,23 +72,6 @@
</script>
</div>
</div>
- <div class="row mt-6">
- <div class="col-3">
- </div>
- <div class="col-9">
- {% if frappe.form_dict.start|int > 0 %}
- <button class="btn btn-outline-secondary btn-prev" data-start="{{ frappe.form_dict.start|int - page_length }}">
- {{ _("Prev") }}
- </button>
- {% endif %}
- {% if items|length >= page_length %}
- <button class="btn btn-outline-secondary btn-next" data-start="{{ frappe.form_dict.start|int + page_length }}"
- style="float: right;">
- {{ _("Next") }}
- </button>
- {% endif %}
- </div>
- </div>
</div>
<script>
diff --git a/erpnext/templates/includes/macros.html b/erpnext/templates/includes/macros.html
index d6d6629..aec23a2 100644
--- a/erpnext/templates/includes/macros.html
+++ b/erpnext/templates/includes/macros.html
@@ -59,7 +59,7 @@
{% endmacro %}
-{%- macro item_card(item, settings=None, is_featured=False, is_full_width=False, align="Left") -%}
+{%- macro item_card(item, is_featured=False, is_full_width=False, align="Left") -%}
{%- set align_items_class = resolve_class({
'align-items-end': align == 'Right',
'align-items-center': align == 'Center',
@@ -80,12 +80,12 @@
<img class="card-img" src="{{ image }}" alt="{{ title }}">
</div>
<div class="col-md-6">
- {{ item_card_body(title, settings, description, item, is_featured, align) }}
+ {{ item_card_body(title, description, item, is_featured, align) }}
</div>
</div>
{% else %}
<div class="col-md-12">
- {{ item_card_body(title, settings, description, item, is_featured, align) }}
+ {{ item_card_body(title, description, item, is_featured, align) }}
</div>
{% endif %}
</div>
@@ -106,13 +106,13 @@
</div>
</a>
{% endif %}
- {{ item_card_body(title, settings, description, item, is_featured, align) }}
+ {{ item_card_body(title, description, item, is_featured, align) }}
</div>
</div>
{% endif %}
{%- endmacro -%}
-{%- macro item_card_body(title, settings, description, item, is_featured, align) -%}
+{%- macro item_card_body(title, description, item, is_featured, align) -%}
{%- set align_class = resolve_class({
'text-right': align == 'Right',
'text-center': align == 'Center' and not is_featured,
@@ -128,52 +128,12 @@
{% endif %}
</div>
</a>
- {% if not item.has_variants and settings.enable_wishlist %}
- <div class="like-action"
- data-item-code="{{ item.item_code }}"
- data-price="{{ item.price }}"
- data-formatted-price="{{ item.get('formatted_price') }}">
- <svg class="icon sm">
- {%- set icon_class = "wished" if item.wished else "not-wished"-%}
- <use class="{{ icon_class }} wish-icon" href="#icon-heart"></use>
- </svg>
- </div>
- {% endif %}
</div>
{% if is_featured %}
<div class="product-price">{{ item.formatted_price or '' }}</div>
<div class="product-description ellipsis">{{ description or '' }}</div>
{% else %}
<div class="product-category">{{ item.item_group or '' }}</div>
-
- {% if item.formatted_price %}
- <div class="product-price">
- {{ item.formatted_price or '' }}
-
- {% if item.get("formatted_mrp") %}
- <small class="ml-1 text-muted">
- <s>{{ item.formatted_mrp }}</s>
- </small>
- <small class="ml-1" style="color: #F47A7A; font-weight: 500;">
- {{ item.discount }} OFF
- </small>
- {% endif %}
-
- </div>
- {% endif %}
-
- {% if item.has_variants %}
- <a href="/{{ item.route or '#' }}">
- <div class="btn btn-sm btn-explore-variants w-100 mt-4">
- {{ _('Explore') }}
- </div>
- </a>
- {% elif settings.enabled and (settings.allow_items_not_in_stock or item.in_stock != "red")%}
- <div id="{{ item.name }}" class="btn btn-sm btn-add-to-cart-list not-added w-100 mt-4"
- data-item-code="{{ item.item_code }}">
- {{ _('Add to Cart') }}
- </div>
- {% endif %}
{% endif %}
</div>
{%- endmacro -%}
diff --git a/erpnext/templates/includes/products_as_list.html b/erpnext/templates/includes/products_as_list.html
index 976d614..a9369bb 100644
--- a/erpnext/templates/includes/products_as_list.html
+++ b/erpnext/templates/includes/products_as_list.html
@@ -1,5 +1,5 @@
{% from "erpnext/templates/includes/macros.html" import item_card, item_card_body, product_image_square %}
-
+<!-- Used in Product Search -->
<a class="product-link product-list-link" href="{{ route|abs_url }}">
<div class='row'>
<div class='col-xs-3 col-sm-2 product-image-wrapper'>