Shiloh/brotherton-erpnext
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[feat] new component: ItemPublishDialog

Browse Source
This commit is contained in:
Prateeksha Singh 2018-08-20 14:02:33 +05:30
parent 4ce54b0011
commit 6faffa5007
3 changed files with 118 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
erpnext/public/js/hub/components/item_publish_dialog.js Normal file
View File

@ -0,0 +1,39 @@
function ItemPublishDialog(primary_action, secondary_action) {
let dialog = new frappe.ui.Dialog({
title: __('Edit Publishing Details'),
fields: [
{
"label": "Item Code",
"fieldname": "item_code",
"fieldtype": "Data",
"read_only": 1
},
{
"label": "Hub Category",
"fieldname": "hub_category",
"fieldtype": "Autocomplete",
"options": ["Agriculture", "Books", "Chemicals", "Clothing",
"Electrical", "Electronics", "Energy", "Fashion", "Food and Beverage",
"Health", "Home", "Industrial", "Machinery", "Packaging and Printing",
"Sports", "Transportation"
],
"reqd": 1
},
{
"label": "Images",
"fieldname": "image_list",
"fieldtype": "MultiSelect",
"options": [],
"reqd": 1
}
],
primary_action_label: primary_action.label || __('Set Details'),
primary_action: primary_action.fn,
secondary_action: secondary_action.fn
});
return dialog;
}
export {
ItemPublishDialog
}

36
erpnext/public/js/hub/components/publishing_area.js Normal file
View File

@ -0,0 +1,36 @@
function get_publishing_header() {
const title_html = `<h5>${__('Select Products to Publish')}</h5>`;
const subtitle_html = `<p class="text-muted">
${__(`Only products with an image, description and category can be published.
Please update them if an item in your inventory does not appear.`)}
</p>`;
const publish_button_html = `<button class="btn btn-primary btn-sm publish-items" disabled>
<i class="visible-xs octicon octicon-check"></i>
<span class="hidden-xs">${__('Publish')}</span>
</button>`;
return $(`
<div class="publish-area empty">
<div class="flex justify-between align-flex-end">
${title_html}
${publish_button_html}
</div>
<div class="empty-items-container flex align-center flex-column justify-center">
<p class="text-muted">${__('No Items Selected')}</p>
</div>
<div class="row hub-items-container selected-items"></div>
</div>
<div class='subpage-title flex'>
<div>
${subtitle_html}
</div>
</div>
`);
}
export {
get_publishing_header
}

149
erpnext/public/js/hub/pages/publish.js
View File

