{% extends "admin/layout.html" %}
{% block admin_title %}Клиенты{% endblock %}
{% block admin_content %}
<div class="admin-top">
  <h1>Клиенты</h1>
  <div class="actions">
    <a class="btn btn-sm btn-ghost" href="/admin/clients">Все</a>
    <a class="btn btn-sm btn-ghost" href="/admin/clients?protocol=wireguard">WireGuard</a>
    <a class="btn btn-sm btn-ghost" href="/admin/clients?protocol=awg2">AWG 2.0</a>
  </div>
</div>

{% if flash %}
  {% if flash.startswith('error:') %}
  <div class="flash flash-error">{{ flash[6:] }}</div>
  {% elif flash == 'created' %}
  <div class="flash">Клиент создан</div>
  {% elif flash == 'deleted' %}
  <div class="flash">Клиент удалён</div>
  {% endif %}
{% endif %}

<div class="panel" style="margin-bottom:1rem">
  <div class="panel-head"><strong>Новый доступ</strong></div>
  <div class="panel-body">
    <form method="post" action="/admin/clients" class="form-grid">
      <label>Имя
        <input name="name" placeholder="phone / laptop" required />
      </label>
      <label>Сервер / протокол
        <select name="server_id" required>
          {% for s in servers %}
          <option value="{{ s.id }}">{{ s.name }} ({{ s.protocol }})</option>
          {% endfor %}
        </select>
      </label>
      <button class="btn btn-accent" type="submit">Создать</button>
      <label style="grid-column: 1 / -1">Заметка
        <input name="notes" placeholder="опционально" />
      </label>
    </form>
  </div>
</div>

<div class="panel">
  <table>
    <thead>
      <tr>
        <th>Имя</th>
        <th>Протокол</th>
        <th>IP</th>
        <th>Статус</th>
        <th>Создан</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      {% for c in clients %}
      <tr>
        <td><a href="/admin/clients/{{ c.id }}">{{ c.name }}</a></td>
        <td><span class="badge badge-proto">{{ c.server.protocol }}</span></td>
        <td>{{ c.address }}</td>
        <td>
          {% if c.is_enabled %}
          <span class="badge badge-ok">on</span>
          {% else %}
          <span class="badge badge-off">off</span>
          {% endif %}
        </td>
        <td class="muted">{{ c.created_at.strftime('%Y-%m-%d %H:%M') if c.created_at else '—' }}</td>
        <td class="actions">
          <a class="btn btn-sm btn-ghost" href="/admin/clients/{{ c.id }}">Открыть</a>
          <form method="post" action="/admin/clients/{{ c.id }}/toggle" class="inline-form">
            <button class="btn btn-sm btn-ghost" type="submit">{% if c.is_enabled %}Выкл{% else %}Вкл{% endif %}</button>
          </form>
          <form method="post" action="/admin/clients/{{ c.id }}/delete" class="inline-form" onsubmit="return confirm('Удалить клиента?')">
            <button class="btn btn-sm btn-danger" type="submit">Удалить</button>
          </form>
        </td>
      </tr>
      {% else %}
      <tr><td colspan="6" class="muted">Клиентов пока нет</td></tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}