mirror of https://github.com/itflow-org/itflow
Update UI/UX for Adding and editing roles, Permissions can be set upon role add nice blocker style radios buttons instead of select boxes
This commit is contained in:
johnnyq
parent
91aba13c0d
commit
4079257739
|
|
@ -11,52 +11,203 @@ ob_start();
|
|||
<span>×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<form action="post.php" method="post" enctype="multipart/form-data" autocomplete="off">
|
||||
<input type="hidden" name="csrf_token" value="<?php echo $_SESSION['csrf_token'] ?>">
|
||||
<input type="hidden" name="csrf_token" value="<?= $_SESSION['csrf_token'] ?>">
|
||||
|
||||
<div class="modal-body">
|
||||
|
||||
<ul class="nav nav-pills nav-justified mb-3">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="pill" href="#pills-role-details">Details</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="pill" href="#pills-role-permissions">Permissions</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="tab-content">
|
||||
|
||||
<div class="form-group">
|
||||
<label>Name <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-user-shield"></i></span>
|
||||
<!-- DETAILS TAB -->
|
||||
<div class="tab-pane fade show active" id="pills-role-details">
|
||||
|
||||
<div class="form-group">
|
||||
<label>Name <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-user-shield"></i></span>
|
||||
</div>
|
||||
<input type="text" class="form-control" name="role_name" placeholder="Role Name" maxlength="200" required>
|
||||
</div>
|
||||
<input type="text" class="form-control" name="role_name" placeholder="Role Name" maxlength="200" required>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>Description <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-chevron-right"></i></span>
|
||||
</div>
|
||||
<input type="text" class="form-control" name="role_description" placeholder="Role Description" maxlength="200" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>Admin Access <strong class="text-danger">*</strong></label>
|
||||
|
||||
<div class="custom-control custom-radio mb-2">
|
||||
<input type="radio" class="custom-control-input" id="admin_no" name="role_is_admin" value="0" checked required>
|
||||
<label class="custom-control-label" for="admin_no">
|
||||
No - use permissions on the next tab
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="custom-control custom-radio">
|
||||
<input type="radio" class="custom-control-input" id="admin_yes" name="role_is_admin" value="1" required>
|
||||
<label class="custom-control-label" for="admin_yes">
|
||||
Yes - this role should have full admin access
|
||||
</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>Description <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-chevron-right"></i></span>
|
||||
</div>
|
||||
<input type="text" class="form-control" name="role_description" placeholder="Role Description" maxlength="200" required>
|
||||
</div>
|
||||
</div>
|
||||
<!-- PERMISSIONS TAB -->
|
||||
<div class="tab-pane fade" id="pills-role-permissions">
|
||||
|
||||
<div class="form-group">
|
||||
<label>Admin Access <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-tools"></i></span>
|
||||
<?php
|
||||
// Enumerate modules
|
||||
$sql_modules = mysqli_query($mysqli, "SELECT * FROM modules");
|
||||
while ($row_modules = mysqli_fetch_assoc($sql_modules)) {
|
||||
|
||||
$module_id = intval($row_modules['module_id']);
|
||||
|
||||
// raw for name, escaped for display
|
||||
$module_name_raw = $row_modules['module_name'];
|
||||
$module_name_display = ucfirst(str_replace("module_", "", $module_name_raw));
|
||||
|
||||
$module_name_display_safe = nullable_htmlentities($module_name_display);
|
||||
$module_description = nullable_htmlentities($row_modules['module_description']);
|
||||
|
||||
// default for new role
|
||||
$module_permission = 0;
|
||||
|
||||
$field_name = $module_id . "##" . $module_name_raw;
|
||||
$group_id = "perm_group_$module_id";
|
||||
?>
|
||||
|
||||
<div class="form-group">
|
||||
<label><?= $module_name_display_safe ?> <strong class="text-danger">*</strong></label>
|
||||
|
||||
<div class="btn-group btn-group-toggle btn-block" data-toggle="buttons" role="group"
|
||||
aria-label="Permissions for <?= $module_name_display_safe ?>">
|
||||
|
||||
<label class="btn btn-outline-secondary btn-sm active" title="No Access">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_0"
|
||||
value="0"
|
||||
autocomplete="off"
|
||||
checked
|
||||
required
|
||||
>
|
||||
None
|
||||
</label>
|
||||
|
||||
<label class="btn btn-outline-primary btn-sm" title="Viewing Only">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_1"
|
||||
value="1"
|
||||
autocomplete="off"
|
||||
>
|
||||
<i class="fas fa-fw fa-eye mr-1"></i>Read
|
||||
</label>
|
||||
|
||||
<label class="btn btn-outline-warning btn-sm" title="Read, Edit, Archive">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_2"
|
||||
value="2"
|
||||
autocomplete="off"
|
||||
>
|
||||
<i class="fas fa-fw fa-edit mr-1"></i>Modify
|
||||
</label>
|
||||
|
||||
<label class="btn btn-outline-danger btn-sm" title="Read, Edit, Archive, Delete">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_3"
|
||||
value="3"
|
||||
autocomplete="off"
|
||||
>
|
||||
<i class="fas fa-fw fa-trash mr-1"></i>Full
|
||||
</label>
|
||||
|
||||
</div>
|
||||
|
||||
<small class="form-text text-muted mt-2"><?= $module_description ?></small>
|
||||
</div>
|
||||
<select class="form-control select2" name="role_is_admin" required>
|
||||
<option value="0">No - edit after creation to set permissions</option>
|
||||
<option value="1">Yes - this role should have full admin access</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<?php } // end while ?>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<button type="submit" name="add_role" class="btn btn-primary text-bold"><i class="fas fa-check mr-2"></i>Save</button>
|
||||
<button type="button" class="btn btn-light" data-dismiss="modal"><i class="fas fa-times mr-2"></i>Cancel</button>
|
||||
<button type="submit" name="add_role" class="btn btn-primary text-bold">
|
||||
<i class="fas fa-check mr-2"></i>Create
|
||||
</button>
|
||||
<button type="button" class="btn btn-light" data-dismiss="modal">
|
||||
<i class="fas fa-times mr-2"></i>Cancel
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<script>
|
||||
// Optional: when Admin Yes is selected, disable permission radios + switch to Details tab
|
||||
(function () {
|
||||
function setPermissionsEnabled(enabled) {
|
||||
const permsTab = document.getElementById('pills-role-permissions');
|
||||
if (!permsTab) return;
|
||||
|
||||
permsTab.querySelectorAll('input[type="radio"]').forEach(function (el) {
|
||||
el.disabled = !enabled;
|
||||
});
|
||||
|
||||
// also visually dim the tab content
|
||||
permsTab.style.opacity = enabled ? '1' : '0.5';
|
||||
}
|
||||
|
||||
const adminYes = document.getElementById('admin_yes');
|
||||
const adminNo = document.getElementById('admin_no');
|
||||
|
||||
function refresh() {
|
||||
const isAdmin = adminYes && adminYes.checked;
|
||||
setPermissionsEnabled(!isAdmin);
|
||||
|
||||
if (isAdmin) {
|
||||
// move user back to Details tab (avoids confusion)
|
||||
const detailsTab = document.querySelector('a[href="#pills-role-details"]');
|
||||
if (detailsTab) detailsTab.click();
|
||||
}
|
||||
}
|
||||
|
||||
if (adminYes && adminNo) {
|
||||
adminYes.addEventListener('change', refresh);
|
||||
adminNo.addEventListener('change', refresh);
|
||||
refresh();
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
|
||||
<?php
|
||||
require_once '../../../includes/modal_footer.php';
|
||||
|
|
|
|||
|
|
@ -31,36 +31,36 @@ if (empty($user_names_string)) {
|
|||
$user_names_string = "-";
|
||||
}
|
||||
|
||||
|
||||
// Generate the HTML form content using output buffering.
|
||||
ob_start();
|
||||
|
||||
?>
|
||||
<div class="modal-header bg-dark">
|
||||
<h5 class="modal-title"><i class="fas fa-fw fa-user-shield mr-2"></i>Editing role:
|
||||
<strong><?php echo $role_name; ?></strong></h5>
|
||||
<strong><?= $role_name ?></strong></h5>
|
||||
<button type="button" class="close text-white" data-dismiss="modal">
|
||||
<span>×</span>
|
||||
</button>
|
||||
</div>
|
||||
<form action="post.php" method="post" enctype="multipart/form-data" autocomplete="off">
|
||||
<input type="hidden" name="csrf_token" value="<?php echo $_SESSION['csrf_token'] ?>">
|
||||
<input type="hidden" name="role_id" value="<?php echo $role_id; ?>">
|
||||
<input type="hidden" name="csrf_token" value="<?= $_SESSION['csrf_token'] ?>">
|
||||
<input type="hidden" name="role_id" value="<?= $role_id ?>">
|
||||
<div class="modal-body">
|
||||
|
||||
<ul class="nav nav-pills nav-justified mb-3">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="pill" href="#pills-role-details<?php echo $role_id; ?>">Details</a>
|
||||
<a class="nav-link active" data-toggle="pill" href="#pills-role-details">Details</a>
|
||||
</li>
|
||||
<?php if (!$role_admin) { ?>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="pill" href="#pills-role-access<?php echo $role_id; ?>">Access</a>
|
||||
<a class="nav-link" data-toggle="pill" href="#pills-role-permissions">Permissions</a>
|
||||
</li>
|
||||
<?php } ?>
|
||||
</ul>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="tab-content">
|
||||
|
||||
<div class="tab-pane fade show active" id="pills-role-details<?php echo $role_id; ?>">
|
||||
<div class="tab-pane fade show active" id="pills-role-details">
|
||||
|
||||
<div class="form-group">
|
||||
<label>Name <strong class="text-danger">*</strong></label>
|
||||
|
|
@ -68,7 +68,7 @@ ob_start();
|
|||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-user-shield"></i></span>
|
||||
</div>
|
||||
<input type="text" class="form-control" name="role_name" placeholder="Role Name" maxlength="200" value="<?php echo $role_name; ?>" required>
|
||||
<input type="text" class="form-control" name="role_name" placeholder="Role Name" maxlength="200" value="<?= $role_name ?>" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -78,27 +78,33 @@ ob_start();
|
|||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-chevron-right"></i></span>
|
||||
</div>
|
||||
<input type="text" class="form-control" name="role_description" placeholder="Role Description" maxlength="200" value="<?php echo $role_description; ?>" required>
|
||||
<input type="text" class="form-control" name="role_description" placeholder="Role Description" maxlength="200" value="<?= $role_description ?>" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label>Admin Access <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-tools"></i></span>
|
||||
</div>
|
||||
<select class="form-control select2" name="role_is_admin" required>
|
||||
<option value="1" <?php if ($role_admin) { echo 'selected'; } ?> >Yes - this role should have full admin access</option>
|
||||
<option value="0" <?php if (!$role_admin) { echo 'selected'; } ?>>No - use permissions on the next tab</option>
|
||||
</select>
|
||||
<div class="custom-control custom-radio mb-2">
|
||||
<input type="radio" class="custom-control-input" id="admin_yes" name="role_is_admin" value="1"
|
||||
<?php if ($role_admin) { echo 'checked'; } ?> required>
|
||||
<label class="custom-control-label" for="admin_yes">
|
||||
Yes - this role should have full admin access
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="custom-control custom-radio">
|
||||
<input type="radio" class="custom-control-input" id="admin_no" name="role_is_admin" value="0"
|
||||
<?php if (!$role_admin) { echo 'checked'; } ?> required>
|
||||
<label class="custom-control-label" for="admin_no">
|
||||
No - use permissions on the next tab
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="tab-pane fade" id="pills-role-access<?php echo $role_id; ?>">
|
||||
<?php if (!$role_admin) { ?>
|
||||
<div class="tab-pane fade" id="pills-role-permissions">
|
||||
|
||||
<?php if ($role_admin) { ?>
|
||||
<div class="alert alert-warning"><strong>Module permissions do not apply to Admins.</strong></div>
|
||||
|
|
@ -123,22 +129,73 @@ ob_start();
|
|||
?>
|
||||
|
||||
<div class="form-group">
|
||||
<label> <?php echo $module_name_display ?> <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<select class="form-control select2" name="<?php echo "$module_id##$module_name" ?>" required>
|
||||
<option value="0" <?php if ($module_permission == 0) { echo 'selected'; } ?> >None</option>
|
||||
<option value="1" <?php if ($module_permission == 1) { echo 'selected'; } ?> >Read</option>
|
||||
<option value="2" <?php if ($module_permission == 2) { echo 'selected'; } ?>>Modify (Read, Edit, Archive)</option>
|
||||
<option value="3" <?php if ($module_permission == 3) { echo 'selected'; } ?>>Full (Read, Edit, Archive, Delete)</option>
|
||||
</select>
|
||||
<label> <?= $module_name_display ?> <strong class="text-danger">*</strong></label>
|
||||
<?php
|
||||
$field_name = "$module_id##$module_name";
|
||||
$group_id = "perm_group_$module_id";
|
||||
?>
|
||||
|
||||
<div class="btn-group btn-group-toggle btn-block" data-toggle="buttons" role="group" aria-label="Permissions for <?= $module_name_display ?>">
|
||||
|
||||
<label class="btn btn-outline-secondary btn-sm <?php if ($module_permission == 0) { echo 'active'; } ?>" title="No Access">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_0"
|
||||
value="0"
|
||||
autocomplete="off"
|
||||
<?php if ($module_permission == 0) { echo 'checked'; } ?>
|
||||
required
|
||||
>
|
||||
None
|
||||
</label>
|
||||
|
||||
<label class="btn btn-outline-primary btn-sm <?php if ($module_permission == 1) { echo 'active'; } ?>" title="Viewing Only">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_1"
|
||||
value="1"
|
||||
autocomplete="off"
|
||||
<?php if ($module_permission == 1) { echo 'checked'; } ?>
|
||||
>
|
||||
<i class="fas fa-fw fa-eye mr-1"></i>Read
|
||||
</label>
|
||||
|
||||
<label class="btn btn-outline-warning btn-sm <?php if ($module_permission == 2) { echo 'active'; } ?>" title="Read, Edit, Archive">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_2"
|
||||
value="2"
|
||||
autocomplete="off"
|
||||
<?php if ($module_permission == 2) { echo 'checked'; } ?>
|
||||
>
|
||||
<i class="fas fa-fw fa-edit mr-1"></i>Modify
|
||||
</label>
|
||||
|
||||
<label class="btn btn-outline-danger btn-sm <?php if ($module_permission == 3) { echo 'active'; } ?>" title="Read, Edit, Archive, Delete">
|
||||
<input
|
||||
type="radio"
|
||||
name="<?= $field_name ?>"
|
||||
id="<?= $group_id ?>_3"
|
||||
value="3"
|
||||
autocomplete="off"
|
||||
<?php if ($module_permission == 3) { echo 'checked'; } ?>
|
||||
>
|
||||
<i class="fas fa-fw fa-trash mr-1"></i>Full
|
||||
</label>
|
||||
|
||||
</div>
|
||||
<small class="form-text text-muted"><?php echo $module_description ?></small>
|
||||
|
||||
<small class="form-text text-muted mt-2"><?= $module_description ?></small>
|
||||
|
||||
</div>
|
||||
|
||||
<?php } // End while ?>
|
||||
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -18,9 +18,23 @@ if (isset($_POST['add_role'])) {
|
|||
|
||||
$role_id = mysqli_insert_id($mysqli);
|
||||
|
||||
// Insert role permissions (only if not admin)
|
||||
if ($admin == 0) {
|
||||
foreach ($_POST as $key => $value) {
|
||||
if (str_contains($key, '##module_')) {
|
||||
$module_id = intval(explode('##', $key)[0]);
|
||||
$access_level = intval($value);
|
||||
|
||||
if ($access_level > 0) {
|
||||
mysqli_query($mysqli, "INSERT INTO user_role_permissions SET user_role_id = $role_id, module_id = $module_id, user_role_permission_level = $access_level");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
logAction("User Role", "Create", "$session_name created user role $name", 0, $role_id);
|
||||
|
||||
flash_alert("User Role <strong$name</strong> created");
|
||||
flash_alert("User Role <strong>$name</strong> created");
|
||||
|
||||
redirect();
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue