UA-Fediland/pixelfed
2
0
Fork 0
mirror of https://github.com/pixelfed/pixelfed.git synced 2024-11-29 17:53:16 +00:00
Code Issues Projects Releases Packages Wiki Activity

Update NotificationCard, fix loading bug

Browse source
This commit is contained in:
Daniel Supernault 2021-06-01 21:01:00 -06:00
parent 4662afd248
commit 69567e19df
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7
1 changed files with 5 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
resources/assets/js/components/NotificationCard.vue
View file

@ -2,12 +2,12 @@
<div> <div>
<transition name="fade"> <transition name="fade">
<div class="card notification-card shadow-none border"> <div class="card notification-card shadow-none border">
<div class="card-body loader text-center" style="height: 200px;"> <div v-if="loading" class="card-body loader text-center" style="height: 240px;">
<div class="spinner-border" role="status"> <div class="spinner-border" role="status">
<span class="sr-only">Loading...</span> <span class="sr-only">Loading...</span>
</div> </div>
</div> </div>
<div v-if="notifications.length > 0" class="card-body px-0 py-0 contents" style="max-height: 240px; overflow-y: scroll;"> <div v-if="!loading && notifications.length > 0" class="card-body px-0 py-0 contents" style="height: 240px; overflow-y: scroll;">
<div v-if="profile.locked" class="media align-items-center mt-n2 px-3 py-2 border-bottom border-lighter bg-light cursor-pointer" @click="redirect('/account/follow-requests')"> <div v-if="profile.locked" class="media align-items-center mt-n2 px-3 py-2 border-bottom border-lighter bg-light cursor-pointer" @click="redirect('/account/follow-requests')">
<div class="media-body font-weight-light pt-2 small d-flex align-items-center justify-content-between"> <div class="media-body font-weight-light pt-2 small d-flex align-items-center justify-content-between">
<p class="mb-0 text-lighter"><i class="fas fa-cog text-light"></i></p> <p class="mb-0 text-lighter"><i class="fas fa-cog text-light"></i></p>
@ -86,7 +86,7 @@
<p class="mb-0 small font-weight-bold">0 Notifications!</p> <p class="mb-0 small font-weight-bold">0 Notifications!</p>
</div> </div>
</div> </div>
<div v-else class="card-body px-0 py-0" style="max-height: 240px;"> <div v-if="!loading && !notifications.length" class="card-body px-0 py-0" style="height: 240px;">
<div class="text-lighter text-center py-3"> <div class="text-lighter text-center py-3">
<p class="mb-0"><i class="fas fa-inbox fa-3x"></i></p> <p class="mb-0"><i class="fas fa-inbox fa-3x"></i></p>
<p class="mb-0 small font-weight-bold">No notifications yet</p> <p class="mb-0 small font-weight-bold">No notifications yet</p>
@ -103,6 +103,7 @@
export default { export default {
data() { data() {
return { return {
loading: true,
notifications: {}, notifications: {},
notificationCursor: 2, notificationCursor: 2,
notificationMaxId: 0, notificationMaxId: 0,
@ -133,8 +134,7 @@
let ids = res.data.map(n => n.id); let ids = res.data.map(n => n.id);
this.notificationMaxId = Math.min(...ids); this.notificationMaxId = Math.min(...ids);
this.notifications = data; this.notifications = data;
$('.notification-card .loader').addClass('d-none'); this.loading = false;
$('.notification-card .contents').removeClass('d-none');
//this.notificationPoll(); //this.notificationPoll();
}); });
}, },