mirror of
https://github.com/donaldzou/WGDashboard.git
synced 2025-09-08 04:31:14 +00:00
v2.0-beta-1 Commit
This commit is contained in:
Donald Zou
committed by
Donald Cheng Hong Zou
Donald Cheng Hong Zou
parent
ab334a393f
commit
bc8b8e7982
@@ -1,45 +1,11 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Wireguard Dashboard</title>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
|
||||
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='dashboard.css') }}">
|
||||
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.0.1/dist/chart.min.js"></script>
|
||||
</head>
|
||||
{% include "header.html" %}
|
||||
|
||||
<body>
|
||||
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
|
||||
<a class="navbar-brand col-md-3 col-lg-2 mr-0 px-3" href="/">Wireguard Dashboard</a>
|
||||
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse"
|
||||
data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</nav>
|
||||
{% include "navbar.html" %}
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="row">
|
||||
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
|
||||
<div class="sidebar-sticky pt-3">
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
|
||||
</ul>
|
||||
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
|
||||
<span>Configurations</span>
|
||||
</h6>
|
||||
<ul class="nav flex-column">
|
||||
{% for i in conf%}
|
||||
<li class="nav-item"><a class="nav-link" href="/configuration/{{i['conf']}}">{{i['conf']}}</a></li>
|
||||
{%endfor%}
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sidebar.html" %}
|
||||
<div id="config_body">
|
||||
|
||||
</div>
|
||||
@@ -150,6 +116,9 @@
|
||||
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
|
||||
crossorigin="anonymous"></script>
|
||||
<script>
|
||||
$(".sb-{{conf_data['name']}}-url").addClass("active");
|
||||
|
||||
|
||||
function load_data(){
|
||||
$.ajax({
|
||||
method: "GET",
|
||||
@@ -176,16 +145,16 @@
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
$('.switch').change(function() {
|
||||
if ($(this).prop('checked') == false){
|
||||
$("body").on("click", ".switch", function (){
|
||||
if ($(this).prop('checked') === true){
|
||||
if (confirm('Are you sure you want to turn off this connection?')){
|
||||
location.replace("/switch/"+$(this).attr('id'));
|
||||
location.replace("/switch/"+$(this).attr('id'))
|
||||
}
|
||||
}
|
||||
else{
|
||||
location.replace("/switch/"+$(this).attr('id'));
|
||||
location.replace("/switch/"+$(this).attr('id'))
|
||||
}
|
||||
});
|
||||
})
|
||||
$("#save_peer").click(function(){
|
||||
if ($("#allowed_ips") != "" && $("#public_key") != ""){
|
||||
var conf = $(this).attr('conf_id')
|
||||
@@ -287,5 +256,7 @@
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
</script>
|
||||
</html>
|
||||
20
src/templates/footer.html
Normal file
20
src/templates/footer.html
Normal file
@@ -0,0 +1,20 @@
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.min.js"
|
||||
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
|
||||
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"
|
||||
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
|
||||
<script>
|
||||
$.ajax({
|
||||
method: "GET",
|
||||
url: "/check_update_dashboard",
|
||||
success: function (response){
|
||||
if (response === "true"){
|
||||
$(".sb-update-url").append("<span class=\"dot dot-running\"></span>")
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
@@ -7,7 +7,13 @@
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<small class="text-muted"><strong>ACTION</strong></small><br>
|
||||
<input class="mt-2 switch" id="{{conf_data['name']}}" type="checkbox" data-toggle="toggle" {{conf_data['checked']}} data-size="sm">
|
||||
{# <input class="mt-2 switch" id="{{conf_data['name']}}" type="checkbox" data-toggle="toggle" {{conf_data['checked']}} data-size="sm">#}
|
||||
|
||||
{% if conf_data['checked'] == "checked" %}
|
||||
<a href="#" id="{{conf_data['name']}}" {{conf_data['checked']}} class="switch text-primary"><i class="bi bi-toggle2-on"></i> ON</a>
|
||||
{% else %}
|
||||
<a href="#" id="{{conf_data['name']}}" {{conf_data['checked']}} class="switch text-secondary"><i class="bi bi-toggle2-off"></i> OFF</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="w-100"></div>
|
||||
<div class="col-sm">
|
||||
@@ -96,50 +102,6 @@
|
||||
<small class="text-muted"><strong>END POINT</strong></small>
|
||||
<h6 style="text-transform: uppercase;">{{i['endpoint']}}</h6>
|
||||
</div>
|
||||
{# <div class="w-100"></div>#}
|
||||
{# <div class="col-sm">#}
|
||||
{# <canvas id="{{ i['id'] }}_chart" style="width: 100%" height="200"></canvas>#}
|
||||
{# </div>#}
|
||||
{# <script>#}
|
||||
{# var data = "{{ i['traffic'] }}";#}
|
||||
{# data = data.replaceAll("'", "\"")#}
|
||||
{# data = JSON.parse(data)#}
|
||||
{# y_label = [];#}
|
||||
{# data_point = [];#}
|
||||
{# for (var i = 1; i < data.length; i++){#}
|
||||
{# y_label.push(data[i]['time'])#}
|
||||
{# data_point.push(data[i]['total_sent'] - data[i-1]['total_sent']);#}
|
||||
{# }#}
|
||||
{# var ctx = document.getElementById('{{ i['id'] }}_chart');#}
|
||||
{# var plot_data =#}
|
||||
{# {#}
|
||||
{# labels: y_label,#}
|
||||
{# datasets:[{#}
|
||||
{# label: "Traffic",#}
|
||||
{# data: data_point,#}
|
||||
{# fill: false,#}
|
||||
{# borderColor: 'rgb(75, 192, 192)',#}
|
||||
{# tension: 0.1#}
|
||||
{# }],#}
|
||||
{# options: {#}
|
||||
{# scales: {#}
|
||||
{# xAxes: [{#}
|
||||
{# type: 'time',#}
|
||||
{# ticks: {#}
|
||||
{# autoSkip: true,#}
|
||||
{# maxTicksLimit: 12#}
|
||||
{# }#}
|
||||
{# }]#}
|
||||
{# },#}
|
||||
{# responsive: true#}
|
||||
{# }#}
|
||||
{# }#}
|
||||
{##}
|
||||
{# var myLineChart = new Chart(ctx, {#}
|
||||
{# type: 'line',#}
|
||||
{# data: plot_data#}
|
||||
{# });#}
|
||||
{# </script>#}
|
||||
<div class="w-100"></div>
|
||||
<div class="col-sm">
|
||||
<!-- <small class="text-muted"><strong>ACTION</strong></small> -->
|
||||
|
||||
13
src/templates/header.html
Normal file
13
src/templates/header.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Wireguard Dashboard</title>
|
||||
<link rel="icon" href="{{ url_for('static',filename='logo.png') }}"/>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
|
||||
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='dashboard.css') }}">
|
||||
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.0.1/dist/chart.min.js"></script>
|
||||
</head>
|
||||
|
||||
@@ -1,70 +1,35 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Wireguard Dashboard</title>
|
||||
<link rel="icon" href="{{ url_for('static',filename='logo.png') }}"/>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
|
||||
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='dashboard.css') }}">
|
||||
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
{% include "header.html" %}
|
||||
<body>
|
||||
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
|
||||
<a class="navbar-brand col-md-3 col-lg-2 mr-0 px-3" href="#">Wireguard Dashboard</a>
|
||||
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse"
|
||||
data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</nav>
|
||||
{% include "navbar.html" %}
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="row">
|
||||
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
|
||||
<div class="sidebar-sticky pt-3">
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
|
||||
</ul>
|
||||
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
|
||||
<span>Configurations</span>
|
||||
</h6>
|
||||
<ul class="nav flex-column">
|
||||
{% for i in conf%}
|
||||
<li class="nav-item"><a class="nav-link" href="/configuration/{{i['conf']}}">{{i['conf']}}</a></li>
|
||||
{%endfor%}
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sidebar.html" %}
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
|
||||
{% for i in conf%}
|
||||
<div class="card mt-3">
|
||||
<div class="card-body">
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="col card-col">
|
||||
<small class="text-muted"><strong>CONFIGURATION</strong></small>
|
||||
<a href="/configuration/{{i['conf']}}">
|
||||
<h5 class="card-title">{{i['conf']}}</h5>
|
||||
<h6 class="card-title" style="margin:0 !important;">{{i['conf']}}</h6>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<input class="mt-2 switch" id="{{i['conf']}}" type="checkbox" data-toggle="toggle" {{i['checked']}} data-size="sm">
|
||||
</div>
|
||||
|
||||
<div class="w-100"></div>
|
||||
<div class="col-sm">
|
||||
<div class="col card-col">
|
||||
<small class="text-muted"><strong>STATUS</strong></small>
|
||||
<h6 style="text-transform: uppercase;">{{i['status']}}<span class="dot dot-{{i['status']}}"></span></h6>
|
||||
<h6 style="text-transform: uppercase; margin:0 !important;">{{i['status']}}<span class="dot dot-{{i['status']}}"></span></h6>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<div class="col-md card-col">
|
||||
<small class="text-muted"><strong>PUBLIC KEY</strong></small>
|
||||
<h6 style="text-transform: uppercase;"><samp>{{i['public_key']}}</samp></h6>
|
||||
<h6 style="text-transform: uppercase; margin:0 !important;"><samp>{{i['public_key']}}</samp></h6>
|
||||
</div>
|
||||
<div class="col-md">
|
||||
{% if i['checked'] == "checked" %}
|
||||
<a href="#" id="{{i['conf']}}" {{i['checked']}} class="switch text-primary"><i class="bi bi-toggle2-on"></i></a>
|
||||
{% else %}
|
||||
<a href="#" id="{{i['conf']}}" {{i['checked']}} class="switch text-secondary"><i class="bi bi-toggle2-off"></i></a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -72,25 +37,11 @@
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.min.js"
|
||||
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
|
||||
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"
|
||||
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
|
||||
{% include "footer.html" %}
|
||||
<script>
|
||||
$('.switch').change(function() {
|
||||
if ($(this).prop('checked') == false){
|
||||
if (confirm('Are you sure you want to turn off this connection?')){
|
||||
location.replace("/switch/"+$(this).attr('id'))
|
||||
}
|
||||
}
|
||||
else{
|
||||
location.replace("/switch/"+$(this).attr('id'))
|
||||
}
|
||||
$('.switch').click(function() {
|
||||
location.replace("/switch/"+$(this).attr('id'))
|
||||
});
|
||||
$(".sb-home-url").addClass("active")
|
||||
</script>
|
||||
</html>
|
||||
7
src/templates/navbar.html
Normal file
7
src/templates/navbar.html
Normal file
@@ -0,0 +1,7 @@
|
||||
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
|
||||
<a class="navbar-brand col-md-3 col-lg-2 mr-0 px-3" href="/">Wireguard Dashboard</a>
|
||||
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse"
|
||||
data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</nav>
|
||||
107
src/templates/settings.html
Normal file
107
src/templates/settings.html
Normal file
@@ -0,0 +1,107 @@
|
||||
<html>
|
||||
{% include "header.html" %}
|
||||
<body>
|
||||
{% include "navbar.html" %}
|
||||
<div class="container-fluid">
|
||||
{% include "sidebar.html" %}
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
|
||||
<div class="setting-container mt-4">
|
||||
{% if message != ""%}
|
||||
<div class="alert alert-{{ status }}" role="alert">
|
||||
{{ message }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<h1 class="pb-4">Settings</h1>
|
||||
{% if required_auth == "true" %}
|
||||
<h3>Account</h3>
|
||||
<form action="/update_acct" method="post">
|
||||
<div class="form-group">
|
||||
<label for="username">Username</label>
|
||||
<input type="text" class="form-control mb-4" id="username" name="username" value="{{ session['username'] }}">
|
||||
<button type="submit" class="btn btn-success" >Update Account</button>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
<h3>Security</h3>
|
||||
<form action="/update_pwd", method="post">
|
||||
<div class="form-group">
|
||||
<label for="currentpass">Current Password</label>
|
||||
<input type="password" class="form-control mb-2" id="currentpass" name="currentpass">
|
||||
<label for="newpass">New Password</label>
|
||||
<input type="password" class="form-control mb-2" id="newpass" name="newpass">
|
||||
<label for="repnewpass">Repeat New Password</label>
|
||||
<input type="password" class="form-control mb-4" id="repnewpass" name="repnewpass">
|
||||
<button type="submit" class="btn btn-danger">Update Password</button>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
{% endif %}
|
||||
<h3>Dashboard Configuration</h3>
|
||||
<form action="/update_app_ip_port" method="post" class="update_app_ip_port">
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-sm">
|
||||
<label for="app_ip" >Dashboard IP</label>
|
||||
<input type="text" class="form-control mb-2" id="app_ip" name="app_ip" value="{{ app_ip }}">
|
||||
<p><small class="text-danger mb-4">0.0.0.0 means it can be access by anyone with your server IP Address.</small></p>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<label for="app_port">Dashboard Port</label>
|
||||
<input type="text" class="form-control mb-4" id="app_port" name="app_port" value="{{ app_port }}">
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-danger confirm_modal" data-toggle="modal" data-target="#confirmModal">Update Configuration & Restart</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</main>
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="confirmModal" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="staticBackdropLabel">Confirm Dashboard Configuration</h5>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<small>Dashboard Original IP</small>
|
||||
<p>{{ app_ip }}</p>
|
||||
<small style="font-weight: bold" class="text-bold">Dashboard New IP</small>
|
||||
<p class="app_new_ip text-bold text-danger" style="font-weight: bold"></p>
|
||||
<small>Dashboard Original Port</small>
|
||||
<p>{{ app_port }}</p>
|
||||
<small style="font-weight: bold" class="text-bold">Dashboard New Port</small>
|
||||
<p class="app_new_port text-bold text-danger" style="font-weight: bold"></p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary cancel_restart" data-dismiss="modal">Cancel</button>
|
||||
<button type="button" class="btn btn-danger confirm_restart">Confirm & Restart Dashboard</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
{% include "footer.html" %}
|
||||
<script>
|
||||
$(".sb-settings-url").addClass("active")
|
||||
$(".confirm_modal").click(function (){
|
||||
$(".app_new_ip").html($("#app_ip")[0].value)
|
||||
$(".app_new_port").html($("#app_port")[0].value)
|
||||
})
|
||||
|
||||
$(".confirm_restart").click(function (){
|
||||
$(".cancel_restart").remove()
|
||||
countdown = 7;
|
||||
$.post('/update_app_ip_port', $('.update_app_ip_port').serialize())
|
||||
url = $("#app_ip")[0].value+":"+$("#app_port")[0].value;
|
||||
$(".confirm_restart").attr("disabled", "disabled")
|
||||
setInterval(function (){
|
||||
if (countdown === 0){
|
||||
window.location.replace("http://"+url);
|
||||
}
|
||||
$(".confirm_restart").html("Redirecting you in "+countdown+" seconds.")
|
||||
countdown--;
|
||||
},1000)
|
||||
})
|
||||
</script>
|
||||
</html>
|
||||
30
src/templates/sidebar.html
Normal file
30
src/templates/sidebar.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<div class="row">
|
||||
<div class="row">
|
||||
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
|
||||
<div class="sidebar-sticky pt-3">
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item"><a class="nav-link sb-home-url" href="/">Home</a></li>
|
||||
{% if "username" in session %}
|
||||
<li class="nav-item"><a class="nav-link sb-settings-url" href="/settings">Settings</a></li>
|
||||
{% endif %}
|
||||
<li class="nav-item"><a class="nav-link sb-update-url" href="/">Check Update</a></li>
|
||||
</ul>
|
||||
<hr>
|
||||
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
|
||||
<span>Configurations</span>
|
||||
</h6>
|
||||
<ul class="nav flex-column">
|
||||
{% for i in conf%}
|
||||
<li class="nav-item"><a class="nav-link sb-{{i['conf']}}-url" href="/configuration/{{i['conf']}}">{{i['conf']}}</a></li>
|
||||
{%endfor%}
|
||||
</ul>
|
||||
<hr>
|
||||
{% if "username" in session %}
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item"><a class="nav-link text-danger" href="/signout" style="font-weight: bold">Sign Out</a></li>
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
43
src/templates/signin.html
Normal file
43
src/templates/signin.html
Normal file
@@ -0,0 +1,43 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Wireguard Dashboard | Login</title>
|
||||
<link rel="icon" href="{{ url_for('static',filename='logo.png') }}"/>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
|
||||
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='dashboard.css') }}">
|
||||
</head>
|
||||
<body>
|
||||
{% include "navbar.html" %}
|
||||
<div class="container-fluid">
|
||||
|
||||
<main role="main" class="container login-container">
|
||||
<div class="login-box" style="margin: auto !important;">
|
||||
<h3 class="text-center">Sign In</h3>
|
||||
|
||||
<form style="margin-left: auto !important; margin-right: auto !important; max-width: 500px;" action="/auth" method="post">
|
||||
{% if message != ""%}
|
||||
<div class="alert alert-danger" role="alert">
|
||||
{{ message }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="form-group">
|
||||
<label for="username" class="text-left">User Name</label>
|
||||
<input type="text" class="form-control" id="username" name="username" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="password" class="text-left">Password</label>
|
||||
<input type="password" class="form-control" id="password" name="password" required>
|
||||
</div>
|
||||
<div class="form-group form-check">
|
||||
<input type="checkbox" class="form-check-input" id="exampleCheck1">
|
||||
<label class="form-check-label" for="exampleCheck1">Keep you login</label>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-dark" style="width: 100%;">Sign In</button>
|
||||
</form>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
{% include "footer.html" %}
|
||||
</html>
|
||||
Reference in New Issue
Block a user