feat: platform-wide sidebar sync and explicit admin routing (v16)
Build Curio HMS / build-and-deploy (push) Successful in 47s Details

This commit is contained in:
Deep Koluguri 2026-05-15 14:33:32 -04:00
parent d987e681c5
commit 28bc4b77bc
5 changed files with 257 additions and 6 deletions

242
admin.html Normal file
View File

@ -0,0 +1,242 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Curio Central | Mission Control</title>
<link rel="stylesheet" href="index.css">
<link rel="stylesheet" href="dashboard.css">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@600;700&display=swap" rel="stylesheet">
<style>
:root {
--admin-bg: #F8FAFC;
--admin-card: #FFFFFF;
--admin-primary: #0F172A;
--admin-accent: #3B82F6;
}
body.admin-body {
background: var(--admin-bg);
font-family: 'Inter', sans-serif;
}
.admin-sidebar {
width: 280px;
background: var(--admin-primary);
height: 100vh;
position: fixed;
padding: 2rem;
color: white;
}
.admin-main {
margin-left: 280px;
padding: 3rem;
}
.admin-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 3rem;
}
.admin-header h1 {
font-family: 'Outfit', sans-serif;
font-size: 2.2rem;
color: var(--admin-primary);
}
.stat-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1.5rem;
margin-bottom: 3rem;
}
.stat-card {
background: white;
padding: 2rem;
border-radius: 24px;
box-shadow: 0 4px 20px rgba(0,0,0,0.03);
border: 1px solid #F1F5F9;
}
.stat-card span {
font-size: 0.85rem;
color: #64748B;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.stat-card h3 {
font-size: 2rem;
margin: 0.5rem 0;
color: var(--admin-primary);
}
.stat-card .trend {
font-size: 0.85rem;
font-weight: 700;
}
.trend.up { color: #10B981; }
.trend.down { color: #EF4444; }
.health-indicator {
display: flex;
align-items: center;
gap: 1rem;
background: #ECFDF5;
padding: 0.75rem 1.5rem;
border-radius: 100px;
color: #059669;
font-weight: 700;
}
.pulse {
width: 10px;
height: 10px;
background: #10B981;
border-radius: 50%;
animation: pulse-ring 1.5s infinite;
}
@keyframes pulse-ring {
0% { transform: scale(.8); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); }
70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); }
100% { transform: scale(.8); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}
.tenant-table-container {
background: white;
border-radius: 32px;
padding: 2rem;
box-shadow: 0 4px 20px rgba(0,0,0,0.03);
}
table {
width: 100%;
border-collapse: collapse;
}
th {
text-align: left;
padding: 1rem;
color: #64748B;
font-size: 0.85rem;
text-transform: uppercase;
border-bottom: 2px solid #F1F5F9;
}
td {
padding: 1.5rem 1rem;
border-bottom: 1px solid #F1F5F9;
font-weight: 500;
}
.status-badge {
padding: 0.4rem 0.8rem;
border-radius: 100px;
font-size: 0.75rem;
font-weight: 700;
}
.status-badge.active { background: #DCFCE7; color: #15803D; }
</style>
</head>
<body class="admin-body">
<aside class="admin-sidebar">
<div class="logo">
<span class="logo-icon" style="background: var(--admin-accent);">C</span>
<span class="logo-text">Curio Central</span>
</div>
<nav class="side-nav" style="margin-top: 3rem;">
<a href="#" class="active">📊 Platform Overview</a>
<a href="#">🏥 Hospital Tenants</a>
<a href="#">💳 Subscription Billing</a>
<a href="#">🛡️ Security & Logs</a>
<a href="#">⚙️ Global Settings</a>
</nav>
<div class="user-profile" style="position: absolute; bottom: 2rem;">
<strong>Super Admin</strong>
<span>admin@curio.app</span>
<a href="login.html" style="color: #FDA4AF; text-decoration: none; display: block; margin-top: 1rem;">Logout</a>
</div>
</aside>
<main class="admin-main">
<header class="admin-header">
<div>
<h1>Platform Command Center</h1>
<p style="color: #64748B;">Real-time analytics across all registered hospital networks.</p>
</div>
<div class="health-indicator">
<span class="pulse"></span>
SYSTEM HEALTH: 99.98%
</div>
</header>
<div class="stat-grid">
<div class="stat-card">
<span>Active Hospitals</span>
<h3>12</h3>
<div class="trend up">↑ 2 this month</div>
</div>
<div class="stat-card">
<span>Monthly Revenue</span>
<h3>₹42,50,000</h3>
<div class="trend up">↑ 14.5%</div>
</div>
<div class="stat-card">
<span>Total Patients</span>
<h3>85,420</h3>
<div class="trend up">↑ 5.2k</div>
</div>
<div class="stat-card">
<span>Avg. Performance</span>
<h3>240ms</h3>
<div class="trend down" style="color: #10B981;">↓ 20ms faster</div>
</div>
</div>
<div class="tenant-table-container">
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem;">
<h2 style="font-family: 'Outfit';">Hospital Tenants</h2>
<button class="btn-primary" style="background: var(--admin-accent);">+ Add New Hospital</button>
</div>
<table>
<thead>
<tr>
<th>Clinic ID</th>
<th>Name</th>
<th>Owner</th>
<th>Plan</th>
<th>Status</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>#HOSP-001</strong></td>
<td>Sharma Clinic</td>
<td>Dr. Sharma</td>
<td>Enterprise</td>
<td><span class="status-badge active">ACTIVE</span></td>
<td><button class="btn-small secondary">Manage</button></td>
</tr>
<tr>
<td><strong>#HOSP-002</strong></td>
<td>City Heart Hospital</td>
<td>Dr. Verma</td>
<td>Pro</td>
<td><span class="status-badge active">ACTIVE</span></td>
<td><button class="btn-small secondary">Manage</button></td>
</tr>
</tbody>
</table>
</div>
</main>
</body>
</html>

View File

@ -9,10 +9,19 @@ app.use(express.json());
// Serve static files // Serve static files
app.use(express.static(path.join(__dirname, '../'))); app.use(express.static(path.join(__dirname, '../')));
// Primary Routes
app.get('/', (req, res) => { app.get('/', (req, res) => {
res.sendFile(path.join(__dirname, '../login.html')); res.sendFile(path.join(__dirname, '../login.html'));
}); });
app.get('/admin', (req, res) => {
res.sendFile(path.join(__dirname, '../admin.html'));
});
app.get('/dashboard', (req, res) => {
res.sendFile(path.join(__dirname, '../dashboard.html'));
});
// Multi-tenant Config API // Multi-tenant Config API
app.get('/api/config/:tenantId', (req, res) => { app.get('/api/config/:tenantId', (req, res) => {
const config = configManager.getTenantConfig(req.params.tenantId); const config = configManager.getTenantConfig(req.params.tenantId);

View File

@ -17,8 +17,8 @@
</div> </div>
<nav class="side-nav"> <nav class="side-nav">
<a href="dashboard.html"><span>🏠</span> Overview</a> <a href="dashboard.html"><span>🏠</span> Overview</a>
<a href="dashboard.html"><span>👥</span> Queue</a> <a href="dashboard.html" onclick="showSection('queue')"><span>👥</span> Queue</a>
<a href="dashboard.html"><span>📂</span> Patients</a> <a href="dashboard.html" onclick="showSection('patients')"><span>📂</span> Patients</a>
<a href="pharmacy.html"><span>💊</span> Pharmacy</a> <a href="pharmacy.html"><span>💊</span> Pharmacy</a>
<a href="lab.html"><span>🔬</span> Lab</a> <a href="lab.html"><span>🔬</span> Lab</a>
<a href="billing.html" class="active"><span>💳</span> Billing & Accounts</a> <a href="billing.html" class="active"><span>💳</span> Billing & Accounts</a>

View File

@ -17,8 +17,8 @@
</div> </div>
<nav class="side-nav"> <nav class="side-nav">
<a href="dashboard.html"><span>🏠</span> Overview</a> <a href="dashboard.html"><span>🏠</span> Overview</a>
<a href="dashboard.html"><span>👥</span> Queue</a> <a href="dashboard.html" onclick="showSection('queue')"><span>👥</span> Queue</a>
<a href="dashboard.html"><span>📂</span> Patients</a> <a href="dashboard.html" onclick="showSection('patients')"><span>📂</span> Patients</a>
<a href="pharmacy.html"><span>💊</span> Pharmacy</a> <a href="pharmacy.html"><span>💊</span> Pharmacy</a>
<a href="lab.html" class="active"><span>🔬</span> Lab</a> <a href="lab.html" class="active"><span>🔬</span> Lab</a>
<a href="billing.html"><span>💳</span> Billing & Accounts</a> <a href="billing.html"><span>💳</span> Billing & Accounts</a>

View File

@ -17,8 +17,8 @@
</div> </div>
<nav class="side-nav"> <nav class="side-nav">
<a href="dashboard.html"><span>🏠</span> Overview</a> <a href="dashboard.html"><span>🏠</span> Overview</a>
<a href="dashboard.html"><span>👥</span> Queue</a> <a href="dashboard.html" onclick="showSection('queue')"><span>👥</span> Queue</a>
<a href="dashboard.html"><span>📂</span> Patients</a> <a href="dashboard.html" onclick="showSection('patients')"><span>📂</span> Patients</a>
<a href="pharmacy.html" class="active"><span>💊</span> Pharmacy</a> <a href="pharmacy.html" class="active"><span>💊</span> Pharmacy</a>
<a href="lab.html"><span>🔬</span> Lab</a> <a href="lab.html"><span>🔬</span> Lab</a>
<a href="billing.html"><span>💳</span> Billing & Accounts</a> <a href="billing.html"><span>💳</span> Billing & Accounts</a>