mirror of
https://github.com/LD-Reborn/Berufsschule_HAM.git
synced 2025-12-20 15:01:56 +00:00
Implemented group creation button
This commit is contained in:
@@ -13,7 +13,9 @@
|
||||
|
||||
|
||||
<div class="mb-4 d-flex flex-wrap gap-2">
|
||||
<button class="btn btn-primary">@T["Create group"]</button>
|
||||
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#createGroupModal">
|
||||
@T["Create group"]
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -83,6 +85,33 @@
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
// 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;
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const deleteModal = document.getElementById('deleteModal');
|
||||
let currentButton = null; // The delete button that opened the modal
|
||||
@@ -129,40 +158,142 @@
|
||||
row.classList.add('table-danger');
|
||||
setTimeout(() => row.remove(), 300);
|
||||
|
||||
showToast('Group deleted successfully', 'success');
|
||||
showToast('@T["Group deleted successfully"]', 'success');
|
||||
} else {
|
||||
showToast(`❌ ${result.reason}: ${result.exception || 'Unknown error'}`, 'danger');
|
||||
let exception = result.exception;
|
||||
switch (exception) {
|
||||
case "None":
|
||||
exception = "@T["Unknown error"]";
|
||||
default:
|
||||
break;
|
||||
}
|
||||
showToast(`${@T["Error"] + ": " + exception}`, 'danger');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
showToast('Error contacting server', 'danger');
|
||||
showToast('@T["Error contacting server"]', 'danger');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- Groups Create Modal -->
|
||||
<div class="modal fade" id="createGroupModal" tabindex="-1" aria-labelledby="createGroupModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header bg-primary text-white">
|
||||
<h5 class="modal-title" id="createGroupModalLabel">@T["Create Group"]</h5>
|
||||
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<form id="createGroupForm">
|
||||
<div class="modal-body">
|
||||
<div class="row g-3 justify-content-center">
|
||||
<!-- Basic Info -->
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">@T["Group ID"] *</label>
|
||||
<input type="text" class="form-control" name="Cn" required />
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">@T["Display name"] *</label>
|
||||
<input type="text" class="form-control" name="DisplayName" />
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<div class="form-check">
|
||||
<input type="checkbox" class="form-check-input" name="Permissions.CanInventorize" id="canInventorize" />
|
||||
<label class="form-check-label" for="canInventorize">@T["Can inventorize"]</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input type="checkbox" class="form-check-input" name="Permissions.CanManageAssets" id="canManageAssets" />
|
||||
<label class="form-check-label" for="canManageAssets">@T["Can manage assets"]</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="form-check">
|
||||
<input type="checkbox" class="form-check-input" name="Permissions.CanManageUsers" id="canManageUsers" />
|
||||
<label class="form-check-label" for="canManageUsers">@T["Can manage users"]</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input type="checkbox" class="form-check-input" name="Permissions.CanManageGroups" id="canManageGroups" />
|
||||
<label class="form-check-label" for="canManageGroups">@T["Can manage groups"]</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-check">
|
||||
<input type="checkbox" class="form-check-input" name="Permissions.CanManageLocations" id="canManageLocations" />
|
||||
<label class="form-check-label" for="canManageLocations">@T["Can manage locations"]</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">@T["Cancel"]</button>
|
||||
<button type="submit" class="btn btn-primary">@T["Create"]</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const createForm = document.getElementById('createGroupForm');
|
||||
|
||||
createForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
const formData = new FormData(createForm);
|
||||
const jsonData = {};
|
||||
|
||||
// Basic fields
|
||||
jsonData.Cn = formData.get('Cn');
|
||||
jsonData.DisplayName = formData.get('DisplayName');
|
||||
|
||||
// Permissions
|
||||
jsonData.Permissions = [];
|
||||
if (createForm.querySelector('[name="Permissions.CanInventorize"]').checked) jsonData.Permissions.push("CanInventorize");
|
||||
if (createForm.querySelector('[name="Permissions.CanManageAssets"]').checked) jsonData.Permissions.push("CanManageAssets");
|
||||
if (createForm.querySelector('[name="Permissions.CanManageUsers"]').checked) jsonData.Permissions.push("CanManageUsers");
|
||||
if (createForm.querySelector('[name="Permissions.CanManageGroups"]').checked) jsonData.Permissions.push("CanManageGroups");
|
||||
if (createForm.querySelector('[name="Permissions.CanManageLocations"]').checked) jsonData.Permissions.push("CanManageLocations");
|
||||
|
||||
try {
|
||||
const response = await fetch('/Groups/Create', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Accept': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(jsonData)
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
const createModalEl = document.getElementById('createGroupModal');
|
||||
if (result.success) {
|
||||
bootstrap.Modal.getInstance(createModalEl).hide();
|
||||
createForm.reset();
|
||||
showToast('@T["Group created successfully"]', 'success');
|
||||
} else {
|
||||
let exception = result.exception;
|
||||
switch (exception) {
|
||||
case "Entry Already Exists":
|
||||
exception = "@T["Entry Already Exists"]";
|
||||
break;
|
||||
case "None":
|
||||
exception = "@T["Unknown error"]";
|
||||
default:
|
||||
break;
|
||||
}
|
||||
showToast("@T["Error"]: " + result.exception || '@T["Error creating group"]', 'danger');
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
showToast('@T["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>
|
||||
|
||||
Reference in New Issue
Block a user