nsinnovations/erpnext
2
0
Fork 0
mirror of https://github.com/frappe/erpnext.git synced 2026-06-04 20:59:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Website: Product Configurator and Bootstrap 4 (#15965)

Browse Source 
- Refactored Homepage with customisable Hero Section
- New Homepage Section to add content on Homepage as cards or using Custom HTML
- Products page at "/all-products" with customisable filters
- Item Configure dialog to find an Item Variant filtered by attribute values
- Contact Us dialog on Item page
- Customisable Item page content using the Website Content field
This commit is contained in:
Faris Ansari
2019-03-19 11:48:32 +05:30
committed by GitHub
parent f060831cce
commit 5f8b358fd4
93 changed files with 5057 additions and 1622 deletions
Download Patch File Download Diff File Expand all files Collapse all files

138
erpnext/templates/pages/cart.html
View File

@@ -2,18 +2,25 @@
{% block title %} {{ _("Shopping Cart") }} {% endblock %}
{% block header %}<h2>{{ _("My Cart") }}</h2>{% endblock %}
{% block header %}<h1>{{ _("Shopping Cart") }}</h1>{% endblock %}
<!--
{% block script %}
<script>{% include "templates/includes/cart.js" %}</script>
{% endblock %}
-->
{% block header_actions %}
{% if doc.items %}
<button class="btn btn-primary btn-place-order btn-sm"
type="button">
{{ _("Place Order") }}</button>
{% if doc.items and cart_settings.enable_checkout %}
<button class="btn btn-primary btn-place-order" type="button">
{{ _("Place Order") }}
</button>
{% endif %}
{% if doc.items and not cart_settings.enable_checkout %}
<button class="btn btn-primary btn-request-for-quotation" type="button">
{{ _("Request for Quotation") }}
</button>
{% endif %}
{% endblock %}
@@ -22,58 +29,89 @@
{% from "templates/includes/macros.html" import item_name_and_description %}
<div class="cart-container">
<div id="cart-container">
<div id="cart-error" class="alert alert-danger"
style="display: none;"></div>
<div id="cart-items">
<div class="row cart-item-header text-muted">
<div class="col-sm-8 col-xs-6 h6 text-uppercase">
{{ _("Item") }}
</div>
<div class="col-sm-2 col-xs-3 text-center h6 text-uppercase">
{{ _("Qty") }}
</div>
<div class="col-sm-2 col-xs-3 text-right h6 text-uppercase">
{{ _("Subtotal") }}
</div>
</div>
{% if doc.items %}
<div class="cart-items">
{% include "templates/includes/cart/cart_items.html" %}
</div>
{% else %}
<p class="empty-cart">{{ _("Cart is Empty") }}</p>
{% endif %}
</div>
{% if doc.items %}
<!-- taxes -->
<div class="row cart-taxes">
<div class="col-sm-6"><!-- empty --></div>
<div class="col-sm-6 text-right cart-tax-items">
<div id="cart-error" class="alert alert-danger" style="display: none;"></div>
{% if doc.items %}
<table class="table table-bordered mt-3">
<thead>
<tr>
<th width="60%">{{ _('Item') }}</th>
<th width="20%" class="text-right">{{ _('Quantity') }}</th>
{% if cart_settings.enable_checkout %}
<th width="20%" class="text-right">{{ _('Subtotal') }}</th>
{% endif %}
</tr>
</thead>
<tbody class="cart-items">
{% include "templates/includes/cart/cart_items.html" %}
</tbody>
{% if cart_settings.enable_checkout %}
<tfoot class="cart-tax-items">
{% include "templates/includes/order/order_taxes.html" %}
</div>
</div>
{% if doc.tc_name %}
<div class="cart-terms" style="display: none;" title={{doc.tc_name}}>
{{doc.tc_name}}
{{doc.terms}}
</div>
<div class="cart-link">
<a href="#" onclick="show_terms();return false;">*{{ __("Terms and Conditions") }}</a>
</div>
</tfoot>
{% endif %}
</table>
{% else %}
<p class="text-muted">{{ _('Your cart is Empty') }}</p>
{% endif %}
<div class="cart-addresses">
{% include "templates/includes/cart/cart_address.html" %}
{% if doc.items %}
{% if doc.tc_name %}
<div class="terms-and-conditions-link">
<a href class="link-terms-and-conditions" data-terms-name="{{ doc.tc_name }}">
{{ _("Terms and Conditions") }}
</a>
<script>
frappe.ready(() => {
$('.link-terms-and-conditions').click((e) => {
e.preventDefault();
const $link = $(e.target);
const terms_name = $link.attr('data-terms-name');
show_terms_and_conditions(terms_name);
})
});
function show_terms_and_conditions(terms_name) {
frappe.call('erpnext.shopping_cart.cart.get_terms_and_conditions', { terms_name })
.then(r => {
frappe.msgprint({
title: terms_name,
message: r.message
});
});
}
</script>
</div>
{% endif %}
<p class="cart-footer text-right">
<button class="btn btn-primary btn-place-order btn-sm" type="button">
{{ _("Place Order") }}</button></p>
{% if cart_settings.enable_checkout %}
<div class="cart-addresses mt-5">
{% include "templates/includes/cart/cart_address.html" %}
</div>
{% endif %}
{% endif %}
</div>
<div class="row mt-5">
<div class="col-12">
{% if cart_settings.enable_checkout %}
<a href="/orders">
{{ _('See past orders') }}
</a>
{% else %}
<a href="/quotations">
{{ _('See past quotations') }}
</a>
{% endif %}
</div>
</div>
{% endblock %}
{% block base_scripts %}
<!-- js should be loaded in body! -->
<script type="text/javascript" src="/assets/frappe/js/lib/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/assets/js/frappe-web.min.js"></script>
<script type="text/javascript" src="/assets/js/control.min.js"></script>
<script type="text/javascript" src="/assets/js/dialog.min.js"></script>
<script type="text/javascript" src="/assets/js/bootstrap-4-web.min.js"></script>
{% endblock %}

