69 lines
2.1 KiB
HTML
69 lines
2.1 KiB
HTML
|
{% extends 'base.html' %}
|
||
|
|
{% block header %}
|
||
|
|
<style>
|
||
|
|
td > input {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
{% endblock %}
|
||
|
|
|
||
|
|
{% block content %}
|
||
|
|
<p>
|
||
|
|
Urejate ključe WireGuard s posebnimi dostopi.
|
||
|
|
|
||
|
|
<table class="keys">
|
||
|
|
<thead>
|
||
|
|
<th><th>Ključ<th>IP<th>IPv6<th>Naprava<th>Omrežja
|
||
|
|
<tbody>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
<section>
|
||
|
|
<h1>Nov ključ</h1>
|
||
|
|
<form id="request">
|
||
|
|
<p>
|
||
|
|
<label for="name">Ime naprave</label><br>
|
||
|
|
<input type="text" id="name" name="name" pattern="[-._A-Za-z0-9 ]*" maxlength="32" placeholder="A-Z a-z 0-9 . _ - " />
|
||
|
|
<p>
|
||
|
|
<label for="networks">Omrežja</label><br>
|
||
|
|
<select id="networks" name="networks" multiple style="width: 20em;">
|
||
|
|
{% for network in ipsets %}
|
||
|
|
<option>{{ network }}
|
||
|
|
{% endfor %}
|
||
|
|
</select>
|
||
|
|
<p>
|
||
|
|
<button id="submit" type="submit">Ustvari ključ</button>
|
||
|
|
</form>
|
||
|
|
|
||
|
|
<section id="settings" style="display: none;">
|
||
|
|
<p>
|
||
|
|
Nastavitve za povezavo so izpisane spodaj. Za nov ključ osvežite to stran.
|
||
|
|
|
||
|
|
<section style="display: flex; align-items: center;">
|
||
|
|
<pre style="flex-grow: 3; margin: 0;"><a id="download" href="" style="float: right; padding: 0.5em;">Prenesi</a><code id="config"></code></pre>
|
||
|
|
<div id="qr" style="flex-grow: 1; text-align: center;"></div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<script type="text/javascript" src="{{ url_for('static', filename='qrcode.js') }}"></script>
|
||
|
|
<script type="text/javascript" src="{{ url_for('static', filename='wireguard.js') }}"></script>
|
||
|
|
<script type="text/javascript" src="{{ url_for('static', filename='vpn.js') }}"></script>
|
||
|
|
<script type="text/javascript">
|
||
|
|
const endpoint = 'list-custom';
|
||
|
|
function update(keys) {
|
||
|
|
const keytab = document.querySelector('table.keys > tbody');
|
||
|
|
keytab.innerHTML = ''
|
||
|
|
for (const key of keys) {
|
||
|
|
const row = keytab.insertRow();
|
||
|
|
row.insertCell().innerHTML = '<button onclick="delKey(\'' + key.key + '\');">✖</button>';
|
||
|
|
row.insertCell().innerHTML = '<code>' + key.key + '</code>';
|
||
|
|
row.insertCell().innerHTML = key.ip;
|
||
|
|
row.insertCell().innerHTML = key.ip6 || '';
|
||
|
|
row.insertCell().innerHTML = key.name;
|
||
|
|
row.insertCell().innerHTML = key.networks;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
{% endblock %}
|