Mirrors/wg-portal
1
0
Fork 0
mirror of https://github.com/h44z/wg-portal.git synced 2025-09-13 14:31:15 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

wip: mail...

Browse Source
This commit is contained in:
Christoph Haas
2020-11-09 20:26:34 +01:00
parent 2e61b8c8bd
commit e8e8d08d98
16 changed files with 801 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
assets/js/custom.js
View File

@@ -10,12 +10,9 @@
e.preventDefault();
});
$(function () {
$('[data-toggle="tooltip"]').tooltip()
});
})(jQuery); // End of use strict
function OnSearch(input) {
if(input.value === "") {
window.location = "/?search=";
}
}

10
assets/tpl/admin_create_clients.html
View File

@@ -20,14 +20,8 @@
<h1>Create new clients</h1>
<h2>Enter valid LDAP user email addresses to quickly create new accounts.</h2>
{{if $.Alerts.HasAlert}}
<div class="row">
<div class="form-row">
<div class="col-md-12">
<div class="alert alert-{{$.Alerts.Type}}" role="alert">
{{$.Alerts.Message}}
</div>
</div>
</div>
<div class="alert alert-{{$.Alerts.Type}}" role="alert">
{{$.Alerts.Message}}
</div>
{{end}}

10
assets/tpl/admin_edit_client.html
View File

@@ -21,14 +21,8 @@
{{end}}
{{if $.Alerts.HasAlert}}
<div class="row">
<div class="form-row">
<div class="col-md-12">
<div class="alert alert-{{$.Alerts.Type}}" role="alert">
{{$.Alerts.Message}}
</div>
</div>
</div>
<div class="alert alert-{{$.Alerts.Type}}" role="alert">
{{$.Alerts.Message}}
</div>
{{end}}

10
assets/tpl/admin_edit_interface.html
View File

@@ -17,14 +17,8 @@
<h1>Edit interface <strong>{{.Device.DeviceName}}</strong></h1>
{{if $.Alerts.HasAlert}}
<div class="row">
<div class="form-row">
<div class="col-md-12">
<div class="alert alert-{{$.Alerts.Type}}" role="alert">
{{$.Alerts.Message}}
</div>
</div>
</div>
<div class="alert alert-{{$.Alerts.Type}}" role="alert">
{{$.Alerts.Message}}
</div>
{{end}}

38
assets/tpl/admin_index.html
View File

@@ -15,12 +15,18 @@
{{template "prt_nav.html" .}}
<div class="container mt-5">
<h1>WireGuard VPN Administration</h1>
{{if $.Alerts.HasAlert}}
<div class="alert alert-{{$.Alerts.Type}}" role="alert">
{{$.Alerts.Message}}
</div>
{{end}}
<div class="card">
<div class="card-header">
<div class="d-flex align-items-center">
<span class="mr-auto">Interface status for <strong>{{.Device.DeviceName}}</strong></span>
<a href="/admin/device/edit"><i class="fas fa-cog"></i></a>
<a href="/admin/device/download?dev={{.Device.DeviceName}}"><i class="fas fa-download"></i></a>
&nbsp;&nbsp;&nbsp;
<a href="/admin/device/edit?dev={{.Device.DeviceName}}"><i class="fas fa-cog"></i></a>
</div>
</div>
<div class="card-body">
@@ -44,6 +50,10 @@
<td>Enabled Peers:</td>
<td>{{len .Device.Interface.Peers}}</td>
</tr>
<tr>
<td>Total Peers:</td>
<td>{{.TotalPeers}}</td>
</tr>
</tbody>
</table>
</div>
@@ -79,11 +89,11 @@
</div>
<div class="mt-4 row">
<div class="col-sm-10 col-12">
<h2>Current VPN Users</h2>
<h2 class="mt-2">Current VPN Users</h2>
</div>
<div class="col-sm-2 col-12">
<a href="/admin/peer/createldap" title="Add a LDAP user" class="btn btn-primary pull-right"><i class="fa fa-fw fa-user-plus"></i></a>
<a href="/admin/peer/create" title="Manual add a user" class="btn btn-primary pull-right"><i class="fa fa-fw fa-plus"></i>M</a>
<div class="col-sm-2 col-12 text-right">
<a href="/admin/peer/createldap" title="Add a LDAP user" class="btn btn-primary"><i class="fa fa-fw fa-user-plus"></i></a>
<a href="/admin/peer/create" title="Manual add a user" class="btn btn-primary"><i class="fa fa-fw fa-plus"></i>M</a>
</div>
</div>
<div class="mt-2 table-responsive">
@@ -95,7 +105,7 @@
<th scope="col"><a href="?sort=pubKey">Public Key <i class="fa fa-fw {{.Session.GetSortIcon "pubKey"}}"></i></a></th>
<th scope="col"><a href="?sort=mail">E-Mail <i class="fa fa-fw {{.Session.GetSortIcon "mail"}}"></i></a></th>
<th scope="col"><a href="?sort=ip">IP's <i class="fa fa-fw {{.Session.GetSortIcon "ip"}}"></i></a></th>
<th scope="col"><a href="?sort=handshake">Last Handshake <i class="fa fa-fw {{.Session.GetSortIcon "handshake"}}"></i></a></th>
<th scope="col"><a href="?sort=handshake">Handshake <i class="fa fa-fw {{.Session.GetSortIcon "handshake"}}"></i></a></th>
<th scope="col"></th><!-- Actions -->
</tr>
</thead>
@@ -110,11 +120,7 @@
<td>{{$p.PublicKey}}</td>
<td>{{$p.Email}}</td>
<td>{{$p.IPsStr}}</td>
{{if not $p.Peer}}
<td>?</td>
{{else}}
<td>{{if $p.DeactivatedAt}}-{{else}}{{$p.Peer.LastHandshakeTime}}{{end}}</td>
{{end}}
<td><span data-toggle="tooltip" data-placement="left" title="" data-original-title="{{$p.LastHandshakeTime}}">{{$p.LastHandshake}}</span></td>
<td>
{{if eq $.Session.IsAdmin true}}
<a href="/admin/peer/edit?pkey={{$p.PublicKey}}"><i class="fas fa-cog"></i></a>
@@ -166,9 +172,15 @@
</div>
</div>
</div>
<div class="col-md-6">
<div class="col-md-3">
<img class="list-image-large" src="/user/qrcode?pkey={{$p.PublicKey}}"/>
</div>
<div class="col-md-3">
<div class="float-right mt-5">
<a href="/admin/peer/download?pkey={{$p.PublicKey}}" class="btn btn-primary" title="Download configuration">Download</a>
<a href="/admin/peer/email?pkey={{$p.PublicKey}}" class="btn btn-primary" title="Send configuration via Email">Email</a>
</div>
</div>
</div>
</div>
</td>