2
erpnext/templates/pages/help.html
View File

@@ -11,7 +11,7 @@
value='{{ frappe.form_dict.q or ''}}'
{% if not frappe.form_dict.q%}placeholder="{{ _("What do you need help with?") }}"{% endif %}>
<input type='submit'
class='btn btn-sm btn-default btn-search' value="{{ _("Search") }}">
class='btn btn-sm btn-light btn-search' value="{{ _("Search") }}">
</form>
</div>

9
erpnext/templates/pages/home.css Normal file
View File

@@ -0,0 +1,9 @@
/* csslint ignore:start */
{% if homepage.hero_image %}
.hero-image {
background-image: url("{{ homepage.hero_image }}");
background-size: cover;
padding: 10rem 0;
}
{% endif %}
/* csslint ignore:end */

130
erpnext/templates/pages/home.html
View File

@@ -1,75 +1,75 @@
{% extends "templates/web.html" %}
{% from "erpnext/templates/includes/macros.html" import product_image_square %}
{% block page_content %}
{% from "erpnext/templates/includes/macros.html" import render_homepage_section %}
<div class="row">
<div class="col-sm-12">
<div class="hero">
<h1 class="text-center">{{ homepage.tag_line or '' }}</h1>
<p class="text-center">{{ homepage.description or '' }}</p>
{% block content %}
<main>
{% if homepage.hero_section_based_on == 'Default' %}
<section class="hero-section border-bottom {%if homepage.hero_image%}hero-image{%endif%}">
<div class="container py-5">
<h1 class="d-none d-sm-block display-4">{{ homepage.tag_line }}</h1>
<h1 class="d-block d-sm-none">{{ homepage.tag_line }}</h1>
<h2 class="d-none d-sm-block">{{ homepage.description }}</h2>
<h3 class="d-block d-sm-none">{{ homepage.description }}</h3>
</div>
{% if homepage.products %}
<div class='featured-products-section' itemscope itemtype="http://schema.org/Product">
<h5 class='featured-product-heading'>{{ _("Featured Products") }}</h5>
<div class="featured-products">
<div id="search-list" class="row" style="margin-top:40px;">
{% for item in homepage.products %}
<a class="product-link" href="{{ item.route|abs_url }}">
<div class="col-sm-4 col-xs-4 product-image-wrapper">
<div class="product-image-img">
<!-- thumbnail not updated, and used as background image in item card -->
{{ product_image_square(item.image) }}
<div class="product-text" itemprop="name">{{ item.item_name }}</div>
</div>
</div>
</a>
{% endfor %}
<div class="container">
<a href="{{ explore_link }}" class="mb-5 btn btn-primary">{{ _('Explore') }}</a>
</div>
</section>
{% elif homepage.hero_section_based_on == 'Slideshow' and slideshow %}
<section class="hero-section">
{% include "templates/includes/slideshow.html" %}
</section>
{% elif homepage.hero_section_based_on == 'Homepage Section' %}
{{ render_homepage_section(homepage.hero_section_doc) }}
{% endif %}
{% if homepage.products %}
<section class="container section-products my-5">
<h3>{{ _('Products') }}</h3>
<div class="row">
{% for item in homepage.products %}
<div class="col-md-4 mb-4">
<div class="card h-100 justify-content-between">
<div class="website-image-lazy" data-class="card-img-top h-100" data-src="{{ item.image }}" data-alt="{{ item.item_name }}"></div>
<div class="card-body flex-grow-0">
<h5 class="card-title">{{ item.item_name }}</h5>
<a href="{{ item.route }}" class="card-link">{{ _('More details') }}</a>
</div>
</div>
</div>
<div class="text-center padding">
<a href="{{ homepage.products_url or "/products" }}" class="btn btn-primary all-products">
{{ _("View All Products") }}</a></div>
{% endfor %}
</div>
{% endif %}
</div>
</div>
{% endblock %}
</section>
{% endif %}
{% block style %}
<style>
.hero {
padding-top: 50px;
padding-bottom: 100px;
}
{% if blogs %}
<section class="container my-5">
<h3>{{ _('Publications') }}</h3>
.hero h1 {
font-size: 40px;
font-weight: 200;
}
<div class="row">
{% for blog in blogs %}
<div class="col-md-4 mb-4">
<div class="card h-100">
<div class="card-body">
<h5 class="card-title">{{ blog.title }}</h5>
<p class="card-subtitle mb-2 text-muted">{{ _('By {0}').format(blog.blogger) }}</p>
<p class="card-text">{{ blog.blog_intro }}</p>
</div>
<div class="card-body flex-grow-0">
<a href="{{ blog.route }}" class="card-link">{{ _('Read blog') }}</a>
</div>
</div>
</div>
{% endfor %}
</div>
</section>
{% endif %}
.home-login {
margin-top: 30px;
}
.btn-login {
width: 80px;
}
.featured-product-heading, .all-products {
text-transform: uppercase;
letter-spacing: 0.5px;
font-size: 12px;
font-weight: 500;
}
.all-products {
font-weight: 300;
padding-left: 25px;
padding-right: 25px;
padding-top: 10px;
padding-bottom: 10px;
}
</style>
{% endblock %}
{% for section in homepage_sections %}
{{ render_homepage_section(section) }}
{% endfor %}
</main>
{% endblock %}

