{% extends "base.html" %}
{% block title %}{{ site_name }} - Cockpit{% endblock %}
{% block body_class %}page-cockpit{% endblock %}
{% block content %}
<div id="user-info" style="text-align:right;padding:12px 16px 0;max-width:900px;margin:0 auto;">
  <span style="color:#888;font-size:13px;">{{ email }} ({{ role }})</span>
  <button onclick="window.location.href='/'" style="background:#333;color:#e0e0e0;border:none;padding:6px 14px;border-radius:4px;cursor:pointer;font-size:13px;margin-left:8px;">Karte</button>
  <button onclick="localStorage.removeItem('adsb_jwt');window.location.href='/'" style="background:#333;color:#e0e0e0;border:none;padding:6px 14px;border-radius:4px;cursor:pointer;font-size:13px;margin-left:4px;">Abmelden</button>
</div>
<div class="dashboard-content">
  <div class="tabs">
    <button class="active" onclick="switchTab('users')">Benutzer</button>
    <button onclick="switchTab('receivers')">Receiver</button>
    <button onclick="switchTab('aircraft')">Flugzeuge</button>
  </div>
  <div id="tab-users" class="tab-content active">
    <div class="admin-only panel" id="pending-panel" style="display:none">
      <h3>Ausstehende Freischaltungen</h3>
      <table><thead><tr><th>Email</th><th>Erstellt</th><th>Rolle</th></tr></thead>
      <tbody id="pending-list"><tr><td colspan="3">Laden...</td></tr></tbody></table>
    </div>
    <div class="panel">
      <h3>Alle Benutzer <button class="btn btn-success" onclick="showAddUser()" style="float:right">+ Hinzufügen</button></h3>
      <table><thead><tr><th>Aktionen</th><th>Username</th><th>Email</th><th>Display Name</th><th>Rolle</th><th>Status</th><th>Letzter Login</th></tr></thead>
      <tbody id="user-list"><tr><td colspan="7">Laden...</td></tr></tbody></table>
    </div>
    <div class="panel" id="add-user-panel" style="display:none">
      <h3>Benutzer hinzufügen</h3>
      <input id="new-username" placeholder="Username (Email)" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px">
      <select id="new-role" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px;margin-right:8px">
        <option value="user">user</option>
        <option value="admin">admin</option>
        <option value="pending">pending</option>
      </select>
      <button class="btn btn-success" onclick="addUser()">Speichern</button>
      <button class="btn" onclick="hideAddUser()">Abbrechen</button>
    </div>
  </div>
  <div id="tab-receivers" class="tab-content">
    <div class="panel">
      <h3>Receiver <button class="btn" onclick="addReceiver()" style="float:right;margin-left:8px">+ Neu</button></h3>
      <table><thead><tr><th>Aktionen</th><th>ID</th><th>Name</th><th>Status</th><th>Standort</th><th>Letztes Update</th></tr></thead>
      <tbody id="receiver-list"><tr><td colspan="6">Laden...</td></tr></tbody></table>
    </div>
    <div class="panel" id="edit-receiver-panel" style="display:none">
      <h3 id="edit-receiver-title">Receiver bearbeiten</h3>
      <input id="edit-rec-name" placeholder="Name" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px">
      <input id="edit-rec-slug" placeholder="Slug" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px">
      <input id="edit-rec-lat" placeholder="Lat" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px">
      <input id="edit-rec-lon" placeholder="Lon" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px">
      <input id="edit-rec-desc" placeholder="Beschreibung" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px">
      <label style="color:#aaa;font-size:13px;margin-right:8px"><input id="edit-rec-enabled" type="checkbox" checked> Aktiv</label>
      <button class="btn btn-success" onclick="saveReceiver()">Speichern</button>
      <button class="btn" onclick="hideEditReceiver()">Abbrechen</button>
    </div>
  </div>
  <div id="tab-aircraft" class="tab-content">
    <div class="panel">
      <h3>Flugzeug-Registry
        <button class="btn btn-success" onclick="showAddAircraft()" style="float:right">+ Hinzufügen</button>
        <button class="btn" onclick="loadUnknownAircraft()" style="float:right;margin-right:8px">Unbekannte</button>
      </h3>
      <table><thead><tr><th>Aktionen</th><th>Hex</th><th>Callsign</th><th>Registration</th><th>Land</th><th>Typ</th><th>Betreiber</th><th>Zuletzt aktualisiert</th></tr></thead>
      <tbody id="aircraft-list"><tr><td colspan="8">Laden...</td></tr></tbody></table>
    </div>
    <div class="panel" id="unknown-aircraft-panel" style="display:none">
      <h3>Unbekannte Hex-Codes</h3>
      <p style="color:#888;font-size:13px;">Flugzeuge die kürzlich gesehen wurden, aber noch nicht in der Registry sind.</p>
      <table><thead><tr><th>Aktionen</th><th>Hex</th><th>Callsign</th><th>Registration</th><th>Zuletzt gesehen</th><th>ADS-B Exchange</th></tr></thead>
      <tbody id="unknown-list"></tbody></table>
      <button class="btn" onclick="hideUnknownAircraft()" style="margin-top:8px">Zurück</button>
    </div>
    <div class="panel" id="add-aircraft-panel" style="display:none">
      <h3>Flugzeug hinzufügen</h3>
      <input id="new-ac-hex" placeholder="Hex (z.B. abc123)" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:120px">
      <input id="new-ac-callsign" placeholder="Callsign" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:100px">
      <input id="new-ac-registration" placeholder="Registration" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:100px">
      <input id="new-ac-country" placeholder="Land" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:120px">
      <input id="new-ac-type" placeholder="Typ (z.B. B738)" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:100px">
      <input id="new-ac-operator" placeholder="Betreiber" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:150px">
      <button class="btn btn-success" onclick="addAircraft()">Speichern</button>
      <button class="btn" onclick="hideAddAircraft()">Abbrechen</button>
    </div>
    <div class="panel" id="edit-aircraft-panel" style="display:none">
      <h3 id="edit-aircraft-title">Flugzeug bearbeiten</h3>
      <input id="edit-ac-hex" placeholder="Hex" readonly style="background:#1a1f2e;color:#888;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:120px">
      <input id="edit-ac-callsign" placeholder="Callsign" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:100px">
      <input id="edit-ac-registration" placeholder="Registration" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:100px">
      <input id="edit-ac-country" placeholder="Land" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:120px">
      <input id="edit-ac-type" placeholder="Typ" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:100px">
      <input id="edit-ac-operator" placeholder="Betreiber" style="background:#0b1220;color:#e0e0e0;border:1px solid #2a2f3f;border-radius:4px;padding:6px 10px;margin-right:8px;width:150px">
      <button class="btn btn-success" onclick="saveAircraft()">Speichern</button>
      <button class="btn" onclick="hideEditAircraft()">Abbrechen</button>
    </div>
  </div>
</div>
{% endblock %}
{% block scripts_extra %}
<script>
var TOKEN={{ token_js_escaped|tojson }};
</script>
<script src="/static/js/admin.js"></script>
{% endblock %}