mirror of
https://github.com/blackboxprogramming/BlackRoad-Operating-System.git
synced 2026-03-17 06:57:17 -05:00
173 lines
6.7 KiB
HTML
173 lines
6.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Prism Console - BlackRoad OS</title>
|
|
<link rel="stylesheet" href="static/css/prism.css">
|
|
</head>
|
|
<body>
|
|
<div class="prism-container">
|
|
<!-- Header -->
|
|
<header class="prism-header">
|
|
<div class="logo">
|
|
<span class="logo-icon">⚡</span>
|
|
<h1>Prism Console</h1>
|
|
</div>
|
|
<div class="header-info">
|
|
<span id="environment-badge">Development</span>
|
|
<span id="health-status">●</span>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Navigation -->
|
|
<nav class="prism-nav">
|
|
<button class="nav-item active" data-tab="overview">Overview</button>
|
|
<button class="nav-item" data-tab="jobs">Jobs</button>
|
|
<button class="nav-item" data-tab="agents">Agents</button>
|
|
<button class="nav-item" data-tab="logs">Logs</button>
|
|
<button class="nav-item" data-tab="system">System</button>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<main class="prism-content">
|
|
<!-- Overview Tab -->
|
|
<div class="tab-panel active" id="overview-tab">
|
|
<h2>System Overview</h2>
|
|
|
|
<div class="metrics-grid">
|
|
<div class="metric-card">
|
|
<div class="metric-label">System Status</div>
|
|
<div class="metric-value" id="system-status">Loading...</div>
|
|
</div>
|
|
|
|
<div class="metric-card">
|
|
<div class="metric-label">Backend Version</div>
|
|
<div class="metric-value" id="backend-version">Loading...</div>
|
|
</div>
|
|
|
|
<div class="metric-card">
|
|
<div class="metric-label">Active Jobs</div>
|
|
<div class="metric-value" id="active-jobs">0</div>
|
|
</div>
|
|
|
|
<div class="metric-card">
|
|
<div class="metric-label">Total Agents</div>
|
|
<div class="metric-value" id="total-agents">208</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="section">
|
|
<h3>Service Health</h3>
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Service</th>
|
|
<th>Status</th>
|
|
<th>Version</th>
|
|
<th>Endpoint</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="service-health-body">
|
|
<tr>
|
|
<td colspan="4" class="empty-state">Waiting for health checks...</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="section">
|
|
<h3>Quick Actions</h3>
|
|
<div class="button-group">
|
|
<button class="action-button" onclick="refreshDashboard()">Refresh Dashboard</button>
|
|
<button class="action-button" onclick="viewLogs()">View Logs</button>
|
|
<button class="action-button" onclick="openOS()">Open BlackRoad OS</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Jobs Tab -->
|
|
<div class="tab-panel" id="jobs-tab">
|
|
<h2>Job Management</h2>
|
|
<p class="placeholder">TODO: Hook up Operator jobs API</p>
|
|
|
|
<div class="section">
|
|
<h3>Scheduled Jobs</h3>
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Job Name</th>
|
|
<th>Schedule</th>
|
|
<th>Status</th>
|
|
<th>Last Run</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="jobs-table-body">
|
|
<tr>
|
|
<td colspan="5" class="empty-state">No jobs configured yet</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Agents Tab -->
|
|
<div class="tab-panel" id="agents-tab">
|
|
<h2>AI Agents</h2>
|
|
<p class="placeholder">TODO: Hook up Agent Library API</p>
|
|
|
|
<div class="section">
|
|
<h3>Agent Categories</h3>
|
|
<div class="agent-categories">
|
|
<div class="category-card">DevOps (24 agents)</div>
|
|
<div class="category-card">Engineering (28 agents)</div>
|
|
<div class="category-card">Data Science (22 agents)</div>
|
|
<div class="category-card">Security (18 agents)</div>
|
|
<div class="category-card">Finance (20 agents)</div>
|
|
<div class="category-card">Creative (21 agents)</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Logs Tab -->
|
|
<div class="tab-panel" id="logs-tab">
|
|
<h2>System Logs</h2>
|
|
<p class="placeholder">TODO: Implement real-time log streaming</p>
|
|
|
|
<div class="section">
|
|
<div class="log-viewer">
|
|
<div class="log-entry">[INFO] Prism Console initialized</div>
|
|
<div class="log-entry">[INFO] Connected to backend API</div>
|
|
<div class="log-entry">[INFO] Health check: OK</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- System Tab -->
|
|
<div class="tab-panel" id="system-tab">
|
|
<h2>System Configuration</h2>
|
|
|
|
<div class="section">
|
|
<h3>Environment Variables</h3>
|
|
<div id="config-display">Loading...</div>
|
|
</div>
|
|
|
|
<div class="section">
|
|
<h3>Feature Flags</h3>
|
|
<div id="features-display">Loading...</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="prism-footer">
|
|
<span>BlackRoad Prism Console v0.1.0</span>
|
|
<span id="last-updated">Last updated: Never</span>
|
|
</footer>
|
|
</div>
|
|
|
|
<script src="static/js/prism.js"></script>
|
|
</body>
|
|
</html>
|