lukas.uptmoor/webgis-lohne
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

custom edit and create modals

Browse Source
This commit is contained in:
patrickzerhusen
2026-06-16 16:06:25 +02:00
parent 70fe829e97
commit cf09e88a5b
2 changed files with 194 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
public/admin.php
View File

@@ -539,6 +539,74 @@ $counts['total'] = count($all_contributions);
</div> </div>
<!-- ============================================================= -->
<!-- Edit Contribution Modal (Admin) -->
<!-- ============================================================= -->
<div id="admin-edit-modal" class="modal-overlay" style="display:none;">
<div class="modal-content">
<h2><i class="fa-solid fa-pen"></i> Beitrag bearbeiten</h2>
<div class="form-group">
<label for="admin-edit-title">Titel</label>
<input type="text" id="admin-edit-title" class="form-input">
</div>
<div class="form-group">
<label for="admin-edit-description">Beschreibung</label>
<textarea id="admin-edit-description" class="form-input" rows="4"></textarea>
</div>
<input type="hidden" id="admin-edit-id">
<div class="modal-actions">
<button class="btn btn-secondary" onclick="closeAdminModal('admin-edit-modal')">Abbrechen</button>
<button class="btn btn-primary" onclick="submitAdminEdit()">Speichern</button>
</div>
</div>
</div>
<!-- ============================================================= -->
<!-- Edit Comment Modal (Admin) -->
<!-- ============================================================= -->
<div id="admin-comment-modal" class="modal-overlay" style="display:none;">
<div class="modal-content">
<h2><i class="fa-solid fa-pen"></i> Kommentar bearbeiten</h2>
<div class="form-group">
<label for="admin-comment-content">Inhalt</label>
<textarea id="admin-comment-content" class="form-input" rows="4"></textarea>
</div>
<input type="hidden" id="admin-comment-id">
<div class="modal-actions">
<button class="btn btn-secondary" onclick="closeAdminModal('admin-comment-modal')">Abbrechen</button>
<button class="btn btn-primary" onclick="submitAdminComment()">Speichern</button>
</div>
</div>
</div>
<!-- ============================================================= -->
<!-- Create/Edit News Modal (Admin) -->
<!-- ============================================================= -->
<div id="admin-news-modal" class="modal-overlay" style="display:none;">
<div class="modal-content">
<h2 id="admin-news-modal-title"><i class="fa-solid fa-newspaper"></i> Neuigkeit hinzufügen</h2>
<div class="form-group">
<label for="admin-news-title">Titel</label>
<input type="text" id="admin-news-title" class="form-input" placeholder="Titel der Neuigkeit">
</div>
<div class="form-group">
<label for="admin-news-content">Inhalt</label>
<textarea id="admin-news-content" class="form-input" rows="4" placeholder="Neuigkeit verfassen..."></textarea>
</div>
<div class="form-group">
<label for="admin-news-author">Autor</label>
<input type="text" id="admin-news-author" class="form-input" value="Stadtverwaltung">
</div>
<input type="hidden" id="admin-news-id">
<input type="hidden" id="admin-news-mode">
<div class="modal-actions">
<button class="btn btn-secondary" onclick="closeAdminModal('admin-news-modal')">Abbrechen</button>
<button class="btn btn-primary" onclick="submitAdminNews()">Speichern</button>
</div>
</div>
</div>
<!-- ============================================================= --> <!-- ============================================================= -->
<!-- Loads JavaScript Dependencies --> <!-- Loads JavaScript Dependencies -->
<!-- ============================================================= --> <!-- ============================================================= -->

234
public/js/admin.js
View File

