fix: product page fixes

This commit is contained in:
prssanna 2021-01-20 17:47:25 +05:30
parent ac7bc78afe
commit 706eae7cac
5 changed files with 52 additions and 36 deletions

View File

@ -3,6 +3,9 @@
{% block title %} {{ title }} {% endblock %}
{% block breadcrumbs %}
<div class="item-breadcrumbs small text-muted">
{% include "templates/includes/breadcrumbs.html" %}
</div>
{% endblock %}
{% block page_content %}

View File

@ -30,7 +30,7 @@
{% endif %}
</div>
{% endif %}
<div class="mt-3">
<div class="mt-5 mb-5">
{% if product_info.price and (cart_settings.allow_items_not_in_stock or product_info.in_stock) %}
<a href="/cart"
class="btn btn-light btn-view-in-cart {% if not product_info.qty %}hidden{% endif %}"
@ -40,8 +40,13 @@
</a>
<button
data-item-code="{{item_code}}"
class="btn btn-outline-primary btn-add-to-cart {% if product_info.qty %}hidden{% endif %}"
class="btn btn-primary btn-add-to-cart {% if product_info.qty %}hidden{% endif %} w-100"
>
<span class="mr-2">
<svg class="icon icon-md">
<use href="#icon-assets"></use>
</svg>
</span>
{{ _("Add to Cart") }}
</button>
{% endif %}

View File

@ -1,9 +1,9 @@
{% if shopping_cart and shopping_cart.cart_settings.enabled %}
{% set cart_settings = shopping_cart.cart_settings %}
<div class="mt-3">
<div class="mt-5 mb-6">
{% if cart_settings.enable_variants | int %}
<button class="btn btn-primary btn-configure"
<button class="btn btn-primary-light btn-configure"
data-item-code="{{ doc.name }}"
data-item-name="{{ doc.item_name }}"
>

View File

@ -187,42 +187,53 @@ class ItemConfigure {
}
get_html_for_item_found({ filtered_items_count, filtered_items, exact_match, product_info }) {
const exact_match_message = __('1 exact match.');
const one_item = exact_match.length === 1 ?
exact_match[0] :
filtered_items_count === 1 ?
filtered_items[0] : '';
const one_item = exact_match.length === 1
? exact_match[0]
: filtered_items_count === 1
? filtered_items[0]
: '';
const item_add_to_cart = one_item ? `
<div class="alert alert-success d-flex justify-content-between align-items-center" role="alert">
<div>
<div>${one_item} ${product_info && product_info.price ? '(' + product_info.price.formatted_price_sales_uom + ')' : ''}</div>
</div>
<a href data-action="btn_add_to_cart" data-item-code="${one_item}">
${__('Add to cart')}
</a>
</div>
`: '';
<button data-item-code="${one_item}"
class="btn btn-primary btn-add-to-cart w-100"
data-action="btn_add_to_cart"
>
<span class="mr-2">
${frappe.utils.icon('assets', 'md')}
</span>
${__("Add to Cart")}s
</button>
` : '';
const items_found = filtered_items_count === 1 ?
__('{0} item found.', [filtered_items_count]) :
__('{0} items found.', [filtered_items_count]);
const item_found_status = `
<div class="alert alert-warning d-flex justify-content-between align-items-center" role="alert">
<span>
${exact_match.length === 1 ? '' : items_found}
${exact_match.length === 1 ? `<span>${exact_match_message}</span>` : ''}
</span>
<a href data-action="btn_clear_values">
${__('Clear values')}
const item_found_status = exact_match.length === 1
? `<div class="alert alert-success d-flex justify-content-between align-items-center" role="alert">
<div><div>
${one_item}
${product_info && product_info.price
? '(' + product_info.price.formatted_price_sales_uom + ')'
: ''
}
</div></div>
<a href data-action="btn_clear_values" data-item-code="${one_item}">
${__('Clear Values')}
</a>
</div>
`;
</div>`
: `<div class="alert alert-warning d-flex justify-content-between align-items-center" role="alert">
<span>
${items_found}
</span>
<a href data-action="btn_clear_values">
${__('Clear values')}
</a>
</div>`;
return `
${item_add_to_cart}
${item_found_status}
${item_add_to_cart}
`;
}
@ -254,8 +265,8 @@ class ItemConfigure {
}
append_status_area() {
this.dialog.$status_area = $('<div class="status-area">');
this.dialog.$wrapper.find('.modal-body').prepend(this.dialog.$status_area);
this.dialog.$status_area = $('<div class="status-area mt-5">');
this.dialog.$wrapper.find('.modal-body').append(this.dialog.$status_area);
this.dialog.$wrapper.on('click', '[data-action]', (e) => {
e.preventDefault();
const $target = $(e.currentTarget);
@ -263,7 +274,7 @@ class ItemConfigure {
const method = this[action];
method.call(this, e);
});
this.dialog.$body.css({ maxHeight: '75vh', overflow: 'auto', overflowX: 'hidden' });
this.dialog.$wrapper.addClass('item-configurator-dialog');
}
get_next_attribute_and_values(selected_attributes) {

View File

@ -1,8 +1,5 @@
<div class="col-md-7">
<div class="col-md-7 product-details">
<!-- title -->
<div class="item-breadcrumbs small text-muted">
{% include "templates/includes/breadcrumbs.html" %}
</div>
<h1 class="product-title" itemprop="name">
{{ item_name }}
</h1>