Merge pull request #30808 from nextchamp-saqib/pos-search-ux-fix
fix(pos): search field doesn't reset on checkout
diff --git a/erpnext/selling/page/point_of_sale/pos_controller.js b/erpnext/selling/page/point_of_sale/pos_controller.js
index 65e0cbb..7a68386 100644
--- a/erpnext/selling/page/point_of_sale/pos_controller.js
+++ b/erpnext/selling/page/point_of_sale/pos_controller.js
@@ -343,9 +343,9 @@
toggle_other_sections: (show) => {
if (show) {
this.item_details.$component.is(':visible') ? this.item_details.$component.css('display', 'none') : '';
- this.item_selector.$component.css('display', 'none');
+ this.item_selector.toggle_component(false);
} else {
- this.item_selector.$component.css('display', 'flex');
+ this.item_selector.toggle_component(true);
}
},
diff --git a/erpnext/selling/page/point_of_sale/pos_item_cart.js b/erpnext/selling/page/point_of_sale/pos_item_cart.js
index 4a99f06..eacf480 100644
--- a/erpnext/selling/page/point_of_sale/pos_item_cart.js
+++ b/erpnext/selling/page/point_of_sale/pos_item_cart.js
@@ -130,10 +130,10 @@
},
cols: 5,
keys: [
- [ 1, 2, 3, __('Quantity') ],
- [ 4, 5, 6, __('Discount') ],
- [ 7, 8, 9, __('Rate') ],
- [ '.', 0, __('Delete'), __('Remove') ]
+ [ 1, 2, 3, 'Quantity' ],
+ [ 4, 5, 6, 'Discount' ],
+ [ 7, 8, 9, 'Rate' ],
+ [ '.', 0, 'Delete', 'Remove' ]
],
css_classes: [
[ '', '', '', 'col-span-2' ],
diff --git a/erpnext/selling/page/point_of_sale/pos_item_selector.js b/erpnext/selling/page/point_of_sale/pos_item_selector.js
index b62b27b..7a90fb0 100644
--- a/erpnext/selling/page/point_of_sale/pos_item_selector.js
+++ b/erpnext/selling/page/point_of_sale/pos_item_selector.js
@@ -179,6 +179,25 @@
});
this.search_field.toggle_label(false);
this.item_group_field.toggle_label(false);
+
+ this.attach_clear_btn();
+ }
+
+ attach_clear_btn() {
+ this.search_field.$wrapper.find('.control-input').append(
+ `<span class="link-btn" style="top: 2px;">
+ <a class="btn-open no-decoration" title="${__("Clear")}">
+ ${frappe.utils.icon('close', 'sm')}
+ </a>
+ </span>`
+ );
+
+ this.$clear_search_btn = this.search_field.$wrapper.find('.link-btn');
+
+ this.$clear_search_btn.on('click', 'a', () => {
+ this.set_search_value('');
+ this.search_field.set_focus();
+ });
}
set_search_value(value) {
@@ -252,6 +271,16 @@
const search_term = e.target.value;
this.filter_items({ search_term });
}, 300);
+
+ this.$clear_search_btn.toggle(
+ Boolean(this.search_field.$input.val())
+ );
+ });
+
+ this.search_field.$input.on('focus', () => {
+ this.$clear_search_btn.toggle(
+ Boolean(this.search_field.$input.val())
+ );
});
}
@@ -284,7 +313,7 @@
if (this.items.length == 1) {
this.$items_container.find(".item-wrapper").click();
frappe.utils.play_sound("submit");
- $(this.search_field.$input[0]).val("").trigger("input");
+ this.set_search_value('');
} else if (this.items.length == 0 && this.barcode_scanned) {
// only show alert of barcode is scanned and enter is pressed
frappe.show_alert({
@@ -293,7 +322,7 @@
});
frappe.utils.play_sound("error");
this.barcode_scanned = false;
- $(this.search_field.$input[0]).val("").trigger("input");
+ this.set_search_value('');
}
});
}
@@ -350,6 +379,7 @@
}
toggle_component(show) {
- show ? this.$component.css('display', 'flex') : this.$component.css('display', 'none');
+ this.set_search_value('');
+ this.$component.css('display', show ? 'flex': 'none');
}
};
diff --git a/erpnext/selling/page/point_of_sale/pos_number_pad.js b/erpnext/selling/page/point_of_sale/pos_number_pad.js
index 95293d1..f27b0d5 100644
--- a/erpnext/selling/page/point_of_sale/pos_number_pad.js
+++ b/erpnext/selling/page/point_of_sale/pos_number_pad.js
@@ -25,7 +25,7 @@
const fieldname = fieldnames && fieldnames[number] ?
fieldnames[number] : typeof number === 'string' ? frappe.scrub(number) : number;
- return a2 + `<div class="numpad-btn ${class_to_append}" data-button-value="${fieldname}">${number}</div>`;
+ return a2 + `<div class="numpad-btn ${class_to_append}" data-button-value="${fieldname}">${__(number)}</div>`;
}, '');
}, '');
}