Merge pull request #25872 from nextchamp-saqib/fix-pos-broken-img

fix(pos): rendering of broken image on pos
This commit is contained in:
Deepesh Garg 2021-05-29 17:28:03 +05:30 committed by GitHub
commit 5483f21fe7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 2 deletions

View File

@ -636,13 +636,23 @@ erpnext.PointOfSale.ItemCart = class {
function get_item_image_html() {
const { image, item_name } = item_data;
if (image) {
return `<div class="item-image"><img src="${image}" alt="${image}""></div>`;
return `
<div class="item-image">
<img
onerror="cur_pos.cart.handle_broken_image(this)"
src="${image}" alt="${frappe.get_abbr(item_name)}"">
</div>`;
} else {
return `<div class="item-image item-abbr">${frappe.get_abbr(item_name)}</div>`;
}
}
}
handle_broken_image($img) {
const item_abbr = $($img).attr('alt');
$($img).parent().replaceWith(`<div class="item-image item-abbr">${item_abbr}</div>`);
}
scroll_to_item($item) {
if ($item.length === 0) return;
const scrollTop = $item.offset().top - this.$cart_items_wrapper.offset().top + this.$cart_items_wrapper.scrollTop();

View File

@ -94,7 +94,11 @@ erpnext.PointOfSale.ItemSelector = class {
<span class="indicator-pill whitespace-nowrap ${indicator_color}">${qty_to_display}</span>
</div>
<div class="flex items-center justify-center h-32 border-b-grey text-6xl text-grey-100">
<img class="h-full" src="${item_image}" alt="${frappe.get_abbr(item.item_name)}" style="object-fit: cover;">
<img
onerror="cur_pos.item_selector.handle_broken_image(this)"
class="h-full" src="${item_image}"
alt="${frappe.get_abbr(item.item_name)}"
style="object-fit: cover;">
</div>`;
} else {
return `<div class="item-qty-pill">
@ -122,6 +126,11 @@ erpnext.PointOfSale.ItemSelector = class {
);
}
handle_broken_image($img) {
const item_abbr = $($img).attr('alt');
$($img).parent().replaceWith(`<div class="item-display abbr">${item_abbr}</div>`);
}
make_search_bar() {
const me = this;
const doc = me.events.get_frm().doc;