Show message when events list is empty

stable
Daniel García 2018-11-26 11:17:53 +01:00 committed by Alex Hermida
parent fe28ed9d53
commit e58825cca8
3 changed files with 37 additions and 28 deletions

View File

@ -1705,6 +1705,7 @@
"DISMISS_ALL": "Dismiss all", "DISMISS_ALL": "Dismiss all",
"VIEW_ALL": "View all", "VIEW_ALL": "View all",
"NO_NEW_EVENTS": "No new events", "NO_NEW_EVENTS": "No new events",
"NO_EVENTS_YET": "There are no events yet",
"ASSIGNED_YOU": "{{username}} assigned you to {{obj_name}}", "ASSIGNED_YOU": "{{username}} assigned you to {{obj_name}}",
"ADDED_YOU_AS_WATCHER": "{{username}} added you as watcher on {{obj_name}}", "ADDED_YOU_AS_WATCHER": "{{username}} added you as watcher on {{obj_name}}",
"ADDED_YOU_AS_MEMBER": "{{username}} added you as member", "ADDED_YOU_AS_MEMBER": "{{username}} added you as member",

View File

@ -5,36 +5,39 @@ section.notifications-list
src="/#{v}/svg/spinner-circle.svg" src="/#{v}/svg/spinner-circle.svg"
alt="Loading..." alt="Loading..."
) )
div( div(ng-if="!vm.loading" )
ng-if="!vm.loading" .empty(ng-if="!vm.notificationsList.length")
infinite-scroll="vm.loadNotifications()" span {{ 'EVENTS.NO_EVENTS_YET' | translate }}
infinite-scroll-disabled="vm.scrollDisabled" div(
ng-attr-infinite-scroll-container="vm.infiniteScrollContainer" ng-if="vm.notificationsList.length"
ng-attr-infinite-scroll-distance="vm.infiniteScrollDistance" infinite-scroll="vm.loadNotifications()"
) infinite-scroll-disabled="vm.scrollDisabled"
.entry( ng-attr-infinite-scroll-container="vm.infiniteScrollContainer"
tg-repeat="notification in vm.notificationsList" ng-attr-infinite-scroll-distance="vm.infiniteScrollDistance"
ng-class="{'new': !notification.get('read')}"
) )
.entry-avatar .entry(
// profile image with url tg-repeat="notification in vm.notificationsList"
.profile-picture(ng-if="notification.getIn(['data', 'user', 'is_profile_visible'])") ng-class="{'new': !notification.get('read')}"
a(tg-nav="user-profile:username=notification.getIn(['data', 'user', 'username'])", title="{{::notification.getIn(['data', 'user', 'name']) }}") )
.entry-avatar
// profile image with url
.profile-picture(ng-if="notification.getIn(['data', 'user', 'is_profile_visible'])")
a(tg-nav="user-profile:username=notification.getIn(['data', 'user', 'username'])", title="{{::notification.getIn(['data', 'user', 'name']) }}")
img(
tg-avatar="notification.getIn(['data', 'user'])"
alt="{{::notification.getIn(['data', 'user', 'name'])}}"
)
// profile image without url
.profile-picture(ng-if="!notification.getIn(['data', 'user', 'is_profile_visible'])")
img( img(
tg-avatar="notification.getIn(['data', 'user'])" tg-avatar="notification.getIn(['data', 'user'])"
alt="{{::notification.getIn(['data', 'user', 'name'])}}" alt="{{::notification.getIn(['data', 'user', 'name'])}}"
) )
// profile image without url .entry-content
.profile-picture(ng-if="!notification.getIn(['data', 'user', 'is_profile_visible'])") p(tg-compile-html="notification.get('title_html')")
img( p
tg-avatar="notification.getIn(['data', 'user'])" a.entry-project(
alt="{{::notification.getIn(['data', 'user', 'name'])}}" href=""
) ng-click="vm.setAsRead(notification, notification.get('projectUrl'))"
.entry-content ) {{::notification.getIn(['data', 'project', 'name'])}}
p(tg-compile-html="notification.get('title_html')") .entry-date {{::notification.get('created') | momentFromNow}}
p
a.entry-project(
href=""
ng-click="vm.setAsRead(notification, notification.get('projectUrl'))"
) {{::notification.getIn(['data', 'project', 'name'])}}
.entry-date {{::notification.get('created') | momentFromNow}}

View File

@ -30,6 +30,11 @@
color: $primary-light; color: $primary-light;
} }
} }
.empty {
margin: 4rem auto;
text-align: center;
width: 100%;
}
.notifications-list .entry { .notifications-list .entry {
align-items: center; align-items: center;
font-size: .95rem; font-size: .95rem;