71 lines
2.7 KiB
HTML
71 lines
2.7 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Verbundene Clients - {{ server.name }} - mGuard VPN{% endblock %}
|
|
|
|
{% block content %}
|
|
<nav aria-label="breadcrumb" class="mb-3">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="/vpn-servers">VPN-Server</a></li>
|
|
<li class="breadcrumb-item"><a href="/vpn-servers/{{ server.id }}">{{ server.name }}</a></li>
|
|
<li class="breadcrumb-item active">Clients</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h1>
|
|
<i class="bi bi-people"></i> Verbundene Clients
|
|
<span class="badge bg-primary">{{ clients|length }}</span>
|
|
</h1>
|
|
<a href="/vpn-servers/{{ server.id }}" class="btn btn-outline-secondary">
|
|
<i class="bi bi-arrow-left"></i> Zurück zum Server
|
|
</a>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-body">
|
|
{% if clients %}
|
|
<div class="table-responsive">
|
|
<table class="table table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>Common Name</th>
|
|
<th>Echte Adresse</th>
|
|
<th>Empfangen</th>
|
|
<th>Gesendet</th>
|
|
<th>Verbunden seit</th>
|
|
<th>Aktionen</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for client in clients %}
|
|
<tr>
|
|
<td>
|
|
<strong>{{ client.common_name }}</strong>
|
|
</td>
|
|
<td><code>{{ client.real_address }}</code></td>
|
|
<td>{{ (client.bytes_received / 1024 / 1024)|round(2) }} MB</td>
|
|
<td>{{ (client.bytes_sent / 1024 / 1024)|round(2) }} MB</td>
|
|
<td>{{ client.connected_since }}</td>
|
|
<td>
|
|
<form action="/vpn-servers/{{ server.id }}/disconnect/{{ client.common_name }}" method="post"
|
|
onsubmit="return confirm('Client wirklich trennen?');">
|
|
<button type="submit" class="btn btn-sm btn-outline-danger">
|
|
<i class="bi bi-x-circle"></i> Trennen
|
|
</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<div class="text-center py-5 text-muted">
|
|
<i class="bi bi-people" style="font-size: 3rem;"></i>
|
|
<p class="mt-3">Keine Clients verbunden</p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|