mirror of
https://github.com/LD-Reborn/Berufsschule_HAM.git
synced 2025-12-20 15:01:56 +00:00
Implemented Groups edit buttons
This commit is contained in:
@@ -45,7 +45,12 @@
|
||||
<td style="text-align: center">@(groupTableViewModel.CanManageGroups ? "☑️" : "❌")</td>
|
||||
<td style="text-align: center">
|
||||
<div class="d-flex gap-2 justify-content-center">
|
||||
<button class="btn btn-sm btn-primary">Update</button>
|
||||
<button class="btn btn-sm btn-warning btn-update"
|
||||
data-group-id="@groupTableViewModel.Cn"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#updateGroupModal">
|
||||
@T["Update"]
|
||||
</button>
|
||||
<button class="btn btn-sm btn-danger btn-delete"
|
||||
data-group-id="@groupTableViewModel.Cn"
|
||||
data-bs-toggle="modal"
|
||||
@@ -297,3 +302,157 @@
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- Groups Update Modal -->
|
||||
<div class="modal fade" id="updateGroupModal" tabindex="-1" aria-labelledby="updateGroupModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header bg-warning text-dark">
|
||||
<h5 class="modal-title" id="updateGroupModalLabel">@T["Update Group"]</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<form id="updateGroupForm">
|
||||
<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="Description.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="Description.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="Description.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="Description.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="Description.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-warning">@T["Save Changes"]</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const updateButtons = document.querySelectorAll('.btn-update');
|
||||
const updateModal = document.getElementById('updateGroupModal');
|
||||
const updateForm = document.getElementById('updateGroupForm');
|
||||
|
||||
updateModal.addEventListener('show.bs.modal', async event => {
|
||||
const button = event.relatedTarget;
|
||||
const groupId = button.getAttribute('data-group-id');
|
||||
|
||||
updateForm.reset();
|
||||
|
||||
try {
|
||||
const response = await fetch(`/Groups/Get?cn=${groupId}`);
|
||||
const responseJson = await response.json();
|
||||
const groups = responseJson.GroupModels[0];
|
||||
|
||||
for (const [key, value] of Object.entries(groups)) {
|
||||
const input = updateForm.querySelector(`[name="${key}"]`);
|
||||
if (input) input.value = value;
|
||||
}
|
||||
if (groups.Permissions) {
|
||||
for (const permission of groups.Permissions)
|
||||
{
|
||||
updateForm.querySelector(`[name="Description.Permissions.${permission}"]`).checked = true;
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
showToast('Error loading group data', 'danger');
|
||||
}
|
||||
});
|
||||
|
||||
updateForm.addEventListener('submit', async e => {
|
||||
e.preventDefault();
|
||||
|
||||
const formData = new FormData(updateForm);
|
||||
const jsonData = {};
|
||||
for (const [key, value] of formData.entries()) {
|
||||
if (!value) continue;
|
||||
const keys = key.split('.');
|
||||
let target = jsonData;
|
||||
for (let i = 0; i < keys.length - 1; i++) {
|
||||
target[keys[i]] = target[keys[i]] || {};
|
||||
target = target[keys[i]];
|
||||
}
|
||||
target[keys[keys.length - 1]] = value;
|
||||
}
|
||||
let permissions = [];
|
||||
const elements = document.querySelectorAll('[name^="Description.Permissions"]');
|
||||
for (const element of elements)
|
||||
{
|
||||
if (element.checked)
|
||||
{
|
||||
permissions.push(element.name.substr(element.name.lastIndexOf(".") + 1));
|
||||
}
|
||||
}
|
||||
jsonData.Description.Permissions = permissions;
|
||||
jsonData.Description.DisplayName = jsonData.DisplayName;
|
||||
jsonData.DisplayName = null;
|
||||
try {
|
||||
const response = await fetch('/Groups/Update', {
|
||||
method: 'PATCH',
|
||||
headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' },
|
||||
body: JSON.stringify(jsonData)
|
||||
});
|
||||
const result = await response.json();
|
||||
|
||||
if (result.success) {
|
||||
bootstrap.Modal.getInstance(updateModal).hide();
|
||||
showToast('Group updated successfully', 'success');
|
||||
|
||||
// Optionally refresh the row
|
||||
const row = [...document.querySelectorAll('tr')]
|
||||
.find(r => r.querySelector(`[data-group-id="${jsonData.Cn}"]`));
|
||||
if (row) {
|
||||
row.children[0].textContent = jsonData.Description.DisplayName || '';
|
||||
row.children[1].textContent = jsonData.Description.Permissions.includes("CanInventorize") ? "☑️" : "❌" || '';
|
||||
row.children[2].textContent = jsonData.Description.Permissions.includes("CanManageUsers") ? "☑️" : "❌" || '';
|
||||
row.children[3].textContent = jsonData.Description.Permissions.includes("CanManageLocations") ? "☑️" : "❌" || '';
|
||||
row.children[4].textContent = jsonData.Description.Permissions.includes("CanManageAssets") ? "☑️" : "❌" || '';
|
||||
row.children[5].textContent = jsonData.Description.Permissions.includes("CanManageGroups") ? "☑️" : "❌" || '';
|
||||
}
|
||||
} else {
|
||||
showToast(result.reason || 'Error updating group', 'danger');
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
showToast('Error contacting server', 'danger');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user