Use translations in notification view

This commit is contained in:
Johannes Zellner
2026-01-23 15:00:08 +01:00
parent e6806453e1
commit e26640c80e
2 changed files with 22 additions and 9 deletions
+14 -7
View File
@@ -105,13 +105,12 @@ onMounted(async () => {
<template>
<div class="content">
<!-- <h1 class="view-header">{{ $t('notifications.title') }}</h1> -->
<h1 class="notification-list-header">
Notifications
{{ $t('notifications.title') }}
<div class="header-action-bar">
<ButtonGroup>
<Button :outline="showAll ? true : undefined" @click="onSetShowAll(false)">Unread</Button>
<Button :outline="showAll ? undefined : true" @click="onSetShowAll(true)">All</Button>
<Button :outline="showAll ? true : undefined" @click="onSetShowAll(false)">{{ $t('notifications.showUnread') }}</Button>
<Button :outline="showAll ? undefined : true" @click="onSetShowAll(true)">{{ $t('notifications.showAll') }}</Button>
</ButtonGroup>
<Button secondary @click="onMarkAllNotificationRead()" :loading="notificationsAllBusy" :disabled="notificationsAllBusy">{{ $t('notifications.markAllAsRead') }}</Button>
</div>
@@ -124,8 +123,8 @@ onMounted(async () => {
{{ notification.title }}
<div class="notification-item-date">{{ prettyDate(notification.creationTime) }}</div>
</div>
<Button v-if="notification.acknowledged" plain secondary tool :disabled="notification.busy" @click.stop="onMarkNotificationUnread(notification)">Unread</Button>
<Button v-else plain primary tool :disabled="notification.busy" @click.stop="onMarkNotificationRead(notification)">Dismiss</Button>
<Button v-if="notification.acknowledged" class="read-state-button" plain secondary :disabled="notification.busy" @click.stop="onMarkNotificationUnread(notification)">{{ $t('notifications.markUnread') }}</Button>
<Button v-else class="read-state-button" plain secondary :disabled="notification.busy" @click.stop="onMarkNotificationRead(notification)">{{ $t('notifications.markRead') }}</Button>
</div>
<div class="notification-item-message">
<div style="cursor: auto; overflow: auto;" v-html="marked.parse(notification.message)"></div>
@@ -134,7 +133,7 @@ onMounted(async () => {
</div>
<div style="text-align: center; padding-bottom: 20px;">
<Button @click="onLoadMore()" plain secondary v-if="hasMore" :disabled="busy" :loading="busy">Load more</Button>
<Button @click="onLoadMore()" plain secondary v-if="hasMore" :disabled="busy" :loading="busy">{{ $t('main.action.loadMore') }}</Button>
</div>
</div>
</template>
@@ -200,4 +199,12 @@ onMounted(async () => {
display: block;
}
.read-state-button {
display: none;
}
.notification-item:hover .read-state-button {
display: block;
}
</style>