HAM/Berufsschule_HAM
1
0
Fork 1
mirror of https://github.com/LD-Reborn/Berufsschule_HAM.git synced 2025-12-20 06:51:55 +00:00
Code Issues Packages Projects 1 Releases Wiki Activity

Merge pull request #74 from LD-Reborn/32-sub-issue-overview-page-dummy-modal

Browse Source 
Added dummy modal
This commit is contained in:
LD50
2025-10-05 20:37:06 +02:00
committed by GitHub
parent 26a0c9b1f1 b98781626c
commit ee44b7d8c8
1 changed files with 145 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
src/Views/Home/Index.cshtml
View File

@@ -40,7 +40,12 @@
<td>
<div class="d-flex gap-2">
<button class="btn btn-sm btn-primary">Update</button>
<button class="btn btn-sm btn-danger">🗑️ Delete</button>
<button class="btn btn-sm btn-danger btn-delete"
data-asset-id="4827391"
data-bs-toggle="modal"
data-bs-target="#deleteModal">
🗑️ Delete
</button>
</div>
</td>
</tr>
@@ -52,7 +57,12 @@
<td>
<div class="d-flex gap-2">
<button class="btn btn-sm btn-primary">Update</button>
<button class="btn btn-sm btn-danger">🗑️ Delete</button>
<button class="btn btn-sm btn-danger btn-delete"
data-asset-id="9150732"
data-bs-toggle="modal"
data-bs-target="#deleteModal">
🗑️ Delete
</button>
</div>
</td>
</tr>
@@ -64,7 +74,12 @@
<td>
<div class="d-flex gap-2">
<button class="btn btn-sm btn-primary">Update</button>
<button class="btn btn-sm btn-danger">🗑️ Delete</button>
<button class="btn btn-sm btn-danger btn-delete"
data-asset-id="1642235"
data-bs-toggle="modal"
data-bs-target="#deleteModal">
🗑️ Delete
</button>
</div>
</td>
</tr>
@@ -73,6 +88,133 @@
</div>
</div>
<!-- Asset Delete Confirmation Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header bg-danger text-white">
<h5 class="modal-title" id="deleteModalLabel">Confirm Delete</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Are you sure you want to delete the asset <strong id="assetName"></strong> (ID: <span id="assetId"></span>)?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<form id="deleteForm" method="post" action="">
<button type="submit" class="btn btn-danger">Yes, Delete</button>
</form>
</div>
</div>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', () => {
const deleteModal = document.getElementById('deleteModal');
let currentButton = null; // The delete button that opened the modal
deleteModal.addEventListener('show.bs.modal', event => {
currentButton = event.relatedTarget; // Button that triggered the modal
const assetId = currentButton.getAttribute('data-asset-id');
const assetName = currentButton.getAttribute('data-asset-name');
deleteModal.querySelector('#assetId').textContent = assetId;
deleteModal.querySelector('#assetName').textContent = assetName;
// Store the delete URL for later use
deleteModal.querySelector('#deleteForm').dataset.url = `/Assets/Delete?cn=${assetId}`;
});
// Handle submit of deleteForm via fetch()
const deleteForm = document.getElementById('deleteForm');
deleteForm.addEventListener('submit', async e => {
e.preventDefault();
const url = deleteForm.dataset.url;
const assetId = deleteModal.querySelector('#assetId').textContent;
try {
const response = await fetch(url, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json'
}//,
//body: JSON.stringify({ id: assetId }) // Use this for Post requests with [FromBody] parameters like in /Groups/Update
});
const result = await response.json();
if (result.success) {
// Close the modal
const modal = bootstrap.Modal.getInstance(deleteModal);
modal.hide();
// Remove the row from the table
const row = currentButton.closest('tr');
row.classList.add('table-danger');
setTimeout(() => row.remove(), 300);
showToast('Asset deleted successfully', 'success');
} else {
showToast(`❌ ${result.reason}: ${result.exception || 'Unknown error'}`, 'danger');
}
} catch (error) {
console.error(error);
showToast('Error contacting server', 'danger');
}
});
// Simple toast helper
function showToast(message, type) {
const toastContainer = document.getElementById('toastContainer') || createToastContainer();
const toast = document.createElement('div');
toast.className = `toast align-items-center text-white bg-${type} border-0`;
toast.role = 'alert';
toast.innerHTML = `
<div class="d-flex">
<div class="toast-body">${message}</div>
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast"></button>
</div>
`;
toastContainer.appendChild(toast);
const bsToast = new bootstrap.Toast(toast, { delay: 3000 });
bsToast.show();
toast.addEventListener('hidden.bs.toast', () => toast.remove());
}
function createToastContainer() {
const container = document.createElement('div');
container.id = 'toastContainer';
container.className = 'toast-container position-fixed bottom-0 end-0 p-3';
document.body.appendChild(container);
return container;
}
});
</script>
@* <script>
document.addEventListener('DOMContentLoaded', () => {
alert("DEBUG@1");
const deleteModal = document.getElementById('deleteModal');
deleteModal.addEventListener('show.bs.modal', event => {
alert("DEBUG@2");
const button = event.relatedTarget; // Button that triggered the modal
const assetId = button.getAttribute('data-asset-id');
const assetName = button.getAttribute('data-asset-name');
// Update modal content
deleteModal.querySelector('#assetId').textContent = assetId;
deleteModal.querySelector('#assetName').textContent = assetName;
// Set the form action dynamically
const form = deleteModal.querySelector('#deleteForm');
form.action = `/Assets/Delete/${assetId}`; // <-- adjust controller/action as needed
});
});
</script> *@
<!--
In case someone wants to reread this: