mirror of
				https://github.com/eduardogsilva/wireguard_webadmin.git
				synced 2025-10-31 02:26:17 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			358 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			358 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="en">
 | |
| <head>
 | |
|   <meta charset="utf-8">
 | |
|   <meta name="viewport" content="width=device-width, initial-scale=1">
 | |
|   <title>{{page_title}} | wireguard-webadmin</title>
 | |
| 
 | |
|   <!-- Google Font: Source Sans Pro -->
 | |
|   <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
 | |
|   <!-- Font Awesome -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/plugins/fontawesome-free/css/all.min.css">
 | |
|   <!-- Ionicons -->
 | |
|   <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
 | |
|   <!-- Tempusdominus Bootstrap 4 -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
 | |
|   <!-- iCheck -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
 | |
|   <!-- JQVMap -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/plugins/jqvmap/jqvmap.min.css">
 | |
|   <!-- Theme style -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/dist/css/adminlte.min.css">
 | |
|   <!-- overlayScrollbars -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
 | |
|   <!-- Daterange picker -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/plugins/daterangepicker/daterangepicker.css">
 | |
|   <!-- summernote -->
 | |
|   <link rel="stylesheet" href="/static/AdminLTE-3.2.0/plugins/summernote/summernote-bs4.min.css">
 | |
|   {% block page_custom_head %}{% endblock%}
 | |
| </head>
 | |
| {% load custom_tags %}
 | |
| {% tag_webadmin_version as webadmin_version %}
 | |
| 
 | |
| <body class="hold-transition sidebar-mini layout-fixed">
 | |
| <div class="wrapper">
 | |
| 
 | |
|   <!-- Preloader -->
 | |
|   <div class="preloader flex-column justify-content-center align-items-center">
 | |
|   </div>
 | |
| 
 | |
|   <!-- Navbar -->
 | |
|   <nav class="main-header navbar navbar-expand navbar-white navbar-light">
 | |
|     <!-- Left navbar links -->
 | |
|     <ul class="navbar-nav">
 | |
|       <li class="nav-item">
 | |
|         <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
 | |
|       </li>
 | |
|       <li class="nav-item d-none d-sm-inline-block">
 | |
|         <a href="/" class="nav-link">Home</a>
 | |
|       </li>
 | |
|       <li class="nav-item d-none d-sm-inline-block">
 | |
|         <a href="/status/" class="nav-link">Status</a>
 | |
|       </li>
 | |
|     </ul>
 | |
| 
 | |
|     <!-- Right navbar links -->
 | |
|     <ul class="navbar-nav ml-auto">
 | |
|       <li class="nav-item">
 | |
|         <a href="/accounts/logout/" class="nav-link">
 | |
|             <i class="fas fa-sign-out-alt"></i>
 | |
|         </a>
 | |
|       </li>
 | |
|     </ul>
 | |
|   </nav>
 | |
|   <!-- /.navbar -->
 | |
| 
 | |
|   <!-- Main Sidebar Container -->
 | |
|   <aside class="main-sidebar sidebar-dark-primary elevation-4">
 | |
|     <!-- Brand Logo -->
 | |
|     <a href="/" class="brand-link">
 | |
|       <span class="brand-text font-weight-light">wireguard-webadmin</span>
 | |
|     </a>
 | |
| 
 | |
|     <!-- Sidebar -->
 | |
|     <div class="sidebar">
 | |
|       <!-- Sidebar Menu -->
 | |
|       <nav class="mt-2">
 | |
|         <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
 | |
|                 <!-- Add icons to the links using the .nav-icon class with font-awesome or any other icon font library -->
 | |
|                 <li class="nav-item">
 | |
|                     <a href="/" class="nav-link {% if '/' == request.path %}active{% endif %}">
 | |
|                       <i class="fas fa-home nav-icon"></i>
 | |
|                       <p>
 | |
|                         Home
 | |
|                       </p>
 | |
|                     </a>
 | |
|                 </li>
 | |
| 
 | |
|                 <li class="nav-item">
 | |
|                     <a href="/status/" class="nav-link {% if '/status/' in request.path %}active{% endif %}">
 | |
|                       <i class="fas fa-tachometer-alt nav-icon"></i>
 | |
|                       <p>
 | |
|                         Status
 | |
|                       </p>
 | |
|                     </a>
 | |
|                 </li>
 | |
| 
 | |
|                 <li class="nav-item">
 | |
|                     <a href="/peer/list/" class="nav-link {% if '/peer/' in request.path %}active{% endif %}">
 | |
|                       <i class="fas fa-users-cog nav-icon"></i>
 | |
|                       <p>
 | |
|                         Peers
 | |
|                       </p>
 | |
|                     </a>
 | |
|                 </li>
 | |
| 
 | |
|               <li class="nav-item">
 | |
|                   <a href="/firewall/rule_list/" class="nav-link {% if '/firewall/' in request.path %}active{% endif %}">
 | |
|                     <i class="fas fa-shield-alt nav-icon"></i>
 | |
|                     <p>
 | |
|                       Firewall
 | |
|                       
 | |
|                     </p>
 | |
|                   </a>
 | |
|               </li>
 | |
| 
 | |
|                 <li class="nav-item">
 | |
|                     <a href="/console/" class="nav-link {% if '/console/' in request.path %}active{% endif %}">
 | |
|                       <i class="fas fa-terminal nav-icon"></i>
 | |
|                       <p>
 | |
|                         Console
 | |
|                       </p>
 | |
|                     </a>
 | |
|                 </li>
 | |
| 
 | |
|                 <li class="nav-item">
 | |
|                     <a href="/user/list/" class="nav-link {% if '/user/' in request.path %}active{% endif %}">
 | |
|                       <i class="fas fa-users nav-icon"></i>
 | |
|                       <p>
 | |
|                         User Manager
 | |
|                       </p>
 | |
|                     </a>
 | |
|                 </li>
 | |
| 
 | |
|                 <li class="nav-item">
 | |
|                   <a href="/server/manage/" class="nav-link {% if '/server/' in request.path %}active{% endif %}">
 | |
|                     <i class="fas fa-cogs nav-icon"></i>
 | |
|                     <p>
 | |
|                       Server Settings
 | |
|                     </p>
 | |
|                   </a>
 | |
|               </li>
 | |
|                 
 | |
|           
 | |
|         </ul>
 | |
|       </nav>
 | |
|       <!-- /.sidebar-menu -->
 | |
|     </div>
 | |
|     <!-- /.sidebar -->
 | |
|   </aside>
 | |
| 
 | |
|   <!-- Content Wrapper. Contains page content -->
 | |
|   <div class="content-wrapper">
 | |
|     <!-- Content Header (Page header) -->
 | |
|     <div class="content-header">
 | |
|       <div class="container-fluid">
 | |
|         {% if page_title %}
 | |
|         <div class="row mb-2">
 | |
|           <div class="col-sm-6">
 | |
|             <h1 class="m-0">{{ page_title }}</h1>
 | |
|           </div><!-- /.col -->
 | |
|           <div class="col-sm-6">
 | |
|             <ol class="breadcrumb float-sm-right">
 | |
|               <li class="breadcrumb-item"><a href="/">Home</a></li>
 | |
|               {% if breadcrumb %}
 | |
|                 <li class="breadcrumb-item active">
 | |
|                     {%if breadcrumb.level2.href%}
 | |
|                         <a href="{{ breadcrumb.level2.href }}">{{ breadcrumb.level2.title }}</a>
 | |
|                     {%else%}
 | |
|                         {{breadcrumb.level2.title}}
 | |
|                     {%endif%}
 | |
|                 </li>
 | |
| 
 | |
|             {% endif %}
 | |
| 
 | |
|               <li class="breadcrumb-item active">{{ page_title }}</li>
 | |
|             </ol>
 | |
|           </div><!-- /.col -->
 | |
|         </div><!-- /.row -->
 | |
|         {% endif %}
 | |
|       </div><!-- /.container-fluid -->
 | |
|     </div>
 | |
|     <!-- /.content-header -->
 | |
| 
 | |
| <!-- Generic Modal Structure -->
 | |
| <div class="modal fade" id="genericModal" tabindex="-1" aria-labelledby="genericModalLabel" aria-hidden="true">
 | |
|   <div class="modal-dialog modal-lg">
 | |
|     <div class="modal-content">
 | |
|       <div class="modal-header">
 | |
|         <h5 class="modal-title" id="genericModalLabel">Modal Title</h5>
 | |
|         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
 | |
|           <span aria-hidden="true">×</span>
 | |
|         </button>
 | |
|       </div>
 | |
|       <div class="modal-body" id="genericModalBody">
 | |
|         <!-- Content will be loaded here -->
 | |
|       </div>
 | |
|       <div class="modal-footer">
 | |
|         <button type="button" class="btn btn-secondary" data-dismiss="modal" id="genericModalCloseButton">Close</button>
 | |
|         <a href="#" class="btn btn-primary" id="genericModalActionButton">Action</a>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
| </div>
 | |
| 
 | |
| <!-- End modal -->
 | |
| 
 | |
|     <!-- Main content -->
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
|     <section class="content">
 | |
|         <div class="container-fluid">
 | |
|           {% if pending_changes_warning %}
 | |
|             <div class="alert alert-warning" role="alert">
 | |
|                 <h4 class="alert-heading">Update Required</h4>
 | |
|                 <p>Your WireGuard settings have been modified. To apply these changes, please update the configuration and reload the WireGuard service.
 | |
|                 </p>
 | |
|                 <p>
 | |
|                   <a href="/tools/export_wireguard_config/?action=update_and_restart" class="btn btn-secondary">Update and restart service</a>
 | |
|               </p>
 | |
|               
 | |
|             </div>
 | |
|           {% endif %}
 | |
|         
 | |
|         
 | |
|           
 | |
| 
 | |
|             {% block content %}{% endblock %}
 | |
|         </div><!-- /.container-fluid -->
 | |
|     </section>
 | |
|     <!-- /.content -->
 | |
|   </div>
 | |
|   <!-- /.content-wrapper -->
 | |
|   <footer class="main-footer">
 | |
|     {% if webadmin_version.update_available %}<a class='btn btn-sm btn-danger' id="btn_update_changelog">Update Available</a>{% else %}wireguard-webadmin {% endif %}
 | |
|     <div class="float-right d-none d-sm-inline-block">
 | |
|       <b>Version</b> {{ webadmin_version.current_version }} 
 | |
|     </div>
 | |
|   </footer>
 | |
| 
 | |
|   <!-- Control Sidebar -->
 | |
|   <aside class="control-sidebar control-sidebar-dark">
 | |
|     <!-- Control sidebar content goes here -->
 | |
|   </aside>
 | |
|   <!-- /.control-sidebar -->
 | |
| </div>
 | |
| <!-- ./wrapper -->
 | |
| 
 | |
| <!-- jQuery -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/jquery/jquery.min.js"></script>
 | |
| <!-- jQuery UI 1.11.4 -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/jquery-ui/jquery-ui.min.js"></script>
 | |
| <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
 | |
| <script>
 | |
|   $.widget.bridge('uibutton', $.ui.button)
 | |
| </script>
 | |
| <!-- Bootstrap 4 -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
 | |
| <!-- ChartJS -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/chart.js/Chart.min.js"></script>
 | |
| <!-- Sparkline -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/sparklines/sparkline.js"></script>
 | |
| <!-- JQVMap -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/jqvmap/jquery.vmap.min.js"></script>
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/jqvmap/maps/jquery.vmap.usa.js"></script>
 | |
| <!-- jQuery Knob Chart -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/jquery-knob/jquery.knob.min.js"></script>
 | |
| <!-- daterangepicker -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/moment/moment.min.js"></script>
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/daterangepicker/daterangepicker.js"></script>
 | |
| <!-- Tempusdominus Bootstrap 4 -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
 | |
| <!-- Summernote -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/summernote/summernote-bs4.min.js"></script>
 | |
| <!-- overlayScrollbars -->
 | |
| <script src="/static/AdminLTE-3.2.0/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
 | |
| <!-- AdminLTE App -->
 | |
| <script src="/static/AdminLTE-3.2.0/dist/js/adminlte.js"></script>
 | |
| <script src="/static/AdminLTE-3.2.0/dist/js/pages/dashboard.js"></script>
 | |
| 
 | |
| 
 | |
| {% comment %}{% if messages %}
 | |
|             <script>
 | |
|               {% for message in messages %}
 | |
|                 {% with message.message|split:"|" as message_part %}
 | |
|                     $(document).Toasts('create', {
 | |
|                       {% if message.tags %}
 | |
|                       class: 'bg-{{ message.tags}}',
 | |
|                       {% endif %}
 | |
|                       {% if partes|length > 1 %}
 | |
|                       title: '{{ message_part.1 }}',
 | |
|                       {% endif %}
 | |
|                       delay: 750,
 | |
|                       body: '{{ message_part.0 }}'
 | |
|                     })
 | |
|                 {% endwith %}
 | |
|               {% endfor %}
 | |
| 
 | |
|             </script>
 | |
|               
 | |
|           
 | |
|       {% endif %}
 | |
| {% endcomment %}
 | |
| 
 | |
| <script>
 | |
|   $(document).ready(function() {
 | |
|     const webadminVersion = '{{ webadmin_version.current_version }}'; 
 | |
| 
 | |
|     $('#btn_update_changelog').on('click', function() {
 | |
|         $.ajax({
 | |
|             url: `https://updates.eth0.com.br/api/application_changelog/?app=wireguard_webadmin&version=${webadminVersion}`,
 | |
|             type: 'GET',
 | |
|             success: function(response) {
 | |
|                 const updates = response.updates.sort((a, b) => new Date(b.release_date) - new Date(a.release_date));
 | |
|                 let updatesHtml = '';
 | |
|                 updates.forEach(update => {
 | |
|                     updatesHtml += `<div class="update">
 | |
|                                         <h5>Version ${update.version}</h5>
 | |
|                                         <p>${update.release_notes.replace(/\r\n/g, "<br>")}</p>
 | |
|                                     </div>`;
 | |
|                 });
 | |
| 
 | |
|                 // Update modal content
 | |
|                 $('#genericModalLabel').text('Wireguard Webadmin Updates');
 | |
|                 $('#genericModalBody').html(updatesHtml);
 | |
|                 $('#genericModalCloseButton').text('Close');
 | |
|                 $('#genericModalActionButton').text('Update Instructions').attr('href', 'https://github.com/eduardogsilva/wireguard_webadmin').attr('target', '_blank');
 | |
|                 
 | |
|                 // Show modal
 | |
|                 $('#genericModal').modal('show');
 | |
|             },
 | |
|             error: function(xhr, status, error) {
 | |
|                 // Update modal for error display
 | |
|                 $('#genericModalLabel').text('Error');
 | |
|                 $('#genericModalBody').html('<p>An error occurred while fetching the update information. Please try again later.</p>');
 | |
|                 $('#genericModalCloseButton').text('Close');
 | |
|                 $('#genericModalActionButton').hide(); // Hide the action button in case of error
 | |
|                 
 | |
|                 // Show modal
 | |
|                 $('#genericModal').modal('show');
 | |
|                 console.error("An error occurred while fetching updates: ", error);
 | |
|             }
 | |
|         });
 | |
|     });
 | |
| });
 | |
| 
 | |
| 
 | |
| </script>
 | |
| 
 | |
| {% include "template_messages.html" %}
 | |
| 
 | |
| {% block custom_page_scripts %}
 | |
| 
 | |
| {% endblock %}
 | |
| 
 | |
| </body>
 | |
| </html> |