mirror of
https://github.com/frappe/erpnext.git
synced 2026-08-31 07:28:04 +00:00
feat: store home page and product page
This commit is contained in:
@@ -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 %}
|
||||
|
||||
@@ -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] }})
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user