`views/admin/users.ejs`

72 lines
<%- include('../partials/head', { title, meta_desc }) %>
<%- include('../partials/header') %>

<main class="container" style="max-width: 1100px; padding: 24px;">

  <p style="margin-bottom: 8px;"><a href="/admin">← Admin</a></p>
  <h1 style="margin: 0 0 6px;">Users</h1>
  <p class="muted" style="margin: 0 0 16px;"><%= users.length %> total</p>

  <section style="padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--panel); margin-bottom:24px;">
    <h3 style="margin:0 0 12px;">Add user</h3>
    <form action="/admin/users/add" method="POST" style="display:grid; grid-template-columns:1fr 1fr 140px 120px; gap:12px; align-items:end;">
      <label style="display:block;">
        <span class="muted" style="font-size:12px;">name</span>
        <input name="name" required style="width:100%; box-sizing:border-box; padding:8px; border:1px solid var(--line); border-radius:6px;"/>
      </label>
      <label style="display:block;">
        <span class="muted" style="font-size:12px;">email</span>
        <input name="email" required type="email" style="width:100%; box-sizing:border-box; padding:8px; border:1px solid var(--line); border-radius:6px;"/>
      </label>
      <label style="display:block;">
        <span class="muted" style="font-size:12px;">role</span>
        <select name="role" style="width:100%; box-sizing:border-box; padding:8px; border:1px solid var(--line); border-radius:6px;">
          <option value="user">user</option>
          <option value="admin">admin</option>
        </select>
      </label>
      <button type="submit" style="padding:10px 16px;">+ Add</button>
    </form>
  </section>

  <table style="width:100%; border-collapse:collapse; font-size:13px;">
    <thead style="background:var(--panel-2);">
      <tr style="border-bottom:1px solid var(--line);">
        <th style="text-align:left; padding:8px;">ID</th>
        <th style="text-align:left; padding:8px;">Name</th>
        <th style="text-align:left; padding:8px;">Email</th>
        <th style="text-align:left; padding:8px;">Role</th>
        <th style="text-align:left; padding:8px;">Created</th>
        <th style="text-align:left; padding:8px;">Calls</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      <% for (const u of users) { %>
      <tr style="border-bottom:1px solid var(--line);">
        <td style="padding:8px; font-family:monospace; font-size:11px;"><%= u.id %></td>
        <td style="padding:8px;"><strong><%= u.name || '—' %></strong></td>
        <td style="padding:8px;"><%= u.email || '—' %></td>
        <td style="padding:8px;">
          <span style="padding:2px 8px; border-radius:4px; font-size:11px; background:<%= u.role === 'admin' ? '#fef3c7' : '#e0e7ff' %>; color:<%= u.role === 'admin' ? '#92400e' : '#3730a3' %>;"><%= u.role || 'user' %></span>
        </td>
        <td style="padding:8px; color:var(--ink-dim); font-size:11px;"><%= u.created_at ? new Date(u.created_at).toLocaleDateString() : '—' %></td>
        <td style="padding:8px;"><%= calls_per_user[u.id] || 0 %></td>
        <td style="padding:8px; text-align:right;">
          <% if (u.id !== req.user?.id) { %>
            <form action="/admin/users/<%= u.id %>/delete" method="POST" style="display:inline;" onsubmit="return confirm('Remove user <%= u.email %>?');">
              <button type="submit" style="padding:4px 10px; font-size:11px; background:#fee2e2; border:1px solid #d33; color:#900; cursor:pointer; border-radius:4px;">remove</button>
            </form>
          <% } else { %>
            <span class="muted" style="font-size:11px;">(you)</span>
          <% } %>
        </td>
      </tr>
      <% } %>
    </tbody>
  </table>

</main>

<%- include('../partials/footer') %>