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

[hub][init] add publish items page

Browse Source
This commit is contained in:
Prateeksha Singh 2018-07-25 20:02:12 +05:30
parent bc8caefc19
commit cf2d2a5c75
3 changed files with 133 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
erpnext/hub_node/__init__.py
View File

@ -31,12 +31,18 @@ def get_list(doctype, start=0, limit=20, fields=["*"], filters="{}", order_by=No
return listing return listing
#### LOCAL ITEMS
@frappe.whitelist() @frappe.whitelist()
def get_valid_items(): def get_valid_items():
items = frappe.get_list('Item') items = frappe.get_list('Item', fields=["*"])
return items valid_items = filter(lambda x: x.image and x.description, items)
def attach_source_type(item):
item.source_type = "local"
return item
valid_items = map(lambda x: attach_source_type(x), valid_items)
return valid_items
@frappe.whitelist() @frappe.whitelist()
def get_item_favourites(start=0, limit=20, fields=["*"], order_by=None): def get_item_favourites(start=0, limit=20, fields=["*"], order_by=None):

180
erpnext/public/js/hub/hub_listing.js
View File

@ -26,6 +26,8 @@ erpnext.hub.Marketplace = class Marketplace {
const $target = $(e.currentTarget); const $target = $(e.currentTarget);
const route = $target.data().route; const route = $target.data().route;
frappe.set_route(route); frappe.set_route(route);
e.stopPropagation();
}); });
} }
@ -43,6 +45,12 @@ erpnext.hub.Marketplace = class Marketplace {
<li class="hub-sidebar-item text-muted" data-route="marketplace/register"> <li class="hub-sidebar-item text-muted" data-route="marketplace/register">
${__('Become a seller')} ${__('Become a seller')}
</li> </li>
<li class="hub-sidebar-item text-muted" data-route="marketplace/profile">
${__('Your Profile')}
</li>
<li class="hub-sidebar-item text-muted" data-route="marketplace/publish">
${__('Publish Products')}
</li>
</ul> </ul>
`); `);
@ -60,6 +68,9 @@ erpnext.hub.Marketplace = class Marketplace {
`<li class="hub-sidebar-item active" data-route="marketplace/home"> `<li class="hub-sidebar-item active" data-route="marketplace/home">
${__('All')} ${__('All')}
</li>`, </li>`,
`<li class="hub-sidebar-item" data-route="marketplace/published">
${__('Your Products')}
</li>`,
...categories.map(category => ` ...categories.map(category => `
<li class="hub-sidebar-item text-muted" data-route="marketplace/category/${category}"> <li class="hub-sidebar-item text-muted" data-route="marketplace/category/${category}">
${__(category)} ${__(category)}
@ -119,6 +130,10 @@ erpnext.hub.Marketplace = class Marketplace {
this.subpages.register = new erpnext.hub.Register(this.$body); this.subpages.register = new erpnext.hub.Register(this.$body);
} }
if (route[1] === 'publish' && !this.subpages.publish) {
this.subpages.publish = new erpnext.hub.Publish(this.$body);
}
if (!Object.keys(this.subpages).includes(route[1])) { if (!Object.keys(this.subpages).includes(route[1])) {
frappe.show_not_found(); frappe.show_not_found();
@ -217,7 +232,7 @@ erpnext.hub.Favourites = class Favourites extends SubPage {
render(items) { render(items) {
const html = get_item_card_container_html(items, __('Favourites')); const html = get_item_card_container_html(items, __('Favourites'));
this.$wrapper.html(html) this.$wrapper.append(html)
} }
} }
@ -241,7 +256,7 @@ erpnext.hub.Category = class Category extends SubPage {
render(items) { render(items) {
const html = get_item_card_container_html(items, __(this.category)); const html = get_item_card_container_html(items, __(this.category));
this.$wrapper.html(html) this.$wrapper.append(html)
} }
} }
@ -551,77 +566,42 @@ erpnext.hub.Register = class Register extends SubPage {
}); });
}); });
} }
make_form() {
const form_html = `<form class="register-form">
<div class="register-title margin-bottom margin-top">
<b>Become a Seller</b>
</div>
<div class="flex">
<div style="flex: 0 0 140px" class="margin-right">
<div>
<div class="missing-image attach-missing-image">
<i class="octicon octicon-device-camera"></i>
</div><div class="img-container" style="display: none;">
<img class="img-responsive attach-image-display">
<div class="img-overlay">
<span class="overlay-text">Change</span>
</div>
</div>
</div>
</div>
<div style="flex: 1; font-size: 12px;">
<div class="form-group">
<input class="form-control" placeholder="Company" name="company" required="required">
</div>
<div class="form-group">
<input class="form-control" placeholder="Country" name="country" required="required">
</div>
<div class="form-group">
<input class="form-control" placeholder="Company Email" name="company_email" required="required">
</div>
<div class="form-group">
<textarea class="form-control" placeholder="About Your Company" name="company_description" required="required">
</textarea>
</div>
<div class="text-right">
<button type="submit" class="btn btn-primary btn-sm">${__('Submit')}</button>
</div>
</div>
</div>
</form>`;
this.$form_container.append(form_html);
this.$form_container.on('submit', (e) => {
e.preventDefault();
const formValues = this.$form_container.find('form').serializeArray();
console.log(formValues);
})
}
} }
erpnext.hub.PublishItems = class PublishItems extends SubPage { erpnext.hub.Publish = class Publish extends SubPage {
constructor(parent) {
super(parent);
// this.selected_items = [];
}
refresh() { refresh() {
this.get_favourites() this.get_valid_items()
.then(r => { .then(r => {
this.render(r.message); this.render(r.message);
}); });
} }
render(items) { render(items) {
const html = get_item_card_container_html(items, __(this.category)); const html = get_item_card_container_html(
this.$wrapper.html(html); items,
__('Select Products to Publish'),
__(`Only products with an image and description can be published.
Please update them if an item in your inventory does not appear.`),
`<div class="hub-search-container">
<input type="text" class="form-control" placeholder="Search Items">
</div>`
);
const container = $(html);
container.addClass('static').on('click', '.hub-card', (e) => {
const $target = $(e.currentTarget);
$target.toggleClass('active');
});
this.$wrapper.append(container);
} }
get_valid_items() { get_valid_items() {
@ -629,17 +609,23 @@ erpnext.hub.PublishItems = class PublishItems extends SubPage {
} }
} }
function get_item_card_container_html(items, title) { function get_item_card_container_html(items, title, subtitle='', search_html='') {
const html = (items || []).map(item => get_item_card_html(item)).join(''); const items_html = (items || []).map(item => get_item_card_html(item)).join('');
return ` const html = `<div class="row hub-card-container">
<div class="row hub-card-container"> <div class="col-md-12 margin-bottom">
<div class="col-md-12 margin-bottom"> <b>${title}</b>
<b>${title}</b>
</div> <p class="text-muted">${subtitle}</p>
${html}
${search_html}
</div> </div>
`;
${items_html}
</div>`;
return html;
} }
function get_item_card_html(item) { function get_item_card_html(item) {
@ -648,8 +634,8 @@ function get_item_card_html(item) {
const img_url = item.image; const img_url = item.image;
const company_name = item.company_name; const company_name = item.company_name;
const route = `marketplace/item/${item.hub_item_code}`;
// Subtitle
let subtitle = [comment_when(item.creation)]; let subtitle = [comment_when(item.creation)];
const rating = get_rating(item); const rating = get_rating(item);
if (rating > 0) { if (rating > 0) {
@ -660,16 +646,36 @@ function get_item_card_html(item) {
let dot_spacer = '<span aria-hidden="true"> · </span>'; let dot_spacer = '<span aria-hidden="true"> · </span>';
subtitle = subtitle.join(dot_spacer); subtitle = subtitle.join(dot_spacer);
// Decide item link
const isLocal = item.source_type === "local";
const route = !isLocal
? `marketplace/item/${item.hub_item_code}`
: `Form/Item/${item.item_name}`;
const card_route = isLocal ? '' : `data-route='${route}'`;
const show_local_item_button = isLocal
? `<div class="overlay button-overlay" data-route='${route}' onclick="event.preventDefault();">
<button class="btn btn-default zoom-view">
<i class="octicon octicon-eye"></i>
</button>
</div>`
: '';
const item_html = ` const item_html = `
<div class="col-md-3 col-sm-4 col-xs-6"> <div class="col-md-3 col-sm-4 col-xs-6">
<div class="hub-card" data-route="${route}"> <div class="hub-card" ${card_route}>
<div class="hub-card-header"> <div class="hub-card-header">
<div class="hub-card-title ellipsis bold">${title}</div> <div class="title">
<div class="hub-card-subtitle ellipsis text-muted">${subtitle}</div> <div class="hub-card-title ellipsis bold">${title}</div>
<div class="hub-card-subtitle ellipsis text-muted">${subtitle}</div>
</div>
<i class="octicon octicon-check text-success"></i>
</div> </div>
<div class="hub-card-body"> <div class="hub-card-body">
<img class="hub-card-image ${item.image ? '' : 'no-image'}" src="${img_url}" /> <img class="hub-card-image ${item.image ? '' : 'no-image'}" src="${img_url}" />
<div class="hub-card-overlay"></div> <div class="overlay hub-card-overlay"></div>
${show_local_item_button}
</div> </div>
</div> </div>
</div> </div>
@ -904,23 +910,7 @@ erpnext.hub.HubListing = class HubListing extends frappe.views.BaseList {
} }
renderHeader() { renderHeader() {
return `<header class="level list-row-head text-muted small"> return ``;
<div class="level-left list-header-subject">
<div class="list-row-col list-subject level ">
<img title="Riadco%20Group" alt="Riadco Group" src="https://cdn.pbrd.co/images/HdaPxcg.png">
<span class="level-item">Products by Blah blah</span>
</div>
</div>
<div class="level-left checkbox-actions">
<div class="level list-subject">
<input class="level-item list-check-all hidden-xs" type="checkbox" title="${__("Select All")}">
<span class="level-item list-header-meta"></span>
</div>
</div>
<div class="level-right">
${''}
</div>
</header>`;
} }
get_image_html(encoded_name, src, alt_text) { get_image_html(encoded_name, src, alt_text) {

40
erpnext/public/less/hub.less
View File

@ -21,6 +21,16 @@ body[data-route^="marketplace/"] {
font-size: @text-medium; font-size: @text-medium;
} }
.btn-primary {
background-color: #89da28;
border-color: #61ca23;
}
.btn-primary:hover {
background-color: #61ca23;
border-color: #59b81c;
}
.hub-card { .hub-card {
border: 1px solid @border-color; border: 1px solid @border-color;
margin-bottom: 25px; margin-bottom: 25px;
@ -28,15 +38,33 @@ body[data-route^="marketplace/"] {
overflow: hidden; overflow: hidden;
cursor: pointer; cursor: pointer;
&:hover .hub-card-overlay { &:hover .overlay {
display: block; display: block;
} }
&.active {
.hub-card-header {
background-color: #f4ffe5;
}
.octicon-check {
display: inline;
}
}
} }
.hub-card-header { .hub-card-header {
padding: 12px 15px; padding: 12px 15px;
height: 60px; height: 60px;
border-bottom: 1px solid @border-color; border-bottom: 1px solid @border-color;
display: flex;
justify-content: space-between;
.octicon-check {
display: none;
font-size: 20px;
}
} }
.hub-card-body { .hub-card-body {
@ -44,15 +72,23 @@ body[data-route^="marketplace/"] {
height: 200px; height: 200px;
} }
.hub-card-overlay { .overlay {
display: none; display: none;
position: absolute; position: absolute;
}
.hub-card-overlay {
top: 0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1);
} }
.button-overlay {
top: 155px;
left: 15px;
}
.hub-card-image { .hub-card-image {
min-width: 100%; min-width: 100%;
width: 100%; width: 100%;