45
erpnext/templates/pages/home.py
View File

@@ -15,15 +15,38 @@ def get_context(context):
if route:
item.route = '/' + route
context.title = homepage.title or homepage.company
# show atleast 3 products
if len(homepage.products) < 3:
for i in range(3 - len(homepage.products)):
homepage.append('products', {
'item_code': 'product-{0}'.format(i),
'item_name': frappe._('Product {0}').format(i),
'route': '#'
})
homepage.title = homepage.title or homepage.company
context.title = homepage.title
context.homepage = homepage
if homepage.hero_section_based_on == 'Homepage Section' and homepage.hero_section:
homepage.hero_section_doc = frappe.get_doc('Homepage Section', homepage.hero_section)
if homepage.slideshow:
doc = frappe.get_doc('Website Slideshow', homepage.slideshow)
context.slideshow = homepage.slideshow
context.slideshow_header = doc.header
context.slides = doc.slideshow_items
context.blogs = frappe.get_all('Blog Post',
fields=['title', 'blogger', 'blog_intro', 'route'],
filters={
'published': 1
},
order_by='modified desc',
limit=3
)
# filter out homepage section which is used as hero section
homepage_hero_section = homepage.hero_section_based_on == 'Homepage Section' and homepage.hero_section
homepage_sections = frappe.get_all('Homepage Section',
filters=[['name', '!=', homepage_hero_section]] if homepage_hero_section else None,
order_by='section_order asc'
)
context.homepage_sections = [frappe.get_doc('Homepage Section', name) for name in homepage_sections]
context.metatags = context.metatags or frappe._dict({})
context.metatags.image = homepage.hero_image or None
context.metatags.description = homepage.description or None
context.explore_link = '/all-products'

