openclaw
c93f99da41
- Serve HTML dashboard at /admin/ai-evolution/ - API endpoint /admin/ai-evolution/api/data returning baseline, versions, commands, agent_runs - Background agent runner base class for autonomous file operations - Chat API sync service with real-time message polling and task execution - Add admin route to aios_chatgpt_actions_api.py, fix missing start_time variable
100 lines
5.8 KiB
HTML
100 lines
5.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>AI Evolution Dashboard</title>
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; background: #0d1117; color: #c9d1d9; height: 100vh; overflow: hidden; }
|
|
.app { display: flex; height: 100vh; }
|
|
.sidebar { width: 260px; background: #161b22; border-right: 1px solid #30363d; padding: 20px; display: flex; flex-direction: column; gap: 16px; }
|
|
.sidebar h1 { font-size: 18px; color: #f0f6fc; border-bottom: 1px solid #30363d; padding-bottom: 12px; margin-bottom: 8px; }
|
|
.sidebar-nav { list-style: none; display: flex; flex-direction: column; gap: 4px; }
|
|
.sidebar-nav li { padding: 8px 12px; border-radius: 6px; cursor: pointer; font-size: 14px; color: #8b949e; }
|
|
.sidebar-nav li:hover, .sidebar-nav li.active { background: #1f6feb22; color: #58a6ff; }
|
|
.sidebar-nav li i { margin-right: 8px; }
|
|
.main { flex: 1; padding: 24px; overflow-y: auto; }
|
|
.main-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; }
|
|
.main-header h2 { font-size: 20px; }
|
|
.status-badge { padding: 4px 12px; border-radius: 12px; font-size: 12px; font-weight: 600; text-transform: uppercase; }
|
|
.status-badge.ok { background: #1b3a2d; color: #3fb950; border: 1px solid #3fb95044; }
|
|
.status-badge.degraded { background: #3a2e1b; color: #d29922; border: 1px solid #d2992244; }
|
|
.status-badge.fail { background: #3a1b1b; color: #f85149; border: 1px solid #f8514944; }
|
|
.card { background: #161b22; border: 1px solid #30363d; border-radius: 8px; padding: 16px; margin-bottom: 16px; }
|
|
.card-title { font-size: 14px; color: #8b949e; margin-bottom: 8px; }
|
|
.card-value { font-size: 28px; font-weight: 700; color: #f0f6fc; }
|
|
.row { display: flex; gap: 16px; }
|
|
.col { flex: 1; }
|
|
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
|
|
pre { white-space: pre-wrap; word-break: break-word; }
|
|
.command-item { padding: 12px; margin-bottom: 8px; border-radius: 6px; background: #0d1117; border: 1px solid #21262d; }
|
|
.command-item .meta { display: flex; gap: 8px; align-items: center; font-size: 12px; color: #8b949e; }
|
|
.command-item .name { font-size: 14px; color: #58a6ff; font-weight: 600; }
|
|
.command-item .state { font-size: 11px; padding: 2px 8px; border-radius: 10px; text-transform: uppercase; }
|
|
.state-active { background: #1b3a2d; color: #3fb950; }
|
|
.state-running { background: #3a2e1b; color: #d29922; }
|
|
.state-completed { background: #1b3a2d; color: #3fb950; }
|
|
.state-failed { background: #3a1b1b; color: #f85149; }
|
|
.loading { text-align: center; padding: 40px; color: #8b949e; }
|
|
.error { padding: 20px; background: #3a1b1b; border: 1px solid #f8514944; border-radius: 8px; color: #f85149; margin-bottom: 16px; }
|
|
.version-item { padding: 8px 12px; background: #0d1117; border: 1px solid #21262d; border-radius: 6px; margin-bottom: 4px; display: flex; justify-content: space-between; }
|
|
.version-item .tag { color: #58a6ff; font-weight: 600; }
|
|
.version-item .name { color: #8b949e; font-size: 13px; }
|
|
.agent-item { background: #0d1117; border: 1px solid #21262d; border-radius: 6px; margin-bottom: 8px; padding: 12px; }
|
|
.agent-item .agent-title { font-size: 14px; font-weight: 600; color: #c9d1d9; margin-bottom: 4px; }
|
|
.agent-item .agent-meta { font-size: 12px; color: #8b949e; }
|
|
.agent-run-item { padding: 8px 12px; margin-bottom: 4px; border-radius: 4px; background: #0d1117; border: 1px solid #21262d; display: flex; justify-content: space-between; align-items: center; }
|
|
.agent-run-item .run-id { color: #58a6ff; font-size: 13px; font-weight: 600; }
|
|
.agent-run-item .source { color: #8b949e; font-size: 12px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app" class="app">
|
|
<div class="sidebar">
|
|
<h1>🕹️ AI Evolution Dashboard</h1>
|
|
<ul class="sidebar-nav">
|
|
<li class="active" onclick="showPanel('overview')"><i>📊</i> Overview</li>
|
|
<li onclick="showPanel('versions')"><i>🏷️</i> Versions</li>
|
|
<li onclick="showPanel('commands')"><i>⚡</i> Commands</li>
|
|
<li onclick="showPanel('agents')"><i>🤖</i> Agent Runs</li>
|
|
</ul>
|
|
</div>
|
|
<div class="main">
|
|
<div id="panel-overview" class="panel">
|
|
<div class="main-header">
|
|
<h2>System Overview</h2>
|
|
<div id="header-status" class="status-badge">Loading...</div>
|
|
</div>
|
|
<div id="loading" class="loading">Loading...</div>
|
|
<div id="error" class="error" style="display:none;"></div>
|
|
<div id="content">
|
|
<div class="row">
|
|
<div class="col"><div class="card"><div class="card-title">Current Baseline</div><div id="base" class="card-value">-</div></div></div>
|
|
<div class="col"><div class="card"><div class="card-title">Git Branch</div><div id="branch" class="card-value">-</div></div></div>
|
|
<div class="col"><div class="card"><div class="card-title">Uptime</div><div id="uptime" class="card-value">-</div></div></div>
|
|
</div>
|
|
<div class="card" style="margin-top:16px">
|
|
<div class="card-title">Event Bus Status</div>
|
|
<pre id="bus-status">-</pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="panel-versions" class="panel" style="display:none;">
|
|
<div class="main-header"><h2>Version Timeline</h2></div>
|
|
<div id="versions-list">Loading...</div>
|
|
</div>
|
|
<div id="panel-commands" class="panel" style="display:none;">
|
|
<div class="main-header"><h2>Command Lookup</h2></div>
|
|
<div id="commands-list">Loading...</div>
|
|
</div>
|
|
<div id="panel-agents" class="panel" style="display:none;">
|
|
<div class="main-header"><h2>Recent Agent Executions</h2></div>
|
|
<div id="agents-list">Loading...</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
async function fetchData() {
|
|
const r = await fetch('/admin/ai-evolution/api/data');
|