Added display of expiration date to the user interface
Also stopped ever displaying creation time and rearranged some CSS
This commit is contained in:
parent
ca3d536868
commit
670c88c7f3
@ -157,11 +157,10 @@ class WireGuard:
|
||||
self.configs_base = Path(config['configs_base'])
|
||||
self.max_clients = config.getint('user_client_limit', fallback=0)
|
||||
|
||||
self.client_validity = 0
|
||||
client_validity = config.get('user_client_validity', fallback=0)
|
||||
if client_validity:
|
||||
self.client_validity = parse_timestring(client_validity)
|
||||
else:
|
||||
self.client_validity = 0
|
||||
|
||||
self.server_config_base = None
|
||||
if 'server_extra_config' in config:
|
||||
@ -326,10 +325,17 @@ class WireGuard:
|
||||
open(self.meta_filepath(config_id), 'r') as mf:
|
||||
metadata = json.load(mf)
|
||||
configdata = cf.read()
|
||||
creation_date = metadata['created']
|
||||
expiry_date = None
|
||||
if self.client_validity:
|
||||
expiry_date = (datetime.fromisoformat(creation_date)
|
||||
+ self.client_validity)
|
||||
expiry_date = expiry_date.strftime('%Y-%m-%d')
|
||||
return {'id': config_id,
|
||||
'name': metadata['name'],
|
||||
'description': metadata['description'],
|
||||
'created': metadata['created'],
|
||||
'created': creation_date,
|
||||
'expires': expiry_date,
|
||||
'data': configdata}
|
||||
|
||||
def delete_config(self, *args) -> None:
|
||||
|
@ -48,7 +48,7 @@
|
||||
<template id="display-config">
|
||||
<config aria-label="client" role="landmark">
|
||||
<a class="conffile" href="" download=""></a>
|
||||
<date aria-label="creation date"></date>
|
||||
<expires aria-label="expiry date"></expires>
|
||||
<name role="heading" aria-label="client name"></name>
|
||||
<description aria-label="client description"></description>
|
||||
<data></data>
|
||||
|
@ -79,10 +79,15 @@
|
||||
qr.setAttribute('aria-label', 'QR code');
|
||||
config.id = 'config-' + config_id;
|
||||
config.querySelector('name').textContent = data.name;
|
||||
config.querySelector('date').textContent = data.created;
|
||||
config.querySelector('description').textContent = data.description;
|
||||
config.querySelector('data').textContent = data.data;
|
||||
config.querySelector('qrcode').replaceWith(qr);
|
||||
const expires = config.querySelector('expires');
|
||||
if(data.expires) {
|
||||
expires.textContent = data.expires;
|
||||
} else {
|
||||
config.removeChild(expires);
|
||||
}
|
||||
const link = config.querySelector('.conffile');
|
||||
link.setAttribute('href',
|
||||
dlprefix + encodeURIComponent(data.data));
|
||||
|
@ -97,6 +97,7 @@ config {
|
||||
background-color: #EBF0F5;
|
||||
border: 2px solid #DCE4EE;
|
||||
border-radius: 0.5rem;
|
||||
gap: 0.2rem;
|
||||
}
|
||||
|
||||
config >*:last-child {
|
||||
@ -110,16 +111,17 @@ config > name {
|
||||
config > description {
|
||||
grid-area: description;
|
||||
align-self: stretch;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
config > data {
|
||||
grid-area: data;
|
||||
}
|
||||
config > date {
|
||||
config > expires {
|
||||
grid-area: date;
|
||||
justify-self: end;
|
||||
align-self: baseline;
|
||||
width: max-content;
|
||||
color: #b00020;
|
||||
}
|
||||
config > expires:before {
|
||||
content: 'Expires: ';
|
||||
}
|
||||
config > svg {
|
||||
grid-area: qr;
|
||||
@ -137,11 +139,6 @@ name {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
name, description {
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
description, data {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
@ -189,7 +186,8 @@ h3 {
|
||||
}
|
||||
|
||||
h3, label {
|
||||
margin-top: 0.4rem;
|
||||
margin-top: 0.6rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
input, textarea {
|
||||
@ -273,11 +271,12 @@ button.delete:hover {
|
||||
}
|
||||
config {
|
||||
grid-template-areas:
|
||||
"name date"
|
||||
"description description"
|
||||
"qr qr"
|
||||
"footer footer";
|
||||
grid-template-rows: min-content auto 280px 2.8rem;
|
||||
"name"
|
||||
"date"
|
||||
"description"
|
||||
"qr"
|
||||
"footer";
|
||||
grid-template-rows: min-content auto auto 280px 2.8rem;
|
||||
}
|
||||
config > svg {
|
||||
justify-self: center;
|
||||
@ -289,10 +288,11 @@ button.delete:hover {
|
||||
@media (width >= 60rem), (width < 44rem) {
|
||||
config {
|
||||
grid-template-areas:
|
||||
"name date"
|
||||
"name name"
|
||||
"date date"
|
||||
"description description"
|
||||
"qr footer";
|
||||
grid-template-rows: min-content auto 240px;
|
||||
grid-template-rows: min-content auto auto 240px;
|
||||
}
|
||||
config > svg {
|
||||
justify-self: start;
|
||||
@ -313,11 +313,12 @@ button.delete:hover {
|
||||
@media (width < 30rem) {
|
||||
config {
|
||||
grid-template-areas:
|
||||
"name date"
|
||||
"description description"
|
||||
"qr qr"
|
||||
"footer footer";
|
||||
grid-template-rows: min-content auto 280px 2.8rem;
|
||||
"name"
|
||||
"date"
|
||||
"description"
|
||||
"qr"
|
||||
"footer";
|
||||
grid-template-rows: min-content auto auto 280px 2.8rem;
|
||||
}
|
||||
config > svg {
|
||||
justify-self: center;
|
||||
|
Loading…
x
Reference in New Issue
Block a user