Group buttons in Api and User view

This commit is contained in:
Marc Ole Bulling
2025-05-30 22:31:55 +02:00
parent 1a6f430fea
commit 4eaab13d11
8 changed files with 93 additions and 39 deletions

View File

@@ -138,5 +138,5 @@ func fileExists(filename string) bool {
// Version codes can be changed in updateVersionNumbers.go
const jsAdminVersion = 10
const jsE2EVersion = 5
const jsE2EVersion = 6
const cssMainVersion = 5

View File

@@ -162,6 +162,11 @@ function addRowApi(apiKey, publicId) {
cellLastUsed.innerText = "Never";
const btnGroup = document.createElement("div");
btnGroup.className = "btn-group";
btnGroup.setAttribute("role", "group");
// === Buttons Cell ===
const copyButton = document.createElement('button');
copyButton.type = 'button';
@@ -185,9 +190,9 @@ function addRowApi(apiKey, publicId) {
deleteIcon.className = 'bi bi-trash3';
deleteButton.appendChild(deleteIcon);
cellButtons.appendChild(copyButton);
cellButtons.appendChild(document.createTextNode(' ')); // space between buttons
cellButtons.appendChild(deleteButton);
btnGroup.appendChild(copyButton);
btnGroup.appendChild(deleteButton);
cellButtons.appendChild(btnGroup);
// === Permissions Cell ===
const perms = [{

View File

@@ -193,6 +193,8 @@ function addNewUser() {
function addRowUser(userid, name) {
userid = sanitizeId(userid);
let table = document.getElementById("usertable");
let row = table.insertRow(1);
row.id = "row-" + userid;
@@ -215,28 +217,66 @@ function addRowUser(userid, name) {
cellGroup.innerText = "User";
cellLastOnline.innerText = "Never";
cellUploads.innerText = "0";
let buttonResetPw = '<button id="pwchange-' + userid + '" type="button" class="btn btn-outline-light btn-sm" onclick="showResetPwModal(\'' + userid + '\', \'' + name + '\')" title="Reset Password"><i class="bi bi-key-fill"></i></button>&nbsp; ';
cellActions.innerHTML = '<button id="changeRank_' + userid + '" type="button" onclick="changeRank( ' + userid + ' , \'ADMIN\', \'changeRank_' + userid + '\')" title="Promote User" class="btn btn-outline-light btn-sm"><i class="bi bi-chevron-double-up"></i></button>&nbsp; <button id="delete-' + userid + '" type="button" class="btn btn-outline-danger btn-sm" onclick="showDeleteModal(' + userid + ', \'' + name + '\')" title="Delete"><i class="bi bi-trash3"></i></button>';
// Create one button group
const btnGroup = document.createElement("div");
btnGroup.className = "btn-group";
btnGroup.setAttribute("role", "group");
// Password reset button (optional)
if (isInternalAuth) {
cellActions.innerHTML = buttonResetPw+cellActions.innerHTML;
const btnResetPw = document.createElement("button");
btnResetPw.id = `pwchange-${userid}`;
btnResetPw.type = "button";
btnResetPw.className = "btn btn-outline-light btn-sm";
btnResetPw.title = "Reset Password";
btnResetPw.onclick = () => showResetPwModal(userid, name);
btnResetPw.innerHTML = `<i class="bi bi-key-fill"></i>`;
btnGroup.appendChild(btnResetPw);
}
// Promote button
const btnPromote = document.createElement("button");
btnPromote.id = `changeRank_${userid}`;
btnPromote.type = "button";
btnPromote.className = "btn btn-outline-light btn-sm";
btnPromote.title = "Promote User";
btnPromote.onclick = () => changeRank(userid, 'ADMIN', `changeRank_${userid}`);
btnPromote.innerHTML = `<i class="bi bi-chevron-double-up"></i>`;
btnGroup.appendChild(btnPromote);
// Delete button
const btnDelete = document.createElement("button");
btnDelete.id = `delete-${userid}`;
btnDelete.type = "button";
btnDelete.className = "btn btn-outline-danger btn-sm";
btnDelete.title = "Delete";
btnDelete.onclick = () => showDeleteModal(userid, name);
btnDelete.innerHTML = `<i class="bi bi-trash3"></i>`;
btnGroup.appendChild(btnDelete);
// Insert button group into cellActions
cellActions.innerHTML = '';
cellActions.appendChild(btnGroup);
// Permissions
cellPermissions.innerHTML = `
<i id="perm_replace_` + userid + `" class="bi bi-recycle perm-notgranted " title="Replace own uploads" onclick='changeUserPermission(` + userid + `,"PERM_REPLACE", "perm_replace_` + userid + `");'></i>
<i id="perm_list_` + userid + `" class="bi bi-eye perm-notgranted " title="List other uploads" onclick='changeUserPermission(` + userid + `,"PERM_LIST", "perm_list_` + userid + `");'></i>
<i id="perm_edit_` + userid + `" class="bi bi-pencil perm-notgranted " title="Edit other uploads" onclick='changeUserPermission(` + userid + `,"PERM_EDIT", "perm_edit_` + userid + `");'></i>
<i id="perm_delete_` + userid + `" class="bi bi-trash3 perm-notgranted " title="Delete other uploads" onclick='changeUserPermission(` + userid + `,"PERM_DELETE", "perm_delete_` + userid + `");'></i>
<i id="perm_replace_other_` + userid + `" class="bi bi-arrow-left-right perm-notgranted " title="Replace other uploads" onclick='changeUserPermission(` + userid + `,"PERM_REPLACE_OTHER", "perm_replace_other_` + userid + `");'></i>
<i id="perm_logs_` + userid + `" class="bi bi-card-list perm-notgranted " title="Manage system logs" onclick='changeUserPermission(` + userid + `,"PERM_LOGS", "perm_logs_` + userid + `");'></i>
<i id="perm_replace_${userid}" class="bi bi-recycle perm-notgranted " title="Replace own uploads" onclick='changeUserPermission(${userid},"PERM_REPLACE", "perm_replace_${userid}");'></i>
<i id="perm_users_` + userid + `" class="bi bi-people perm-notgranted " title="Manage users" onclick='changeUserPermission(` + userid + `,"PERM_USERS", "perm_users_` + userid + `");'></i>
<i id="perm_list_${userid}" class="bi bi-eye perm-notgranted " title="List other uploads" onclick='changeUserPermission(${userid},"PERM_LIST", "perm_list_${userid}");'></i>
<i id="perm_edit_${userid}" class="bi bi-pencil perm-notgranted " title="Edit other uploads" onclick='changeUserPermission(${userid},"PERM_EDIT", "perm_edit_${userid}");'></i>
<i id="perm_delete_${userid}" class="bi bi-trash3 perm-notgranted " title="Delete other uploads" onclick='changeUserPermission(${userid},"PERM_DELETE", "perm_delete_${userid}");'></i>
<i id="perm_replace_other_${userid}" class="bi bi-arrow-left-right perm-notgranted " title="Replace other uploads" onclick='changeUserPermission(${userid},"PERM_REPLACE_OTHER", "perm_replace_other_${userid}");'></i>
<i id="perm_logs_${userid}" class="bi bi-card-list perm-notgranted " title="Manage system logs" onclick='changeUserPermission(${userid},"PERM_LOGS", "perm_logs_${userid}");'></i>
<i id="perm_users_${userid}" class="bi bi-people perm-notgranted " title="Manage users" onclick='changeUserPermission(${userid},"PERM_USERS", "perm_users_${userid}");'></i>
<i id="perm_api_${userid}" class="bi bi-sliders2 perm-notgranted " title="Manage API keys" onclick='changeUserPermission(${userid},"PERM_API", "perm_api_${userid}");'></i>`;
<i id="perm_api_` + userid + `" class="bi bi-sliders2 perm-notgranted " title="Manage API keys" onclick='changeUserPermission(` + userid + `,"PERM_API", "perm_api_` + userid + `");'></i>`;
setTimeout(() => {
@@ -247,5 +287,12 @@ function addRowUser(userid, name) {
cellPermissions.classList.remove("newUser");
cellActions.classList.remove("newUser");
}, 700);
}
function sanitizeId(id) {
const numericId = id.toString().trim();
if (!/^\d+$/.test(numericId)) {
throw new Error("Invalid ID: must contain only digits.");
}
return numericId;
}

File diff suppressed because one or more lines are too long

View File

@@ -57,8 +57,9 @@
</td>
<td>
<div class="btn-group" role="group">
{{if $.IsInternalAuth}}
<button id="pwchange-{{ .User.Id }}" type="button" class="btn btn-outline-light btn-sm" {{if or (eq .User.UserLevel 0) (eq .User.Id $.ActiveUser.Id)}}disabled{{end}} onclick="showResetPwModal('{{ .User.Id }}', '{{ .User.Name }}')" title="Reset Password"><i class="bi bi-key-fill"></i></button>&nbsp;
<button id="pwchange-{{ .User.Id }}" type="button" class="btn btn-outline-light btn-sm" {{if or (eq .User.UserLevel 0) (eq .User.Id $.ActiveUser.Id)}}disabled{{end}} onclick="showResetPwModal('{{ .User.Id }}', '{{ .User.Name }}')" title="Reset Password"><i class="bi bi-key-fill"></i></button>
{{end}}
{{if gt .User.UserLevel 1}}
@@ -70,7 +71,8 @@
{{ end }}
&nbsp;<button id="delete-{{ .User.Id }}" type="button" class="btn btn-outline-danger btn-sm" {{if or (eq .User.UserLevel 0) (eq .User.Id $.ActiveUser.Id)}}disabled{{end}} onclick="showDeleteModal('{{ .User.Id }}', '{{ .User.Name }}')" title="Delete"><i class="bi bi-trash3"></i></button></td>
<button id="delete-{{ .User.Id }}" type="button" class="btn btn-outline-danger btn-sm" {{if or (eq .User.UserLevel 0) (eq .User.Id $.ActiveUser.Id)}}disabled{{end}} onclick="showDeleteModal('{{ .User.Id }}', '{{ .User.Name }}')" title="Delete"><i class="bi bi-trash3"></i></button>
</div></td>
</tr>
{{ end }}
</tbody>

View File

@@ -5,5 +5,5 @@
// use a cached version, if the file has been updated
{{define "js_admin_version"}}10{{end}}
{{define "js_dropzone_version"}}5{{end}}
{{define "js_e2eversion"}}5{{end}}
{{define "js_e2eversion"}}6{{end}}
{{define "css_main"}}5{{end}}