jostreff/wireguard-ui
1
0
Fork 0
mirror of https://github.com/ngoduykhanh/wireguard-ui.git synced 2025-06-07 00:46:58 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Edit wireguard client (#19)

Browse source 
* Add the ability to modify an existing client
* Update client page using Ajax
This commit is contained in:
Khanh Ngo 2020-06-02 11:20:50 +07:00 • committed by GitHub
parent 9169e75e88
commit cd7f6e500a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 445 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

53
templates/base.html
View file

@ -56,16 +56,17 @@
</div>
</form>
<!-- Right navbar links -->
<div class="navbar-nav ml-auto">
<button style="margin-left: 0.5em;" type="button" class="btn btn-outline-primary btn-sm" data-toggle="modal"
data-target="#modal_new_client"><i class="nav-icon fas fa-plus"></i> New
Client</button>
<button style="margin-left: 0.5em;" type="button" class="btn btn-outline-danger btn-sm" data-toggle="modal"
data-target="#modal_apply_config"><i class="nav-icon fas fa-check"></i> Apply
Config</button>
<button onclick="location.href='/logout';" style="margin-left: 0.5em;" type="button"
class="btn btn-outline-danger btn-sm"><i class="nav-icon fas fa-sign-out-alt"></i> Logout</button>
<!-- Right navbar links -->
<div class="navbar-nav ml-auto">
<button style="margin-left: 0.5em;" type="button" class="btn btn-outline-primary btn-sm" data-toggle="modal"
data-target="#modal_new_client"><i class="nav-icon fas fa-plus"></i> New
Client</button>
<button style="margin-left: 0.5em;" type="button" class="btn btn-outline-danger btn-sm" data-toggle="modal"
data-target="#modal_apply_config"><i class="nav-icon fas fa-check"></i> Apply
Config</button>
<button onclick="location.href='/logout';" style="margin-left: 0.5em;" type="button"
class="btn btn-outline-danger btn-sm"><i class="nav-icon fas fa-sign-out-alt"></i> Logout</button>
</div>
</nav>
<!-- /.navbar -->
@ -245,7 +246,28 @@
<script src="static/plugins/jquery-tags-input/dist/jquery.tagsinput.min.js"></script>
<!-- AdminLTE App -->
<script src="static/dist/js/adminlte.min.js"></script>
<!-- Custom js -->
<script src="static/custom/js/helper.js"></script>
<script>
// populateClient function for render new client info
// on the client page.
function populateClient(client_id) {
$.ajax({
cache: false,
method: 'GET',
url: '/api/client/' + client_id,
dataType: 'json',
contentType: "application/json",
success: function (resp) {
renderClientList([resp]);
},
error: function (jqXHR, exception) {
const responseJson = jQuery.parseJSON(jqXHR.responseText);
toastr.error(responseJson['message']);
}
});
}
// submitNewClient function for new client form submission
function submitNewClient() {
const name = $("#client_name").val();
@ -260,7 +282,6 @@
const data = {"name": name, "email": email, "allocated_ips": allocated_ips, "allowed_ips": allowed_ips,
"enabled": enabled};
console.log(data);
$.ajax({
cache: false,
@ -269,12 +290,12 @@
dataType: 'json',
contentType: "application/json",
data: JSON.stringify(data),
success: function(data) {
success: function(resp) {
$("#modal_new_client").modal('hide');
toastr.success('Created new client successfully');
// Refresh the home page (clients page) after adding successfully
// Update the home page (clients page) after adding successfully
if (window.location.pathname === "/") {
location.reload();
populateClient(resp.id);
}
},
error: function(jqXHR, exception) {
@ -356,7 +377,7 @@
},
client_email: {
required: "Please enter an email address",
email: "Please enter a vaild email address"
email: "Please enter a valid email address"
},
},
errorElement: 'span',
@ -376,6 +397,8 @@
// New Client modal event
$(document).ready(function () {
$("#modal_new_client").on('shown.bs.modal', function (e) {
$("#client_name").val("");
$("#client_email").val("");
$("#client_allocated_ips").importTags('');
updateIPAllocationSuggestion();
});