Chocobozzz
9 years ago
8 changed files with 405 additions and 632 deletions
@ -1,144 +1,15 @@ |
|||||||
body { |
body { |
||||||
margin: auto; |
padding-top: 10px; |
||||||
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; |
|
||||||
} |
|
||||||
|
|
||||||
a.glyphicon { |
|
||||||
color: #333 !important; |
|
||||||
} |
} |
||||||
|
|
||||||
.delete { |
.action { |
||||||
cursor: pointer; |
cursor: pointer; |
||||||
} |
} |
||||||
|
|
||||||
#header_admin { |
|
||||||
margin : 10px; |
|
||||||
} |
|
||||||
|
|
||||||
.block-grid { |
.block-grid { |
||||||
margin: 20px; |
margin: 20px; |
||||||
} |
} |
||||||
|
|
||||||
.grid { |
.btn .glyphicon { |
||||||
border: 1px solid rgba(0, 0, 0, 0.2); |
top: 2px; |
||||||
} |
|
||||||
|
|
||||||
/*.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; |
|
||||||
} |
|
||||||
|
|
||||||
|
|
||||||
/* 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,41 +1,83 @@ |
|||||||
<!-- Users grid --> |
<!-- Users grid --> |
||||||
<div class="block-grid row" id="user-grid"> |
<div class="block-grid row" id="user-grid"> |
||||||
<div class="grid-header"> |
<h4> |
||||||
<label>OpenVPN Users</label> |
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> |
||||||
<div class="grid" id="grid_user"></div> |
|
||||||
</div> |
</div> |
||||||
|
|
||||||
<!-- Logs grid --> |
<!-- Logs grid --> |
||||||
<div class="block-grid row" id="log-grid"> |
<div class="block-grid row" id="log-grid"> |
||||||
<div class="grid-header"> |
<h4> |
||||||
<label>OpenVPN Logs</label> |
OpenVPN logs |
||||||
</div> |
</h4> |
||||||
<div class="grid" id="grid_log"></div> |
<table id="table-logs" class="table"></table> |
||||||
<div id="pager" class="slick-enhancement-pager"></div> |
|
||||||
</div> |
</div> |
||||||
|
|
||||||
<!-- Admins grid --> |
<!-- Admins grid --> |
||||||
<div class="block-grid row" id="admin-grid"> |
<div class="block-grid row" id="admin-grid"> |
||||||
<div class="grid-header"> |
<h4> |
||||||
<label>Web Admins</label> |
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> |
||||||
<div class="grid" id="grid_admin"></div> |
|
||||||
</div> |
</div> |
||||||
|
|
||||||
<script src="vendor/slickgrid/lib/jquery-1.7.min.js"></script> |
<script src="/vendor/jquery/dist/jquery.min.js"></script> |
||||||
<script src="vendor/slickgrid/lib/jquery-ui-1.8.16.custom.min.js"></script> |
<script src="/vendor/bootstrap/js/modal.js"></script> |
||||||
<script src="vendor/slickgrid/lib/jquery.event.drag-2.2.js"></script> |
<script src="/vendor/bootstrap/js/tooltip.js"></script> |
||||||
<script src="vendor/slickgrid/slick.core.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/slickgrid/slick.formatters.js"></script> |
<script src="/vendor/bootstrap-table/dist/extensions/editable/bootstrap-table-editable.min.js"></script> |
||||||
<script src="vendor/slickgrid/slick.editors.js"></script> |
<script src="/vendor/x-editable/dist/bootstrap3-editable/js/bootstrap-editable.js"></script> |
||||||
<script src="vendor/slickgrid/slick.grid.js"></script> |
<script src="/js/grids.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> |
|
||||||
|
|||||||
@ -1,365 +1,236 @@ |
|||||||
$(function () { |
$(function () { |
||||||
"use strict"; |
"use strict"; |
||||||
|
|
||||||
// -------------------- USERS --------------------
|
// ------------------------- GLOBAL definitions -------------------------
|
||||||
$.ajax({ |
var gridsUrl = '/include/grids.php'; |
||||||
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
|
function deleteFormatter() { |
||||||
var save = null; |
return "<span class='glyphicon glyphicon-remove action'></span"; |
||||||
|
|
||||||
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) { |
function refreshTable($table) { |
||||||
data[i] = { |
$table.bootstrapTable('refresh'); |
||||||
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
|
function onAjaxError (xhr, textStatus, error) { |
||||||
grid = new Slick.Grid($("#grid_user"), data, columns, options); |
console.error(error); |
||||||
|
alert('Error: ' + textStatus); |
||||||
$("#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) |
// ------------------------- USERS definitions -------------------------
|
||||||
item.set_user = save; |
var $userTable = $('#table-users'); |
||||||
else |
var $modalUserAdd = $('#modal-user-add'); |
||||||
item.set_user = item.user_id; |
var $userAddSave = $modalUserAdd.find('#modal-user-add-save'); |
||||||
|
|
||||||
// Remove in the database
|
function addUser(username, password) { |
||||||
$.ajax({ |
$.ajax({ |
||||||
type: "POST", |
url: gridsUrl, |
||||||
url: "include/grids.php", |
method: 'POST', |
||||||
dataType: "json", |
data: { |
||||||
data: item, |
add_user: true, |
||||||
|
user_id: username, |
||||||
|
user_pass: password |
||||||
|
}, |
||||||
success: function() { |
success: function() { |
||||||
// If we edited the password, hash it
|
refreshTable($userTable); |
||||||
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 () { |
error: onAjaxError |
||||||
alert("Error : cannot update the database."); |
|
||||||
} |
|
||||||
}); |
}); |
||||||
|
} |
||||||
|
|
||||||
delete item.set_user; |
function deleteUser(user_id) { |
||||||
}); |
|
||||||
|
|
||||||
// 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({ |
$.ajax({ |
||||||
type: "POST", |
url: gridsUrl, |
||||||
url: "include/grids.php", |
data: { |
||||||
dataType: "json", |
del_user: true, |
||||||
data: item, |
del_user_id: user_id |
||||||
success: function(res) { |
|
||||||
// Update the grid
|
|
||||||
grid.invalidateRow(data.length); |
|
||||||
data.push(res); |
|
||||||
grid.updateRowCount(); |
|
||||||
grid.render(); |
|
||||||
}, |
}, |
||||||
error: function () { |
method: 'POST', |
||||||
alert("Error : cannot update the database."); |
success: function() { |
||||||
} |
refreshTable($userTable); |
||||||
|
}, |
||||||
|
error: onAjaxError |
||||||
}); |
}); |
||||||
|
} |
||||||
|
|
||||||
delete item.add_user; |
var userEditable = { |
||||||
}); |
url: gridsUrl, |
||||||
|
params: function (params) { |
||||||
|
params.set_user = true; |
||||||
|
|
||||||
grid.autosizeColumns(); |
return params; |
||||||
}, |
}, |
||||||
error: function () { |
success: function () { |
||||||
alert('Error : cannot get the data.'); |
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; |
// ES 2015 so be prudent
|
||||||
|
if (typeof Object.assign == 'function') { |
||||||
// Header
|
var userDateEditable = Object.assign({ type: 'date', placement: 'bottom' }, userEditable); |
||||||
var columns = [ |
} else { |
||||||
{ id: "admin_id", name: "Admin ID", field: "admin_id", width: 120, cssClass: "cell-title", editor: Slick.Editors.Text }, |
console.warn('Your browser does not support Object.assign. You will not be able to modify the date inputs.'); |
||||||
{ 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 } |
|
||||||
]; |
|
||||||
|
|
||||||
// Grid options
|
|
||||||
var options = { |
|
||||||
editable: true, |
|
||||||
enableAddRow: true, |
|
||||||
enableCellNavigation: true, |
|
||||||
asyncEditorLoading: false, |
|
||||||
autoEdit: false, |
|
||||||
autoHeight: true |
|
||||||
}; |
|
||||||
|
|
||||||
var data = []; |
|
||||||
var grid = null; |
|
||||||
|
|
||||||
// Save the old admin id when we update one
|
|
||||||
var save = null; |
|
||||||
|
|
||||||
// When we want to remove an administrator
|
// ------------------------- ADMIN definitions -------------------------
|
||||||
$('#admin-grid').on('click', '.del_admin', function () { |
var $adminTable = $('#table-admins'); |
||||||
var me = $(this); |
var $modalAdminAdd = $('#modal-admin-add'); |
||||||
var id = me.attr('id'); |
var $adminAddSave = $modalAdminAdd.find('#modal-admin-add-save'); |
||||||
var data = grid.getData(); |
|
||||||
|
|
||||||
// Update the database
|
function addAdmin(username, password) { |
||||||
$.ajax({ |
$.ajax({ |
||||||
type: "POST", |
url: gridsUrl, |
||||||
url: "include/grids.php", |
method: 'POST', |
||||||
dataType: "json", |
data: { |
||||||
data: { del_admin_id: id }, |
add_admin: true, |
||||||
|
admin_id: username, |
||||||
|
admin_pass: password |
||||||
|
}, |
||||||
success: function() { |
success: function() { |
||||||
// Update the grid
|
refreshTable($adminTable); |
||||||
data.splice(me.attr('data-row'), 1); |
|
||||||
grid.setData(data); |
|
||||||
grid.render(); |
|
||||||
}, |
}, |
||||||
error: function () { |
error: onAjaxError |
||||||
alert("Error : cannot update the database."); |
|
||||||
} |
|
||||||
}); |
|
||||||
}); |
}); |
||||||
|
|
||||||
|
|
||||||
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); |
function deleteAdmin(admin_id) { |
||||||
|
$.ajax({ |
||||||
$("#grid_admin").on('click', function () { |
url: gridsUrl, |
||||||
var $active = grid.getActiveCell(); |
data: { |
||||||
|
del_admin: true, |
||||||
if ($active !== undefined && $active.cell === 0) |
del_admin_id: admin_id |
||||||
save = $(grid.getActiveCellNode()).html(); |
}, |
||||||
else |
method: 'POST', |
||||||
save = null; |
success: function() { |
||||||
|
refreshTable($adminTable); |
||||||
|
}, |
||||||
|
error: onAjaxError |
||||||
}); |
}); |
||||||
|
} |
||||||
|
|
||||||
// When we update the administrator
|
var adminEditable = { |
||||||
grid.onCellChange.subscribe(function (e, args) { |
url: gridsUrl, |
||||||
var item = args.item; |
params: function (params) { |
||||||
|
params.set_admin = true; |
||||||
// We save the old admin id
|
|
||||||
if (save) |
|
||||||
item.set_admin = save; |
|
||||||
else |
|
||||||
item.set_admin = item.admin_id; |
|
||||||
|
|
||||||
// Update the database
|
return params; |
||||||
$.ajax({ |
}, |
||||||
type: "POST", |
|
||||||
url: "include/grids.php", |
|
||||||
dataType: "json", |
|
||||||
data: item, |
|
||||||
success: function () { |
success: function () { |
||||||
// Hash the password
|
refreshTable($adminTable); |
||||||
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_admin; |
|
||||||
}); |
|
||||||
|
|
||||||
// When we want to add a new administrator
|
// ------------------------- ADMIN definitions -------------------------
|
||||||
grid.onAddNewRow.subscribe(function (e, args) { |
var $logTable = $('#table-logs'); |
||||||
var item = args.item; |
|
||||||
|
|
||||||
// We only add an administrator if we specify the ID
|
|
||||||
if (!item.admin_id) |
|
||||||
return; |
|
||||||
|
|
||||||
item.add_admin = true; |
// -------------------- USERS --------------------
|
||||||
|
|
||||||
// Update the database
|
// Bootstrap table definition
|
||||||
$.ajax({ |
$userTable.bootstrapTable({ |
||||||
type: "POST", |
url: gridsUrl, |
||||||
url: "include/grids.php", |
sortable: false, |
||||||
dataType: "json", |
queryParams: function (params) { |
||||||
data: item, |
params.select = 'user'; |
||||||
success: function() { |
return params; |
||||||
// Update the grid
|
|
||||||
grid.invalidateRow(data.length); |
|
||||||
data.push(item); |
|
||||||
grid.updateRowCount(); |
|
||||||
grid.render(); |
|
||||||
}, |
}, |
||||||
error: function () { |
// Primary key
|
||||||
alert("Error : cannot update the database."); |
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); |
||||||
|
} |
||||||
|
} |
||||||
} |
} |
||||||
|
} |
||||||
|
] |
||||||
}); |
}); |
||||||
|
|
||||||
delete item.add_admin; |
// 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'); |
||||||
|
}); |
||||||
|
|
||||||
|
|
||||||
}); |
// -------------------- ADMINS --------------------
|
||||||
|
|
||||||
grid.autosizeColumns(); |
// Bootstrap table definition
|
||||||
|
$adminTable.bootstrapTable({ |
||||||
|
url: gridsUrl, |
||||||
|
sortable: false, |
||||||
|
queryParams: function (params) { |
||||||
|
params.select = 'admin'; |
||||||
|
return params; |
||||||
}, |
}, |
||||||
error: function () { |
// Primary key
|
||||||
alert('Erreur dans la récupération des données...'); |
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); |
||||||
|
} |
||||||
|
} |
||||||
} |
} |
||||||
|
} |
||||||
|
] |
||||||
}); |
}); |
||||||
|
|
||||||
|
// 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 --------------------
|
// -------------------- 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 } |
|
||||||
]; |
|
||||||
|
|
||||||
// Grid options
|
|
||||||
var options = { |
|
||||||
editable: false, |
|
||||||
enableAddRow: false, |
|
||||||
enableCellNavigation: true, |
|
||||||
asyncEditorLoading: false, |
|
||||||
autoEdit: false, |
|
||||||
autoHeight: true |
|
||||||
}; |
|
||||||
|
|
||||||
var data = []; |
// Bootstrap table definition
|
||||||
|
$logTable.bootstrapTable({ |
||||||
// Creation of the grid
|
url: gridsUrl, |
||||||
var grid = new Slick.Grid($("#grid_log"), data, columns, options); |
sortable: false, |
||||||
|
sidePagination: 'server', |
||||||
var pager = new Slick.Controls.EnhancementPager({ |
pagination: true, |
||||||
container: $("#pager"), |
queryParams: function (params) { |
||||||
remoteUrl: "include/grids.php", |
params.select = 'log'; |
||||||
params: { select: "log" }, |
return params; |
||||||
datagrid: grid, |
}, |
||||||
pagerType: "" |
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