feat: роуты и UI — список, добавление, удаление, экспорт

2026-05-29 23:30:43 +03:00
parent d4a70bb947
commit a0a52e99fb
2 changed files with 144 additions and 29 deletions
@@ -2,12 +2,69 @@
 <html lang="ru">
 <head>
  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title><%= title %></title>
-  <link rel="stylesheet" href="/style.css">
+  <title>IP WhiteList</title>
+  <style>
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+    body { font-family: -apple-system, sans-serif; max-width: 900px; margin: 2rem auto; padding: 0 1rem; color: #333; }
+    h1 { margin-bottom: 0.5rem; }
+    .limit { color: #666; margin-bottom: 1rem; }
+    .limit .full { color: #c00; font-weight: bold; }
+    table { width: 100%; border-collapse: collapse; margin-bottom: 1rem; }
+    th, td { padding: 0.5rem; text-align: left; border-bottom: 1px solid #eee; }
+    th { background: #f5f5f5; }
+    .msg { padding: 0.5rem; margin-bottom: 1rem; border-radius: 4px; }
+    .msg.ok { background: #d4edda; color: #155724; }
+    .msg.err { background: #f8d7da; color: #721c24; }
+    .msg.warn { background: #fff3cd; color: #856404; }
+    form { display: flex; gap: 0.5rem; align-items: flex-end; flex-wrap: wrap; }
+    input, button { padding: 0.5rem; font-size: 1rem; }
+    input[name="value"] { width: 200px; }
+    input[name="comment"] { width: 250px; }
+    button { background: #007bff; color: #fff; border: none; border-radius: 4px; cursor: pointer; }
+    button.del { background: #dc3545; font-size: 0.85rem; padding: 0.3rem 0.5rem; }
+    button:hover { opacity: 0.85; }
+    td small { color: #999; }
+  </style>
 </head>
 <body>
-  <h1><%= title %></h1>
-  <p>Сервис работает. БД: <strong><%= dbStatus %></strong></p>
+  <h1>IP WhiteList</h1>
+  <p><%= user.email %> | <%= user.clientId %> | <%= user.companyName %></p>
+  <p class="limit">Использовано <strong class="<%= used >= limit ? 'full' : '' %>"><%= used %></strong> из <%= limit %></p>
+
+  <% if (message) { %><div class="msg <%= wasNormalized ? 'warn' : 'ok' %>"><%= message %></div><% } %>
+  <% if (error) { %><div class="msg err"><%= error %></div><% } %>
+
+  <form method="POST" action="/add">
+    <div>
+      <label>IPv4 / CIDR</label><br>
+      <input name="value" placeholder="203.0.113.0/24" required <%= used >= limit ? 'disabled' : '' %>>
+    </div>
+    <div>
+      <label>Комментарий</label><br>
+      <input name="comment" placeholder="Офис (необязательно)" maxlength="255">
+    </div>
+    <button type="submit" <%= used >= limit ? 'disabled' : '' %>>Добавить</button>
+  </form>
+
+  <table>
+    <thead>
+      <tr><th>Адрес / Подсеть</th><th>Комментарий</th><th>Кто</th><th>Когда</th><th></th></tr>
+    </thead>
+    <tbody>
+      <% entries.forEach(e => { %>
+      <tr>
+        <td><code><%= e.value_cidr %></code></td>
+        <td><%= e.comment || '' %></td>
+        <td><%= e.created_by %></td>
+        <td><small><%= new Date(e.created_at).toLocaleString('ru') %></small></td>
+        <td>
+          <form method="POST" action="/delete/<%= e.id %>" style="display:inline">
+            <button class="del" onclick="return confirm('Удалить?')">Удалить</button>
+          </form>
+        </td>
+      </tr>
+      <% }) %>
+    </tbody>
+  </table>
 </body>
 </html>