Misterzym
/
OpenVPN-Admin
mirror of https://github.com/misterzym/OpenVPN-Admin.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

- moved the configuration interface elements (logs, users, webadmins) to tabs; this makes useability a tiny bit better 

- "enabled" in the user config is now a checkbox that can be toggled in order to activate or deactivate the user
master
Serjoscha Bassauer 8 years ago
parent
828a72f374
commit
dbe3233632
2 changed files with 112 additions and 68 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 147
      include/html/grids.php
  2. 33
      js/grids.js

147
include/html/grids.php
Unescape View File

@ -1,80 +1,93 @@
<!-- Users grid --> <ul class="nav nav-tabs">
<div class="block-grid row" id="user-grid"> <li class="active"><a data-toggle="tab" href="#menu0">OpenVPN Users</a></li>
<h4> <li><a data-toggle="tab" href="#menu1">OpenVPN logs</a></li>
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> <li><a data-toggle="tab" href="#menu2">Web Admins</a></li>
</h4> </ul>
<table id="table-users" class="table"></table> <div class="tab-content">
<div id="menu0" class="tab-pane fade in active">
<!-- Users grid -->
<div class="block-grid row" id="user-grid">
<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 id="modal-user-add" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Add user</h4> <h4 class="modal-title">Add user</h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div class="form-group"> <div class="form-group">
<label for="modal-user-add-username">Username</label> <label for="modal-user-add-username">Username</label>
<input type="text" name="username" id="modal-user-add-username" class="form-control" autofocus/> <input type="text" name="username" id="modal-user-add-username" class="form-control" autofocus/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="modal-user-add-password">Password</label> <label for="modal-user-add-password">Password</label>
<input type="password" name="password" id="modal-user-add-password" class="form-control" /> <input type="password" name="password" id="modal-user-add-password" class="form-control" />
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <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> <button type="button" class="btn btn-primary" id="modal-user-add-save">Save</button>
</div> </div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> <div id="menu1" class="tab-pane fade">
</div> <!-- Logs grid -->
<div class="block-grid row" id="log-grid">
<!-- Logs grid --> <h4>
<div class="block-grid row" id="log-grid"> OpenVPN logs
<h4> </h4>
OpenVPN logs <table id="table-logs" class="table"></table>
</h4> </div>
<table id="table-logs" class="table"></table> </div>
</div>
<!-- Admins grid --> <div id="menu2" class="tab-pane fade">
<div class="block-grid row" id="admin-grid"> <!-- Admins grid -->
<h4> <div class="block-grid row" id="admin-grid">
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>
</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>
<table id="table-admins" class="table"></table> </h4>
<table id="table-admins" class="table"></table>
<div id="modal-admin-add" class="modal fade" tabindex="-1" role="dialog"> <div id="modal-admin-add" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Add admin</h4> <h4 class="modal-title">Add admin</h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div class="form-group"> <div class="form-group">
<label for="modal-admin-add-username">Username</label> <label for="modal-admin-add-username">Username</label>
<input type="text" name="username" id="modal-admin-add-username" class="form-control" autofocus/> <input type="text" name="username" id="modal-admin-add-username" class="form-control" autofocus/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="modal-admin-add-password">Password</label> <label for="modal-admin-add-password">Password</label>
<input type="password" name="password" id="modal-admin-add-password" class="form-control" /> <input type="password" name="password" id="modal-admin-add-password" class="form-control" />
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <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> <button type="button" class="btn btn-primary" id="modal-admin-add-save">Save</button>
</div> </div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div>
</div> </div>
<script src="vendor/jquery/dist/jquery.min.js"></script> <script src="vendor/jquery/dist/jquery.min.js"></script>
<script src="vendor/bootstrap/js/modal.js"></script> <script src="vendor/bootstrap/js/modal.js"></script>
<script src="vendor/bootstrap/js/tooltip.js"></script> <script src="vendor/bootstrap/js/tooltip.js"></script>
<script src="vendor/bootstrap/js/tab.js"></script>
<script src="vendor/bootstrap/js/popover.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-table/dist/bootstrap-table.min.js"></script>
<script src="vendor/bootstrap-datepicker/dist/js/bootstrap-datepicker.js"></script> <script src="vendor/bootstrap-datepicker/dist/js/bootstrap-datepicker.js"></script>

33
js/grids.js
Unescape View File

@ -17,6 +17,10 @@ $(function () {
alert('Error: ' + textStatus); alert('Error: ' + textStatus);
} }
function checkFormatter(value, row, index) {
return '<input type="checkbox" '+(parseInt(value)===1?'checked':'')+' />';
}
// ------------------------- USERS definitions ------------------------- // ------------------------- USERS definitions -------------------------
var $userTable = $('#table-users'); var $userTable = $('#table-users');
var $modalUserAdd = $('#modal-user-add'); var $modalUserAdd = $('#modal-user-add');
@ -53,6 +57,23 @@ $(function () {
}); });
} }
function genericSetField(field, new_value, pk) {
$.ajax({
url: gridsUrl,
data: {
set_user: true,
name: field,
value: new_value,
pk : pk
},
method: 'POST',
success: function() {
refreshTable($userTable);
},
error: onAjaxError
});
}
var userEditable = { var userEditable = {
url: gridsUrl, url: gridsUrl,
params: function (params) { params: function (params) {
@ -131,6 +152,7 @@ $(function () {
$userTable.bootstrapTable({ $userTable.bootstrapTable({
url: gridsUrl, url: gridsUrl,
sortable: false, sortable: false,
checkboxHeader: false,
queryParams: function (params) { queryParams: function (params) {
params.select = 'user'; params.select = 'user';
return params; return params;
@ -143,7 +165,16 @@ $(function () {
{ title: "Mail", field: "user_mail", editable: userEditable }, { title: "Mail", field: "user_mail", editable: userEditable },
{ title: "Phone", field: "user_phone", editable: userEditable }, { title: "Phone", field: "user_phone", editable: userEditable },
{ title: "Online", field: "user_online" }, { title: "Online", field: "user_online" },
{ title: "Enabled", field: "user_enable" }, {
title: "Enabled",
field: "user_enable",
formatter : checkFormatter,
events: {
'click input': function (e, value, row) {
genericSetField('user_enable', $(this).is(':checked') ? '1' : '0', row.user_id);
}
}
},
{ title: "Start Date", field: "user_start_date", editable: userDateEditable }, { title: "Start Date", field: "user_start_date", editable: userDateEditable },
{ title: "End Date", field: "user_end_date", editable: userDateEditable }, { title: "End Date", field: "user_end_date", editable: userDateEditable },
{ {

Write Preview
Loading…
Cancel
Save