wip: create/update/delete...

This commit is contained in:
Christoph Haas 2020-11-09 14:32:20 +01:00
parent 7d7af70346
commit 2e61b8c8bd
10 changed files with 62 additions and 187 deletions

View File

@ -1,3 +1,8 @@
/* THEME STYLE */
pre{background:#f7f7f9}iframe{overflow:hidden;border:none}@media (min-width: 768px){body>.navbar-transparent{box-shadow:none}body>.navbar-transparent .navbar-nav>.open>a{box-shadow:none}}#home,#help{font-size:.9rem}#home .navbar,#help .navbar{background:#349aed;background:linear-gradient(145deg, #349aed 50%, #34d8ed 100%);transition:box-shadow 200ms ease-in}#home .navbar-transparent,#help .navbar-transparent{background:none !important;box-shadow:none}#home .navbar-brand .nav-link,#help .navbar-brand .nav-link{display:inline-block;margin-right:-30px}#home .nav-link,#help .nav-link{text-transform:uppercase;font-weight:500;color:#fff}#home{padding-top:0}#home .btn{padding:.6rem .55rem .5rem;box-shadow:none;font-size:.7rem;font-weight:500}.bs-docs-section{margin-top:4em}.bs-docs-section .page-header h1{padding:2rem 0;font-size:3rem}.dropdown-menu.show[aria-labelledby="themes"]{display:-ms-flexbox;display:flex;width:420px;-ms-flex-wrap:wrap;flex-wrap:wrap}.dropdown-menu.show[aria-labelledby="themes"] .dropdown-item{width:33.333%}.dropdown-menu.show[aria-labelledby="themes"] .dropdown-item:first-child{width:100%}.bs-component{position:relative}.bs-component+.bs-component{margin-top:1rem}.bs-component .card{margin-bottom:1rem}.bs-component .modal{position:relative;top:auto;right:auto;left:auto;bottom:auto;z-index:1;display:block}.bs-component .modal-dialog{width:90%}.bs-component .popover{position:relative;display:inline-block;width:220px;margin:20px}.source-button{display:none;position:absolute;top:0;right:0;z-index:100;font-weight:700}.source-button:hover{cursor:pointer}.bs-component:hover .source-button{display:block}#source-modal pre{max-height:calc(100vh - 11rem);background-color:rgba(0,0,0,0.7);color:rgba(255,255,255,0.7)}.nav-tabs{margin-bottom:15px}.progress{margin-bottom:10px}#footer{margin:5em 0}#footer li{float:left;margin-right:1.5em;margin-bottom:1.5em}#footer p{clear:left;margin-bottom:0}.splash{padding:12em 0 6em;background:#349aed;background:linear-gradient(145deg, #349aed 50%, #34d8ed 100%);color:#fff;text-align:center}.splash .logo{width:160px}.splash h1{font-size:3em;color:#fff}.splash #social{margin:2em 0 3em}.splash .alert{margin:2em 0;border:none}.splash .sponsor a{color:#fff}.section-tout{padding:6em 0 1em;border-bottom:1px solid rgba(0,0,0,0.05);background-color:#eaf1f1;text-align:center}.section-tout .icon{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:80px;height:80px;margin:0 auto 1rem;background:#349aed;background:linear-gradient(145deg, #3b9cea 50%, #3db8eb 100%);border-radius:50%;font-size:2rem;color:rgba(0,0,0,0.5)}.section-tout p{margin-bottom:5em}.section-preview{padding:4em 0}.section-preview .preview{margin-bottom:4em;background-color:#eaf1f1}.section-preview .preview .image{position:relative}.section-preview .preview .image::before{box-shadow:inset 0 0 0 1px rgba(0,0,0,0.1);position:absolute;top:0;left:0;width:100%;height:100%;content:"";pointer-events:none}.section-preview .preview .options{padding:2em;border:1px solid rgba(0,0,0,0.05);border-top:none;text-align:center}.section-preview .preview .options p{margin-bottom:2em}.section-preview .dropdown-menu{text-align:left}.section-preview .lead{margin-bottom:2em}.sponsor #carbonads{max-width:240px;margin:0 auto}.sponsor .carbon-text{display:block;margin-top:1em;font-size:12px}.sponsor .carbon-poweredby{float:right;margin-top:1em;font-size:10px}@media (max-width: 767px){.splash{padding-top:8em}.splash .logo{width:100px}.splash h1{font-size:2em}#banner{margin-bottom:2em;text-align:center}}
/* CUSTOM STYLE */
/* Start collapsable table /* Start collapsable table
-------------------------------------------------- */ -------------------------------------------------- */

View File

@ -14,9 +14,9 @@
<link rel="stylesheet" href="/css/custom.css"> <link rel="stylesheet" href="/css/custom.css">
</head> </head>
<body id="page-top"> <body id="page-top" class="d-flex flex-column min-vh-100">
{{template "prt_nav.html" .}} {{template "prt_nav.html" .}}
<div class="container"> <div class="container mt-5">
<h1>Create new clients</h1> <h1>Create new clients</h1>
<h2>Enter valid LDAP user email addresses to quickly create new accounts.</h2> <h2>Enter valid LDAP user email addresses to quickly create new accounts.</h2>
{{if $.Alerts.HasAlert}} {{if $.Alerts.HasAlert}}

View File

@ -11,9 +11,9 @@
<link rel="stylesheet" href="/css/custom.css"> <link rel="stylesheet" href="/css/custom.css">
</head> </head>
<body id="page-top"> <body id="page-top" class="d-flex flex-column min-vh-100">
{{template "prt_nav.html" .}} {{template "prt_nav.html" .}}
<div class="container"> <div class="container mt-5">
{{if .Peer.IsNew}} {{if .Peer.IsNew}}
<h1>Create a new client</h1> <h1>Create a new client</h1>
{{else}} {{else}}
@ -69,15 +69,15 @@
<div class="form-row"> <div class="form-row">
<div class="form-group col-md-12"> <div class="form-group col-md-12">
<div class="form-check form-check-inline"> <div class="custom-control custom-switch">
<input class="form-check-input" name="isdisabled" type="checkbox" value="true" id="inputDisabled" {{if .Peer.DeactivatedAt}}checked{{end}}> <input class="custom-control-input" name="isdisabled" type="checkbox" value="true" id="inputDisabled" {{if .Peer.DeactivatedAt}}checked{{end}}>
<label class="form-check-label" for="inputDisabled"> <label class="custom-control-label" for="inputDisabled">
Disabled Disabled
</label> </label>
</div> </div>
<div class="form-check form-check-inline"> <div class="custom-control custom-switch">
<input class="form-check-input" name="ignorekeepalive" type="checkbox" value="true" id="inputIgnoreKeepalive" {{if .Peer.IgnorePersistentKeepalive}}checked{{end}}> <input class="custom-control-input" name="ignorekeepalive" type="checkbox" value="true" id="inputIgnoreKeepalive" {{if .Peer.IgnorePersistentKeepalive}}checked{{end}}>
<label class="form-check-label" for="inputIgnoreKeepalive"> <label class="custom-control-label" for="inputIgnoreKeepalive">
Ignore persistent keepalive Ignore persistent keepalive
</label> </label>
</div> </div>

View File

@ -11,9 +11,9 @@
<link rel="stylesheet" href="/css/custom.css"> <link rel="stylesheet" href="/css/custom.css">
</head> </head>
<body id="page-top"> <body id="page-top" class="d-flex flex-column min-vh-100">
{{template "prt_nav.html" .}} {{template "prt_nav.html" .}}
<div class="container"> <div class="container mt-5 main-app">
<h1>Edit interface <strong>{{.Device.DeviceName}}</strong></h1> <h1>Edit interface <strong>{{.Device.DeviceName}}</strong></h1>
{{if $.Alerts.HasAlert}} {{if $.Alerts.HasAlert}}

View File

@ -11,10 +11,10 @@
<link rel="stylesheet" href="/css/custom.css"> <link rel="stylesheet" href="/css/custom.css">
</head> </head>
<body id="page-top"> <body id="page-top" class="d-flex flex-column min-vh-100">
{{template "prt_nav.html" .}} {{template "prt_nav.html" .}}
<div class="container"> <div class="container mt-5">
<h1 class="mt-2">WireGuard VPN Administration</h1> <h1>WireGuard VPN Administration</h1>
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
@ -95,7 +95,6 @@
<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=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=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=ip">IP's <i class="fa fa-fw {{.Session.GetSortIcon "ip"}}"></i></a></th>
<th scope="col"><a href="?sort=traffic">Traffic <i class="fa fa-fw {{.Session.GetSortIcon "traffic"}}"></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">Last Handshake <i class="fa fa-fw {{.Session.GetSortIcon "handshake"}}"></i></a></th>
<th scope="col"></th><!-- Actions --> <th scope="col"></th><!-- Actions -->
</tr> </tr>
@ -112,10 +111,8 @@
<td>{{$p.Email}}</td> <td>{{$p.Email}}</td>
<td>{{$p.IPsStr}}</td> <td>{{$p.IPsStr}}</td>
{{if not $p.Peer}} {{if not $p.Peer}}
<td>? / ?</td>
<td>?</td> <td>?</td>
{{else}} {{else}}
<td>{{if $p.DeactivatedAt}}-{{else}}{{$p.Peer.ReceiveBytes}} / {{$p.Peer.TransmitBytes}}{{end}}</td>
<td>{{if $p.DeactivatedAt}}-{{else}}{{$p.Peer.LastHandshakeTime}}{{end}}</td> <td>{{if $p.DeactivatedAt}}-{{else}}{{$p.Peer.LastHandshakeTime}}{{end}}</td>
{{end}} {{end}}
<td> <td>
@ -125,7 +122,7 @@
</td> </td>
</tr> </tr>
<tr class="hiddenRow"> <tr class="hiddenRow">
<td colspan="8" class="hiddenCell" style="white-space:nowrap"> <td colspan="7" class="hiddenCell" style="white-space:nowrap">
<div class="collapse" id="{{$p.UID}}" data-parent="#userTable"> <div class="collapse" id="{{$p.UID}}" data-parent="#userTable">
<div class="row collapsedRow"> <div class="row collapsedRow">
<div class="col-md-6 leftBorder"> <div class="col-md-6 leftBorder">
@ -142,6 +139,7 @@
</ul> </ul>
<div class="tab-content" id="tabContent{{$p.UID}}"> <div class="tab-content" id="tabContent{{$p.UID}}">
<div id="t1{{$p.UID}}" class="tab-pane fade active show"> <div id="t1{{$p.UID}}" class="tab-pane fade active show">
<h4>User details</h4>
{{if not $p.LdapUser}} {{if not $p.LdapUser}}
<p>No LDAP user-information available...</p> <p>No LDAP user-information available...</p>
{{else}} {{else}}
@ -153,6 +151,12 @@
<li>Department: {{$p.UID}}</li> <li>Department: {{$p.UID}}</li>
</ul> </ul>
{{end}} {{end}}
<h4>Traffic</h4>
{{if not $p.Peer}}
<p>No Traffic data available...</p>
{{else}}
<p>{{if $p.DeactivatedAt}}-{{else}}{{$p.Peer.ReceiveBytes}} / {{$p.Peer.TransmitBytes}}{{end}}</p>
{{end}}
</div> </div>
<div id="t2{{$p.UID}}" class="tab-pane fade"> <div id="t2{{$p.UID}}" class="tab-pane fade">
<pre>{{$p.Config}}</pre> <pre>{{$p.Config}}</pre>

View File

@ -1,142 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<!-- http://paintstrap.com/preview_by_id/27826?design=large -->
<!-- http://www.colourlovers.com/palette/4657935 -->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>{{ .static.WebsiteTitle }} - Edit User</title>
<meta name="description" content="{{ .static.WebsiteTitle }}">
<link rel="stylesheet" href="/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i">
<link rel="stylesheet" href="/fonts/fontawesome-all.min.css">
<link rel="stylesheet" href="/css/custom.css">
</head>
<body id="page-top">
{{template "prt_nav.html" .}}
<div class="container user-edit-container">
<div class="jumbotron user-edit-jumbotron">
<form method="post" enctype="multipart/form-data">
<div class="row">
<div class="form-row">
<div class="form-group col-md-6 text-center">
<img class="list-image-edit" src="/user/{{$.user.Username}}/user.jpg?cc={{len $.user.Image}}" alt="User Image"/>
<input type="file" accept="image/jpeg" name="thumbnailPhoto"
class="form-control-file center-block" id="inputThumbnailPhoto">
</div>
<div class="form-group col-md-6">
<label for="inputName">Name</label>
<input type="text" name="displayName" class="form-control" id="inputName" placeholder="" value="{{index $.user.Attributes "displayName" }}">
<label for="inputMail">Email</label>
<input type="email" name="mail" class="form-control" id="inputMail" placeholder="" value="{{index $.user.Attributes "mail" }}" readonly >
<label for="inputUserID">User ID</label>
<input type="text" name="sAMAccountName" class="form-control" id="inputUserID" placeholder="" value="{{index $.user.Attributes "sAMAccountName" }}" readonly>
</div>
</div>
</div>
<br>
<div class="row">
<div class="form-row">
<div class="form-group col-md-4">
<label for="inputPhone">Phone Number</label>
<input type="text" name="telephoneNumber" class="form-control" id="inputPhone" value="{{index $.user.Attributes "telephoneNumber" }}" placeholder="">
</div>
<div class="form-group col-md-4">
<label for="inputMobile">Mobile Number</label>
<input type="text" name="mobile" class="form-control" id="inputMobile" value="{{index $.user.Attributes "mobile" }}" placeholder="">
</div>
<div class="form-group col-md-4">
<label for="inputEmployeeID">Employee ID</label>
<input type="text" name="employeeID" class="form-control" id="inputEmployeeID" value="{{index $.user.Attributes "employeeID" }}" placeholder="">
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputTitle">Title</label>
<input type="text" name="title" class="form-control" id="inputTitle" value="{{index $.user.Attributes "title" }}" placeholder="">
</div>
<div class="form-group col-md-6">
<label for="inputDepartment">Department</label>
<input type="text" name="department" class="form-control" id="inputDepartment" value="{{index $.user.Attributes "department" }}" placeholder="">
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputCompany">Company</label>
<input type="text" name="company" class="form-control" id="inputCompany" value="{{index $.user.Attributes "company" }}" placeholder="">
</div>
<div class="form-group col-md-6">
<label for="inputManager">Teamleader</label>
<select name="manager" id="inputManager" class="form-control">
<option value="">No Teamleader</option>
{{range $i, $leader := $.teamLeaders}}
{{if eq $leader.DN (index $.user.Attributes "manager")}}
<option value="{{$leader.DN}}" selected>{{$leader.Firstname}} {{$leader.Lastname}}</option>
{{else}}
<option value="{{$leader.DN}}">{{$leader.Firstname}} {{$leader.Lastname}}</option>
{{end}}
{{end}}
</select>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="inputStreet">Street</label>
<input type="text" name="streetAddress" class="form-control" id="inputStreet" value="{{index $.user.Attributes "streetAddress" }}" placeholder="">
</div>
<div class="form-group col-md-4">
<label for="inputZip">Street</label>
<input type="text" name="postalCode" class="form-control" id="inputZip" value="{{index $.user.Attributes "postalCode" }}" placeholder="">
</div>
<div class="form-group col-md-4">
<label for="inputCity">City</label>
<input type="text" name="l" class="form-control" id="inputCity" value="{{index $.user.Attributes "l" }}" placeholder="">
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputState">State/Province</label>
<input type="text" name="st" class="form-control" id="inputState" value="{{index $.user.Attributes "st" }}" placeholder="">
</div>
<div class="form-group col-md-6">
<label for="inputCountry">Country</label>
<input type="text" name="co" class="form-control" id="inputCountry" value="{{index $.user.Attributes "co" }}" placeholder="">
</div>
</div>
</div>
<div class="row">
<div class="form-row">
<div class="form-group col-md-12">
<button type="submit" class="btn btn-primary">Save</button>
{{if le $.jumpBack 0 }}
<a href="/" class="btn btn-default">Cancel</a>
{{else}}
<a href="/#user-pos-{{$.jumpBack}}" class="btn btn-default">Cancel</a>
{{end}}
</div>
</div>
</div>
{{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>
{{end}}
</form>
</div>
</div>
{{template "prt_footer.html"}}
<script src="/js/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/jquery.easing.js"></script>
<script src="/js/custom.js"></script>
</body>
</html>

View File

@ -1,7 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<!-- http://paintstrap.com/preview_by_id/27826?design=large --> <!-- https://bootswatch.com/lux/ -->
<!-- http://www.colourlovers.com/palette/4657935 -->
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
@ -13,9 +12,9 @@
<link rel="stylesheet" href="/css/custom.css"> <link rel="stylesheet" href="/css/custom.css">
</head> </head>
<body id="page-top"> <body id="page-top" class="d-flex flex-column min-vh-100">
{{template "prt_nav.html" .}} {{template "prt_nav.html" .}}
<div class="container"> <div class="container mt-5">
<div class="page-header"> <div class="page-header">
<h1>WireGuard VPN Portal</h1> <h1>WireGuard VPN Portal</h1>
</div> </div>
@ -23,7 +22,7 @@
</div> </div>
{{template "prt_footer.html"}} {{template "prt_footer.html"}}
<script src="/js/jquery.min.js"></script> <script src="/js/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script> <script src="/js/bootstrap.bundle.min.js"></script>
<script src="/js/jquery.easing.js"></script> <script src="/js/jquery.easing.js"></script>
<script src="/js/custom.js"></script> <script src="/js/custom.js"></script>
</body> </body>

View File

@ -16,23 +16,32 @@
<body class="bg-gradient-primary"> <body class="bg-gradient-primary">
<div class="container"> <div class="container">
<form class="form-signin" method="post"> <div class="card mt-5">
<h2 class="form-signin-heading">Please sign in</h2> <div class="card-header">Please sign in</div>
<label for="inputUser" class="sr-only">Username</label> <div class="card-body">
<input name="username" type="text" id="inputUser" class="form-control" placeholder="user.name" required="" autofocus=""> <form class="form-signin" method="post">
<label for="inputPassword" class="sr-only">Password</label> <div class="form-group">
<input name="password" type="password" id="inputPassword" class="form-control" placeholder="password" required=""> <label for="inputUsername">Username</label>
<button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button> <input type="text" name="username" class="form-control" id="inputUsername" aria-describedby="usernameHelp" placeholder="Enter username">
<small id="usernameHelp" class="form-text text-muted">Please enter your LDAP username, not the email address.</small>
</div>
<div class="form-group">
<label for="inputPassword">Password</label>
<input type="password" name="password" class="form-control" id="inputPassword" placeholder="Password">
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
{{ if eq .error true }} {{ if eq .error true }}
<hr> <hr>
<span class="text-danger">{{.message}}</span> <span class="text-danger">{{.message}}</span>
{{end}} {{end}}
</form> </form>
<div class="card shadow-lg o-hidden border-0 my-5"> <div class="card shadow-lg o-hidden border-0 my-5">
<div class="card-body p-0"> <div class="card-body p-0">
<a href="/" class="btn btn-white btn-block text-primary btn-user">Go Home</a> <a href="/" class="btn btn-white btn-block text-primary btn-user">Go Home</a>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -1,6 +1,5 @@
<footer class="footer"> <footer class="page-footer mt-auto">
<div class="container"> <div class="container mt-3">
<p class="text-muted">Copyright © Prolicht GmbH 2020 <a class="scroll-to-top" href="#page-top"><i class="fas fa-angle-up"></i></a></p> <p class="text-muted">Copyright © Prolicht GmbH 2020 <a class="scroll-to-top" href="#page-top"><i class="fas fa-angle-up"></i></a></p>
</div> </div>
</footer> </footer>

View File

@ -7,11 +7,12 @@
<div id="topNavbar" class="navbar-collapse collapse"> <div id="topNavbar" class="navbar-collapse collapse">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0"> <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<li class="nav-spacer"></li> <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"> <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"> <input class="form-control mr-sm-2" name="search" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit"><i class="fa fa-search"></i></button> <button class="btn btn-outline-success my-2 my-sm-0" type="submit"><i class="fa fa-search"></i></button>
</form> </form>
{{end}}{{end}}
</ul> </ul>
{{if eq $.Session.LoggedIn true}} {{if eq $.Session.LoggedIn true}}
<div class="nav-item dropdown"> <div class="nav-item dropdown">