feat: store home page and product page

This commit is contained in:
prssanna
2020-12-24 11:40:33 +05:30
parent 7a38f41350
commit eb0e596d43
15 changed files with 459 additions and 269 deletions

View File

@@ -7,17 +7,19 @@
{% endblock %}
{% block page_content %}
{% from "erpnext/templates/includes/macros.html" import product_image %}
<div class="item-content">
<div class="product-page-content" itemscope itemtype="http://schema.org/Product">
<div class="row mb-5">
{% include "templates/generators/item/item_image.html" %}
{% include "templates/generators/item/item_details.html" %}
<div class="product-page">
{% from "erpnext/templates/includes/macros.html" import product_image %}
<div class="item-content">
<div class="product-page-content" itemscope itemtype="http://schema.org/Product">
<div class="row mb-5">
{% include "templates/generators/item/item_image.html" %}
{% include "templates/generators/item/item_details.html" %}
</div>
{% include "templates/generators/item/item_specifications.html" %}
{{ doc.website_content or '' }}
</div>
{% include "templates/generators/item/item_specifications.html" %}
{{ doc.website_content or '' }}
</div>
</div>
{% endblock %}

View File

@@ -6,10 +6,10 @@
<div class="item-cart row mt-2" data-variant-item-code="{{ item_code }}">
<div class="col-md-12">
{% if cart_settings.show_price and product_info.price %}
<h4>
<div class="product-price">
{{ product_info.price.formatted_price_sales_uom }}
<small class="text-muted">({{ product_info.price.formatted_price }} / {{ product_info.uom }})</small>
</h4>
<small class="formatted-price">({{ product_info.price.formatted_price }} / {{ product_info.uom }})</small>
</div>
{% else %}
{{ _("Unit of Measurement") }} : {{ product_info.uom }}
{% endif %}
@@ -17,11 +17,11 @@
{% if cart_settings.show_stock_availability %}
<div>
{% if product_info.in_stock == 0 %}
<span class="text-danger">
<span class="text-danger no-stock">
{{ _('Not in stock') }}
</span>
{% elif product_info.in_stock == 1 %}
<span class="text-success">
<span class="text-success has-stock">
{{ _('In stock') }}
{% if product_info.show_stock_qty and product_info.stock_qty %}
({{ product_info.stock_qty[0][0] }})

View File

@@ -1,14 +1,21 @@
<div class="col-md-8">
<!-- title -->
<h1 itemprop="name">
<div class="product-title" itemprop="name">
{{ item_name }}
</h1>
<p class="text-muted">
</div>
<p class="product-code">
<span>{{ _("Item Code") }}:</span>
<span itemprop="productID">{{ doc.name }}</span>
</p>
{% if has_variants %}
<!-- configure template -->
{% include "templates/generators/item/item_configure.html" %}
{% else %}
<!-- add variant to cart -->
{% include "templates/generators/item/item_add_to_cart.html" %}
{% endif %}
<!-- description -->
<div itemprop="description">
<div class="product-description" itemprop="description">
{% if frappe.utils.strip_html(doc.web_long_description or '') %}
{{ doc.web_long_description | safe }}
{% elif frappe.utils.strip_html(doc.description or '') %}
@@ -17,12 +24,4 @@
{{ _("No description given") }}
{% endif %}
</div>
{% if has_variants %}
<!-- configure template -->
{% include "templates/generators/item/item_configure.html" %}
{% else %}
<!-- add variant to cart -->
{% include "templates/generators/item/item_add_to_cart.html" %}
{% endif %}
</div>

View File

@@ -1,42 +1,42 @@
<div class="col-md-4 h-100">
{% if slides %}
{{ product_image(slides[0].image, 'product-image') }}
<div class="item-slideshow">
{% for item in slides %}
<img class="item-slideshow-image mt-2 {% if loop.first %}active{% endif %}"
src="{{ item.image }}" alt="{{ item.heading }}">
{% endfor %}
</div>
<!-- Simple image slideshow -->
<script>
frappe.ready(() => {
$('.page_content').on('click', '.item-slideshow-image', (e) => {
const $img = $(e.currentTarget);
const link = $img.prop('src');
const $product_image = $('.product-image');
$product_image.find('a').prop('href', link);
$product_image.find('img').prop('src', link);
<div class="col-md-4 h-100 d-flex">
{% if slides %}
<div class="item-slideshow d-flex flex-column mr-3">
{% for item in slides %}
<img class="item-slideshow-image mb-2 {% if loop.first %}active{% endif %}"
src="{{ item.image }}" alt="{{ item.heading }}">
{% endfor %}
</div>
{{ product_image(slides[0].image, 'product-image') }}
<!-- Simple image slideshow -->
<script>
frappe.ready(() => {
$('.page_content').on('click', '.item-slideshow-image', (e) => {
const $img = $(e.currentTarget);
const link = $img.prop('src');
const $product_image = $('.product-image');
$product_image.find('a').prop('href', link);
$product_image.find('img').prop('src', link);
$('.item-slideshow-image').removeClass('active');
$img.addClass('active');
});
})
</script>
{% else %}
{{ product_image(website_image or image or 'no-image.jpg', alt=website_image_alt or item_name) }}
{% endif %}
$('.item-slideshow-image').removeClass('active');
$img.addClass('active');
});
})
</script>
{% else %}
{{ product_image(website_image or image or 'no-image.jpg', alt=website_image_alt or item_name) }}
{% endif %}
<!-- Simple image preview -->
<!-- Simple image preview -->
<div class="image-zoom-view" style="display: none;">
<button type="button" class="close" aria-label="Close">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</button>
</div>
<div class="image-zoom-view" style="display: none;">
<button type="button" class="close" aria-label="Close">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</button>
</div>
</div>
<style>
.website-image {