97 lines
4.9 KiB
HTML
97 lines
4.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>User management — QR Presentation</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
|
|
<link rel="stylesheet" href="/css/styles.css" />
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<header class="topbar">
|
|
<div class="brand"><img class="brand-logo" src="/img/mps-icon.png" alt="" /> <span class="brand-name">MPS <small>/ management</small></span></div>
|
|
<div class="usermenu">
|
|
<a class="btn ghost small" href="/">← Presentations</a>
|
|
<button class="btn ghost small" id="logoutBtn">Sign out</button>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="eyebrow">Admin</div>
|
|
<h1 style="font-size:30px;margin-top:6px;">Management</h1>
|
|
|
|
<div class="tabs" id="tabs">
|
|
<button data-tab="users" class="active">Users</button>
|
|
<button data-tab="mail">Mail</button>
|
|
<button data-tab="logs">Logs</button>
|
|
</div>
|
|
|
|
<!-- USERS -->
|
|
<section class="tab-panel active" id="tab-users">
|
|
<div class="card panel-pad" style="margin-bottom:18px;">
|
|
<div class="eyebrow">Add a user</div>
|
|
<div class="grid2" style="margin-top:12px;">
|
|
<div><label class="hint">Username</label><input class="input" id="nu_name" /></div>
|
|
<div><label class="hint">Email</label><input class="input" id="nu_email" placeholder="optional" /></div>
|
|
<div><label class="hint">Password</label><input class="input" id="nu_pass" type="password" /></div>
|
|
<div><label class="hint">Role</label>
|
|
<select class="input" id="nu_role"><option value="user">User</option><option value="admin">Admin</option></select>
|
|
</div>
|
|
</div>
|
|
<div class="err" id="nu_err"></div>
|
|
<button class="btn primary" id="nu_add" style="margin-top:6px;">Create user</button>
|
|
</div>
|
|
<div class="card">
|
|
<table class="table" id="userTable">
|
|
<thead><tr><th>Username</th><th>Email</th><th>Role</th><th>Created</th><th></th></tr></thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- MAIL -->
|
|
<section class="tab-panel" id="tab-mail">
|
|
<div class="card panel-pad">
|
|
<div class="eyebrow">Mail account (PurelyMail)</div>
|
|
<p class="hint">Enter the full email address and password of a PurelyMail account. Servers are prefilled; leave the password blank to keep the stored one.</p>
|
|
<label class="check" style="margin:14px 0;"><input type="checkbox" id="m_enabled" /> Enable email sending</label>
|
|
<div class="grid2">
|
|
<div class="full"><label class="hint">Account email (SMTP/IMAP username)</label><input class="input" id="m_username" placeholder="you@yourdomain.com" /></div>
|
|
<div class="full"><label class="hint">Password</label><input class="input" id="m_password" type="password" placeholder="•••••••• (unchanged)" /></div>
|
|
<div class="full"><label class="hint">From name</label><input class="input" id="m_fromName" /></div>
|
|
<div><label class="hint">SMTP host</label><input class="input" id="m_smtpHost" /></div>
|
|
<div><label class="hint">SMTP port</label><input class="input" id="m_smtpPort" /></div>
|
|
<div><label class="hint">IMAP host</label><input class="input" id="m_imapHost" /></div>
|
|
<div><label class="hint">IMAP port</label><input class="input" id="m_imapPort" /></div>
|
|
<div><label class="hint">Sent folder</label><input class="input" id="m_sentFolder" /></div>
|
|
<div style="display:flex;align-items:flex-end;">
|
|
<label class="check"><input type="checkbox" id="m_saveToSent" /> Save a copy to Sent</label>
|
|
</div>
|
|
</div>
|
|
<div class="err" id="m_err"></div>
|
|
<div class="row" style="display:flex;gap:8px;margin-top:6px;">
|
|
<button class="btn primary" id="m_save">Save settings</button>
|
|
<input class="input" id="m_testTo" placeholder="test recipient" style="max-width:240px;" />
|
|
<button class="btn ghost" id="m_test">Send test</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- LOGS -->
|
|
<section class="tab-panel" id="tab-logs">
|
|
<div style="display:flex;gap:8px;justify-content:flex-end;margin-bottom:10px;">
|
|
<button class="btn ghost small" id="logRefresh">Refresh</button>
|
|
<button class="btn danger small" id="logClear">Clear</button>
|
|
</div>
|
|
<div class="card logs" id="logList"></div>
|
|
</section>
|
|
</div>
|
|
|
|
<footer class="app-footer">© 2026 Martinhal IT - Joao Vaz - Version 1.7</footer>
|
|
<div class="toast" id="toast"></div>
|
|
<script type="module" src="/js/users.js"></script>
|
|
</body>
|
|
</html>
|