381 lines
18 KiB
HTML
381 lines
18 KiB
HTML
<!doctype html>
|
|
<html lang="en" data-bs-theme="dark">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Admin — IMFestival SMS Dashboard</title>
|
|
|
|
<link href="assets/vendor/bootstrap.min.css" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" rel="stylesheet"
|
|
crossorigin="anonymous">
|
|
<link href="assets/css/dashboard.css" rel="stylesheet">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<!-- ─── Mobile top bar ─── -->
|
|
<div class="topbar">
|
|
<button class="hamburger" data-bs-toggle="offcanvas" data-bs-target="#mobileSidebar" aria-label="Open menu">
|
|
<i class="fa-solid fa-bars"></i>
|
|
</button>
|
|
<span style="font-weight:600;font-size:0.95rem;">Admin</span>
|
|
</div>
|
|
|
|
<!-- ─── Mobile offcanvas sidebar ─── -->
|
|
<div class="offcanvas offcanvas-start" tabindex="-1" id="mobileSidebar">
|
|
<div class="offcanvas-header">
|
|
<div class="brand"
|
|
style="border:none;margin:0;padding:0;flex-direction:column;align-items:flex-start;gap:0.5rem;">
|
|
<span>SMS Dashboard</span>
|
|
</div>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas"
|
|
aria-label="Close"></button>
|
|
</div>
|
|
<div class="offcanvas-body p-3">
|
|
<nav class="d-flex flex-column gap-1">
|
|
<a href="index.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-house fa-fw"></i>
|
|
Home
|
|
</a>
|
|
<a href="attendees.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-users fa-fw"></i>
|
|
Attendees
|
|
</a>
|
|
<a href="templates.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-comment-sms fa-fw"></i>
|
|
SMS Templates
|
|
</a>
|
|
<a href="schedule.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-calendar-days fa-fw"></i>
|
|
Schedule
|
|
</a>
|
|
<a href="delivery-log.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-list-check fa-fw"></i>
|
|
Delivery Log
|
|
</a>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ─── Desktop sidebar ─── -->
|
|
<div class="sidebar">
|
|
<div class="brand">
|
|
<span style="margin: 0 auto;">IMFestival SMS Dashboard</span>
|
|
</div>
|
|
|
|
<nav class="d-flex flex-column gap-1 mt-2">
|
|
<a href="index.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-house fa-fw"></i>
|
|
Home
|
|
</a>
|
|
<a href="attendees.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-users fa-fw"></i>
|
|
Attendees
|
|
</a>
|
|
<a href="templates.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-comment-sms fa-fw"></i>
|
|
SMS Templates
|
|
</a>
|
|
<a href="schedule.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-calendar-days fa-fw"></i>
|
|
Schedule
|
|
</a>
|
|
<a href="delivery-log.html" class="nav-link-custom">
|
|
<i class="fa-solid fa-list-check fa-fw"></i>
|
|
Delivery Log
|
|
</a>
|
|
</nav>
|
|
|
|
<div class="mt-auto pt-3" style="border-top:1px solid var(--border);">
|
|
<div class="nav-link-custom" style="cursor:default;">
|
|
<i class="fa-solid fa-circle-user fa-fw"></i>
|
|
<span class="nav-username" style="font-size:0.82rem;">User</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ─── Main content ─── -->
|
|
<div class="main">
|
|
<div class="main-inner">
|
|
<div id="sandboxBanner" class="alert alert-warning"
|
|
style="display:none;font-size:0.85rem;font-weight:600;text-align:center;">
|
|
<i class="fa-solid fa-flask me-1"></i> Sandbox mode is active — texts are tagged as a test and excluded
|
|
from
|
|
cost calculations.
|
|
</div>
|
|
|
|
<div class="page-header d-flex align-items-center gap-3">
|
|
<a href="index.html" class="btn btn-sm btn-secondary">
|
|
<i class="fa-solid fa-arrow-left me-1"></i> Back
|
|
</a>
|
|
<div>
|
|
<h1>Admin</h1>
|
|
<p>Sandbox mode and data management controls.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Alert area -->
|
|
<div id="adminResult" class="alert mb-4" style="display:none;" role="alert"></div>
|
|
|
|
<!-- ── Sandbox Mode ─────────────────────────────────────────────────────── -->
|
|
<div class="card p-4 mb-4">
|
|
<div class="d-flex align-items-start justify-content-between mb-3 gap-3">
|
|
<div>
|
|
<h5 class="mb-1">
|
|
<i class="fa-solid fa-flask fa-fw me-1" style="color:var(--text-muted);"></i>
|
|
Sandbox Mode
|
|
</h5>
|
|
<p class="text-muted mb-0" style="font-size:0.85rem;">
|
|
When enabled, all new messages are tagged as sandbox. Sandbox messages are excluded from the
|
|
success rate and cost calculations on the dashboard.
|
|
</p>
|
|
</div>
|
|
<div class="form-check form-switch flex-shrink-0 mt-1">
|
|
<input class="form-check-input" type="checkbox" role="switch" id="sandboxToggle"
|
|
style="width:3rem;height:1.5rem;cursor:pointer;" aria-label="Toggle sandbox mode">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Stats row -->
|
|
<div class="row g-3 mb-3">
|
|
<div class="col-4">
|
|
<div class="stat-card">
|
|
<div class="stat-label">Real Sends</div>
|
|
<div class="stat-value" id="stat-real" style="color:#4ade80;">—</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4">
|
|
<div class="stat-card">
|
|
<div class="stat-label">Sandbox Sends</div>
|
|
<div class="stat-value" id="stat-sandbox" style="color:var(--text-muted);">—</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4">
|
|
<div class="stat-card">
|
|
<div class="stat-label">Total Logged</div>
|
|
<div class="stat-value" id="stat-total">—</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="btn btn-sm btn-secondary" onclick="markAllSandbox()">
|
|
<i class="fa-solid fa-flask me-1"></i>
|
|
Mark all existing sends as sandbox
|
|
</button>
|
|
</div>
|
|
|
|
<!-- ── Data Management ───────────────────────────────────────────────────── -->
|
|
<div class="card p-4">
|
|
<h5 class="mb-4">
|
|
<i class="fa-solid fa-database fa-fw me-1" style="color:var(--text-muted);"></i>
|
|
Data Management
|
|
</h5>
|
|
|
|
<!-- Delivery Log -->
|
|
<div class="mb-4">
|
|
<h6 class="mb-1">Delivery Log</h6>
|
|
<p class="text-muted mb-2" style="font-size:0.82rem;">
|
|
<span id="count-log">—</span> entries logged.
|
|
</p>
|
|
<div class="d-flex flex-wrap align-items-center gap-2">
|
|
<button class="btn btn-sm btn-danger" onclick="purge('delivery_log')">
|
|
<i class="fa-solid fa-trash-can me-1"></i> Purge All
|
|
</button>
|
|
<span class="text-muted" style="font-size:0.82rem;">or purge before:</span>
|
|
<input type="date" id="purgeBefore" class="form-control form-control-sm"
|
|
style="width:auto;min-width:150px;">
|
|
<button class="btn btn-sm btn-warning" onclick="purge('delivery_log', true)">
|
|
<i class="fa-solid fa-calendar-xmark me-1"></i> Purge Before Date
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<hr style="border-color:var(--border);">
|
|
|
|
<!-- Attendees -->
|
|
<div class="mb-4">
|
|
<h6 class="mb-1">Attendees & Workshops</h6>
|
|
<p class="text-muted mb-2" style="font-size:0.82rem;">
|
|
<span id="count-attendees">—</span> attendees. Removes all attendees, registrations and
|
|
workshop sessions.
|
|
</p>
|
|
<button class="btn btn-sm btn-danger" onclick="purge('attendees')">
|
|
<i class="fa-solid fa-trash-can me-1"></i> Purge All Attendees
|
|
</button>
|
|
</div>
|
|
|
|
<hr style="border-color:var(--border);">
|
|
|
|
<!-- Templates -->
|
|
<div class="mb-4">
|
|
<h6 class="mb-1">SMS Templates</h6>
|
|
<p class="text-muted mb-2" style="font-size:0.82rem;">
|
|
<span id="count-templates">—</span> templates.
|
|
</p>
|
|
<button class="btn btn-sm btn-danger" onclick="purge('templates')">
|
|
<i class="fa-solid fa-trash-can me-1"></i> Purge All Templates
|
|
</button>
|
|
</div>
|
|
|
|
<hr style="border-color:var(--border);">
|
|
|
|
<!-- Schedules -->
|
|
<div>
|
|
<h6 class="mb-1">Scheduled Rules</h6>
|
|
<p class="text-muted mb-2" style="font-size:0.82rem;">
|
|
<span id="count-schedules">—</span> scheduled rules.
|
|
</p>
|
|
<button class="btn btn-sm btn-danger" onclick="purge('schedules')">
|
|
<i class="fa-solid fa-trash-can me-1"></i> Purge All Schedules
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div><!-- /.main-inner -->
|
|
</div><!-- /.main -->
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
|
crossorigin="anonymous"></script>
|
|
|
|
<script>
|
|
'use strict';
|
|
|
|
// ─── Load admin state ────────────────────────────────────────────────────────
|
|
|
|
async function loadAdmin() {
|
|
try {
|
|
const r = await fetch('/api/admin.php', { redirect: 'manual' });
|
|
if (r.type === 'opaqueredirect') { window.location.reload(); return; }
|
|
if (!r.ok) { window.location.replace('index.html'); return; }
|
|
const data = await r.json();
|
|
|
|
if (!data.is_admin) {
|
|
window.location.replace('index.html');
|
|
return;
|
|
}
|
|
|
|
document.querySelectorAll('.admin-nav-link').forEach(el => el.classList.remove('d-none'));
|
|
const name = data.name || data.username;
|
|
if (name) {
|
|
document.querySelectorAll('.nav-username').forEach(el => { el.textContent = name; });
|
|
}
|
|
|
|
document.getElementById('sandboxToggle').checked = data.sandbox_mode;
|
|
document.getElementById('sandboxBanner').style.display = data.sandbox_mode ? '' : 'none';
|
|
|
|
document.getElementById('stat-real').textContent = data.delivery_log_real_sent ?? '—';
|
|
document.getElementById('stat-sandbox').textContent = data.delivery_log_sandbox ?? '—';
|
|
document.getElementById('stat-total').textContent = data.delivery_log_total ?? '—';
|
|
|
|
document.getElementById('count-log').textContent = data.delivery_log_total ?? '—';
|
|
document.getElementById('count-attendees').textContent = data.attendees ?? '—';
|
|
document.getElementById('count-templates').textContent = data.templates ?? '—';
|
|
document.getElementById('count-schedules').textContent = data.schedules ?? '—';
|
|
} catch (e) {
|
|
showResult('Failed to load admin data: ' + e.message, 'danger');
|
|
}
|
|
}
|
|
|
|
// ─── Sandbox toggle ──────────────────────────────────────────────────────────
|
|
|
|
document.getElementById('sandboxToggle').addEventListener('change', async () => {
|
|
try {
|
|
const data = await fetch('/api/admin.php', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ action: 'toggle_sandbox' }),
|
|
}).then(r => r.json());
|
|
document.getElementById('sandboxToggle').checked = data.sandbox_mode;
|
|
document.getElementById('sandboxBanner').style.display = data.sandbox_mode ? '' : 'none';
|
|
showResult(`Sandbox mode ${data.sandbox_mode ? 'enabled' : 'disabled'}.`, 'success');
|
|
} catch (e) {
|
|
showResult('Failed to toggle sandbox mode: ' + e.message, 'danger');
|
|
await loadAdmin(); // revert toggle visual state
|
|
}
|
|
});
|
|
|
|
// ─── Mark all as sandbox ─────────────────────────────────────────────────────
|
|
|
|
async function markAllSandbox() {
|
|
if (!confirm('Mark ALL existing delivery log entries as sandbox?\n\nThey will be excluded from cost calculations and success rate on the dashboard.')) {
|
|
return;
|
|
}
|
|
try {
|
|
const res = await fetch('/api/admin.php', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ action: 'mark_all_sandbox' }),
|
|
});
|
|
if (!res.ok) throw new Error((await res.json()).error ?? 'Failed');
|
|
showResult('All sends marked as sandbox.', 'success');
|
|
loadAdmin();
|
|
} catch (e) {
|
|
showResult('Failed: ' + e.message, 'danger');
|
|
}
|
|
}
|
|
|
|
// ─── Purge ───────────────────────────────────────────────────────────────────
|
|
|
|
const PURGE_LABELS = {
|
|
delivery_log: 'all delivery log entries',
|
|
attendees: 'all attendees, registrations and workshops',
|
|
templates: 'all SMS templates',
|
|
schedules: 'all scheduled rules',
|
|
};
|
|
|
|
async function purge(target, useDateFilter = false) {
|
|
const body = { action: 'purge', target };
|
|
|
|
if (useDateFilter) {
|
|
const before = document.getElementById('purgeBefore').value;
|
|
if (!before) {
|
|
alert('Please select a date first.');
|
|
return;
|
|
}
|
|
if (!confirm(`Purge all delivery log entries before ${before}?\n\nThis cannot be undone.`)) {
|
|
return;
|
|
}
|
|
body.before = before;
|
|
} else {
|
|
if (!confirm(`This will permanently delete ${PURGE_LABELS[target]}.\n\nThis cannot be undone. Are you sure?`)) {
|
|
return;
|
|
}
|
|
}
|
|
|
|
try {
|
|
const res = await fetch('/api/admin.php', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(body),
|
|
});
|
|
const data = await res.json();
|
|
if (!res.ok) throw new Error(data.error ?? 'Purge failed');
|
|
const n = typeof data.purged === 'number' ? ` (${data.purged} rows)` : '';
|
|
showResult(`Purge completed successfully${n}.`, 'success');
|
|
loadAdmin();
|
|
} catch (e) {
|
|
showResult('Purge failed: ' + e.message, 'danger');
|
|
}
|
|
}
|
|
|
|
// ─── Toast/alert helper ──────────────────────────────────────────────────────
|
|
|
|
function showResult(msg, type) {
|
|
const el = document.getElementById('adminResult');
|
|
el.className = `alert alert-${type}`;
|
|
el.textContent = msg;
|
|
el.style.display = '';
|
|
clearTimeout(el._timer);
|
|
el._timer = setTimeout(() => { el.style.display = 'none'; }, 6000);
|
|
}
|
|
|
|
// ─── Init ────────────────────────────────────────────────────────────────────
|
|
|
|
loadAdmin();
|
|
document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'visible') loadAdmin(); });
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|