| {% extends "base.html" %} |
| {% block content %} |
| <div class="page-header"> |
| <div> |
| <h1>{{ _("Admin control panel — magic secrets") }}</h1> |
| <div class="subtitle"> |
| {{ _("Every bot's") }} <strong>{{ _("admin login / admin password / secret word / secret number") }}</strong> {{ _("in one place. Visible to panel admins only; viewing is audit-logged.") }} |
| </div> |
| </div> |
| </div> |
|
|
| <form method="get" class="search-bar" style="margin-bottom:16px;"> |
| <input type="search" name="q" value="{{ q }}" |
| placeholder="{{ _("Filter by bot name / slug / owner…") }}" |
| autocomplete="off"> |
| <button type="submit" class="btn btn-primary">{{ _("Search") }}</button> |
| {% if q %}<a href="/admin/secrets" class="btn btn-outline">{{ _("Clear") }}</a>{% endif %} |
| </form> |
|
|
| <div class="card"> |
| <div class="card-body" style="padding: 0;"> |
| {% if not rows %} |
| <div style="padding: 32px; text-align: center; color: var(--text-2);"> |
| {% if q %}{{ _("No bots match") }} "{{ q }}".{% else %}{{ _("No bots registered yet.") }}{% endif %} |
| </div> |
| {% else %} |
| <div class="table-wrap" style="border: 0; border-radius: 0;"> |
| <table class="table"> |
| <thead> |
| <tr> |
| <th>{{ _("Bot") }}</th> |
| <th>{{ _("Owner") }}</th> |
| <th>{{ _("Admin login") }}</th> |
| <th>{{ _("Admin password") }}</th> |
| <th>{{ _("Secret word") }}</th> |
| <th>{{ _("Secret number") }}</th> |
| <th>{{ _("Status") }}</th> |
| </tr> |
| </thead> |
| <tbody> |
| {% for r in rows %} |
| <tr> |
| <td> |
| <a href="/bots/{{ r.bot.id }}" |
| style="font-weight: 600; color: var(--accent);"> |
| {{ r.bot.name or r.bot.slug }} |
| </a> |
| <div style="color: var(--text-2); font-size: 12px;"> |
| <code>{{ r.bot.slug }}</code> |
| </div> |
| </td> |
| <td> |
| <code>{{ r.owner.username }}</code> |
| </td> |
| <td> |
| {% if r.login %} |
| <code class="admin-secret-cell" |
| data-secret="{{ r.login }}" |
| data-masked="••••••">{{ r.login }}</code> |
| <button type="button" class="icon-btn" data-copy="{{ r.login }}" title="{{ _("Copy") }}">⎘</button> |
| <button type="button" class="icon-btn" data-reveal title="{{ _("Toggle") }}">👁</button> |
| {% else %}<span style="color: var(--text-3);">—</span>{% endif %} |
| </td> |
| <td> |
| {% if r.password %} |
| <code class="admin-secret-cell" |
| data-secret="{{ r.password }}" |
| data-masked="••••••••••">{{ r.password }}</code> |
| <button type="button" class="icon-btn" data-copy="{{ r.password }}" title="{{ _("Copy") }}">⎘</button> |
| <button type="button" class="icon-btn" data-reveal title="{{ _("Toggle") }}">👁</button> |
| {% else %}<span style="color: var(--text-3);">—</span>{% endif %} |
| </td> |
| <td> |
| {% if r.secret_word %} |
| <code class="admin-secret-cell" |
| data-secret="{{ r.secret_word }}" |
| data-masked="••••••••••">{{ r.secret_word }}</code> |
| <button type="button" class="icon-btn" data-copy="{{ r.secret_word }}" title="{{ _("Copy") }}">⎘</button> |
| <button type="button" class="icon-btn" data-reveal title="{{ _("Toggle") }}">👁</button> |
| {% else %}<span style="color: var(--text-3);">—</span>{% endif %} |
| </td> |
| <td> |
| {% if r.secret_number %} |
| <code class="admin-secret-cell" |
| data-secret="{{ r.secret_number }}" |
| data-masked="••••">{{ r.secret_number }}</code> |
| <button type="button" class="icon-btn" data-copy="{{ r.secret_number }}" title="{{ _("Copy") }}">⎘</button> |
| <button type="button" class="icon-btn" data-reveal title="{{ _("Toggle") }}">👁</button> |
| {% else %}<span style="color: var(--text-3);">—</span>{% endif %} |
| </td> |
| <td> |
| <span class="status-pill status-{{ r.bot.status.value }}"> |
| {{ r.bot.status.value }} |
| </span> |
| </td> |
| </tr> |
| {% endfor %} |
| </tbody> |
| </table> |
| </div> |
| {% endif %} |
| </div> |
| </div> |
|
|
| <p class="hint" style="margin-top: 16px; color: var(--text-2); font-size: 12px;"> |
| {{ _("Total:") }} <strong>{{ rows|length }}</strong> {{ _("bot(s). Click a value to copy, click the eye to toggle masking. Each view is recorded in the audit log.") }} |
| </p> |
|
|
| <style> |
| .admin-secret-cell { |
| font-family: ui-monospace, SFMono-Regular, Menlo, monospace; |
| font-size: 12px; |
| background: var(--surface-2); |
| padding: 2px 6px; |
| border-radius: 4px; |
| word-break: break-all; |
| display: inline-block; |
| max-width: 220px; |
| vertical-align: middle; |
| } |
| .admin-secret-cell.masked { |
| background: var(--surface-1); |
| color: var(--text-2); |
| letter-spacing: 2px; |
| } |
| </style> |
|
|
| <script> |
| (function () { |
| function toggle(el) { |
| if (el.classList.contains('masked')) { |
| el.textContent = el.dataset.secret; |
| el.classList.remove('masked'); |
| } else { |
| el.textContent = el.dataset.masked; |
| el.classList.add('masked'); |
| } |
| } |
| document.querySelectorAll('[data-reveal]').forEach(function (btn) { |
| btn.addEventListener('click', function () { |
| var row = btn.closest('td'); |
| var cell = row.querySelector('.admin-secret-cell'); |
| if (cell) toggle(cell); |
| }); |
| }); |
| document.querySelectorAll('[data-copy]').forEach(function (btn) { |
| btn.addEventListener('click', function () { |
| var v = btn.dataset.copy; |
| if (!v) return; |
| if (navigator.clipboard) { |
| navigator.clipboard.writeText(v).then(function () { |
| btn.textContent = '✓'; |
| setTimeout(function () { btn.textContent = '⎘'; }, 1000); |
| }); |
| } |
| }); |
| }); |
| document.querySelectorAll('.admin-secret-cell').forEach(function (cell) { |
| cell.textContent = cell.dataset.masked; |
| cell.classList.add('masked'); |
| }); |
| })(); |
| </script> |
| {% endblock %} |
|
|