@@ -319,6 +319,22 @@ function escapeHtml(text) {
return div.innerHTML; return div.innerHTML;
} }
// Closes Admin Modals by ID
function closeAdminModal(modalId) {
document.getElementById(modalId).style.display = 'none';
}
// Closes Admin Modals on Escape Key
document.addEventListener('keydown', function (e) {
if (e.key === 'Escape') {
document.querySelectorAll('.modal-overlay').forEach(function (modal) {
modal.style.display = 'none';
});
}
});
// ===================================================================== // =====================================================================
// Block 9: CRUD Operations for Contributions // Block 9: CRUD Operations for Contributions
// ===================================================================== // =====================================================================
@@ -354,46 +370,37 @@ function changeStatus(contributionId, newStatus) {
// UPDATE: Edits existing Contributions // UPDATE: Edits existing Contributions
function editContribution(contributionId, currentTitle, currentDescription) { function editContribution(contributionId, currentTitle, currentDescription) {
Swal.fire({ document.getElementById('admin-edit-id').value = contributionId;
title: 'Beitrag bearbeiten', document.getElementById('admin-edit-title').value = currentTitle;
html: document.getElementById('admin-edit-description').value = currentDescription;
'<div class="swal-form">' + document.getElementById('admin-edit-modal').style.display = 'flex';
'<div class="swal-group">' + }
'<label class="swal-label">Titel</label>' +
'<input id="swal-title" class="swal2-input" value="' + escapeHtml(currentTitle) + '">' + // Submits Edit from Custom Modal
'</div>' + function submitAdminEdit() {
'<div>' + var id = document.getElementById('admin-edit-id').value;
'<label class="swal-label">Beschreibung</label>' + var title = document.getElementById('admin-edit-title').value.trim();
'<textarea id="swal-description" class="swal2-textarea">' + escapeHtml(currentDescription) + '</textarea>' + var description = document.getElementById('admin-edit-description').value.trim();
'</div>' +
'</div>', if (!title) {
showCancelButton: true, Swal.fire('Titel fehlt', 'Bitte geben Sie einen Titel ein.', 'warning');
confirmButtonText: 'Speichern', return;
cancelButtonText: 'Abbrechen',
confirmButtonColor: ADMIN_CONFIG.primaryColor,
preConfirm: function () {
return {
title: document.getElementById('swal-title').value.trim(),
description: document.getElementById('swal-description').value.trim()
};
} }
}).then(function (result) {
if (!result.isConfirmed) return;
apiCall({ apiCall({
action: 'update', action: 'update',
contribution_id: contributionId, contribution_id: id,
title: result.value.title, title: title,
description: result.value.description description: description
}).then(function (response) { }).then(function (response) {
if (response.error) { if (response.error) {
Swal.fire('Fehler', response.error, 'error'); Swal.fire('Fehler', response.error, 'error');
return; return;
} }
closeAdminModal('admin-edit-modal');
Swal.fire('Gespeichert!', 'Beitrag wurde aktualisiert.', 'success') Swal.fire('Gespeichert!', 'Beitrag wurde aktualisiert.', 'success')
.then(function () { location.reload(); }); .then(function () { location.reload(); });
}); });
});
} }
@@ -458,36 +465,34 @@ function changeCommentStatus(commentId, newStatus) {
// UPDATE: Edits existing Comments // UPDATE: Edits existing Comments
function editModComment(commentId, currentContent) { function editModComment(commentId, currentContent) {
Swal.fire({ document.getElementById('admin-comment-id').value = commentId;
title: 'Kommentar bearbeiten', document.getElementById('admin-comment-content').value = currentContent;
html: document.getElementById('admin-comment-modal').style.display = 'flex';
'<div class="swal-form">' + }
'<label class="swal-label">Inhalt</label>' +
'<textarea id="swal-comment-content" class="swal2-textarea">' + escapeHtml(currentContent) + '</textarea>' + // Submits Comment Edit from Custom Modal
'</div>', function submitAdminComment() {
showCancelButton: true, var id = document.getElementById('admin-comment-id').value;
confirmButtonText: 'Speichern', var content = document.getElementById('admin-comment-content').value.trim();
cancelButtonText: 'Abbrechen',
confirmButtonColor: ADMIN_CONFIG.primaryColor, if (!content) {
preConfirm: function () { Swal.fire('Inhalt fehlt', 'Bitte geben Sie einen Inhalt ein.', 'warning');
return { content: document.getElementById('swal-comment-content').value.trim() }; return;
} }
}).then(function (result) {
if (!result.isConfirmed) return;
apiCall({ apiCall({
action: 'update_comment', action: 'update_comment',
comment_id: commentId, comment_id: id,
content: result.value.content content: content
}).then(function (response) { }).then(function (response) {
if (response.error) { if (response.error) {
Swal.fire('Fehler', response.error, 'error'); Swal.fire('Fehler', response.error, 'error');
return; return;
} }
closeAdminModal('admin-comment-modal');
Swal.fire('Gespeichert!', 'Kommentar wurde aktualisiert.', 'success') Swal.fire('Gespeichert!', 'Kommentar wurde aktualisiert.', 'success')
.then(function () { location.reload(); }); .then(function () { location.reload(); });
}); });
});
} }
@@ -523,108 +528,69 @@ function deleteModComment(commentId) {
// Block 11: CRUD Operations for News // Block 11: CRUD Operations for News
// ===================================================================== // =====================================================================
// CREATE: Submits new News Article // CREATE: Creates News
function createNews() { function createNews() {
Swal.fire({ document.getElementById('admin-news-modal-title').innerHTML = '<i class="fa-solid fa-newspaper"></i> Neuigkeit hinzufügen';
title: 'Neuigkeit hinzufügen', document.getElementById('admin-news-id').value = '';
html: document.getElementById('admin-news-mode').value = 'create';
'<div class="swal-form">' + document.getElementById('admin-news-title').value = '';
'<div class="swal-group">' + document.getElementById('admin-news-content').value = '';
'<label class="swal-label">Titel</label>' + document.getElementById('admin-news-author').value = 'Stadtverwaltung';
'<input id="swal-news-title" class="swal2-input" placeholder="Titel der Neuigkeit">' + document.getElementById('admin-news-modal').style.display = 'flex';
'</div>' +
'<div class="swal-group">' +
'<label class="swal-label">Inhalt</label>' +
'<textarea id="swal-news-content" class="swal2-textarea" placeholder="Neuigkeit verfassen..."></textarea>' +
'</div>' +
'<div>' +
'<label class="swal-label">Autor</label>' +
'<input id="swal-news-author" class="swal2-input" value="Stadtverwaltung">' +
'</div>' +
'</div>',
showCancelButton: true,
confirmButtonText: 'Veröffentlichen',
cancelButtonText: 'Abbrechen',
confirmButtonColor: ADMIN_CONFIG.primaryColor,
preConfirm: function () {
const title = document.getElementById('swal-news-title').value.trim();
const content = document.getElementById('swal-news-content').value.trim();
const author = document.getElementById('swal-news-author').value.trim() || 'Stadtverwaltung';
if (!title || !content) {
Swal.showValidationMessage('Titel und Inhalt sind Pflichtfelder.');
return false;
} }
return { title, content, author_name: author };
}
}).then(function (result) {
if (!result.isConfirmed) return;
apiCall({
action: 'create_news',
municipality_id: ADMIN_CONFIG.id,
title: result.value.title,
content: result.value.content,
author_name: result.value.author_name
}).then(function (response) {
if (response.error) {
Swal.fire('Fehler', response.error, 'error');
return;
}
Swal.fire('Veröffentlicht!', 'Neuigkeit wurde veröffentlicht.', 'success')
.then(function () { location.reload(); });
});
});
}
// UPDATE: Edits existing News // UPDATE: Edits existing News
function editNews(newsId, currentTitle, currentContent, currentAuthor) { function editNews(newsId, currentTitle, currentContent, currentAuthor) {
Swal.fire({ document.getElementById('admin-news-modal-title').innerHTML = '<i class="fa-solid fa-pen"></i> Neuigkeit bearbeiten';
title: 'Neuigkeit bearbeiten', document.getElementById('admin-news-id').value = newsId;
html: document.getElementById('admin-news-mode').value = 'edit';
'<div class="swal-form">' + document.getElementById('admin-news-title').value = currentTitle;
'<div class="swal-group">' + document.getElementById('admin-news-content').value = currentContent;
'<label class="swal-label">Titel</label>' + document.getElementById('admin-news-author').value = currentAuthor;
'<input id="swal-news-title" class="swal2-input" value="' + escapeHtml(currentTitle) + '">' + document.getElementById('admin-news-modal').style.display = 'flex';
'</div>' + }
'<div class="swal-group">' +
'<label class="swal-label">Inhalt</label>' + // Submits News from Custom Modal (Create or Edit)
'<textarea id="swal-news-content" class="swal2-textarea">' + escapeHtml(currentContent) + '</textarea>' + function submitAdminNews() {
'</div>' + var mode = document.getElementById('admin-news-mode').value;
'<div>' + var title = document.getElementById('admin-news-title').value.trim();
'<label class="swal-label">Autor</label>' + var content = document.getElementById('admin-news-content').value.trim();
'<input id="swal-news-author" class="swal2-input" value="' + escapeHtml(currentAuthor) + '">' + var author = document.getElementById('admin-news-author').value.trim() || 'Stadtverwaltung';
'</div>' +
'</div>', if (!title || !content) {
showCancelButton: true, Swal.fire('Pflichtfelder', 'Titel und Inhalt sind Pflichtfelder.', 'warning');
confirmButtonText: 'Speichern', return;
cancelButtonText: 'Abbrechen', }
confirmButtonColor: ADMIN_CONFIG.primaryColor,
preConfirm: function () { var data;
return { if (mode === 'create') {
title: document.getElementById('swal-news-title').value.trim(), data = {
content: document.getElementById('swal-news-content').value.trim(), action: 'create_news',
author_name: document.getElementById('swal-news-author').value.trim() || 'Stadtverwaltung' municipality_id: ADMIN_CONFIG.id,
title: title,
content: content,
author_name: author
};
} else {
data = {
action: 'update_news',
news_id: document.getElementById('admin-news-id').value,
title: title,
content: content,
author_name: author
}; };
} }
}).then(function (result) {
if (!result.isConfirmed) return;
apiCall({ apiCall(data).then(function (response) {
action: 'update_news',
news_id: newsId,
title: result.value.title,
content: result.value.content,
author_name: result.value.author_name
}).then(function (response) {
if (response.error) { if (response.error) {
Swal.fire('Fehler', response.error, 'error'); Swal.fire('Fehler', response.error, 'error');
return; return;
} }
Swal.fire('Gespeichert!', 'Neuigkeit wurde aktualisiert.', 'success') closeAdminModal('admin-news-modal');
var msg = mode === 'create' ? 'Neuigkeit wurde veröffentlicht.' : 'Neuigkeit wurde aktualisiert.';
Swal.fire('Gespeichert!', msg, 'success')
.then(function () { location.reload(); }); .then(function () { location.reload(); });
}); });
});
} }