nsinnovations/erpnext
2
0
Fork 0
mirror of https://github.com/frappe/erpnext.git synced 2026-06-04 12:49:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #30355 from frappe/mergify/bp/version-13-hotfix/pr-30336

Browse Source 
fix: Product Filters Lookup (backport #30336)
This commit is contained in:
Marica
2022-03-22 18:05:17 +05:30
committed by GitHub
parent 7e6131280f cfce719a7d
commit 315599b46f
5 changed files with 33 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
erpnext/e_commerce/product_ui/views.js
View File

@@ -424,6 +424,22 @@ erpnext.ProductView = class {
me.change_route_with_filters(); me.change_route_with_filters();
}); });
// bind filter lookup input box
$('.filter-lookup-input').on('keydown', frappe.utils.debounce((e) => {
const $input = $(e.target);
const keyword = ($input.val() || '').toLowerCase();
const $filter_options = $input.next('.filter-options');
$filter_options.find('.filter-lookup-wrapper').show();
$filter_options.find('.filter-lookup-wrapper').each((i, el) => {
const $el = $(el);
const value = $el.data('value').toLowerCase();
if (!value.includes(keyword)) {
$el.hide();
}
});
}, 300));
} }
change_route_with_filters() { change_route_with_filters() {

10
erpnext/public/scss/shopping_cart.scss
View File

@@ -4,6 +4,7 @@
--green-info: #38A160; --green-info: #38A160;
--product-bg-color: white; --product-bg-color: white;
--body-bg-color: var(--gray-50); --body-bg-color: var(--gray-50);
--text-md: 13px; // variables are in desk folder in frappe for v13, this is a temporary fix
} }
body.product-page { body.product-page {
@@ -264,6 +265,15 @@ body.product-page {
font-size: 13px; font-size: 13px;
} }
.filter-lookup-input {
background-color: white;
border: 1px solid var(--gray-300);
&:focus {
border: 1px solid var(--primary);
}
}
.filter-label { .filter-label {
font-size: 11px; font-size: 11px;
font-weight: 600; font-weight: 600;

18
erpnext/templates/generators/item_group.html
View File

@@ -52,24 +52,6 @@
</div> </div>
<script>
frappe.ready(() => {
$('.product-filter-filter').on('keydown', frappe.utils.debounce((e) => {
const $input = $(e.target);
const keyword = ($input.val() || '').toLowerCase();
const $filter_options = $input.next('.filter-options');
$filter_options.find('.custom-control').show();
$filter_options.find('.custom-control').each((i, el) => {
const $el = $(el);
const value = $el.data('value').toLowerCase();
if (!value.includes(keyword)) {
$el.hide();
}
});
}, 300));
})
</script>
</div> </div>
</div> </div>
</div> </div>

14
erpnext/templates/includes/macros.html
View File

@@ -300,13 +300,13 @@
{% if values | len > 20 %} {% if values | len > 20 %}
<!-- show inline filter if values more than 20 --> <!-- show inline filter if values more than 20 -->
<input type="text" class="form-control form-control-sm mb-2 product-filter-filter"/> <input type="text" class="form-control form-control-sm mb-2 filter-lookup-input" placeholder="Search {{ item_field.label + 's' }}"/>
{% endif %} {% endif %}
{% if values %} {% if values %}
<div class="filter-options"> <div class="filter-options">
{% for value in values %} {% for value in values %}
<div class="checkbox" data-value="{{ value }}"> <div class="filter-lookup-wrapper checkbox" data-value="{{ value }}">
<label for="{{value}}"> <label for="{{value}}">
<input type="checkbox" <input type="checkbox"
class="product-filter field-filter" class="product-filter field-filter"
@@ -329,17 +329,17 @@
{%- macro attribute_filter_section(filters)-%} {%- macro attribute_filter_section(filters)-%}
{% for attribute in filters %} {% for attribute in filters %}
<div class="mb-4 filter-block pb-5"> <div class="mb-4 filter-block pb-5">
<div class="filter-label mb-3">{{ attribute.name}}</div> <div class="filter-label mb-3">{{ attribute.name }}</div>
{% if values | len > 20 %} {% if attribute.item_attribute_values | len > 20 %}
<!-- show inline filter if values more than 20 --> <!-- show inline filter if values more than 20 -->
<input type="text" class="form-control form-control-sm mb-2 product-filter-filter"/> <input type="text" class="form-control form-control-sm mb-2 filter-lookup-input" placeholder="Search {{ attribute.name + 's' }}"/>
{% endif %} {% endif %}
{% if attribute.item_attribute_values %} {% if attribute.item_attribute_values %}
<div class="filter-options"> <div class="filter-options">
{% for attr_value in attribute.item_attribute_values %} {% for attr_value in attribute.item_attribute_values %}
<div class="checkbox"> <div class="filter-lookup-wrapper checkbox" data-value="{{ attr_value }}">
<label> <label data-value="{{ attr_value }}">
<input type="checkbox" <input type="checkbox"
class="product-filter attribute-filter" class="product-filter attribute-filter"
id="{{ attr_value }}" id="{{ attr_value }}"

18
erpnext/www/all-products/index.html
View File

@@ -31,24 +31,6 @@
{% endif %} {% endif %}
</div> </div>
<script>
frappe.ready(() => {
$('.product-filter-filter').on('keydown', frappe.utils.debounce((e) => {
const $input = $(e.target);
const keyword = ($input.val() || '').toLowerCase();
const $filter_options = $input.next('.filter-options');
$filter_options.find('.custom-control').show();
$filter_options.find('.custom-control').each((i, el) => {
const $el = $(el);
const value = $el.data('value').toLowerCase();
if (!value.includes(keyword)) {
$el.hide();
}
});
}, 300));
})
</script>
</div> </div>
</div> </div>