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

Merge pull request #15305 from frappe/hub-multiuser

Browse Source 
feat: Add skeleton to Home and Sidebar
This commit is contained in:
Faris Ansari 2018-09-03 19:40:22 +05:30 committed by GitHub
commit 74a32e6ffe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
erpnext/public/js/hub/Sidebar.vue
View File

@ -9,7 +9,10 @@
<li class="hub-sidebar-item is-title bold text-muted">
{{ __('Categories') }}
</li>
<li class="hub-sidebar-item" v-for="category in categories" :key="category.label" v-route="category.route">
<li v-if="show_skeleton" class="hub-skeleton hub-sidebar-item" v-for="(c, $index) in [1, 2, 3, 4, 5, 6, 7]" :key="$index">
Category
</li>
<li class="hub-sidebar-item" v-else v-for="category in categories" :key="category.label" v-route="category.route">
{{ category.label }}
</li>
</ul>
@ -57,11 +60,14 @@ export default {
},
],
categories: [],
show_skeleton: true
}
},
created() {
this.get_categories()
.then(categories => {
this.show_skeleton = false;
this.categories = categories.map(c => {
return {
label: __(c.name),

16
erpnext/public/js/hub/pages/Home.vue
View File

@ -9,7 +9,18 @@
v-model="search_value"
/>
<div v-for="section in sections" :key="section.title">
<div v-if="show_skeleton">
<section-header>
<h4 class="hub-skeleton">Explore Explore Explore</h4>
</section-header>
<div class="row">
<div class="col-md-3 col-sm-4 col-xs-6 hub-card-container" v-for="(f, $index) in [1, 2, 3, 4, 5, 6, 7]" :key="$index">
<div class="hub-skeleton" style="height: 262px; width: 100%; margin-bottom: 25px;"></div>
</div>
</div>
</div>
<div v-else v-for="section in sections" :key="section.title">
<section-header>
<h4>{{ section.title }}</h4>
@ -36,6 +47,7 @@ export default {
search_value: '',
sections: [],
show_skeleton: true,
// Constants
search_placeholder: __('Search for anything ...'),
@ -52,6 +64,8 @@ export default {
country: frappe.defaults.get_user_default('country')
})
.then((data) => {
this.show_skeleton = false;
this.sections.push({
title: __('Explore'),
items: data.random_items