feat(notifications): add option to mark all as read

This commit is contained in:
kolaente 2023-10-20 16:51:35 +02:00
parent d73c62a424
commit ff2b4b8bf4
Signed by untrusted user: konrad
GPG Key ID: F40E70337AB24C9B
3 changed files with 29 additions and 1 deletions

View File

@ -36,6 +36,14 @@
</span>
</div>
</div>
<x-button
v-if="notifications.length > 0 && unreadNotifications > 0"
@click="markAllRead"
variant="tertiary"
class="mt-2 is-fullwidth"
>
{{ $t('notification.markAllRead') }}
</x-button>
<p class="nothing" v-if="notifications.length === 0">
{{ $t('notification.none') }}<br/>
<span class="explainer">
@ -60,11 +68,15 @@ import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
import {formatDateLong, formatDateSince} from '@/helpers/time/formatDate'
import {getDisplayName} from '@/models/user'
import {useAuthStore} from '@/stores/auth'
import XButton from '@/components/input/button.vue'
import {success} from '@/message'
import {useI18n} from 'vue-i18n'
const LOAD_NOTIFICATIONS_INTERVAL = 10000
const authStore = useAuthStore()
const router = useRouter()
const {t} = useI18n()
const allNotifications = ref<INotification[]>([])
const showNotifications = ref(false)
@ -138,6 +150,12 @@ function to(n, index) {
allNotifications.value[index] = await notificationService.update(n)
}
}
async function markAllRead() {
const notificationService = new NotificationService()
await notificationService.markAllRead()
success({message: t('notification.markAllReadSuccess')})
}
</script>
<style lang="scss" scoped>

View File

@ -952,7 +952,9 @@
"notification": {
"title": "Notifications",
"none": "You don't have any notifications. Have a nice day!",
"explainer": "Notifications will appear here when actions projects or tasks you subscribed to happen."
"explainer": "Notifications will appear here when actions projects or tasks you subscribed to happen.",
"markAllRead": "Mark all notifications as read",
"markAllReadSuccess": "Successfully marked all notifications as read."
},
"quickActions": {
"commands": "Commands",

View File

@ -15,8 +15,16 @@ export default class NotificationService extends AbstractService<INotification>
}
beforeUpdate(model) {
if (!model) {
return model
}
model.created = new Date(model.created).toISOString()
model.readAt = new Date(model.readAt).toISOString()
return model
}
async markAllRead() {
return this.post('/notifications', false)
}
}