developer
11e9a257a1
- Interface: tags:string[], task:string, runtime:string, hero?:boolean - Alle 5 Agenten mit Tags, Task, Runtime, Hero befüllt
337 lines
12 KiB
TypeScript
337 lines
12 KiB
TypeScript
import { ref, reactive, computed } from 'vue'
|
|
|
|
export interface AgentNodeData {
|
|
id: string
|
|
name: string
|
|
role: string
|
|
description: string
|
|
tags: string[]
|
|
color: string
|
|
icon: string
|
|
task: string
|
|
runtime: string
|
|
model?: string
|
|
hero?: boolean
|
|
currentTask: string
|
|
goal: string
|
|
progress: number
|
|
workload: number // 0-100
|
|
active: boolean
|
|
runtimeSeconds: number
|
|
workingFeed: Array<{ time: string; text: string }>
|
|
thinkingStream?: Array<{ time: string; text: string }>
|
|
}
|
|
|
|
export interface OpenTask {
|
|
id: string
|
|
title: string
|
|
detail: string
|
|
source: 'bao' | 'iris'
|
|
createdAt: string
|
|
}
|
|
|
|
export interface FeedEntry {
|
|
time: string
|
|
agent: string
|
|
action: string
|
|
timestamp: string
|
|
}
|
|
|
|
export interface ChatMessage {
|
|
id: string
|
|
sender: 'user' | 'iris'
|
|
text: string
|
|
timestamp: number
|
|
}
|
|
|
|
export interface QueueItem {
|
|
id: string
|
|
text: string
|
|
priority: 'high' | 'medium' | 'low'
|
|
waitTime: string
|
|
}
|
|
|
|
const now = Date.now()
|
|
|
|
export function useDashboardData() {
|
|
const sessionStart = Date.now()
|
|
|
|
// Runtime counter
|
|
const runtimeSeconds = ref(0)
|
|
let runtimeInterval: ReturnType<typeof setInterval> | null = null
|
|
|
|
function startRuntime() {
|
|
const startTs = sessionStart
|
|
runtimeSeconds.value = Math.floor((Date.now() - startTs) / 1000)
|
|
runtimeInterval = setInterval(() => {
|
|
runtimeSeconds.value = Math.floor((Date.now() - startTs) / 1000)
|
|
}, 1000)
|
|
}
|
|
|
|
function stopRuntime() {
|
|
if (runtimeInterval) {
|
|
clearInterval(runtimeInterval)
|
|
runtimeInterval = null
|
|
}
|
|
}
|
|
|
|
const formatRuntime = (seconds: number): string => {
|
|
const m = Math.floor(seconds / 60)
|
|
const s = seconds % 60
|
|
return `${String(m).padStart(2, '0')}:${String(s).padStart(2, '0')}`
|
|
}
|
|
|
|
const irisRuntime = computed(() => formatRuntime(runtimeSeconds.value))
|
|
|
|
// Agent runtimes (simulated)
|
|
const agentStartTimes = reactive<Record<string, number>>({
|
|
iris: now - 28800000,
|
|
developer: now - 3600000,
|
|
devops: now - 1800000,
|
|
researcher: now - 2700000,
|
|
reviewer: now - 900000,
|
|
})
|
|
|
|
const getAgentRuntime = (id: string): string => {
|
|
const start = agentStartTimes[id]
|
|
if (!start) return '00:00'
|
|
const secs = Math.floor((now - start) / 1000)
|
|
const m = Math.floor(secs / 60)
|
|
const s = secs % 60
|
|
return `${String(m).padStart(2, '0')}:${String(s).padStart(2, '0')}`
|
|
}
|
|
|
|
// Agents
|
|
const agents = ref<AgentNodeData[]>([
|
|
{
|
|
id: 'iris',
|
|
name: 'Iris',
|
|
role: 'Chief of Staff',
|
|
description: 'Koordiniert, delegiert, hält das Team tight. Die erste Anlaufstelle zwischen Boss und Maschine.',
|
|
tags: ['Orchestration', 'Delegation', 'Approval'],
|
|
color: '#8b7cf6',
|
|
icon: 'bot',
|
|
hero: true,
|
|
task: 'Orchestrating Nexus Dashboard redesign',
|
|
runtime: '14:23',
|
|
currentTask: 'Orchestrating Nexus Dashboard redesign',
|
|
goal: 'Complete Mission Control v3',
|
|
progress: 85,
|
|
workload: 55,
|
|
active: true,
|
|
runtimeSeconds: 28800,
|
|
model: 'GPT-5.4',
|
|
workingFeed: [
|
|
{ time: '22:38', text: 'Analyzed user feedback on Dashboard' },
|
|
{ time: '22:36', text: 'Delegated card redesign to Developer' },
|
|
{ time: '22:34', text: 'Verifying full-width layout deployment' },
|
|
{ time: '22:32', text: 'Reviewing AgentModal integration' },
|
|
],
|
|
thinkingStream: [
|
|
{ time: '22:24', text: 'Analysing constraint: full-width layout' },
|
|
{ time: '22:25', text: 'Removing max-width from global CSS' },
|
|
{ time: '22:26', text: 'Verifying Dashboard grid reflow' },
|
|
],
|
|
},
|
|
{
|
|
id: 'developer',
|
|
name: 'Developer',
|
|
role: 'Backend & Frontend',
|
|
description: 'Implements features across the stack with TypeScript, C#, and Vue.',
|
|
tags: ['Coding', 'Development', 'Builds'],
|
|
color: '#3b82f6',
|
|
icon: 'code',
|
|
task: 'Building Dungeon System API endpoints',
|
|
runtime: '01:00',
|
|
currentTask: 'Building Dungeon System API endpoints',
|
|
goal: 'Complete Dungeon CRUD + room generation',
|
|
progress: 62,
|
|
workload: 65,
|
|
active: true,
|
|
runtimeSeconds: 3600,
|
|
workingFeed: [
|
|
{ time: '22:30', text: 'Created DungeonController' },
|
|
{ time: '22:28', text: 'Defined dungeon schema' },
|
|
{ time: '22:26', text: 'Implementing room generation algorithm' },
|
|
{ time: '22:24', text: 'Writing unit tests for RoomFactory' },
|
|
],
|
|
thinkingStream: [
|
|
{ time: '22:22', text: 'Parsing dungeon spec from Iris' },
|
|
{ time: '22:23', text: 'Designing RoomFactory interface' },
|
|
{ time: '22:24', text: 'Implementing corridor connection logic' },
|
|
],
|
|
model: 'DeepSeek V4 Flash',
|
|
},
|
|
{
|
|
id: 'devops',
|
|
name: 'DevOps',
|
|
role: 'Infrastructure & CI/CD',
|
|
description: 'Manages Docker, deployment pipelines, and system reliability.',
|
|
tags: ['Deployment', 'Docker', 'CI/CD'],
|
|
color: '#eab308',
|
|
icon: 'server',
|
|
task: 'Optimizing Docker Compose caching',
|
|
runtime: '00:30',
|
|
currentTask: 'Optimizing Docker Compose caching',
|
|
goal: 'Reduce build times by 40%',
|
|
progress: 45,
|
|
workload: 40,
|
|
active: false,
|
|
runtimeSeconds: 1800,
|
|
workingFeed: [
|
|
{ time: '22:20', text: 'Analyzed Docker layer cache' },
|
|
{ time: '22:18', text: 'Optimized COPY order in Dockerfile' },
|
|
{ time: '22:16', text: 'Added .dockerignore for node_modules' },
|
|
{ time: '22:14', text: 'Testing incremental builds' },
|
|
],
|
|
thinkingStream: [
|
|
{ time: '22:20', text: 'Checking build cache hit rates' },
|
|
{ time: '22:21', text: 'Benchmarking multi-stage vs single-stage' },
|
|
{ time: '22:22', text: 'Calculating potential speedup from caching' },
|
|
],
|
|
model: 'DeepSeek V4 Pro',
|
|
},
|
|
{
|
|
id: 'researcher',
|
|
name: 'Researcher',
|
|
role: 'Analysis & Documentation',
|
|
description: 'Researches APIs, patterns, and best practices. Maintains docs.',
|
|
tags: ['Research', 'Analysis', 'Docs'],
|
|
color: '#22c55e',
|
|
icon: 'search',
|
|
task: 'Analyzing WebSocket alternatives',
|
|
runtime: '00:45',
|
|
currentTask: 'Analyzing WebSocket alternatives',
|
|
goal: 'Recommend real-time communication strategy',
|
|
progress: 30,
|
|
workload: 25,
|
|
active: true,
|
|
runtimeSeconds: 2700,
|
|
workingFeed: [
|
|
{ time: '22:18', text: 'Evaluated WebSocket vs SSE vs WebRTC' },
|
|
{ time: '22:17', text: 'Documented SignalR limitations' },
|
|
{ time: '22:16', text: 'Prototyping WebSocket fallback' },
|
|
],
|
|
thinkingStream: [
|
|
{ time: '22:18', text: 'Cross-referencing WebSocket latency benchmarks' },
|
|
{ time: '22:19', text: 'Checking SSE browser support matrix' },
|
|
{ time: '22:20', text: 'Drafting recommendation summary' },
|
|
],
|
|
model: 'DeepSeek V4 Pro',
|
|
},
|
|
{
|
|
id: 'reviewer',
|
|
name: 'Reviewer',
|
|
role: 'Code Quality & Testing',
|
|
description: 'Reviews pull requests, enforces standards, runs test suites.',
|
|
tags: ['Code Review', 'Testing', 'Quality'],
|
|
color: '#a855f7',
|
|
icon: 'shield',
|
|
task: 'Reviewing Dungeon System PR',
|
|
runtime: '00:15',
|
|
currentTask: 'Reviewing Dungeon System PR',
|
|
goal: 'Zero critical findings before merge',
|
|
progress: 80,
|
|
workload: 50,
|
|
active: false,
|
|
runtimeSeconds: 900,
|
|
workingFeed: [
|
|
{ time: '22:15', text: 'Reviewed DungeonController.cs' },
|
|
{ time: '22:14', text: 'Found 3 minor style issues' },
|
|
{ time: '22:13', text: 'Approved RoomValidator' },
|
|
{ time: '22:12', text: 'Running integration tests' },
|
|
],
|
|
thinkingStream: [
|
|
{ time: '22:15', text: 'Analyzing DungeonController PR diff' },
|
|
{ time: '22:16', text: 'Checking RoomValidator edge cases' },
|
|
{ time: '22:17', text: 'Verifying integration test coverage' },
|
|
],
|
|
model: 'DeepSeek V4 Pro',
|
|
},
|
|
])
|
|
|
|
// Open Tasks
|
|
const openTasks = ref<OpenTask[]>([
|
|
{ id: 't1', title: 'Agent Thinking Panel visualisieren', detail: 'Live-Animation der Denkprozesse im AgentModal', source: 'iris', createdAt: '22:30' },
|
|
{ id: 't2', title: 'CI/CD Pipeline Monitoring Dashboard', detail: 'Echtzeit-Status der Gitea Actions im Dashboard', source: 'iris', createdAt: '21:15' },
|
|
{ id: 't3', title: 'Dungeon System Dokumentation', detail: 'API-Doku für Room-Generation-Endpunkte schreiben', source: 'bao', createdAt: '20:00' },
|
|
])
|
|
|
|
// Feed
|
|
const ts = (offset: number) => new Date(now + offset).toISOString()
|
|
const feedEntries = ref<FeedEntry[]>([
|
|
{ time: '22:50', agent: 'Developer', action: 'Created DungeonController endpoints', timestamp: ts(-120000) },
|
|
{ time: '22:46', agent: 'DevOps', action: 'Optimized Docker COPY order for layer caching', timestamp: ts(-360000) },
|
|
{ time: '22:42', agent: 'Iris', action: 'Delegated room generation to Developer with spec', timestamp: ts(-600000) },
|
|
{ time: '22:35', agent: 'Researcher', action: 'Documented WebSocket vs SSE analysis results', timestamp: ts(-960000) },
|
|
{ time: '22:28', agent: 'Reviewer', action: 'Approved RoomValidator PR with minor fixes', timestamp: ts(-1200000) },
|
|
{ time: '22:18', agent: 'DevOps', action: 'Added .dockerignore for node_modules and build artifacts', timestamp: ts(-1500000) },
|
|
{ time: '22:08', agent: 'Iris', action: 'Broke down Dungeon System tasks into sub-tasks', timestamp: ts(-1800000) },
|
|
{ time: '21:55', agent: 'Developer', action: 'Defined dungeon schema models with validation', timestamp: ts(-2400000) },
|
|
])
|
|
|
|
// Chat
|
|
const chatMessages = ref<ChatMessage[]>([
|
|
{ id: 'm1', sender: 'iris', text: 'Guten Abend, Bao. Ready to continue the Dungeon System?', timestamp: now - 600000 },
|
|
{ id: 'm2', sender: 'user', text: "Yes, what's the status?", timestamp: now - 540000 },
|
|
{ id: 'm3', sender: 'iris', text: "Developer is at 62% on room generation. Reviewer approved the schema. I'd recommend focusing on the room connection logic next.", timestamp: now - 480000 },
|
|
])
|
|
|
|
const irisBusy = ref(true)
|
|
const irisFocus = ref('Breaking down Dungeon System for DevOps and Developer')
|
|
|
|
// Queue
|
|
const queue = ref<QueueItem[]>([
|
|
{ id: 'q1', text: 'Deploy latest dashboard build to preview', priority: 'high', waitTime: '2 min' },
|
|
{ id: 'q2', text: 'Review infrastructure cost analysis', priority: 'medium', waitTime: '8 min' },
|
|
{ id: 'q3', text: 'Schedule B2 German lesson review', priority: 'low', waitTime: '15 min' },
|
|
{ id: 'q4', text: 'Update project roadmap document', priority: 'medium', waitTime: '12 min' },
|
|
])
|
|
|
|
function sendChat(text: string): void {
|
|
if (!text.trim()) return
|
|
chatMessages.value.push({
|
|
id: `user-${Date.now()}`,
|
|
sender: 'user',
|
|
text: text.trim(),
|
|
timestamp: Date.now(),
|
|
})
|
|
}
|
|
|
|
function removeQueueItem(id: string): void {
|
|
const idx = queue.value.findIndex(q => q.id === id)
|
|
if (idx !== -1) queue.value.splice(idx, 1)
|
|
}
|
|
|
|
function moveQueueItem(fromIdx: number, toIdx: number): void {
|
|
if (toIdx < 0 || toIdx >= queue.value.length) return
|
|
const [item] = queue.value.splice(fromIdx, 1)
|
|
queue.value.splice(toIdx, 0, item)
|
|
}
|
|
|
|
function changeQueuePriority(id: string, priority: QueueItem['priority']): void {
|
|
const item = queue.value.find(q => q.id === id)
|
|
if (item) item.priority = priority
|
|
}
|
|
|
|
return {
|
|
agents,
|
|
openTasks,
|
|
feedEntries,
|
|
chatMessages,
|
|
irisBusy,
|
|
irisFocus,
|
|
irisRuntime,
|
|
queue,
|
|
runtimeSeconds,
|
|
getAgentRuntime,
|
|
startRuntime,
|
|
stopRuntime,
|
|
formatRuntime,
|
|
sendChat,
|
|
removeQueueItem,
|
|
moveQueueItem,
|
|
changeQueuePriority,
|
|
}
|
|
}
|