38 lines
1.7 KiB
HTML
38 lines
1.7 KiB
HTML
@include(snippets/header)
|
|
<div class="pagewrapper">
|
|
<div id="main" class="notifications-page">
|
|
<div class="notif-history-container">
|
|
<div class="notif-page-header">
|
|
<h2>{{ t('notifications.page_title') }}</h2>
|
|
<button id="mark-all-read-page" class="btn-small">{{ t('notifications.mark_all_read') }}</button>
|
|
</div>
|
|
<div id="notifications-container" class="posts notifications-list-full" data-page="{{ pagination.page }}">
|
|
@include(snippets/notifications-list)
|
|
</div>
|
|
@if(pagination.next)
|
|
<div id="footbar" data-end-msg="You reached the end" style="text-align: center; padding: 20px;">
|
|
<span class="loading-spinner" style="color: #888;">{{ t('notifications.scroll_for_more') }}</span>
|
|
</div>
|
|
@endif
|
|
<script>
|
|
// Initialize mark all read for the page
|
|
(function () {
|
|
const btn = document.getElementById('mark-all-read-page');
|
|
if (btn) {
|
|
btn.onclick = async () => {
|
|
const res = await fetch('/api/notifications/read', { method: 'POST' });
|
|
const data = await res.json();
|
|
if (data.success) {
|
|
document.querySelectorAll('.notif-item.unread').forEach(el => el.classList.remove('unread'));
|
|
if (window.NotificationSystemInstance) {
|
|
window.NotificationSystemInstance.markAllReadUI();
|
|
}
|
|
}
|
|
};
|
|
}
|
|
})();
|
|
</script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@include(snippets/footer) |