@ -2,12 +2,13 @@ import SubPage from './subpage';
import { get_item_card_container_html } from '../components/items_container'; import { get_item_card_container_html } from '../components/items_container';
import { get_local_item_card_html } from '../components/item_card'; import { get_local_item_card_html } from '../components/item_card';
import { make_search_bar } from '../components/search_bar'; import { make_search_bar } from '../components/search_bar';
import { get_publishing_header } from '../components/publishing_area';
import { ItemPublishDialog } from '../components/item_publish_dialog';
erpnext.hub.Publish = class Publish extends SubPage { erpnext.hub.Publish = class Publish extends SubPage {
make_wrapper() { make_wrapper() {
super.make_wrapper(); super.make_wrapper();
this.items_to_publish = {}; this.items_data_to_publish = {};
this.unpublished_items = []; this.unpublished_items = [];
this.fetched_items = []; this.fetched_items = [];
this.fetched_items_dict = {}; this.fetched_items_dict = {};
@ -41,7 +42,7 @@ erpnext.hub.Publish = class Publish extends SubPage {
make_publish_ready_state() { make_publish_ready_state() {
this.$wrapper.empty(); this.$wrapper.empty();
this.$wrapper.append(this.get_publishing_header()); this.$wrapper.append(get_publishing_header());
make_search_bar({ make_search_bar({
wrapper: this.$wrapper, wrapper: this.$wrapper,
@ -53,46 +54,15 @@ erpnext.hub.Publish = class Publish extends SubPage {
}); });
this.setup_publishing_events(); this.setup_publishing_events();
this.show_last_sync_message();
this.get_items_and_render();
}
show_last_sync_message() {
if(hub.settings.last_sync_datetime) { if(hub.settings.last_sync_datetime) {
this.show_message(`Last sync was <a href="#marketplace/profile">${comment_when(hub.settings.last_sync_datetime)}</a>. this.show_message(`Last sync was <a href="#marketplace/profile">${comment_when(hub.settings.last_sync_datetime)}</a>.
<a href="#marketplace/my-products">See your Published Products</a>.`); <a href="#marketplace/my-products">See your Published Products</a>.`);
} }
this.get_items_and_render();
}
get_publishing_header() {
const title_html = `<h5>${__('Select Products to Publish')}</h5>`;
const subtitle_html = `<p class="text-muted">
${__(`Only products with an image, description and category can be published.
Please update them if an item in your inventory does not appear.`)}
</p>`;
const publish_button_html = `<button class="btn btn-primary btn-sm publish-items" disabled>
<i class="visible-xs octicon octicon-check"></i>
<span class="hidden-xs">${__('Publish')}</span>
</button>`;
return $(`
<div class="publish-area empty">
<div class="flex justify-between align-flex-end">
${title_html}
${publish_button_html}
</div>
<div class="empty-items-container flex align-center flex-column justify-center">
<p class="text-muted">${__('No Items Selected')}</p>
</div>
<div class="row hub-items-container selected-items"></div>
</div>
<div class='subpage-title flex'>
<div>
${subtitle_html}
</div>
</div>
`);
} }
setup_publishing_events() { setup_publishing_events() {
@ -118,69 +88,54 @@ erpnext.hub.Publish = class Publish extends SubPage {
} }
make_publishing_dialog() { make_publishing_dialog() {
this.publishing_dialog = new frappe.ui.Dialog({ this.item_publish_dialog = ItemPublishDialog(
title: __('Edit Publishing Details'), {
fields: [ fn: (values) => {
{ this.add_item_to_publish(values);
"label": "Item Code", this.item_publish_dialog.hide();
"fieldname": "item_code",
"fieldtype": "Data",
"read_only": 1
},
{
"label": "Hub Category",
"fieldname": "hub_category",
"fieldtype": "Autocomplete",
"options": ["Agriculture", "Books", "Chemicals", "Clothing",
"Electrical", "Electronics", "Energy", "Fashion", "Food and Beverage",
"Health", "Home", "Industrial", "Machinery", "Packaging and Printing",
"Sports", "Transportation"
],
"reqd": 1
},
{
"label": "Images",
"fieldname": "image_list",
"fieldtype": "MultiSelect",
"options": [],
"reqd": 1
} }
],
primary_action_label: __('Set Details'),
primary_action: () => {
const values = this.publishing_dialog.get_values(true);
this.items_to_publish[values.item_code] = values;
this.$current_selected_card.appendTo(this.selected_items_container);
this.$current_selected_card.find('.hub-card').toggleClass('active');
this.update_selected_items_count();
this.publishing_dialog.hide();
}, },
secondary_action: () => { {
const values = this.publishing_dialog.get_values(true); fn: () => {
this.items_to_publish[values.item_code] = values; const values = this.item_publish_dialog.get_values(true);
this.update_items_data_to_publish(values);
}
} }
}); );
}
add_item_to_publish(values) {
this.update_items_data_to_publish(values);
this.select_current_card()
}
update_items_data_to_publish(values) {
this.items_data_to_publish[values.item_code] = values;
}
select_current_card() {
this.$current_selected_card.appendTo(this.selected_items_container);
this.$current_selected_card.find('.hub-card').toggleClass('active');
this.update_selected_items_count();
} }
show_publishing_dialog_for_item(item_code) { show_publishing_dialog_for_item(item_code) {
let item_data = this.items_to_publish[item_code]; let item_data = this.items_data_to_publish[item_code];
if(!item_data) { item_data = { item_code }; }; if(!item_data) { item_data = { item_code }; };
this.publishing_dialog.clear(); this.item_publish_dialog.clear();
const item_doc = this.fetched_items_dict[item_code]; const item_doc = this.fetched_items_dict[item_code];
if(item_doc) { if(item_doc) {
this.publishing_dialog.fields_dict.image_list.set_data( this.item_publish_dialog.fields_dict.image_list.set_data(
item_doc.attachments.map(attachment => attachment.file_url) item_doc.attachments.map(attachment => attachment.file_url)
); );
} }
this.publishing_dialog.set_values(item_data); this.item_publish_dialog.set_values(item_data);
this.publishing_dialog.show(); this.item_publish_dialog.show();
} }
update_selected_items_count() { update_selected_items_count() {
@ -204,14 +159,6 @@ erpnext.hub.Publish = class Publish extends SubPage {
this.$wrapper.find('.publish-area').toggleClass('filled', !is_empty); this.$wrapper.find('.publish-area').toggleClass('filled', !is_empty);
} }
add_item_to_publish() {
//
}
remove_item_from_publish() {
//
}
make_publish_in_progress_state() { make_publish_in_progress_state() {
this.$wrapper.empty(); this.$wrapper.empty();
@ -238,8 +185,8 @@ erpnext.hub.Publish = class Publish extends SubPage {
} }
show_publish_progress() { show_publish_progress() {
const items_to_publish = this.items_to_publish.length const items_to_publish = this.items_data_to_publish.length
? this.items_to_publish ? this.items_data_to_publish
: JSON.parse(hub.settings.custom_data); : JSON.parse(hub.settings.custom_data);
const $publish_progress = $(`<div class="sync-progress"> const $publish_progress = $(`<div class="sync-progress">
@ -302,17 +249,7 @@ erpnext.hub.Publish = class Publish extends SubPage {
item_codes_to_publish.push($(this).attr("data-id")); item_codes_to_publish.push($(this).attr("data-id"));
}); });
// this.unpublished_items = this.fetched_items.filter(item => { const items_data_to_publish = item_codes_to_publish.map(item_code => this.items_data_to_publish[item_code])
// return !item_codes_to_publish.includes(item.item_code);
// });
// const items_to_publish = this.fetched_items.filter(item => {
// return item_codes_to_publish.includes(item.item_code);
// });
// this.items_to_publish = items_to_publish;
const items_data_to_publish = item_codes_to_publish.map(item_code => this.items_to_publish[item_code])
return frappe.call( return frappe.call(
'erpnext.hub_node.api.publish_selected_items', 'erpnext.hub_node.api.publish_selected_items',