4
erpnext/templates/pages/material_request_info.html
View File

@@ -12,7 +12,7 @@
{% endblock %}
{% block header_actions %}
<a class='btn btn-xs btn-default' href='/printview?doctype={{ doc.doctype}}&name={{ doc.name }}&format={{ print_format }}' target="_blank" rel="noopener noreferrer">{{ _("Print") }}</a>
<a class='btn btn-xs btn-light' href='/printview?doctype={{ doc.doctype}}&name={{ doc.name }}&format={{ print_format }}' target="_blank" rel="noopener noreferrer">{{ _("Print") }}</a>
{% endblock %}
{% block page_content %}
@@ -70,5 +70,5 @@
{% endif %}
{% endfor %}
</div>
</div>
</div>
{% endblock %}

2
erpnext/templates/pages/non_profit/leave-chapter.html
View File

@@ -9,7 +9,7 @@
<label for="leave">Why do you want to leave this chapter</label>
<input type="text" name="leave" class="form-control" id="leave">
</div>
<button type="button" class="btn btn-default btn-leave" data-title= "{{ chapter.name }}" id="btn-leave">Submit
<button type="button" class="btn btn-light btn-leave" data-title= "{{ chapter.name }}" id="btn-leave">Submit
</button>
</form>
</div>

40
erpnext/templates/pages/order.html
View File

