Business/ManagePanel
2
0
Fork 1
Code Issues 1 Pull Requests Releases Wiki Activity

Redesign permission UI (close #2)

Browse Source
This commit is contained in:
Skylar Ittner 2017-12-16 13:38:20 -07:00
parent d77d7f0896
commit 9de8dda3e5
10 changed files with 281 additions and 253 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
action.php
View File

@ -149,12 +149,35 @@ switch ($VARS['action']) {
}
$database->delete('managers', ['AND' => ['managerid' => $VARS['mid'], 'employeeid' => $VARS['eid']]]);
returnToSender("relationship_deleted");
case "editperms":
if (!$database->has('accounts', ['username' => $VARS['user']])) {
returnToSender("invalid_userid");
}
$uid = $database->select('accounts', 'uid', ['username' => $VARS['user']])[0];
$already_assigned = $database->select('assigned_permissions', 'permid', ['uid' => $uid]);
$permids = [];
foreach ($VARS['permissions'] as $perm) {
if (!$database->has('permissions', ['permcode' => $perm])) {
returnToSender("permission_not_exists", htmlentities($perm));
}
$permid = $database->get('permissions', 'permid', ['permcode' => $perm]);
$permids[] = $permid;
$already_assigned = array_diff($already_assigned, [$permid]); // Remove permission from old list
}
foreach ($already_assigned as $permid) {
$database->delete('assigned_permissions', ["AND" => ['uid' => $uid, 'permid' => $permid]]);
}
foreach ($permids as $permid) {
$database->insert('assigned_permissions', ['uid' => $uid, 'permid' => $permid]);
}
returnToSender("permissions_assigned", "", ["user" => $VARS['user']]);
case "addpermission":
if (!$database->has('accounts', ['username' => $VARS['user']])) {
returnToSender("invalid_userid");
}
if (!$database->has('permissions', ['permcode' => $VARS['perm']])) {
returnToSender("permission_not_exists");
returnToSender("permission_not_exists", htmlentities($VARS['perm']));
}
$uid = $database->select('accounts', 'uid', ['username' => $VARS['user']])[0];
$pid = $database->select('permissions', 'permid', ['permcode' => $VARS['perm']])[0];
@ -165,7 +188,7 @@ switch ($VARS['action']) {
returnToSender("invalid_userid");
}
if (!$database->has('permissions', ['permid' => $VARS['pid']])) {
returnToSender("permission_not_exists");
returnToSender("permission_not_exists", htmlentities($VARS['pid']));
}
$database->delete('assigned_permissions', ['AND' => ['uid' => $VARS['uid'], 'permid' => $VARS['pid']]]);
returnToSender("permission_deleted");

8
lang/en_us.php
View File

@ -78,7 +78,7 @@ define("STRINGS", [
"delete permission" => "Delete Permission",
"adding permission" => "Adding Permission",
"user" => "User",
"permission does not exist" => "Permission does not exist.",
"permission does not exist" => "Permission does not exist: {arg}",
"really delete permission" => "Are you sure you want to revoke this permission?",
"permission added" => "Permission assigned.",
"permission deleted" => "Permission deleted.",
@ -107,5 +107,9 @@ define("STRINGS", [
"manager username" => "Mgr. Username",
"employee name" => "Employee",
"employee username" => "Emp. Username",
"permission id" => "Perm. ID"
"permission id" => "Perm. ID",
"permissions assigned" => "Permissions assigned.",
"type to select a user" => "Type to select a user",
"type to add a permission" => "Type to add a permission",
"select a user to view or edit permissions" => "Select a user to view or edit the assigned permissions."
]);

4
lang/messages.php
View File

@ -45,6 +45,10 @@ define("MESSAGES", [
"string" => "permission does not exist",
"type" => "danger"
],
"permissions_assigned" => [
"string" => "permissions assigned",
"type" => "success"
],
"permission_added" => [
"string" => "permission added",
"type" => "success"

20
pages.php
View File

@ -64,29 +64,13 @@ define("PAGES", [
"title" => "permissions",
"navbar" => true,
"icon" => "key",
"styles" => [
"static/css/datatables.min.css",
"static/css/tables.css"
],
"scripts" => [
"static/js/datatables.min.js",
"static/js/permissions.js"
],
],
"addpermission" => [
"title" => "new permission",
"navbar" => false,
"styles" => [
"static/css/easy-autocomplete.min.css"
],
"scripts" => [
"static/js/jquery.easy-autocomplete.min.js",
"static/js/addpermission.js"
]
],
"delpermission" => [
"title" => "delete permission",
"navbar" => false
"static/js/permissions.js"
],
],
"export" => [
"title" => "report export",

38
pages/addpermission.php
View File

@ -1,38 +0,0 @@
<?php
require_once __DIR__ . '/../required.php';
redirectifnotloggedin();
?>
<form role="form" action="action.php" method="POST">
<div class="panel panel-blue">
<div class="panel-heading">
<h3 class="panel-title">
<i class="fa fa-plus"></i> <?php lang("adding permission"); ?>
</h3>
</div>
<div class="panel-body">
<div class="row">
<div class="col-xs-12 col-md-6">
<div class="form-group">
<label for="user"><i class="fa fa-id-card-o"></i> <?php lang("user"); ?></label>
<input type="text" class="form-control" name="user" id="user" required="required" />
</div>
</div>
<div class="col-xs-12 col-md-6">
<div class="form-group">
<label for="perm"><i class="fa fa-user"></i> <?php lang("permission"); ?></label>
<input type="text" class="form-control" name="perm" id="perm" required="required" />
</div>
</div>
</div>
</div>
<input type="hidden" name="action" value="addpermission" />
<input type="hidden" name="source" value="permissions" />
<div class="panel-footer">
<button type="submit" class="btn btn-success"><i class="fa fa-floppy-o"></i> <?php lang("save"); ?></button>
</div>
</div>
</form>

54
pages/delpermission.php
View File

@ -1,54 +0,0 @@
<?php
require_once __DIR__ . "/../required.php";
redirectifnotloggedin();
if (is_empty($VARS['uid'])) {
header('Location: app.php?page=permissions&msg=user_not_exists');
die();
}
if (!$database->has('permissions', ['permid' => $VARS['pid']])) {
header('Location: app.php?page=permissions&msg=permission_not_exists');
die();
}
?>
<div class="row">
<div class="col-xs-12 col-sm-6 col-sm-offset-3">
<div class="panel panel-danger">
<div class="panel-heading">
<h3 class="panel-title">
<?php lang("delete permission") ?>
</h3>
</div>
<div class="panel-body">
<div class="center-text">
<p><i class="fa fa-exclamation-triangle fa-5x"></i></p>
<h4><?php lang("really delete permission") ?></h4>
<?php
$data = $database->select('assigned_permissions', [
"[>]accounts" => ['uid' => 'uid'],
"[>]permissions" => ['permid' => 'permid']
], [
'username',
'realname',
'permcode',
'perminfo'
], ["AND" => ['assigned_permissions.permid' => $VARS['pid'], 'assigned_permissions.uid' => $VARS['uid']]])[0];
?>
<div class="list-group">
<div class="list-group-item">
<i class="fa fa-fw fa-user"></i> <?php echo $data['realname']; ?> (<?php echo $data['username']; ?>)
</div>
<div class="list-group-item">
<i class="fa fa-fw fa-key"></i> <?php echo $data['permcode']; ?> (<?php echo $data['perminfo']; ?>)
</div>
</div>
</div>
</div>
<div class="panel-footer">
<a href="action.php?action=delpermission&source=permissions&uid=<?php echo htmlspecialchars($VARS['uid']); ?>&pid=<?php echo htmlspecialchars($VARS['pid']); ?>" class="btn btn-danger"><i class="fa fa-times"></i> <?php lang('delete'); ?></a>
<a href="app.php?page=permissions" class="btn btn-primary pull-right"><i class="fa fa-arrow-left"></i> <?php lang('cancel'); ?></a>
</div>
</div>
</div>
</div>

94
pages/permissions.php
View File

@ -2,26 +2,78 @@
require_once __DIR__ . '/../required.php';
redirectifnotloggedin();
$perms = [];
$permissions = false;
$user = "";
if ($VARS['user'] && $database->has('accounts', ['username' => $VARS['user']])) {
$user = $VARS['user'];
require_once __DIR__ . "/../lib/userinfo.php";
$uid = getUserByUsername($user)['uid'];
$perms = $database->select('assigned_permissions', ["[>]permissions" => ["permid" => "permid"]], ['permissions.permid', 'permcode', 'perminfo'], ['uid' => $uid]);
$permissions = true;
}
?>
<div class="btn-group mgn-btm-10px">
<a href="app.php?page=addpermission" class="btn btn-success"><i class="fa fa-plus"></i> <?php lang("new permission"); ?></a>
<?php if ($permissions !== false) { ?>
<form role="form" action="action.php" method="POST">
<?php } ?>
<div class="alert alert-brown"><?php lang("select a user to view or edit permissions"); ?></div>
<div class="row">
<div class="col-xs-12 col-md-6">
<div class="form-group">
<label for="user-box"><i class="fa fa-id-card-o"></i> <?php lang("user"); ?></label><br />
<div class="row">
<div class="col-xs-8 col-sm-10 col-md-9 col-lg-10">
<input type="text"<?php if ($permissions === false) { ?>id="user-box"<?php } ?> class="form-control" value="<?php echo $user ?>" name="user" placeholder="<?php lang("type to select a user"); ?>" <?php if ($permissions !== false) { echo "readonly"; }?>/>
</div>
<div class="col-xs-4 col-sm-2 col-md-3 col-lg-2">
<?php if ($permissions === false) { ?>
<button class="btn btn-default" type="button" id="selectuserbtn"><i class="fa fa-chevron-right"></i> <?php lang("next") ?></button>
<?php } ?>
</div>
</div>
</div>
</div>
<?php
if ($permissions !== false) {
?>
<div class="col-xs-12 col-md-6">
<label for="perms-box"><i class="fa fa-user"></i> <?php lang("permissions"); ?></label><br />
<div class="row">
<div class="col-xs-8 col-sm-10 col-md-9 col-lg-10">
<input type="text" id="perms-box" class="form-control" placeholder="<?php lang("type to add a permission") ?>" />
</div>
<div class="col-xs-4 col-sm-2 col-md-3 col-lg-2">
<button class="btn btn-default" type="button" id="addpermbtn"><i class="fa fa-plus"></i> <?php lang("add") ?></button>
</div>
</div>
<div class="panel" id="permslist-panel">
<div class="list-group" id="permslist">
<?php
foreach ($perms as $perm) {
?>
<div class="list-group-item" data-permcode="<?php echo $perm['permcode']; ?>">
<?php echo $perm['permcode']; ?> <div class="btn btn-danger btn-sm pull-right rmperm"><i class="fa fa-trash-o"></i></div><input type="hidden" name="permissions[]" value="<?php echo $perm['permcode']; ?>" />
<p class="small"><?php echo $perm['perminfo']; ?></p>
</div>
<?php
}
?>
</div>
</div>
</div>
<?php
}
?>
</div>
</div>
<table id="permtable" class="table table-bordered table-striped">
<thead>
<tr>
<th data-priority="0"></th>
<th data-priority="1"><?php lang('actions'); ?></th>
<th data-priority="1"><i class="fa fa-fw fa-user hidden-xs"></i> <?php lang('user'); ?></th>
<th data-priority="1"><i class="fa fa-fw fa-key hidden-xs"></i> <?php lang('permission'); ?></th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<th data-priority="0"></th>
<th data-priority="1"><?php lang('actions'); ?></th>
<th data-priority="1"><i class="fa fa-fw fa-user hidden-xs"></i> <?php lang('user'); ?></th>
<th data-priority="1"><i class="fa fa-fw fa-key hidden-xs"></i> <?php lang('permission'); ?></th>
</tfoot>
</table>
<input type="hidden" name="action" value="editperms" />
<input type="hidden" name="source" value="permissions" />
<?php if ($permissions !== false) { ?>
<button type="submit" class="btn btn-success pull-right" id="save-btn"><i class="fa fa-floppy-o"></i> <?php lang("save"); ?></button>
</form>
<?php } ?>

47
static/js/addpermission.js
View File

@ -1,47 +0,0 @@
$("#user").easyAutocomplete({
url: "action.php",
ajaxSettings: {
dataType: "json",
method: "GET",
data: {
action: "autocomplete_user"
}
},
preparePostData: function (data) {
data.q = $("#user").val();
return data;
},
getValue: function (element) {
return element.username;
},
template: {
type: "custom",
method: function (value, item) {
return item.name + " <i class=\"small\">" + item.username + "</i>";
}
}
});
$("#perm").easyAutocomplete({
url: "action.php",
ajaxSettings: {
dataType: "json",
method: "GET",
data: {
action: "autocomplete_permission"
}
},
preparePostData: function (data) {
data.q = $("#perm").val();
return data;
},
getValue: function (element) {
return element.name;
},
template: {
type: "custom",
method: function (value, item) {
return item.name + " <i class=\"small\">" + item.info + "</i>";
}
}
});

52
static/js/managers.js
View File

@ -1,3 +1,26 @@
function addPerson(p) {
p = p.trim();
if (p == "") {
return false;
}
if ($("#peoplelist div[data-user=" + p + "]").length) {
$("#peoplelist .list-group-item[data-user=" + p + "]").animate({
backgroundColor: "#ff0000",
}, 500, "linear", function () {
$("#peoplelist .list-group-item[data-user=" + p + "]").animate({
backgroundColor: "#ffffff",
}, 500);
});
return false;
}
$('#peoplelist').append("<div class=\"list-group-item\" data-user=\"" + p + "\">" + p + "<div class=\"btn btn-danger btn-sm pull-right rmperson\"><i class=\"fa fa-trash-o\"></i></div><input type=\"hidden\" name=\"employees[]\" value=\"" + p + "\" /></div>");
$("#people-box").val("");
}
function removePerson(p) {
$("#peoplelist div[data-user=" + p + "]").remove();
}
var empoptions = {
url: "action.php",
ajaxSettings: {
@ -25,7 +48,8 @@ var empoptions = {
var value = $("#people-box").getSelectedItemData().username;
addPerson(value);
}
}
},
requestDelay: 500
};
$("#people-box").easyAutocomplete(empoptions);
@ -57,7 +81,8 @@ var manoptions = {
var value = $("#manager-box").getSelectedItemData().username;
document.location.href = "app.php?page=managers&man=" + value;
}
}
},
requestDelay: 500
};
$("#manager-box").easyAutocomplete(manoptions);
@ -90,29 +115,6 @@ $("#addpersonbtn").click(function () {
addPerson($("#people-box").val());
});
function addPerson(p) {
p = String.trim(p);
if (p == "") {
return false;
}
if ($("#peoplelist div[data-user=" + p + "]").length) {
$("#peoplelist .list-group-item[data-user=" + p + "]").animate({
backgroundColor: "#ff0000",
}, 500, "linear", function () {
$("#peoplelist .list-group-item[data-user=" + p + "]").animate({
backgroundColor: "#ffffff",
}, 500);
});
return false;
}
$('#peoplelist').append("<div class=\"list-group-item\" data-user=\"" + p + "\">" + p + "<div class=\"btn btn-danger btn-sm pull-right rmperson\"><i class=\"fa fa-trash-o\"></i></div><input type=\"hidden\" name=\"employees[]\" value=\"" + p + "\" /></div>");
$("#people-box").val("");
}
function removePerson(p) {
$("#peoplelist div[data-user=" + p + "]").remove();
}
$('#peoplelist').on("click", ".rmperson", function () {
removePerson($(this).parent().data("user"));
});

186
static/js/permissions.js
View File

@ -1,47 +1,145 @@
$('#permtable').DataTable({
responsive: {
details: {
display: $.fn.dataTable.Responsive.display.modal({
header: function (row) {
var data = row.data();
return "<i class=\"fa fa-key fa-fw\"></i> " + data[2] + " | " + data[3];
}
}),
renderer: $.fn.dataTable.Responsive.renderer.tableAll({
tableClass: 'table'
}),
type: "column"
}
function addPermission(permcode, permdesc) {
permcode = permcode.trim().toUpperCase();
if (permcode == "") {
return false;
}
if ($("#permslist div[data-permcode=" + permcode + "]").length) {
$("#permslist .list-group-item[data-permcode=" + permcode + "]").animate({
backgroundColor: "#ff0000",
}, 500, "linear", function () {
$("#permslist .list-group-item[data-permcode=" + permcode + "]").animate({
backgroundColor: "#ffffff",
}, 500);
});
return false;
}
if (typeof permdesc == "undefined") {
$.post("action.php", {
action: 'autocomplete_permission',
q: $("#perms-box").val()
}, function (resp) {
if (resp.length === 0) {
return;
}
if (resp.length === 1) {
permdesc = resp[0].info;
} else {
for (var i = 0; i < resp.length; i++) {
if (resp[i].name == permcode) {
permdesc = resp[i].info;
break;
}
}
if (typeof permdesc == "undefined") {
return;
}
}
$('#permslist').append("<div class=\"list-group-item\" data-permcode=\"" + permcode + "\">" + permcode + "<div class=\"btn btn-danger btn-sm pull-right rmperm\"><i class=\"fa fa-trash-o\"></i></div><input type=\"hidden\" name=\"permissions[]\" value=\"" + permcode + "\" /> <p class=\"small\">" + permdesc + "</p></div>");
$("#perms-box").val("");
}, "json");
} else {
$('#permslist').append("<div class=\"list-group-item\" data-permcode=\"" + permcode + "\">" + permcode + "<div class=\"btn btn-danger btn-sm pull-right rmperm\"><i class=\"fa fa-trash-o\"></i></div><input type=\"hidden\" name=\"permissions[]\" value=\"" + permcode + "\" /> <p class=\"small\">" + permdesc + "</p></div>");
$("#perms-box").val("");
}
}
function removePermission(permcode) {
$("#permslist div[data-permcode=" + permcode + "]").remove();
}
var options = {
url: "action.php",
ajaxSettings: {
dataType: "json",
method: "GET",
data: {
action: "autocomplete_user"
}
},
columnDefs: [
{
targets: 0,
className: 'control',
orderable: false
},
{
targets: 1,
orderable: false
}
],
order: [
[2, 'asc']
],
serverSide: true,
ajax: {
url: "lib/getpermtable.php",
dataFilter: function (data) {
var json = jQuery.parseJSON(data);
json.data = [];
json.perms.forEach(function (row) {
json.data.push([
"",
row.delbtn,
row.realname + " (" + row.username + ")",
row.permcode
]);
});
return JSON.stringify(json);
}
preparePostData: function (data) {
data.q = $("#user-box").val();
return data;
},
getValue: function (element) {
return element.username;
},
template: {
type: "custom",
method: function (value, item) {
return item.name + " <i class=\"small\">" + item.username + "</i>";
}
},
list: {
onClickEvent: function () {
var value = $("#user-box").getSelectedItemData().username;
document.location.href = "app.php?page=permissions&user=" + value;
}
},
requestDelay: 500
};
$("#perms-box").easyAutocomplete({
url: "action.php",
ajaxSettings: {
dataType: "json",
method: "GET",
data: {
action: "autocomplete_permission"
}
},
preparePostData: function (data) {
data.q = $("#perms-box").val();
return data;
},
getValue: function (element) {
return element.name;
},
template: {
type: "custom",
method: function (value, item) {
return item.name + " <i class=\"small\">" + item.info + "</i>";
}
},
list: {
onClickEvent: function () {
var permcode = $("#perms-box").getSelectedItemData().name;
var permdesc = $("#perms-box").getSelectedItemData().info;
addPermission(permcode, permdesc);
}
},
requestDelay: 500
});
$("#user-box").easyAutocomplete(options);
$("#user-box").keyup(function (e) {
if (e.keyCode == 13) {
$("#selectuserbtn").click();
}
});
$("#selectuserbtn").click(function () {
document.location.href = "app.php?page=permissions&user=" + $("#user-box").val();
});
$("#perms-box").keyup(function (event) {
if (event.keyCode == 13) {
$("#addpermbtn").click();
event.preventDefault();
return false;
}
});
$("#perms-box").keydown(function (event) {
if (event.keyCode == 13) {
event.preventDefault();
return false;
}
});
$("#addpermbtn").click(function () {
addPermission($("#perms-box").val());
});
$('#permslist').on("click", ".rmperm", function () {
removePermission($(this).parent().data("permcode"));
});