187
assets/tpl/email.html Normal file
View File

@@ -0,0 +1,187 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<!--[if gte mso 9]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="format-detection" content="date=no" />
<meta name="format-detection" content="address=no" />
<meta name="format-detection" content="telephone=no" />
<meta name="x-apple-disable-message-reformatting" />
<!--[if !mso]><!-->
<link href="https://fonts.googleapis.com/css?family=Muli:400,400i,700,700i" rel="stylesheet" />
<!--<![endif]-->
<title>Email Template</title>
<!--[if gte mso 9]>
<style type="text/css" media="all">
sup { font-size: 100% !important; }
</style>
<![endif]-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<style type="text/css" media="screen">
/* Linked Styles */
body { padding:0 !important; margin:0 !important; display:block !important; min-width:100% !important; width:100% !important; background: #ffffff; -webkit-text-size-adjust:none }
a { color: #000000; text-decoration:none }
p { padding:0 !important; margin:0 !important }
img { -ms-interpolation-mode: bicubic; /* Allow smoother rendering of resized image in Internet Explorer */ }
.mcnPreviewText { display: none !important; }
/* Mobile styles */
@media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
.mobile-shell { width: 100% !important; min-width: 100% !important; }
.bg { background-size: 100% auto !important; -webkit-background-size: 100% auto !important; }
.text-header,
.m-center { text-align: center !important; }
.center { margin: 0 auto !important; }
.container { padding: 20px 10px !important }
.td { width: 100% !important; min-width: 100% !important; }
.m-br-15 { height: 15px !important; }
.p30-15 { padding: 30px 15px !important; }
.m-td,
.m-hide { display: none !important; width: 0 !important; height: 0 !important; font-size: 0 !important; line-height: 0 !important; min-height: 0 !important; }
.m-block { display: block !important; }
.fluid-img img { width: 100% !important; max-width: 100% !important; height: auto !important; }
.column,
.column-top,
.column-empty,
.column-empty2,
.column-dir-top { float: left !important; width: 100% !important; display: block !important; }
.column-empty { padding-bottom: 10px !important; }
.column-empty2 { padding-bottom: 30px !important; }
.content-spacing { width: 15px !important; }
}
</style>
</head>
<body class="body" style="padding:0 !important; margin:0 !important; display:block !important; min-width:100% !important; width:100% !important; background:#000000; -webkit-text-size-adjust:none;">
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#000000">
<tr>
<td align="center" valign="top">
<table width="650" border="0" cellspacing="0" cellpadding="0" class="mobile-shell">
<tr>
<td class="td container" style="width:650px; min-width:650px; font-size:0pt; line-height:0pt; margin:0; font-weight:normal; padding:55px 0px;">
<!-- Article / Image On The Left - Copy On The Right -->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="padding-bottom: 10px;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="tbrr p30-15" style="padding: 60px 30px; border-radius:26px 26px 0px 0px;" bgcolor="#ffffff">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<th class="column-top" width="210" style="font-size:0pt; line-height:0pt; padding:0; margin:0; font-weight:normal; vertical-align:top;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="fluid-img" style="font-size:0pt; line-height:0pt; text-align:left;"><img src="cid:{{.QrcodePngName}}" width="210" height="210" border="0" alt="" /></td>
</tr>
</table>
</th>
<th class="column-empty2" width="30" style="font-size:0pt; line-height:0pt; padding:0; margin:0; font-weight:normal; vertical-align:top;"></th>
<th class="column-top" width="280" style="font-size:0pt; line-height:0pt; padding:0; margin:0; font-weight:normal; vertical-align:top;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
{{if not .Client.LdapUser}}
<td class="h4 pb20" style="color:#000000; font-family:'Muli', Arial,sans-serif; font-size:20px; line-height:28px; text-align:left; padding-bottom:20px;">Hello {{.Client.LdapUser.Firstname}} {{.Client.LdapUser.Lastname}}</td>
{{else}}
<td class="h4 pb20" style="color:#000000; font-family:'Muli', Arial,sans-serif; font-size:20px; line-height:28px; text-align:left; padding-bottom:20px;">Hello</td>
{{end}}
</tr>
<tr>
<td class="text pb20" style="color:#000000; font-family:Arial,sans-serif; font-size:14px; line-height:26px; text-align:left; padding-bottom:20px;">You or your administrator probably requested this VPN configuration. Scan the Qrcode or open the attached configuration file ({{.Client.GetConfigFileName}}) in the WireGuard VPN client to establish a secure VPN connection.</td>
</tr>
</table>
</th>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END Article / Image On The Left - Copy On The Right -->
<!-- Two Columns / Articles -->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="padding-bottom: 10px;">
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="p30-15" style="padding: 50px 30px;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="h3 pb20" style="color:#000000; font-family:'Muli', Arial,sans-serif; font-size:25px; line-height:32px; text-align:left; padding-bottom:20px;">About WireGuard</td>
</tr>
<tr>
<td class="text pb20" style="color:#000000; font-family:Arial,sans-serif; font-size:14px; line-height:26px; text-align:left; padding-bottom:20px;">WireGuard is an extremely simple yet fast and modern VPN that utilizes state-of-the-art cryptography. It aims to be faster, simpler, leaner, and more useful than IPsec, while avoiding the massive headache. It intends to be considerably more performant than OpenVPN.</td>
</tr>
<!-- Button -->
<tr>
<td align="left">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="blue-button text-button" style="background:#000000; color:#c1cddc; font-family:'Muli', Arial,sans-serif; font-size:14px; line-height:18px; padding:12px 30px; text-align:center; border-radius:0px 22px 22px 22px; font-weight:bold;"><a href="https://www.wireguard.com/install" target="_blank" class="link-white" style="color:#ffffff; text-decoration:none;"><span class="link-white" style="color:#ffffff; text-decoration:none;">Download WireGuard VPN Client</span></a></td>
</tr>
</table>
</td>
</tr>
<!-- END Button -->
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END Two Columns / Articles -->
<!-- Footer -->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="p30-15 bbrr" style="padding: 50px 30px; border-radius:0px 0px 26px 26px;" bgcolor="#ffffff">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="text-footer1 pb10" style="color:#000000; font-family:'Muli', Arial,sans-serif; font-size:16px; line-height:20px; text-align:center; padding-bottom:10px;">This mail was generated using WireGuard Portal.</td>
</tr>
<tr>
<td class="text-footer2" style="color:#000000; font-family:'Muli', Arial,sans-serif; font-size:12px; line-height:26px; text-align:center;"><a href="{{.PortalURL}}" target="_blank" class="link" style="color:#000000; text-decoration:none;"><span class="link" style="color:#000000; text-decoration:none;">Visit WireGuard Portal</span></a></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END Footer -->
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>

4
assets/tpl/prt_nav.html
View File

@@ -8,8 +8,8 @@
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<li class="nav-spacer"></li>
{{with eq $.Session.LoggedIn true}}{{with eq $.Session.IsAdmin true}}
<form class="form-inline my-2 my-lg-0" action="/search">
<input class="form-control mr-sm-2" name="search" type="search" placeholder="Search" aria-label="Search">
<form class="form-inline my-2 my-lg-0" method="get">
<input class="form-control mr-sm-2" name="search" type="search" placeholder="Search" aria-label="Search" value="{{$.Session.Search}}">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit"><i class="fa fa-search"></i></button>
</form>
{{end}}{{end}}