8 changed files with 405 additions and 632 deletions
@ -1,144 +1,15 @@
|
||||
body { |
||||
margin: auto; |
||||
padding: 10px; |
||||
|
||||
/* Overide jquery ui style with bootstrap */ |
||||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important; |
||||
font-size: 14px !important; |
||||
line-height: 1.42857 !important; |
||||
color: #333 !important; |
||||
padding-top: 10px; |
||||
} |
||||
|
||||
a.glyphicon { |
||||
color: #333 !important; |
||||
} |
||||
|
||||
.delete { |
||||
cursor: pointer; |
||||
} |
||||
|
||||
#header_admin { |
||||
margin : 10px; |
||||
.action { |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.block-grid { |
||||
margin: 20px; |
||||
} |
||||
|
||||
.grid { |
||||
border: 1px solid rgba(0, 0, 0, 0.2); |
||||
} |
||||
|
||||
/*.slick-header-column { |
||||
font-weight: bold; |
||||
border-bottom: 2px solid rgba(0, 0, 0, 0.2) !important; |
||||
}*/ |
||||
|
||||
/* Fix with slickgrid and bootstrap association */ |
||||
.slick-header *, *:before, *.after { |
||||
-moz-box-sizing: content-box; |
||||
box-sizing: content-box; |
||||
.btn .glyphicon { |
||||
top: 2px; |
||||
} |
||||
|
||||
|
||||
/* Editor */ |
||||
/* Slick.Editors.Text, Slick.Editors.Date */ |
||||
input.editor-text { |
||||
width: 100%; |
||||
height: 100%; |
||||
border: 0; |
||||
margin: 0; |
||||
background: transparent; |
||||
outline: 0; |
||||
padding: 0; |
||||
|
||||
} |
||||
|
||||
.ui-datepicker-trigger { |
||||
margin-top: 2px; |
||||
padding: 0; |
||||
vertical-align: top; |
||||
} |
||||
|
||||
/* Slick.Editors.PercentComplete */ |
||||
input.editor-percentcomplete { |
||||
width: 100%; |
||||
height: 100%; |
||||
border: 0; |
||||
margin: 0; |
||||
background: transparent; |
||||
outline: 0; |
||||
padding: 0; |
||||
|
||||
float: left; |
||||
} |
||||
|
||||
.editor-percentcomplete-picker { |
||||
position: relative; |
||||
display: inline-block; |
||||
width: 16px; |
||||
height: 100%; |
||||
background: url("../images/pencil.gif") no-repeat center center; |
||||
overflow: visible; |
||||
z-index: 1000; |
||||
float: right; |
||||
} |
||||
|
||||
.editor-percentcomplete-helper { |
||||
border: 0 solid gray; |
||||
position: absolute; |
||||
top: -2px; |
||||
left: -9px; |
||||
background: url("../images/editor-helper-bg.gif") no-repeat top left; |
||||
padding-left: 9px; |
||||
|
||||
width: 120px; |
||||
height: 140px; |
||||
display: none; |
||||
overflow: visible; |
||||
} |
||||
|
||||
.editor-percentcomplete-wrapper { |
||||
background: beige; |
||||
padding: 20px 8px; |
||||
|
||||
width: 100%; |
||||
height: 98px; |
||||
border: 1px solid gray; |
||||
border-left: 0; |
||||
} |
||||
|
||||
.editor-percentcomplete-buttons { |
||||
float: right; |
||||
} |
||||
|
||||
.editor-percentcomplete-buttons button { |
||||
width: 80px; |
||||
} |
||||
|
||||
.editor-percentcomplete-slider { |
||||
float: left; |
||||
} |
||||
|
||||
.editor-percentcomplete-picker:hover .editor-percentcomplete-helper { |
||||
display: block; |
||||
} |
||||
|
||||
.editor-percentcomplete-helper:hover { |
||||
display: block; |
||||
} |
||||
|
||||
/* Slick.Editors.YesNoSelect */ |
||||
select.editor-yesno { |
||||
width: 100%; |
||||
margin: 0; |
||||
vertical-align: middle; |
||||
} |
||||
|
||||
/* Slick.Editors.Checkbox */ |
||||
input.editor-checkbox { |
||||
margin: 0; |
||||
height: 100%; |
||||
padding: 0; |
||||
border: 0; |
||||
} |
@ -1,37 +1,29 @@
|
||||
<?php |
||||
|
||||
function dateToSql($date) { |
||||
return implode('-', array_reverse(explode('/', $date))); |
||||
} |
||||
|
||||
function dateFromSql($date) { |
||||
return implode('/', array_reverse(explode('-', $date))); |
||||
} |
||||
|
||||
|
||||
function printError($str) { |
||||
echo '<div class="alert alert-danger" role="alert">' . $str . '</div>'; |
||||
} |
||||
|
||||
|
||||
function printSuccess($str) { |
||||
echo '<div class="alert alert-success" role="alert">' . $str . '</div>'; |
||||
} |
||||
|
||||
|
||||
function isInstalled($bdd) { |
||||
$req = $bdd->prepare("SHOW TABLES LIKE 'admin'"); |
||||
$req->execute(); |
||||
|
||||
|
||||
if(!$req->fetch()) |
||||
return false; |
||||
|
||||
|
||||
return true; |
||||
} |
||||
|
||||
|
||||
function hashPass($pass) { |
||||
return password_hash($pass, PASSWORD_DEFAULT); |
||||
} |
||||
|
||||
|
||||
function passEqual($pass, $hash) { |
||||
return password_verify($pass, $hash); |
||||
} |
||||
|
||||
?> |
||||
|
||||
?> |
||||
|
@ -1,41 +1,83 @@
|
||||
<!-- Users grid --> |
||||
<div class="block-grid row" id="user-grid"> |
||||
<div class="grid-header"> |
||||
<label>OpenVPN Users</label> |
||||
<h4> |
||||
OpenVPN Users <button data-toggle="modal" data-target="#modal-user-add" type="button" class="btn btn-success btn-xs"><span class="glyphicon glyphicon-plus"></span></button> |
||||
</h4> |
||||
<table id="table-users" class="table"></table> |
||||
|
||||
<div id="modal-user-add" class="modal fade" tabindex="-1" role="dialog"> |
||||
<div class="modal-dialog" role="document"> |
||||
<div class="modal-content"> |
||||
<div class="modal-header"> |
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> |
||||
<h4 class="modal-title">Add user</h4> |
||||
</div> |
||||
<div class="modal-body"> |
||||
<div class="form-group"> |
||||
<label for="modal-user-add-username">Username</label> |
||||
<input type="text" name="username" id="modal-user-add-username" class="form-control" /> |
||||
</div> |
||||
<div class="form-group"> |
||||
<label for="modal-user-add-password">Password</label> |
||||
<input type="password" name="password" id="modal-user-add-password" class="form-control" /> |
||||
</div> |
||||
</div> |
||||
<div class="modal-footer"> |
||||
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button> |
||||
<button type="button" class="btn btn-primary" id="modal-user-add-save">Save</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="grid" id="grid_user"></div> |
||||
</div> |
||||
|
||||
<!-- Logs grid --> |
||||
<div class="block-grid row" id="log-grid"> |
||||
<div class="grid-header"> |
||||
<label>OpenVPN Logs</label> |
||||
</div> |
||||
<div class="grid" id="grid_log"></div> |
||||
<div id="pager" class="slick-enhancement-pager"></div> |
||||
<h4> |
||||
OpenVPN logs |
||||
</h4> |
||||
<table id="table-logs" class="table"></table> |
||||
</div> |
||||
|
||||
<!-- Admins grid --> |
||||
<div class="block-grid row" id="admin-grid"> |
||||
<div class="grid-header"> |
||||
<label>Web Admins</label> |
||||
<h4> |
||||
Web Admins <button data-toggle="modal" data-target="#modal-admin-add" type="button" class="btn btn-success btn-xs"><span class="glyphicon glyphicon-plus"></span></button> |
||||
</h4> |
||||
<table id="table-admins" class="table"></table> |
||||
|
||||
<div id="modal-admin-add" class="modal fade" tabindex="-1" role="dialog"> |
||||
<div class="modal-dialog" role="document"> |
||||
<div class="modal-content"> |
||||
<div class="modal-header"> |
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> |
||||
<h4 class="modal-title">Add admin</h4> |
||||
</div> |
||||
<div class="modal-body"> |
||||
<div class="form-group"> |
||||
<label for="modal-admin-add-username">Username</label> |
||||
<input type="text" name="username" id="modal-admin-add-username" class="form-control" /> |
||||
</div> |
||||
<div class="form-group"> |
||||
<label for="modal-admin-add-password">Password</label> |
||||
<input type="password" name="password" id="modal-admin-add-password" class="form-control" /> |
||||
</div> |
||||
</div> |
||||
<div class="modal-footer"> |
||||
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button> |
||||
<button type="button" class="btn btn-primary" id="modal-admin-add-save">Save</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="grid" id="grid_admin"></div> |
||||
</div> |
||||
|
||||
<script src="vendor/slickgrid/lib/jquery-1.7.min.js"></script> |
||||
<script src="vendor/slickgrid/lib/jquery-ui-1.8.16.custom.min.js"></script> |
||||
<script src="vendor/slickgrid/lib/jquery.event.drag-2.2.js"></script> |
||||
<script src="vendor/slickgrid/slick.core.js"></script> |
||||
|
||||
|
||||
<script src="vendor/slickgrid/slick.formatters.js"></script> |
||||
<script src="vendor/slickgrid/slick.editors.js"></script> |
||||
<script src="vendor/slickgrid/slick.grid.js"></script> |
||||
|
||||
<script src="vendor/slickgrid-enhancement-pager/libs/jquery.json-2.3.min.js"></script> |
||||
<script src="vendor/slickgrid-enhancement-pager/libs/jquery.dropkick-2.1.6.js"></script> |
||||
<script src="vendor/slickgrid-enhancement-pager/slick.enhancementpager.js"></script> |
||||
|
||||
<script src="vendor/js-sha1/src/sha1.js"></script> |
||||
<script src="js/grids.js"></script> |
||||
<script src="/vendor/jquery/dist/jquery.min.js"></script> |
||||
<script src="/vendor/bootstrap/js/modal.js"></script> |
||||
<script src="/vendor/bootstrap/js/tooltip.js"></script> |
||||
<script src="/vendor/bootstrap/js/popover.js"></script> |
||||
<script src="/vendor/bootstrap-table/dist/bootstrap-table.min.js"></script> |
||||
<script src="/vendor/bootstrap-datepicker/dist/js/bootstrap-datepicker.js"></script> |
||||
<script src="/vendor/bootstrap-table/dist/extensions/editable/bootstrap-table-editable.min.js"></script> |
||||
<script src="/vendor/x-editable/dist/bootstrap3-editable/js/bootstrap-editable.js"></script> |
||||
<script src="/js/grids.js"></script> |
||||
|
@ -1,365 +1,236 @@
|
||||
$(function () { |
||||
"use strict"; |
||||
|
||||
// -------------------- USERS --------------------
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: 'json', |
||||
data: "select=user", |
||||
success: function (json) { |
||||
// Button to format a cell and remove an user
|
||||
function buttonFormatter(row, cell, value, columnDef, dataContext) { |
||||
var button = "<span class='glyphicon glyphicon-remove delete del_user' data-row='" + row + "' id='" + dataContext.user_id + "'></span>"; |
||||
return button; |
||||
} |
||||
|
||||
var i; |
||||
var columns = [ |
||||
{ id: "user_id", name: "ID", field: "user_id", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "user_pass", name: "Pass", field: "user_pass", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "user_mail", name: "Mail", field: "user_mail", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "user_phone", name: "Phone", field: "user_phone", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "user_online", name: "Online", field: "user_online", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "user_enable", name: "Enabled", field: "user_enable", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "user_start_date", name: "Start Date", field: "user_start_date", width: 120, cssClass: "cell-title", editor: Slick.Editors.Date }, |
||||
{ id: "user_end_date", name: "End Date", field: "user_end_date", width: 120, cssClass: "cell-title", editor: Slick.Editors.Date }, |
||||
{ id: "user_del", name: 'Delete', field: "user_del", width: 250, formatter: buttonFormatter } |
||||
]; |
||||
|
||||
// Grid options
|
||||
var options = { |
||||
editable: true, |
||||
enableAddRow: true, |
||||
enableCellNavigation: true, |
||||
asyncEditorLoading: false, |
||||
autoEdit: false, |
||||
autoHeight: true |
||||
}; |
||||
|
||||
var data = []; |
||||
|
||||
// Save the old user_id when the admin update an user
|
||||
var save = null; |
||||
|
||||
var grid = null; |
||||
|
||||
// Action when we want to remove an user
|
||||
$('#user-grid').on('click', '.del_user', function () { |
||||
|
||||
// Remove from the database
|
||||
var me = $(this), id = me.attr('id'); |
||||
var data = grid.getData(); |
||||
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: "json", |
||||
data: { del_user_id: id }, |
||||
success: function() { |
||||
// Remove the line
|
||||
data.splice(me.attr('data-row'), 1); |
||||
grid.setData(data); |
||||
grid.render(); |
||||
}, |
||||
error: function () { |
||||
alert("Error: cannot update the database."); |
||||
} |
||||
});
|
||||
}); |
||||
|
||||
|
||||
for (i = 0; i < json.length; i += 1) { |
||||
data[i] = { |
||||
user_id: json[i].user_id, |
||||
user_pass: json[i].user_pass, |
||||
user_mail: json[i].user_mail, |
||||
user_phone: json[i].user_phone, |
||||
user_online: json[i].user_online, |
||||
user_enable: json[i].user_enable, |
||||
user_start_date: json[i].user_start_date, |
||||
user_end_date: json[i].user_end_date |
||||
}; |
||||
} |
||||
|
||||
// Grid of the users
|
||||
grid = new Slick.Grid($("#grid_user"), data, columns, options); |
||||
|
||||
$("#grid_user").on('click', function () { |
||||
var $active = grid.getActiveCell(); |
||||
|
||||
if ($active && $active.cell === 0) { |
||||
save = $(grid.getActiveCellNode()).html(); |
||||
} else { |
||||
save = null; |
||||
} |
||||
}); |
||||
|
||||
// When we want to modify an user
|
||||
grid.onCellChange.subscribe(function (e, args) { |
||||
var item = args.item; |
||||
|
||||
if (save) |
||||
item.set_user = save; |
||||
else |
||||
item.set_user = item.user_id; |
||||
|
||||
// Remove in the database
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: "json", |
||||
data: item, |
||||
success: function () { |
||||
// If we edited the password, hash it
|
||||
if(args.cell === 1) { |
||||
grid.invalidateRow(args.row); |
||||
data[args.row][grid.getColumns()[args.cell].field] = sha1(data[args.row][grid.getColumns()[args.cell].field]); |
||||
grid.render();
|
||||
} |
||||
}, |
||||
error: function () { |
||||
alert("Error : cannot update the database."); |
||||
} |
||||
}); |
||||
|
||||
delete item.set_user; |
||||
}); |
||||
|
||||
// Add a new user
|
||||
grid.onAddNewRow.subscribe(function (e, args) { |
||||
var item = args.item; |
||||
|
||||
// We only can add a new user if we specify his id
|
||||
if (!item.user_id) |
||||
return; |
||||
|
||||
item.add_user = true; |
||||
|
||||
// Update the database
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: "json", |
||||
data: item, |
||||
success: function(res) { |
||||
// Update the grid
|
||||
grid.invalidateRow(data.length); |
||||
data.push(res); |
||||
grid.updateRowCount(); |
||||
grid.render(); |
||||
}, |
||||
error: function () { |
||||
alert("Error : cannot update the database."); |
||||
} |
||||
}); |
||||
|
||||
delete item.add_user; |
||||
}); |
||||
|
||||
grid.autosizeColumns(); |
||||
// ------------------------- GLOBAL definitions -------------------------
|
||||
var gridsUrl = '/include/grids.php'; |
||||
|
||||
function deleteFormatter() { |
||||
return "<span class='glyphicon glyphicon-remove action'></span"; |
||||
} |
||||
|
||||
function refreshTable($table) { |
||||
$table.bootstrapTable('refresh'); |
||||
} |
||||
|
||||
function onAjaxError (xhr, textStatus, error) { |
||||
console.error(error); |
||||
alert('Error: ' + textStatus); |
||||
} |
||||
|
||||
// ------------------------- USERS definitions -------------------------
|
||||
var $userTable = $('#table-users'); |
||||
var $modalUserAdd = $('#modal-user-add'); |
||||
var $userAddSave = $modalUserAdd.find('#modal-user-add-save'); |
||||
|
||||
function addUser(username, password) { |
||||
$.ajax({ |
||||
url: gridsUrl, |
||||
method: 'POST', |
||||
data: { |
||||
add_user: true, |
||||
user_id: username, |
||||
user_pass: password |
||||
}, |
||||
success: function() { |
||||
refreshTable($userTable); |
||||
}, |
||||
error: onAjaxError |
||||
}); |
||||
} |
||||
|
||||
function deleteUser(user_id) { |
||||
$.ajax({ |
||||
url: gridsUrl, |
||||
data: { |
||||
del_user: true, |
||||
del_user_id: user_id |
||||
}, |
||||
method: 'POST', |
||||
success: function() { |
||||
refreshTable($userTable); |
||||
}, |
||||
error: onAjaxError |
||||
}); |
||||
} |
||||
|
||||
var userEditable = { |
||||
url: gridsUrl, |
||||
params: function (params) { |
||||
params.set_user = true; |
||||
|
||||
return params; |
||||
}, |
||||
error: function () { |
||||
alert('Error : cannot get the data.'); |
||||
success: function () { |
||||
refreshTable($userTable); |
||||
} |
||||
}); |
||||
|
||||
|
||||
// -------------------- ADMINISTRATORS --------------------
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: 'json', |
||||
data: "select=admin", |
||||
success: function (json) { |
||||
// Create the button to remove an administrator
|
||||
function buttonFormatter(row, cell, value, columnDef, dataContext) {
|
||||
var button = "<span class='glyphicon glyphicon-remove delete del_admin' data-row='" + row + "' id='" + dataContext.admin_id + "'></span>"; |
||||
return button; |
||||
} |
||||
|
||||
var i; |
||||
|
||||
// Header
|
||||
var columns = [ |
||||
{ id: "admin_id", name: "Admin ID", field: "admin_id", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "admin_pass", name: "Admin Pass", field: "admin_pass", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "admin_del", name: 'Delete', field: "admin_del", width: 250, formatter: buttonFormatter } |
||||
]; |
||||
} |
||||
|
||||
// ES 2015 so be prudent
|
||||
if (typeof Object.assign == 'function') { |
||||
var userDateEditable = Object.assign({ type: 'date', placement: 'bottom' }, userEditable); |
||||
} else { |
||||
console.warn('Your browser does not support Object.assign. You will not be able to modify the date inputs.'); |
||||
} |
||||
|
||||
|
||||
// ------------------------- ADMIN definitions -------------------------
|
||||
var $adminTable = $('#table-admins'); |
||||
var $modalAdminAdd = $('#modal-admin-add'); |
||||
var $adminAddSave = $modalAdminAdd.find('#modal-admin-add-save'); |
||||
|
||||
function addAdmin(username, password) { |
||||
$.ajax({ |
||||
url: gridsUrl, |
||||
method: 'POST', |
||||
data: { |
||||
add_admin: true, |
||||
admin_id: username, |
||||
admin_pass: password |
||||
}, |
||||
success: function() { |
||||
refreshTable($adminTable); |
||||
}, |
||||
error: onAjaxError |
||||
}); |
||||
} |
||||
|
||||
function deleteAdmin(admin_id) { |
||||
$.ajax({ |
||||
url: gridsUrl, |
||||
data: { |
||||
del_admin: true, |
||||
del_admin_id: admin_id |
||||
}, |
||||
method: 'POST', |
||||
success: function() { |
||||
refreshTable($adminTable); |
||||
}, |
||||
error: onAjaxError |
||||
}); |
||||
} |
||||
|
||||
var adminEditable = { |
||||
url: gridsUrl, |
||||
params: function (params) { |
||||
params.set_admin = true; |
||||
|
||||
return params; |
||||
}, |
||||
success: function () { |
||||
refreshTable($adminTable); |
||||
} |
||||
} |
||||
|
||||
// Grid options
|
||||
var options = { |
||||
editable: true, |
||||
enableAddRow: true, |
||||
enableCellNavigation: true, |
||||
asyncEditorLoading: false, |
||||
autoEdit: false, |
||||
autoHeight: true |
||||
}; |
||||
// ------------------------- ADMIN definitions -------------------------
|
||||
var $logTable = $('#table-logs'); |
||||
|
||||
var data = []; |
||||
var grid = null; |
||||
|
||||
// Save the old admin id when we update one
|
||||
var save = null; |
||||
// -------------------- USERS --------------------
|
||||
|
||||
// When we want to remove an administrator
|
||||
$('#admin-grid').on('click', '.del_admin', function () { |
||||
var me = $(this); |
||||
var id = me.attr('id'); |
||||
var data = grid.getData(); |
||||
|
||||
// Update the database
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: "json", |
||||
data: { del_admin_id: id }, |
||||
success: function() { |
||||
// Update the grid
|
||||
data.splice(me.attr('data-row'), 1); |
||||
grid.setData(data); |
||||
grid.render(); |
||||
}, |
||||
error: function () { |
||||
alert("Error : cannot update the database."); |
||||
// Bootstrap table definition
|
||||
$userTable.bootstrapTable({ |
||||
url: gridsUrl, |
||||
sortable: false, |
||||
queryParams: function (params) { |
||||
params.select = 'user'; |
||||
return params; |
||||
}, |
||||
// Primary key
|
||||
idField: 'user_id', |
||||
columns: [ |
||||
{ title: "ID", field: "user_id", editable: userEditable }, |
||||
{ title: "Pass", field: "user_pass", editable: userEditable }, |
||||
{ title: "Mail", field: "user_mail", editable: userEditable }, |
||||
{ title: "Phone", field: "user_phone", editable: userEditable }, |
||||
{ title: "Online", field: "user_online" }, |
||||
{ title: "Enabled", field: "user_enable" }, |
||||
{ title: "Start Date", field: "user_start_date", editable: userDateEditable }, |
||||
{ title: "End Date", field: "user_end_date", editable: userDateEditable }, |
||||
{ |
||||
title: 'Delete', |
||||
field: "user_del", |
||||
formatter: deleteFormatter, |
||||
events: { |
||||
'click .glyphicon': function (e, value, row) { |
||||
if (confirm('Are you sure you want to delete this user?')) { |
||||
deleteUser(row.user_id); |
||||
} |
||||
} |
||||
}); |
||||
}); |
||||
|
||||
|
||||
for (i = 0; i < json.length; i += 1) { |
||||
data[i] = { |
||||
admin_id: json[i].admin_id, |
||||
admin_pass: json[i].admin_pass |
||||
}; |
||||
} |
||||
} |
||||
] |
||||
}); |
||||
|
||||
grid = new Slick.Grid($("#grid_admin"), data, columns, options); |
||||
|
||||
$("#grid_admin").on('click', function () { |
||||
var $active = grid.getActiveCell(); |
||||
|
||||
if ($active !== undefined && $active.cell === 0) |
||||
save = $(grid.getActiveCellNode()).html(); |
||||
else |
||||
save = null; |
||||
}); |
||||
// When we want to add a user
|
||||
$userAddSave.on('click', function () { |
||||
var $usernameInput = $modalUserAdd.find('input[name=username]'); |
||||
var $passwordInput = $modalUserAdd.find('input[name=password]'); |
||||
addUser($usernameInput.val(), $passwordInput.val()); |
||||
$modalUserAdd.modal('hide'); |
||||
}); |
||||
|
||||
// When we update the administrator
|
||||
grid.onCellChange.subscribe(function (e, args) { |
||||
var item = args.item; |
||||
|
||||
// We save the old admin id
|
||||
if (save) |
||||
item.set_admin = save; |
||||
else |
||||
item.set_admin = item.admin_id; |
||||
// -------------------- ADMINS --------------------
|
||||
|
||||
// Update the database
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: "json", |
||||
data: item, |
||||
success: function() { |
||||
// Hash the password
|
||||
if(args.cell === 1) { |
||||
grid.invalidateRow(args.row); |
||||
data[args.row][grid.getColumns()[args.cell].field] = sha1(data[args.row][grid.getColumns()[args.cell].field]); |
||||
grid.render();
|
||||
// Bootstrap table definition
|
||||
$adminTable.bootstrapTable({ |
||||
url: gridsUrl, |
||||
sortable: false, |
||||
queryParams: function (params) { |
||||
params.select = 'admin'; |
||||
return params; |
||||
}, |
||||
// Primary key
|
||||
idField: 'admin_id', |
||||
columns: [ |
||||
{ title: "ID", field: "admin_id", editable: adminEditable }, |
||||
{ title: "Pass", field: "admin_pass", editable: adminEditable }, |
||||
{ |
||||
title: 'Delete', |
||||
field: "admin_del", |
||||
formatter: deleteFormatter, |
||||
events: { |
||||
'click .glyphicon': function (e, value, row) { |
||||
if (confirm('Are you sure you want to delete this admin?')) { |
||||
deleteAdmin(row.admin_id); |
||||
} |
||||
}, |
||||
error: function () { |
||||
alert("Error : cannot update the database"); |
||||
} |
||||
}); |
||||
|
||||
delete item.set_admin; |
||||
}); |
||||
|
||||
// When we want to add a new administrator
|
||||
grid.onAddNewRow.subscribe(function (e, args) { |
||||
var item = args.item; |
||||
|
||||
// We only add an administrator if we specify the ID
|
||||
if (!item.admin_id) |
||||
return; |
||||
|
||||
item.add_admin = true; |
||||
|
||||
// Update the database
|
||||
$.ajax({ |
||||
type: "POST", |
||||
url: "include/grids.php", |
||||
dataType: "json", |
||||
data: item, |
||||
success: function() { |
||||
// Update the grid
|
||||
grid.invalidateRow(data.length); |
||||
data.push(item); |
||||
grid.updateRowCount(); |
||||
grid.render(); |
||||
}, |
||||
error: function () { |
||||
alert("Error : cannot update the database."); |
||||
} |
||||
}); |
||||
|
||||
delete item.add_admin; |
||||
|
||||
|
||||
}); |
||||
} |
||||
} |
||||
] |
||||
}); |
||||
|
||||
grid.autosizeColumns(); |
||||
}, |
||||
error: function () { |
||||
alert('Erreur dans la récupération des données...'); |
||||
} |
||||
// When we want to add a user
|
||||
$adminAddSave.on('click', function () { |
||||
var $usernameInput = $modalAdminAdd.find('input[name=username]'); |
||||
var $passwordInput = $modalAdminAdd.find('input[name=password]'); |
||||
addAdmin($usernameInput.val(), $passwordInput.val()); |
||||
$modalAdminAdd.modal('hide'); |
||||
}); |
||||
|
||||
|
||||
|
||||
// -------------------- LOGS --------------------
|
||||
var i; |
||||
|
||||
// Headers
|
||||
var columns = [ |
||||
{ id: "log_id", name: "Log ID", field: "log_id", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "user_id", name: "User ID", field: "user_id", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_trusted_ip", name: "Trusted IP", field: "log_trusted_ip", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_trusted_port", name: "Trusted Port", field: "log_trusted_port", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_remote_ip", name: "Remote IP", field: "log_remote_ip", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_remote_port", name: "Remote Port", field: "log_remote_port", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_start_time", name: "Start Time", field: "log_start_time", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_end_time", name: "End Time", field: "log_end_time", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_received", name: "Receveid", field: "log_received", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
||||
{ id: "log_send", name: "Sent", field: "log_send", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text } |
||||
]; |
||||
// -------------------- LOGS --------------------
|
||||
|
||||
// Grid options
|
||||
var options = { |
||||
editable: false, |
||||
enableAddRow: false, |
||||
enableCellNavigation: true, |
||||
asyncEditorLoading: false, |
||||
autoEdit: false, |
||||
autoHeight: true |
||||
}; |
||||
|
||||
var data = []; |
||||
|
||||
// Creation of the grid
|
||||
var grid = new Slick.Grid($("#grid_log"), data, columns, options); |
||||
|
||||
var pager = new Slick.Controls.EnhancementPager({ |
||||
container: $("#pager"), |
||||
remoteUrl: "include/grids.php", |
||||
params: { select: "log" }, |
||||
datagrid: grid, |
||||
pagerType: "" |
||||
// Bootstrap table definition
|
||||
$logTable.bootstrapTable({ |
||||
url: gridsUrl, |
||||
sortable: false, |
||||
sidePagination: 'server', |
||||
pagination: true, |
||||
queryParams: function (params) { |
||||
params.select = 'log'; |
||||
return params; |
||||
}, |
||||
columns: [ |
||||
{ title: "Log ID", field: "log_id" }, |
||||
{ title: "User ID", field: "user_id" }, |
||||
{ title: "Trusted IP", field: "log_trusted_ip" }, |
||||
{ title: "Trusted Port", field: "log_trusted_port" }, |
||||
{ title: "Remote IP", field: "log_remote_ip" }, |
||||
{ title: "Remote Port", field: "log_remote_port" }, |
||||
{ title: "Start Time", field: "log_start_time" }, |
||||
{ title: "End Time", field: "log_end_time" }, |
||||
{ title: "Receveid", field: "log_received" }, |
||||
{ title: "Sent", field: "log_send" } |
||||
] |
||||
}); |
||||
|
||||
grid.autosizeColumns(); |
||||
|
||||
}); |
||||
|
Loading…
Reference in new issue