fediport/pixelfed
2
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Update Profile component, add bookmark loader

Browse source
This commit is contained in:
Daniel Supernault 2020-06-13 00:32:41 -06:00
parent 4bee8397e0
commit c8d5edc9b2
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7
1 changed files with 40 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
resources/assets/js/components/Profile.vue
View file

@ -210,35 +210,46 @@
</infinite-loading>
</div>
<div v-if="mode == 'bookmarks'">
<div v-if="bookmarks.length" class="row">
<div class="col-4 p-1 p-sm-2 p-md-3" v-for="(s, index) in bookmarks">
<a class="card info-overlay card-md-border-0" :href="s.url">
<div class="square">
<span v-if="s.pf_type == 'photo:album'" class="float-right mr-3 post-icon"><i class="fas fa-images fa-2x"></i></span>
<span v-if="s.pf_type == 'video'" class="float-right mr-3 post-icon"><i class="fas fa-video fa-2x"></i></span>
<span v-if="s.pf_type == 'video:album'" class="float-right mr-3 post-icon"><i class="fas fa-film fa-2x"></i></span>
<div class="square-content" v-bind:style="previewBackground(s)">
</div>
<div class="info-overlay-text">
<h5 class="text-white m-auto font-weight-bold">
<span>
<span class="far fa-heart fa-lg p-2 d-flex-inline"></span>
<span class="d-flex-inline">{{s.favourites_count}}</span>
</span>
<span>
<span class="fas fa-retweet fa-lg p-2 d-flex-inline"></span>
<span class="d-flex-inline">{{s.reblogs_count}}</span>
</span>
</h5>
</div>
<div v-if="bookmarksLoading">
<div class="row">
<div class="col-12">
<div class="p-1 p-sm-2 p-md-3 d-flex justify-content-center align-items-center" style="height: 30vh;">
<img src="/img/pixelfed-icon-grey.svg" class="">
</div>
</a>
</div>
</div>
</div>
<div v-else class="col-12">
<div class="py-5 text-center text-muted">
<p><i class="fas fa-bookmark fa-2x"></i></p>
<p class="h2 font-weight-light pt-3">No saved bookmarks</p>
<div v-else>
<div v-if="bookmarks.length" class="row">
<div class="col-4 p-1 p-sm-2 p-md-3" v-for="(s, index) in bookmarks">
<a class="card info-overlay card-md-border-0" :href="s.url">
<div class="square">
<span v-if="s.pf_type == 'photo:album'" class="float-right mr-3 post-icon"><i class="fas fa-images fa-2x"></i></span>
<span v-if="s.pf_type == 'video'" class="float-right mr-3 post-icon"><i class="fas fa-video fa-2x"></i></span>
<span v-if="s.pf_type == 'video:album'" class="float-right mr-3 post-icon"><i class="fas fa-film fa-2x"></i></span>
<div class="square-content" v-bind:style="previewBackground(s)">
</div>
<div class="info-overlay-text">
<h5 class="text-white m-auto font-weight-bold">
<span>
<span class="far fa-heart fa-lg p-2 d-flex-inline"></span>
<span class="d-flex-inline">{{s.favourites_count}}</span>
</span>
<span>
<span class="fas fa-retweet fa-lg p-2 d-flex-inline"></span>
<span class="d-flex-inline">{{s.reblogs_count}}</span>
</span>
</h5>
</div>
</div>
</a>
</div>
</div>
<div v-else class="col-12">
<div class="py-5 text-center text-muted">
<p><i class="fas fa-bookmark fa-2x"></i></p>
<p class="h2 font-weight-light pt-3">No saved bookmarks</p>
</div>
</div>
</div>
</div>
@ -641,6 +652,7 @@
followingModalSearch: null,
followingModalSearchCache: null,
followingModalTab: 'following',
bookmarksLoading: true,
}
},
beforeMount() {
@ -789,7 +801,8 @@
if(this.mode == 'bookmarks' && this.bookmarks.length == 0) {
axios.get('/api/local/bookmarks')
.then(res => {
this.bookmarks = res.data
this.bookmarks = res.data;
this.bookmarksLoading = false;
});
}
if(this.mode == 'collections' && this.collections.length == 0) {