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

style: format js files

Browse Source
This commit is contained in:
Ankush Menat
2024-03-11 10:58:48 +05:30
parent c46be27e9e
commit 4c629d31c6
605 changed files with 27454 additions and 18952 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
erpnext/e_commerce/doctype/e_commerce_settings/e_commerce_settings.js
View File

@@ -2,57 +2,58 @@
// For license information, please see license.txt
frappe.ui.form.on("E Commerce Settings", {
onload: function(frm) {
if(frm.doc.__onload && frm.doc.__onload.quotation_series) {
onload: function (frm) {
if (frm.doc.__onload && frm.doc.__onload.quotation_series) {
frm.fields_dict.quotation_series.df.options = frm.doc.__onload.quotation_series;
frm.refresh_field("quotation_series");
}
frm.set_query('payment_gateway_account', function() {
return { 'filters': { 'payment_channel': "Email" } };
frm.set_query("payment_gateway_account", function () {
return { filters: { payment_channel: "Email" } };
});
},
refresh: function(frm) {
refresh: function (frm) {
if (frm.doc.enabled) {
frm.get_field('store_page_docs').$wrapper.removeClass('hide-control').html(
`<div>${__("Follow these steps to create a landing page for your store")}:
frm.get_field("store_page_docs")
.$wrapper.removeClass("hide-control")
.html(
`<div>${__("Follow these steps to create a landing page for your store")}:
<a href="https://docs.erpnext.com/docs/user/manual/en/website/store-landing-page"
style="color: var(--gray-600)">
docs/store-landing-page
</a>
</div>`
);
);
}
frappe.model.with_doctype("Website Item", () => {
const web_item_meta = frappe.get_meta('Website Item');
const web_item_meta = frappe.get_meta("Website Item");
const valid_fields = web_item_meta.fields.filter(df =>
["Link", "Table MultiSelect"].includes(df.fieldtype) && !df.hidden
).map(df =>
({ label: df.label, value: df.fieldname })
);
const valid_fields = web_item_meta.fields
.filter((df) => ["Link", "Table MultiSelect"].includes(df.fieldtype) && !df.hidden)
.map((df) => ({ label: df.label, value: df.fieldname }));
frm.get_field("filter_fields").grid.update_docfield_property(
'fieldname', 'options', valid_fields
"fieldname",
"options",
valid_fields
);
});
},
enabled: function(frm) {
enabled: function (frm) {
if (frm.doc.enabled === 1) {
frm.set_value('enable_variants', 1);
}
else {
frm.set_value('company', '');
frm.set_value('price_list', '');
frm.set_value('default_customer_group', '');
frm.set_value('quotation_series', '');
frm.set_value("enable_variants", 1);
} else {
frm.set_value("company", "");
frm.set_value("price_list", "");
frm.set_value("default_customer_group", "");
frm.set_value("quotation_series", "");
}
},
enable_checkout: function(frm) {
enable_checkout: function (frm) {
if (frm.doc.enable_checkout) {
erpnext.utils.check_payments_app();
}
}
},
});

3
erpnext/e_commerce/doctype/item_review/item_review.js
View File

@@ -1,8 +1,7 @@
// Copyright (c) 2021, Frappe Technologies Pvt. Ltd. and contributors
// For license information, please see license.txt
frappe.ui.form.on('Item Review', {
frappe.ui.form.on("Item Review", {
// refresh: function(frm) {
// }
});

42
erpnext/e_commerce/doctype/website_item/website_item.js
View File

@@ -1,37 +1,49 @@
// Copyright (c) 2021, Frappe Technologies Pvt. Ltd. and contributors
// For license information, please see license.txt
frappe.ui.form.on('Website Item', {
frappe.ui.form.on("Website Item", {
onload: (frm) => {
// should never check Private
frm.fields_dict["website_image"].df.is_private = 0;
},
refresh: (frm) => {
frm.add_custom_button(__("Prices"), function() {
frappe.set_route("List", "Item Price", {"item_code": frm.doc.item_code});
}, __("View"));
frm.add_custom_button(
__("Prices"),
function () {
frappe.set_route("List", "Item Price", { item_code: frm.doc.item_code });
},
__("View")
);
frm.add_custom_button(__("Stock"), function() {
frappe.route_options = {
"item_code": frm.doc.item_code
};
frappe.set_route("query-report", "Stock Balance");
}, __("View"));
frm.add_custom_button(
__("Stock"),
function () {
frappe.route_options = {
item_code: frm.doc.item_code,
};
frappe.set_route("query-report", "Stock Balance");
},
__("View")
);
frm.add_custom_button(__("E Commerce Settings"), function() {
frappe.set_route("Form", "E Commerce Settings");
}, __("View"));
frm.add_custom_button(
__("E Commerce Settings"),
function () {
frappe.set_route("Form", "E Commerce Settings");
},
__("View")
);
},
copy_from_item_group: (frm) => {
return frm.call({
doc: frm.doc,
method: "copy_specification_from_item_group"
method: "copy_specification_from_item_group",
});
},
set_meta_tags: (frm) => {
frappe.utils.set_meta_tag(frm.doc.route);
}
},
});

12
erpnext/e_commerce/doctype/website_item/website_item_list.js
View File

@@ -1,20 +1,20 @@
frappe.listview_settings['Website Item'] = {
frappe.listview_settings["Website Item"] = {
add_fields: ["item_name", "web_item_name", "published", "website_image", "has_variants", "variant_of"],
filters: [["published", "=", "1"]],
get_indicator: function(doc) {
get_indicator: function (doc) {
if (doc.has_variants && doc.published) {
return [__("Template"), "orange", "has_variants,=,Yes|published,=,1"];
} else if (doc.has_variants && !doc.published) {
return [__("Template"), "grey", "has_variants,=,Yes|published,=,0"];
} else if (doc.variant_of && doc.published) {
} else if (doc.variant_of && doc.published) {
return [__("Variant"), "blue", "published,=,1|variant_of,=," + doc.variant_of];
} else if (doc.variant_of && !doc.published) {
} else if (doc.variant_of && !doc.published) {
return [__("Variant"), "grey", "published,=,0|variant_of,=," + doc.variant_of];
} else if (doc.published) {
return [__("Published"), "green", "published,=,1"];
} else {
return [__("Not Published"), "grey", "published,=,0"];
}
}
};
},
};

3
erpnext/e_commerce/doctype/wishlist/wishlist.js
View File

@@ -1,8 +1,7 @@
// Copyright (c) 2021, Frappe Technologies Pvt. Ltd. and contributors
// For license information, please see license.txt
frappe.ui.form.on('Wishlist', {
frappe.ui.form.on("Wishlist", {
// refresh: function(frm) {
// }
});

59
erpnext/e_commerce/product_ui/grid.js
View File

@@ -20,9 +20,9 @@ erpnext.ProductGrid = class {
let me = this;
let html = ``;
this.items.forEach(item => {
this.items.forEach((item) => {
let title = item.web_item_name || item.item_name || item.item_code || "";
title = title.length > 90 ? title.substr(0, 90) + "..." : title;
title = title.length > 90 ? title.substr(0, 90) + "..." : title;
html += `<div class="col-sm-4 item-card"><div class="card text-left">`;
html += me.get_image_html(item, title);
@@ -40,17 +40,17 @@ erpnext.ProductGrid = class {
if (image) {
return `
<div class="card-img-container">
<a href="/${ item.route || '#' }" style="text-decoration: none;">
<img class="card-img" src="${ image }" alt="${ title }">
<a href="/${item.route || "#"}" style="text-decoration: none;">
<img class="card-img" src="${image}" alt="${title}">
</a>
</div>
`;
} else {
return `
<div class="card-img-container">
<a href="/${ item.route || '#' }" style="text-decoration: none;">
<a href="/${item.route || "#"}" style="text-decoration: none;">
<div class="card-img-top no-image">
${ frappe.get_abbr(title) }
${frappe.get_abbr(title)}
</div>
</a>
</div>
@@ -73,11 +73,10 @@ erpnext.ProductGrid = class {
if (settings.enabled) {
body_html += this.get_cart_indicator(item);
}
}
body_html += `</div>`;
body_html += `<div class="product-category">${ item.item_group || '' }</div>`;
body_html += `<div class="product-category">${item.item_group || ""}</div>`;
if (item.formatted_price) {
body_html += this.get_price_html(item);
@@ -92,9 +91,9 @@ erpnext.ProductGrid = class {
get_title(item, title) {
let title_html = `
<a href="/${ item.route || '#' }">
<a href="/${item.route || "#"}">
<div class="product-title">
${ title || '' }
${title || ""}
</div>
</a>
`;
@@ -104,10 +103,10 @@ erpnext.ProductGrid = class {
get_wishlist_icon(item) {
let icon_class = item.wished ? "wished" : "not-wished";
return `
<div class="like-action ${ item.wished ? "like-action-wished" : ''}"
data-item-code="${ item.item_code }">
<div class="like-action ${item.wished ? "like-action-wished" : ""}"
data-item-code="${item.item_code}">
<svg class="icon sm">
<use class="${ icon_class } wish-icon" href="#icon-heart"></use>
<use class="${icon_class} wish-icon" href="#icon-heart"></use>
</svg>
</div>
`;
@@ -115,7 +114,7 @@ erpnext.ProductGrid = class {
get_cart_indicator(item) {
return `
<div class="cart-indicator ${item.in_cart ? '' : 'hidden'}" data-item-code="${ item.item_code }">
<div class="cart-indicator ${item.in_cart ? "" : "hidden"}" data-item-code="${item.item_code}">
1
</div>
`;
@@ -124,16 +123,16 @@ erpnext.ProductGrid = class {
get_price_html(item) {
let price_html = `
<div class="product-price">
${ item.formatted_price || '' }
${item.formatted_price || ""}
`;
if (item.formatted_mrp) {
price_html += `
<small class="striked-price">
<s>${ item.formatted_mrp ? item.formatted_mrp.replace(/ +/g, "") : "" }</s>
<s>${item.formatted_mrp ? item.formatted_mrp.replace(/ +/g, "") : ""}</s>
</small>
<small class="ml-1 product-info-green">
${ item.discount } OFF
${item.discount} OFF
</small>
`;
}
@@ -146,13 +145,13 @@ erpnext.ProductGrid = class {
if (item.on_backorder) {
return `
<span class="out-of-stock mb-2 mt-1" style="color: var(--primary-color)">
${ __("Available on backorder") }
${__("Available on backorder")}
</span>
`;
} else if (!item.in_stock) {
return `
<span class="out-of-stock mb-2 mt-1">
${ __("Out of stock") }
${__("Out of stock")}
</span>
`;
}
@@ -164,33 +163,33 @@ erpnext.ProductGrid = class {
get_primary_button(item, settings) {
if (item.has_variants) {
return `
<a href="/${ item.route || '#' }">
<a href="/${item.route || "#"}">
<div class="btn btn-sm btn-explore-variants w-100 mt-4">
${ __('Explore') }
${__("Explore")}
</div>
</a>
`;
} else if (settings.enabled && (settings.allow_items_not_in_stock || item.in_stock)) {
return `
<div id="${ item.name }" class="btn
<div id="${item.name}" class="btn
btn-sm btn-primary btn-add-to-cart-list
w-100 mt-2 ${ item.in_cart ? 'hidden' : '' }"
data-item-code="${ item.item_code }">
w-100 mt-2 ${item.in_cart ? "hidden" : ""}"
data-item-code="${item.item_code}">
<span class="mr-2">
<svg class="icon icon-md">
<use href="#icon-assets"></use>
</svg>
</span>
${ settings.enable_checkout ? __('Add to Cart') : __('Add to Quote') }
${settings.enable_checkout ? __("Add to Cart") : __("Add to Quote")}
</div>
<a href="/cart">
<div id="${ item.name }" class="btn
<div id="${item.name}" class="btn
btn-sm btn-primary btn-add-to-cart-list
w-100 mt-4 go-to-cart-grid
${ item.in_cart ? '' : 'hidden' }"
data-item-code="${ item.item_code }">
${ settings.enable_checkout ? __('Go to Cart') : __('Go to Quote') }
${item.in_cart ? "" : "hidden"}"
data-item-code="${item.item_code}">
${settings.enable_checkout ? __("Go to Cart") : __("Go to Quote")}
</div>
</a>
`;
@@ -198,4 +197,4 @@ erpnext.ProductGrid = class {
return ``;
}
}
};
};

69
erpnext/e_commerce/product_ui/list.js
View File

@@ -20,9 +20,9 @@ erpnext.ProductList = class {
let me = this;
let html = `<br><br>`;
this.items.forEach(item => {
this.items.forEach((item) => {
let title = item.web_item_name || item.item_name || item.item_code || "";
title = title.length > 200 ? title.substr(0, 200) + "..." : title;
title = title.length > 200 ? title.substr(0, 200) + "..." : title;
html += `<div class='row list-row w-100 mb-4'>`;
html += me.get_image_html(item, title, me.settings);
@@ -42,23 +42,23 @@ erpnext.ProductList = class {
if (image) {
image_html += `
<div class="col-2 border text-center rounded list-image">
<a class="product-link product-list-link" href="/${ item.route || '#' }">
<img itemprop="image" class="website-image h-100 w-100" alt="${ title }"
src="${ image }">
<a class="product-link product-list-link" href="/${item.route || "#"}">
<img itemprop="image" class="website-image h-100 w-100" alt="${title}"
src="${image}">
</a>
${ wishlist_enabled ? this.get_wishlist_icon(item): '' }
${wishlist_enabled ? this.get_wishlist_icon(item) : ""}
</div>
`;
} else {
image_html += `
<div class="col-2 border text-center rounded list-image">
<a class="product-link product-list-link" href="/${ item.route || '#' }"
<a class="product-link product-list-link" href="/${item.route || "#"}"
style="text-decoration: none">
<div class="card-img-top no-image-list">
${ frappe.get_abbr(title) }
${frappe.get_abbr(title)}
</div>
</a>
${ wishlist_enabled ? this.get_wishlist_icon(item): '' }
${wishlist_enabled ? this.get_wishlist_icon(item) : ""}
</div>
`;
}
@@ -78,16 +78,16 @@ erpnext.ProductList = class {
let title_html = `<div style="display: flex; margin-left: -15px;">`;
title_html += `
<div class="col-8" style="margin-right: -15px;">
<a href="/${ item.route || '#' }">
<a href="/${item.route || "#"}">
<div class="product-title">
${ title }
${title}
</div>
</a>
</div>
`;
if (settings.enabled) {
title_html += `<div class="col-4 cart-action-container ${item.in_cart ? 'd-flex' : ''}">`;
title_html += `<div class="col-4 cart-action-container ${item.in_cart ? "d-flex" : ""}">`;
title_html += this.get_primary_button(item, settings);
title_html += `</div>`;
}
@@ -99,22 +99,22 @@ erpnext.ProductList = class {
get_item_details(item, settings) {
let details = `
<p class="product-code">
${ item.item_group } | Item Code : ${ item.item_code }
${item.item_group} | Item Code : ${item.item_code}
</p>
<div class="mt-2" style="color: var(--gray-600) !important; font-size: 13px;">
${ item.short_description || '' }
${item.short_description || ""}
</div>
<div class="product-price">
${ item.formatted_price || '' }
${item.formatted_price || ""}
`;
if (item.formatted_mrp) {
details += `
<small class="striked-price">
<s>${ item.formatted_mrp ? item.formatted_mrp.replace(/ +/g, "") : "" }</s>
<s>${item.formatted_mrp ? item.formatted_mrp.replace(/ +/g, "") : ""}</s>
</small>
<small class="ml-1 product-info-green">
${ item.discount } OFF
${item.discount} OFF
</small>
`;
}
@@ -131,19 +131,19 @@ erpnext.ProductList = class {
return `
<br>
<span class="out-of-stock mt-2" style="color: var(--primary-color)">
${ __("Available on backorder") }
${__("Available on backorder")}
</span>
`;
} else if (!item.in_stock) {
return `
<br>
<span class="out-of-stock mt-2">${ __("Out of stock") }</span>
<span class="out-of-stock mt-2">${__("Out of stock")}</span>
`;
} else if (item.is_stock) {
return `
<br>
<span class="in-stock in-green has-stock mt-2"
style="font-size: 14px;">${ __("In stock") }</span>
style="font-size: 14px;">${__("In stock")}</span>
`;
}
}
@@ -154,10 +154,10 @@ erpnext.ProductList = class {
let icon_class = item.wished ? "wished" : "not-wished";
return `
<div class="like-action-list ${ item.wished ? "like-action-wished" : ''}"
data-item-code="${ item.item_code }">
<div class="like-action-list ${item.wished ? "like-action-wished" : ""}"
data-item-code="${item.item_code}">
<svg class="icon sm">
<use class="${ icon_class } wish-icon" href="#icon-heart"></use>
<use class="${icon_class} wish-icon" href="#icon-heart"></use>
</svg>
</div>
`;
@@ -166,18 +166,18 @@ erpnext.ProductList = class {
get_primary_button(item, settings) {
if (item.has_variants) {
return `
<a href="/${ item.route || '#' }">
<a href="/${item.route || "#"}">
<div class="btn btn-sm btn-explore-variants btn mb-0 mt-0">
${ __('Explore') }
${__("Explore")}
</div>
</a>
`;
} else if (settings.enabled && (settings.allow_items_not_in_stock || item.in_stock)) {
return `
<div id="${ item.name }" class="btn
<div id="${item.name}" class="btn
btn-sm btn-primary btn-add-to-cart-list mb-0
${ item.in_cart ? 'hidden' : '' }"
data-item-code="${ item.item_code }"
${item.in_cart ? "hidden" : ""}"
data-item-code="${item.item_code}"
style="margin-top: 0px !important; max-height: 30px; float: right;
padding: 0.25rem 1rem; min-width: 135px;">
<span class="mr-2">
@@ -185,21 +185,21 @@ erpnext.ProductList = class {
<use href="#icon-assets"></use>
</svg>
</span>
${ settings.enable_checkout ? __('Add to Cart') : __('Add to Quote') }
${settings.enable_checkout ? __("Add to Cart") : __("Add to Quote")}
</div>
<div class="cart-indicator list-indicator ${item.in_cart ? '' : 'hidden'}">
<div class="cart-indicator list-indicator ${item.in_cart ? "" : "hidden"}">
1
</div>
<a href="/cart">
<div id="${ item.name }" class="btn
<div id="${item.name}" class="btn
btn-sm btn-primary btn-add-to-cart-list
ml-4 go-to-cart mb-0 mt-0
${ item.in_cart ? '' : 'hidden' }"
data-item-code="${ item.item_code }"
${item.in_cart ? "" : "hidden"}"
data-item-code="${item.item_code}"
style="padding: 0.25rem 1rem; min-width: 135px;">
${ settings.enable_checkout ? __('Go to Cart') : __('Go to Quote') }
${settings.enable_checkout ? __("Go to Cart") : __("Go to Quote")}
</div>
</a>
`;
@@ -207,5 +207,4 @@ erpnext.ProductList = class {
return ``;
}
}
};

63
erpnext/e_commerce/product_ui/search.js
View File

@@ -28,7 +28,7 @@ erpnext.ProductSearch = class {
// Click can happen anywhere on the page
$("body").on("click", (e) => {
let searchEvent = $(e.target).closest(this.search_box_id).length;
let resultsEvent = $(e.target).closest('#search-results-container').length;
let resultsEvent = $(e.target).closest("#search-results-container").length;
let isResultHidden = this.search_dropdown.hasClass("hidden");
if (!searchEvent && !resultsEvent && !isResultHidden) {
@@ -50,10 +50,11 @@ erpnext.ProductSearch = class {
frappe.call({
method: "erpnext.templates.pages.product_search.search",
args: {
query: query
query: query,
},
callback: (data) => {
let product_results = null, category_results = null;
let product_results = null,
category_results = null;
// Populate product results
product_results = data.message ? data.message.product_results : null;
@@ -69,7 +70,7 @@ erpnext.ProductSearch = class {
if (!$.isEmptyObject(product_results) || !$.isEmptyObject(category_results)) {
me.setRecentSearches(query);
}
}
},
});
this.search_dropdown.removeClass("hidden");
@@ -77,13 +78,17 @@ erpnext.ProductSearch = class {
}
setupSearchResultContainer() {
this.search_dropdown = this.search_area.append(`
this.search_dropdown = this.search_area
.append(
`
<div class="overflow-hidden shadow dropdown-menu w-100 hidden"
id="search-results-container"
aria-labelledby="dropdownMenuSearch"
style="display: flex; flex-direction: column;">
</div>
`).find("#search-results-container");
`
)
.find("#search-results-container");
this.setupCategoryContainer();
this.setupProductsContainer();
@@ -91,36 +96,52 @@ erpnext.ProductSearch = class {
}
setupProductsContainer() {
this.products_container = this.search_dropdown.append(`
this.products_container = this.search_dropdown
.append(
`
<div id="product-results mt-2">
<div id="product-scroll" style="overflow: scroll; max-height: 300px">
</div>
</div>
`).find("#product-scroll");
`
)
.find("#product-scroll");
}
setupCategoryContainer() {
this.category_container = this.search_dropdown.append(`
this.category_container = this.search_dropdown
.append(
`
<div class="category-container mt-2 mb-1">
<div class="category-chips">
</div>
</div>
`).find(".category-chips");
`
)
.find(".category-chips");
}
setupRecentsContainer() {
let $recents_section = this.search_dropdown.append(`
let $recents_section = this.search_dropdown
.append(
`
<div class="mb-2 mt-2 recent-searches">
<div>
<b>${ __("Recent") }</b>
<b>${__("Recent")}</b>
</div>
</div>
`).find(".recent-searches");
`
)
.find(".recent-searches");
this.recents_container = $recents_section.append(`
this.recents_container = $recents_section
.append(
`
<div id="recents" style="padding: .25rem 0 1rem 0;">
</div>
`).find("#recents");
`
)
.find("#recents");
}
getRecentSearches() {
@@ -128,7 +149,7 @@ erpnext.ProductSearch = class {
}
attachEventListenersToChips() {
let me = this;
let me = this;
const chips = $(".recent-search");
window.chips = chips;
@@ -178,7 +199,7 @@ erpnext.ProductSearch = class {
<path d="M8.00027 5.20947V8.00017L10 10" stroke="var(--gray-500)" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</span>
${ key }
${key}
</div>
`;
});
@@ -197,7 +218,7 @@ erpnext.ProductSearch = class {
let html = "";
product_results.forEach((res) => {
let thumbnail = res.thumbnail || '/assets/erpnext/images/ui-states/cart-empty-state.png';
let thumbnail = res.thumbnail || "/assets/erpnext/images/ui-states/cart-empty-state.png";
html += `
<div class="dropdown-item" style="display: flex;">
<img class="item-thumb col-2" src=${thumbnail} />
@@ -226,7 +247,7 @@ erpnext.ProductSearch = class {
let html = `
<div class="mb-2">
<b>${ __("Categories") }</b>
<b>${__("Categories")}</b>
</div>
`;
@@ -234,11 +255,11 @@ erpnext.ProductSearch = class {
html += `
<a href="/${category.route}" class="btn btn-sm category-chip mr-2 mb-2"
style="font-size: 13px" role="button">
${ category.name }
${category.name}
</button>
`;
});
this.category_container.html(html);
}
};
};

206
erpnext/e_commerce/product_ui/views.js
View File

@@ -1,4 +1,4 @@
erpnext.ProductView = class {
erpnext.ProductView = class {
/* Options:
- View Type
- Products Section Wrapper,
@@ -10,7 +10,7 @@ erpnext.ProductView = class {
this.make();
}
make(from_filters=false) {
make(from_filters = false) {
this.products_section.empty();
this.prepare_toolbar();
this.get_item_filter_data(from_filters);
@@ -28,7 +28,6 @@ erpnext.ProductView = class {
}
prepare_view_toggler() {
if (!$("#list").length || !$("#image-view").length) {
this.render_view_toggler();
this.bind_view_toggler_actions();
@@ -36,7 +35,7 @@ erpnext.ProductView = class {
}
}
get_item_filter_data(from_filters=false) {
get_item_filter_data(from_filters = false) {
// Get and render all Product related views
let me = this;
this.from_filters = from_filters;
@@ -47,9 +46,9 @@ erpnext.ProductView = class {
frappe.call({
method: "erpnext.e_commerce.api.get_product_filter_data",
args: {
query_args: args
query_args: args,
},
callback: function(result) {
callback: function (result) {
if (!result || result.exc || !result.message || result.message.exc) {
me.render_no_products_section(true);
} else {
@@ -87,13 +86,13 @@ erpnext.ProductView = class {
}
me.disable_view_toggler(false);
}
},
});
}
disable_view_toggler(disable=false) {
$('#list').prop('disabled', disable);
$('#image-view').prop('disabled', disable);
disable_view_toggler(disable = false) {
$("#list").prop("disabled", disable);
$("#image-view").prop("disabled", disable);
}
render_grid_view(items, settings) {
@@ -105,7 +104,7 @@ erpnext.ProductView = class {
items: items,
products_section: $("#products-grid-area"),
settings: settings,
preference: me.preference
preference: me.preference,
});
}
@@ -117,7 +116,7 @@ erpnext.ProductView = class {
items: items,
products_section: $("#products-list-area"),
settings: settings,
preference: me.preference
preference: me.preference,
});
}
@@ -126,13 +125,13 @@ erpnext.ProductView = class {
let top_margin = view == "list" ? "mt-6" : "mt-minus-1";
return this.products_section.append(`
<br>
<div id="products-${view}-area" class="row products-list ${ top_margin } ${ left_margin }"></div>
<div id="products-${view}-area" class="row products-list ${top_margin} ${left_margin}"></div>
`);
}
get_query_filters() {
const filters = frappe.utils.get_query_params();
let {field_filters, attribute_filters} = filters;
let { field_filters, attribute_filters } = filters;
field_filters = field_filters ? JSON.parse(field_filters) : {};
attribute_filters = attribute_filters ? JSON.parse(attribute_filters) : {};
@@ -142,7 +141,7 @@ erpnext.ProductView = class {
attribute_filters: attribute_filters,
item_group: this.item_group,
start: filters.start || null,
from_filters: this.from_filters || false
from_filters: this.from_filters || false,
};
}
@@ -161,18 +160,18 @@ erpnext.ProductView = class {
let page_length = settings.products_per_page || 0;
let prev_disable = start > 0 ? "" : "disabled";
let next_disable = (this.product_count > page_length) ? "" : "disabled";
let next_disable = this.product_count > page_length ? "" : "disabled";
paging_html += `
<button class="btn btn-default btn-prev" data-start="${ start - page_length }"
<button class="btn btn-default btn-prev" data-start="${start - page_length}"
style="float: left" ${prev_disable}>
${ __("Prev") }
${__("Prev")}
</button>`;
paging_html += `
<button class="btn btn-default btn-next" data-start="${ start + page_length }"
<button class="btn btn-default btn-next" data-start="${start + page_length}"
${next_disable}>
${ __("Next") }
${__("Next")}
</button>
`;
@@ -209,14 +208,14 @@ erpnext.ProductView = class {
render_view_toggler() {
$(".toolbar").append(`<div class="toggle-container col-4 p-0"></div>`);
["btn-list-view", "btn-grid-view"].forEach(view => {
["btn-list-view", "btn-grid-view"].forEach((view) => {
let icon = view === "btn-list-view" ? "list" : "image-view";
$(".toggle-container").append(`
<div class="form-group mb-0" id="toggle-view">
<button id="${ icon }" class="btn ${ view } mr-2">
<button id="${icon}" class="btn ${view} mr-2">
<span>
<svg class="icon icon-md">
<use href="#icon-${ icon }"></use>
<use href="#icon-${icon}"></use>
</svg>
</span>
</button>
@@ -226,22 +225,22 @@ erpnext.ProductView = class {
}
bind_view_toggler_actions() {
$("#list").click(function() {
$("#list").click(function () {
let $btn = $(this);
$btn.removeClass('btn-primary');
$btn.addClass('btn-primary');
$(".btn-grid-view").removeClass('btn-primary');
$btn.removeClass("btn-primary");
$btn.addClass("btn-primary");
$(".btn-grid-view").removeClass("btn-primary");
$("#products-grid-area").addClass("hidden");
$("#products-list-area").removeClass("hidden");
localStorage.setItem("product_view", "List View");
});
$("#image-view").click(function() {
$("#image-view").click(function () {
let $btn = $(this);
$btn.removeClass('btn-primary');
$btn.addClass('btn-primary');
$(".btn-list-view").removeClass('btn-primary');
$btn.removeClass("btn-primary");
$btn.addClass("btn-primary");
$(".btn-list-view").removeClass("btn-primary");
$("#products-list-area").addClass("hidden");
$("#products-grid-area").removeClass("hidden");
@@ -251,26 +250,26 @@ erpnext.ProductView = class {
set_view_state() {
if (this.preference === "List View") {
$("#list").addClass('btn-primary');
$("#image-view").removeClass('btn-primary');
$("#list").addClass("btn-primary");
$("#image-view").removeClass("btn-primary");
} else {
$("#image-view").addClass('btn-primary');
$("#list").removeClass('btn-primary');
$("#image-view").addClass("btn-primary");
$("#list").removeClass("btn-primary");
}
}
bind_paging_action() {
let me = this;
$('.btn-prev, .btn-next').click((e) => {
$(".btn-prev, .btn-next").click((e) => {
const $btn = $(e.target);
me.from_filters = false;
$btn.prop('disabled', true);
const start = $btn.data('start');
$btn.prop("disabled", true);
const start = $btn.data("start");
let query_params = frappe.utils.get_query_params();
query_params.start = start;
let path = window.location.pathname + '?' + frappe.utils.get_url_from_dict(query_params);
let path = window.location.pathname + "?" + frappe.utils.get_url_from_dict(query_params);
window.location.href = path;
});
}
@@ -292,24 +291,24 @@ erpnext.ProductView = class {
if (filter_data) {
$("#product-filters").append(`
<div id="discount-filters" class="mb-4 filter-block pb-5">
<div class="filter-label mb-3">${ __("Discounts") }</div>
<div class="filter-label mb-3">${__("Discounts")}</div>
</div>
`);
let html = `<div class="filter-options">`;
filter_data.forEach(filter => {
filter_data.forEach((filter) => {
html += `
<div class="checkbox">
<label data-value="${ filter[0] }">
<label data-value="${filter[0]}">
<input type="radio"
class="product-filter discount-filter"
name="discount" id="${ filter[0] }"
name="discount" id="${filter[0]}"
data-filter-name="discount"
data-filter-value="${ filter[0] }"
data-filter-value="${filter[0]}"
style="width: 14px !important"
>
<span class="label-area" for="${ filter[0] }">
${ filter[1] }
<span class="label-area" for="${filter[0]}">
${filter[1]}
</span>
</label>
</div>
@@ -330,23 +329,23 @@ erpnext.ProductView = class {
if (field_filters && field_filters["discount"]) {
const values = field_filters["discount"];
const selector = values.map(value => {
return `input[data-filter-name="discount"][data-filter-value="${value}"]`;
}).join(',');
$(selector).prop('checked', true);
const selector = values
.map((value) => {
return `input[data-filter-name="discount"][data-filter-value="${value}"]`;
})
.join(",");
$(selector).prop("checked", true);
this.field_filters = field_filters;
}
}
bind_discount_filter_action() {
let me = this;
$('.discount-filter').on('change', (e) => {
$(".discount-filter").on("change", (e) => {
const $checkbox = $(e.target);
const is_checked = $checkbox.is(':checked');
const is_checked = $checkbox.is(":checked");
const {
filterValue: filter_value
} = $checkbox.data();
const { filterValue: filter_value } = $checkbox.data();
delete this.field_filters["discount"];
@@ -368,36 +367,32 @@ erpnext.ProductView = class {
this.field_filters = {};
this.attribute_filters = {};
$('.product-filter').on('change', (e) => {
$(".product-filter").on("change", (e) => {
me.from_filters = true;
const $checkbox = $(e.target);
const is_checked = $checkbox.is(':checked');
const is_checked = $checkbox.is(":checked");
if ($checkbox.is('.attribute-filter')) {
const {
attributeName: attribute_name,
attributeValue: attribute_value
} = $checkbox.data();
if ($checkbox.is(".attribute-filter")) {
const { attributeName: attribute_name, attributeValue: attribute_value } = $checkbox.data();
if (is_checked) {
this.attribute_filters[attribute_name] = this.attribute_filters[attribute_name] || [];
this.attribute_filters[attribute_name].push(attribute_value);
} else {
this.attribute_filters[attribute_name] = this.attribute_filters[attribute_name] || [];
this.attribute_filters[attribute_name] = this.attribute_filters[attribute_name].filter(v => v !== attribute_value);
this.attribute_filters[attribute_name] = this.attribute_filters[attribute_name].filter(
(v) => v !== attribute_value
);
}
if (this.attribute_filters[attribute_name].length === 0) {
delete this.attribute_filters[attribute_name];
}
} else if ($checkbox.is('.field-filter') || $checkbox.is('.discount-filter')) {
const {
filterName: filter_name,
filterValue: filter_value
} = $checkbox.data();
} else if ($checkbox.is(".field-filter") || $checkbox.is(".discount-filter")) {
const { filterName: filter_name, filterValue: filter_value } = $checkbox.data();
if ($checkbox.is('.discount-filter')) {
if ($checkbox.is(".discount-filter")) {
// clear previous discount filter to accomodate new
delete this.field_filters["discount"];
}
@@ -408,7 +403,9 @@ erpnext.ProductView = class {
}
} else {
this.field_filters[filter_name] = this.field_filters[filter_name] || [];
this.field_filters[filter_name] = this.field_filters[filter_name].filter(v => v !== filter_value);
this.field_filters[filter_name] = this.field_filters[filter_name].filter(
(v) => v !== filter_value
);
}
if (this.field_filters[filter_name].length === 0) {
@@ -420,20 +417,23 @@ erpnext.ProductView = class {
});
// bind filter lookup input box
$('.filter-lookup-input').on('keydown', frappe.utils.debounce((e) => {
const $input = $(e.target);
const keyword = ($input.val() || '').toLowerCase();
const $filter_options = $input.next('.filter-options');
$(".filter-lookup-input").on(
"keydown",
frappe.utils.debounce((e) => {
const $input = $(e.target);
const keyword = ($input.val() || "").toLowerCase();
const $filter_options = $input.next(".filter-options");
$filter_options.find('.filter-lookup-wrapper').show();
$filter_options.find('.filter-lookup-wrapper').each((i, el) => {
const $el = $(el);
const value = $el.data('value').toLowerCase();
if (!value.includes(keyword)) {
$el.hide();
}
});
}, 300));
$filter_options.find(".filter-lookup-wrapper").show();
$filter_options.find(".filter-lookup-wrapper").each((i, el) => {
const $el = $(el);
const value = $el.data("value").toLowerCase();
if (!value.includes(keyword)) {
$el.hide();
}
});
}, 300)
);
}
change_route_with_filters() {
@@ -449,26 +449,28 @@ erpnext.ProductView = class {
field_filters: JSON.stringify(this.if_key_exists(this.field_filters)),
attribute_filters: JSON.stringify(this.if_key_exists(this.attribute_filters)),
});
window.history.pushState('filters', '', `${location.pathname}?` + query_string);
window.history.pushState("filters", "", `${location.pathname}?` + query_string);
$('.page_content input').prop('disabled', true);
$(".page_content input").prop("disabled", true);
this.make(true);
$('.page_content input').prop('disabled', false);
$(".page_content input").prop("disabled", false);
}
restore_filters_state() {
const filters = frappe.utils.get_query_params();
let {field_filters, attribute_filters} = filters;
let { field_filters, attribute_filters } = filters;
if (field_filters) {
field_filters = JSON.parse(field_filters);
for (let fieldname in field_filters) {
const values = field_filters[fieldname];
const selector = values.map(value => {
return `input[data-filter-name="${fieldname}"][data-filter-value="${value}"]`;
}).join(',');
$(selector).prop('checked', true);
const selector = values
.map((value) => {
return `input[data-filter-name="${fieldname}"][data-filter-value="${value}"]`;
})
.join(",");
$(selector).prop("checked", true);
}
this.field_filters = field_filters;
}
@@ -476,16 +478,18 @@ erpnext.ProductView = class {
attribute_filters = JSON.parse(attribute_filters);
for (let attribute in attribute_filters) {
const values = attribute_filters[attribute];
const selector = values.map(value => {
return `input[data-attribute-name="${attribute}"][data-attribute-value="${value}"]`;
}).join(',');
$(selector).prop('checked', true);
const selector = values
.map((value) => {
return `input[data-attribute-name="${attribute}"][data-attribute-value="${value}"]`;
})
.join(",");
$(selector).prop("checked", true);
}
this.attribute_filters = attribute_filters;
}
}
render_no_products_section(error=false) {
render_no_products_section(error = false) {
let error_section = `
<div class="mt-4 w-100 alert alert-error font-md">
Something went wrong. Please refresh or contact us.
@@ -496,7 +500,7 @@ erpnext.ProductView = class {
<div class="cart-empty-state">
<img src="/assets/erpnext/images/ui-states/cart-empty-state.png" alt="Empty Cart">
</div>
<div class="cart-empty-message mt-4">${ __('No products found') }</p>
<div class="cart-empty-message mt-4">${__("No products found")}</p>
</div>
`;
@@ -509,11 +513,11 @@ erpnext.ProductView = class {
<div class="sub-category-container scroll-categories">
`;
categories.forEach(category => {
categories.forEach((category) => {
sub_group_html += `
<a href="/${ category.route || '#' }" style="text-decoration: none;">
<a href="/${category.route || "#"}" style="text-decoration: none;">
<div class="category-pill">
${ category.name }
${category.name}
</div>
</a>
`;
@@ -545,4 +549,4 @@ erpnext.ProductView = class {
}
return exists ? obj : undefined;
}
};
};