scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2024-12-27 02:04:33 +08:00
Code Issues Projects Releases Packages Wiki Activity

Fixes for notifications improvment [SCI-11235]

Browse source
This commit is contained in:
Anton 2024-10-30 11:44:30 +01:00
parent 89bc4102ee
commit 649a8abe66
2 changed files with 14 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
app/javascript/vue/navigation/notifications/notification_item.vue
View file

@ -1,15 +1,17 @@
<template>
<div class="sci-navigation--notificaitons-flyout-notification">
<div class="sci-navigation--notificaitons-flyout-notification hover:bg-sn-super-light-grey !px-2 !-mx-2">
<div class="flex item-center">
<div class="sci-navigation--notificaitons-flyout-notification-date">
{{ notification.attributes.created_at }}
</div>
<a :href="lastBreadcrumbUrl" @click="toggleRead(true); closeFlyout()" class="hover:no-underline text-black hover:text-black grow">
<div class="sci-navigation--notificaitons-flyout-notification-date">
{{ notification.attributes.created_at }}
</div>
</a>
<div class="ml-auto cursor-pointer" @click="toggleRead()">
<div v-if="!notification.attributes.checked" class="w-2.5 h-2.5 bg-sn-coral rounded-full cursor-pointer"></div>
<div v-else class="w-2.5 h-2.5 border-2 border-sn-grey rounded-full border-solid cursor-pointer"></div>
<div v-else class="w-2.5 h-2.5 border-2 border-sn-grey rounded-full border-solid cursor-pointer hover:border-sn-coral"></div>
</div>
</div>
<a :href="lastBreadcrumbUrl" @click="toggleRead(true)" class="hover:no-underline text-black hover:text-black">
<a :href="lastBreadcrumbUrl" @click="toggleRead(true); closeFlyout()" class="hover:no-underline text-black hover:text-black">
<div class="sci-navigation--notificaitons-flyout-notification-title"
v-html="notification.attributes.title"
:data-seen="notification.attributes.checked"></div>
@ -42,6 +44,9 @@ export default {
}
},
methods: {
closeFlyout() {
this.$emit('close');
},
toggleRead(check = false) {
const params = {};
if (!this.notification.attributes.checked || check) {

4
app/javascript/vue/navigation/notifications/notifications_flyout.vue
View file

@ -28,7 +28,7 @@
>
{{ i18n.t('nav.notifications.read') }}
</div>
<div class="py-4 ml-auto cursor-pointer" @click="markAllNotificationsAsRead">
<div v-if="activeTab !== 'read'" class="py-2 ml-auto cursor-pointer" @click="markAllNotificationsAsRead">
{{ i18n.t('nav.notifications.read_all') }}
</div>
</div>
@ -39,12 +39,14 @@
</div>
<NotificationItem v-for="notification in todayNotifications" :key="notification.type_of + '-' + notification.id"
@updateNotification="updateNotification"
@close="$emit('close')"
:notification="notification" />
<div class="sci-navigation--notificaitons-flyout-subtitle" v-if="olderNotifications.length">
{{ i18n.t('nav.notifications.older') }}
</div>
<NotificationItem v-for="notification in olderNotifications" :key="notification.type_of + '-' + notification.id"
@updateNotification="updateNotification"
@close="$emit('close')"
:notification="notification" />
<div class="next-page-loader">
<img src="/images/medium/loading.svg" v-if="loadingPage" />