@@ -8,23 +8,22 @@
{% block title %}{{ doc.name }}{% endblock %}
{% block header %}
<h1>{{ doc.name }}</h1>
<h1 class="m-0">{{ doc.name }}</h1>
{% endblock %}
{% block header_actions %}
<a class='btn btn-xs btn-default' href='/printview?doctype={{ doc.doctype}}&name={{ doc.name }}&format={{ print_format }}' target="_blank" rel="noopener noreferrer">{{ _("Print") }}</a>
<a href='/printview?doctype={{ doc.doctype}}&name={{ doc.name }}&format={{ print_format }}' target="_blank" rel="noopener noreferrer">{{ _("Print") }}</a>
{% endblock %}
{% block page_content %}
<div class="row transaction-subheading">
<div class="col-xs-6">
<div class="col-6">
<span class="indicator {{ doc.indicator_color or ("blue" if doc.docstatus==1 else "darkgrey") }}">
{{ _(doc.get('indicator_title')) or _(doc.status) or _("Submitted") }}
</span>
</div>
<div class="col-xs-6 text-muted text-right small">
<div class="col-6 text-muted text-right small">
{{ frappe.utils.formatdate(doc.transaction_date, 'medium') }}
{% if doc.valid_till %}
<p>
@@ -34,16 +33,14 @@
</div>
</div>
<p class='small' style='padding-top: 15px;'>
{% if doc.doctype == 'Supplier Quotation' %}
<b>{{ doc.supplier_name}}</b>
{% else %}
<b>{{ doc.customer_name}}</b>
{% endif %}
{% if doc.contact_display %}
<br>
{{ doc.contact_display }}
{% endif %}
<p class="small my-3">
{%- set party_name = doc.supplier_name if doc.doctype == 'Supplier Quotation' else doc.customer_name %}
<b>{{ party_name }}</b>
{% if doc.contact_display and doc.contact_display != party_name %}
<br>
{{ doc.contact_display }}
{% endif %}
</p>
{% if doc._header %}
@@ -55,7 +52,7 @@
<!-- items -->
<div class="order-item-table">
<div class="row order-items order-item-header text-muted">
<div class="col-sm-6 col-xs-6 h6 text-uppercase">
<div class="col-sm-6 col-6 h6 text-uppercase">
{{ _("Item") }}
</div>
<div class="col-sm-3 col-xs-3 text-right h6 text-uppercase">
@@ -67,7 +64,7 @@
</div>
{% for d in doc.items %}
<div class="row order-items">
<div class="col-sm-6 col-xs-6">
<div class="col-sm-6 col-6">
{{ item_name_and_description(d) }}
</div>
<div class="col-sm-3 col-xs-3 text-right">
@@ -85,11 +82,10 @@
</div>
<!-- taxes -->
<div class="order-taxes row">
<div class="col-sm-6"><!-- empty --></div>
<div class="col-sm-6 text-right">
<div class="order-taxes d-flex justify-content-end">
<table>
{% include "erpnext/templates/includes/order/order_taxes.html" %}
</div>
</table>
</div>
</div>
@@ -115,7 +111,7 @@
<div class="control-input">
<input class="form-control" type="number" min="0" max="{{ available_loyalty_points }}" id="loyalty-point-to-redeem">
</div>
<p class="help-box small text-muted hidden-xs"> Available Points: {{ available_loyalty_points }} </p>
<p class="help-box small text-muted d-none d-sm-block"> Available Points: {{ available_loyalty_points }} </p>
</div>
</div>
{% endif %}

2
erpnext/templates/pages/product_search.html
View File

@@ -25,7 +25,7 @@ frappe.ready(function() {
<div style="text-align: center;">
<div class="more-btn"
style="display: none; text-align: center;">
<button class="btn btn-default">{{ _("More...") }}</button>
<button class="btn btn-light">{{ _("More...") }}</button>
</div>
</div>
</div>

4
erpnext/templates/pages/projects.html
View File

@@ -20,11 +20,11 @@
aria-valuemin="0" aria-valuemax="100" style="width:{{ doc.percent_complete|round|int }}%;">
</div>
</div>
{% endif %}
{% endif %}
<div class="clearfix">
<h4 style="float: left;">{{ _("Tasks") }}</h4>
<a class="btn btn-secondary btn-default btn-sm" style="float: right; position: relative; top: 10px;" href='/tasks?new=1&project={{ doc.project_name }}'>{{ _("New task") }}</a>
<a class="btn btn-secondary btn-light btn-sm" style="float: right; position: relative; top: 10px;" href='/tasks?new=1&project={{ doc.project_name }}'>{{ _("New task") }}</a>
</div>
<p>

4
erpnext/templates/pages/task_info.html
View File

@@ -20,7 +20,7 @@
<div class="page-header-actions-block" data-html-block="header-actions">
<button type="submit" class="btn btn-primary btn-sm btn-form-submit">
{{ __("Update") }}</button>
<a href="tasks" class="btn btn-default btn-sm">
<a href="tasks" class="btn btn-light btn-sm">
{{ __("Cancel") }}</a>
</div>
</div>
@@ -91,7 +91,7 @@
{% endfor %}
</div>
<div class="comment-form-wrapper">
<a class="add-comment btn btn-default btn-sm">{{ __("Add Comment") }}</a>
<a class="add-comment btn btn-light btn-sm">{{ __("Add Comment") }}</a>
<div style="display: none;" id="comment-form">
<p>{{ __("Add Comment") }}</p>
<form>