jamesp/sasa-maillist
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sub mamangement

Browse Source
This commit is contained in:
James Pattinson
2025-10-12 21:20:53 +00:00
parent ba1bf32393
commit 9b6a6dab06
6 changed files with 463 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

190
web/static/js/ui.js
View File

@@ -54,8 +54,19 @@ class UIManager {
this.showMemberModal();
});
document.getElementById('addSubscriptionBtn').addEventListener('click', () => {
this.showSubscriptionModal();
// Member subscriptions modal
document.getElementById('memberSubscriptionsModalClose').addEventListener('click', () => {
this.closeModal(document.getElementById('memberSubscriptionsModal'));
});
document.getElementById('memberSubscriptionsCancelBtn').addEventListener('click', () => {
this.closeModal(document.getElementById('memberSubscriptionsModal'));
});
document.getElementById('memberSubscriptionsSaveBtn').addEventListener('click', () => {
this.handleMemberSubscriptionsSave();
});
// Form submissions
@@ -386,6 +397,181 @@ class UIManager {
}
}
/**
* Show member subscriptions modal
*/
async showMemberSubscriptionsModal(member) {
const modal = document.getElementById('memberSubscriptionsModal');
// Update member info
document.getElementById('memberSubscriptionsName').textContent = member.name;
document.getElementById('memberSubscriptionsEmail').textContent = member.email;
document.getElementById('memberSubscriptionsTitle').textContent = `Manage Subscriptions - ${member.name}`;
try {
// Load all lists and member's current subscriptions
const [lists, memberSubscriptions] = await Promise.all([
apiClient.getLists(),
this.getMemberSubscriptions(member.member_id)
]);
this.currentMemberForSubscriptions = member;
this.renderSubscriptionCheckboxes(lists, memberSubscriptions);
this.showModal(modal);
} catch (error) {
this.handleError(error, 'Failed to load subscription data');
}
}
/**
* Get member's current subscriptions
*/
async getMemberSubscriptions(memberId) {
const subscriptions = [];
// Check each list to see if the member is subscribed
for (const [listId, members] of window.app.subscriptions) {
if (members.some(m => m.member_id === memberId)) {
const list = window.app.lists.find(l => l.list_id === listId);
if (list) {
subscriptions.push(list);
}
}
}
return subscriptions;
}
/**
* Render subscription checkboxes
*/
renderSubscriptionCheckboxes(lists, memberSubscriptions) {
const container = document.getElementById('subscriptionCheckboxList');
container.innerHTML = '';
this.subscriptionChanges = new Map(); // Track changes
lists.forEach(list => {
const isSubscribed = memberSubscriptions.some(sub => sub.list_id === list.list_id);
const item = document.createElement('div');
item.className = `subscription-item ${isSubscribed ? 'subscribed' : ''}`;
item.dataset.listId = list.list_id;
item.dataset.subscribed = isSubscribed.toString();
item.innerHTML = `
<div class="list-info">
<div class="list-name">${this.escapeHtml(list.list_name)}</div>
<div class="list-email">${this.escapeHtml(list.list_email)}</div>
</div>
<div class="subscription-toggle">
<div class="toggle-switch ${isSubscribed ? 'active' : ''}" data-list-id="${list.list_id}"></div>
<span class="subscription-status ${isSubscribed ? 'subscribed' : 'not-subscribed'}">
${isSubscribed ? 'Subscribed' : 'Not subscribed'}
</span>
</div>
`;
// Add click handlers
const toggleSwitch = item.querySelector('.toggle-switch');
const statusSpan = item.querySelector('.subscription-status');
const toggleSubscription = () => {
const currentlySubscribed = item.dataset.subscribed === 'true';
const newSubscribed = !currentlySubscribed;
// Update UI
item.dataset.subscribed = newSubscribed.toString();
item.className = `subscription-item ${newSubscribed ? 'subscribed' : ''}`;
toggleSwitch.className = `toggle-switch ${newSubscribed ? 'active' : ''}`;
statusSpan.className = `subscription-status ${newSubscribed ? 'subscribed' : 'not-subscribed'}`;
statusSpan.textContent = newSubscribed ? 'Subscribed' : 'Not subscribed';
// Track the change
const originallySubscribed = memberSubscriptions.some(sub => sub.list_id === list.list_id);
if (newSubscribed !== originallySubscribed) {
this.subscriptionChanges.set(list.list_id, {
list: list,
action: newSubscribed ? 'subscribe' : 'unsubscribe'
});
} else {
this.subscriptionChanges.delete(list.list_id);
}
// Update save button state
this.updateSubscriptionsSaveButton();
};
item.addEventListener('click', toggleSubscription);
toggleSwitch.addEventListener('click', (e) => {
e.stopPropagation();
toggleSubscription();
});
container.appendChild(item);
});
this.updateSubscriptionsSaveButton();
}
/**
* Update save button state based on changes
*/
updateSubscriptionsSaveButton() {
const saveBtn = document.getElementById('memberSubscriptionsSaveBtn');
const hasChanges = this.subscriptionChanges && this.subscriptionChanges.size > 0;
saveBtn.disabled = !hasChanges;
saveBtn.innerHTML = hasChanges
? `<i class="fas fa-save"></i> Save Changes (${this.subscriptionChanges.size})`
: `<i class="fas fa-save"></i> No Changes`;
}
/**
* Handle saving subscription changes
*/
async handleMemberSubscriptionsSave() {
if (!this.subscriptionChanges || this.subscriptionChanges.size === 0) {
return;
}
try {
this.setLoading(true);
const promises = [];
for (const [listId, change] of this.subscriptionChanges) {
if (change.action === 'subscribe') {
promises.push(
apiClient.createSubscription({
list_email: change.list.list_email,
member_email: this.currentMemberForSubscriptions.email,
active: true
})
);
} else {
promises.push(
apiClient.deleteSubscription(
change.list.list_email,
this.currentMemberForSubscriptions.email
)
);
}
}
await Promise.all(promises);
this.showNotification(`Successfully updated ${this.subscriptionChanges.size} subscription(s)`, 'success');
this.closeModal(document.getElementById('memberSubscriptionsModal'));
await window.app.loadData();
} catch (error) {
this.handleError(error, 'Failed to save subscription changes');
} finally {
this.setLoading(false);
}
}
/**
* Handle API errors
*/