109 lines
7.7 KiB
HTML
109 lines
7.7 KiB
HTML
{% extends "sidebar.html" %}
|
|
|
|
{% block title %}AstraOS — IP Analyzer{% endblock %}
|
|
|
|
{% block head %}
|
|
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
|
|
<style>
|
|
.switch { position: relative; display: inline-block; width: 50px; height: 28px; }
|
|
.switch input { opacity: 0; width: 0; height: 0; }
|
|
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #4a5568; transition: .4s; border-radius: 28px; }
|
|
.slider:before { position: absolute; content: ""; height: 20px; width: 20px; left: 4px; bottom: 4px; background-color: white; transition: .4s; border-radius: 50%; }
|
|
input:checked + .slider { background-color: #ef4444; } /* red-500 */
|
|
input:checked + .slider:before { transform: translateX(22px); }
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div x-data="{ isCheater: false }" class="space-y-10">
|
|
<header class="flex justify-between items-center">
|
|
<h2 class="text-4xl font-bold tracking-wide {% if maintenance_active %}text-yellow-300{% else %}text-purple-300{% endif %}">IP Analyzer</h2>
|
|
</header>
|
|
|
|
<div class="bg-black/40 rounded-xl backdrop-blur-lg p-8 {% if maintenance_active %}border border-yellow-500/30{% else %}border border-purple-500/20{% endif %}">
|
|
<form action="{{ url_for('ip_analyzer') }}" method="POST" class="space-y-6">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
|
|
<div>
|
|
<label for="ip_address" class="block text-sm font-medium text-gray-300">IP-Adresse</label>
|
|
<input type="text" name="ip_address" id="ip_address" required placeholder="z.B. 8.8.8.8"
|
|
class="mt-1 w-full px-3 py-2 bg-gray-800 border border-gray-700 rounded-lg text-white focus:outline-none focus:ring-2 {% if maintenance_active %}focus:ring-yellow-500{% else %}focus:ring-purple-500{% endif %}">
|
|
</div>
|
|
|
|
<div class="flex items-center justify-between p-4 bg-gray-900/50 rounded-lg">
|
|
<div>
|
|
<h3 class="text-lg font-semibold text-red-400">Als Cheater markieren</h3>
|
|
<p class="text-gray-400 text-sm mt-1">Markiert diese IP als zu einem Cheater gehörig.</p>
|
|
</div>
|
|
<label class="switch">
|
|
<input type="checkbox" name="is_cheater" x-model="isCheater">
|
|
<span class="slider"></span>
|
|
</label>
|
|
</div>
|
|
|
|
<div x-show="isCheater" x-transition>
|
|
<label for="steam_id" class="block text-sm font-medium text-gray-300">SteamID64</label>
|
|
<input type="text" name="steam_id" id="steam_id" placeholder="Erforderlich, wenn als Cheater markiert"
|
|
class="mt-1 w-full px-3 py-2 bg-gray-800 border border-gray-700 rounded-lg text-white focus:outline-none focus:ring-2 {% if maintenance_active %}focus:ring-yellow-500{% else %}focus:ring-purple-500{% endif %}">
|
|
</div>
|
|
|
|
<div class="flex justify-end pt-4">
|
|
<button type="submit" class="px-6 py-2 text-white font-semibold rounded-lg transition
|
|
{% if maintenance_active %}bg-yellow-600 hover:bg-yellow-700{% else %}bg-purple-600 hover:bg-purple-700{% endif %}">
|
|
Analysieren
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
{% if error %}
|
|
<div class="bg-red-500/20 border border-red-500/30 text-red-300 p-4 rounded-lg">{{ error }}</div>
|
|
{% endif %}
|
|
|
|
{% if ip_data %}
|
|
<div class="bg-black/40 rounded-xl backdrop-blur-lg p-8 {% if maintenance_active %}border border-yellow-500/30{% else %}border border-purple-500/20{% endif %}">
|
|
<h3 class="text-2xl font-bold mb-6 {% if maintenance_active %}text-yellow-300{% else %}text-purple-300{% endif %}">Analyse-Ergebnis</h3>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 text-gray-300">
|
|
<div class="bg-gray-900/50 p-4 rounded-lg"><strong>IP-Adresse:</strong> {{ ip_data.ip }}</div>
|
|
<div class="bg-gray-900/50 p-4 rounded-lg"><strong>Land:</strong> {{ ip_data.location.country }} ({{ ip_data.location.city }})</div>
|
|
<div class="bg-gray-900/50 p-4 rounded-lg"><strong>VPN:</strong> <span class="font-bold {{ 'text-red-400' if ip_data.security.vpn else 'text-green-400' }}">{{ 'Ja' if ip_data.security.vpn else 'Nein' }}</span></div>
|
|
<div class="bg-gray-900/50 p-4 rounded-lg"><strong>Proxy:</strong> <span class="font-bold {{ 'text-red-400' if ip_data.security.proxy else 'text-green-400' }}">{{ 'Ja' if ip_data.security.proxy else 'Nein' }}</span></div>
|
|
<div class="bg-gray-900/50 p-4 rounded-lg"><strong>Tor:</strong> <span class="font-bold {{ 'text-red-400' if ip_data.security.tor else 'text-green-400' }}">{{ 'Ja' if ip_data.security.tor else 'Nein' }}</span></div>
|
|
<div class="bg-gray-900/50 p-4 rounded-lg"><strong>ASN:</strong> {{ ip_data.network.autonomous_system_number }}</div>
|
|
<div class="md:col-span-2 bg-gray-900/50 p-4 rounded-lg"><strong>Netzwerk:</strong> {{ ip_data.network.network }}</div>
|
|
<div class="md:col-span-2 bg-gray-900/50 p-4 rounded-lg"><strong>Organisation:</strong> {{ ip_data.network.autonomous_system_organization }}</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if similar_ips %}
|
|
<div class="bg-black/40 rounded-xl backdrop-blur-lg p-8 {% if maintenance_active %}border border-yellow-500/30{% else %}border border-purple-500/20{% endif %}">
|
|
<h3 class="text-2xl font-bold mb-6 {% if maintenance_active %}text-yellow-300{% else %}text-purple-300{% endif %}">Ähnliche Einträge gefunden</h3>
|
|
<div class="overflow-x-auto">
|
|
<table class="min-w-full divide-y {% if maintenance_active %}divide-yellow-500/30{% else %}divide-purple-500/20{% endif %}">
|
|
<thead class="bg-black/20">
|
|
<tr>
|
|
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">IP</th>
|
|
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Cheater</th>
|
|
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">SteamID</th>
|
|
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Hinzugefügt von</th>
|
|
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Datum</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y {% if maintenance_active %}divide-yellow-500/30{% else %}divide-purple-500/30{% endif %}">
|
|
{% for ip in similar_ips %}
|
|
<tr class="transition {% if maintenance_active %}hover:bg-yellow-500/5{% else %}hover:bg-purple-500/5{% endif %}">
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-white">{{ ip.ip }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm"><span class="font-bold {{ 'text-red-400' if ip.is_cheater else 'text-green-400' }}">{{ 'Ja' if ip.is_cheater else 'Nein' }}</span></td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">{{ ip.steam_id or 'N/A' }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">{{ ip.added_by }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">{{ ip.timestamp.strftime('%d.%m.%Y %H:%M') }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %}
|