JS toggle class read/unread status works on *all* container (change DOM selector)

This commit is contained in:
2022-01-14 20:02:00 +01:00
parent 20fcaa5428
commit 22022e5143
3 changed files with 10 additions and 10 deletions

View File

@@ -6,7 +6,7 @@ const i18n = _createI18n({});
window.addEventListener('DOMContentLoaded', function (e) {
document.querySelectorAll('.notification_toggle_read_status')
.forEach(function (el) {
.forEach(function (el, i) {
createApp({
template: '<notification-read-toggle ' +
':notificationId="notificationId" ' +
@@ -31,20 +31,20 @@ window.addEventListener('DOMContentLoaded', function (e) {
},
computed: {
getContainer() {
return document.getElementById(this.container);
return document.querySelectorAll('div.' + this.container);
}
},
methods: {
onMarkRead() {
if (null !== this.getContainer) {
this.getContainer.classList.replace('read', 'unread');
}
if (typeof this.getContainer[i] !== 'undefined') {
this.getContainer[i].classList.replace('read', 'unread');
} else { throw 'data-container attribute is missing' }
this.isRead = false;
},
onMarkUnread() {
if (null !== this.getContainer) {
this.getContainer.classList.replace('unread', 'read');
}
if (typeof this.getContainer[i] !== 'undefined') {
this.getContainer[i].classList.replace('unread', 'read');
} else { throw 'data-container attribute is missing' }
this.isRead = true;
},
}