核心组件: - Orchestrator: 意图理解、任务拆分、竞标管理、结果验证 - Worker: 竞标任务、执行交付 - TaskBoard: 状态管理、信息存储 - BidEvaluator: 竞标评估算法 - ExecutionMonitor: 执行监控、超时处理 - LLMClient: 大模型接口调用 功能特性: - 竞标机制:Agent主动竞争任务 - 动态调度:串行/并行任务智能调度 - 智能容错:超时切换、验证重试 - 质量保证:结果验证、历史追踪 Web界面:首页、请求列表、任务列表、Agent管理 API接口:请求/任务/Agent管理、测试接口 端口:19015
213 lines
9.5 KiB
HTML
213 lines
9.5 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Agent管理 - 多智能体竞标调度系统</title>
|
||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||
<link href="https://cdn.jsdelivr.net/npm/remixicon@3.5.0/fonts/remixicon.css" rel="stylesheet">
|
||
<style>
|
||
body { background-color: #f5f7fa; }
|
||
.agent-card {
|
||
background: white;
|
||
border-radius: 12px;
|
||
padding: 25px;
|
||
box-shadow: 0 2px 12px rgba(0,0,0,0.08);
|
||
margin-bottom: 20px;
|
||
}
|
||
.capability-tag {
|
||
background: linear-gradient(135deg, #667eea, #764ba2);
|
||
color: white;
|
||
padding: 5px 12px;
|
||
border-radius: 15px;
|
||
font-size: 0.75rem;
|
||
margin: 2px;
|
||
}
|
||
.stat-item {
|
||
background: #f8f9fa;
|
||
padding: 15px;
|
||
border-radius: 8px;
|
||
text-align: center;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||
<div class="container">
|
||
<a class="navbar-brand" href="/"><i class="ri-robot-2-line"></i> 多智能体竞标调度系统</a>
|
||
<div class="collapse navbar-collapse">
|
||
<ul class="navbar-nav ms-auto">
|
||
<li class="nav-item"><a class="nav-link" href="/">首页</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="/requests">请求列表</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="/tasks">任务列表</a></li>
|
||
<li class="nav-item"><a class="nav-link active" href="/agents">Agent管理</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<div class="container py-4">
|
||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||
<h4><i class="ri-robot-line"></i> Agent管理</h4>
|
||
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addModal">
|
||
<i class="ri-add-line"></i> 注册Agent
|
||
</button>
|
||
</div>
|
||
|
||
<div id="agents-list" class="row">
|
||
<div class="text-center text-muted py-5">
|
||
<i class="ri-loader-4-line fs-1"></i>
|
||
<p>加载中...</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 添加Agent模态框 -->
|
||
<div class="modal fade" id="addModal" tabindex="-1">
|
||
<div class="modal-dialog">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h5 class="modal-title"><i class="ri-robot-add-line"></i> 注册新Agent</h5>
|
||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<form id="agent-form">
|
||
<div class="mb-3">
|
||
<label class="form-label">Agent ID</label>
|
||
<input type="text" class="form-control" id="agent-id" placeholder="如: my_agent">
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">名称</label>
|
||
<input type="text" class="form-control" id="agent-name" placeholder="如: 我的助手">
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">描述</label>
|
||
<textarea class="form-control" id="agent-desc" rows="2" placeholder="Agent的功能描述"></textarea>
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">能力标签(逗号分隔)</label>
|
||
<input type="text" class="form-control" id="agent-caps" placeholder="如: coding, search, writing">
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">最大并发任务</label>
|
||
<input type="number" class="form-control" id="agent-max" value="1" min="1" max="10">
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
|
||
<button type="button" class="btn btn-primary" onclick="addAgent()">
|
||
<i class="ri-check-line"></i> 注册
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||
<script>
|
||
function loadAgents() {
|
||
fetch('/api/agents')
|
||
.then(r => r.json())
|
||
.then(data => {
|
||
const list = document.getElementById('agents-list');
|
||
|
||
if (!data.length) {
|
||
list.innerHTML = `
|
||
<div class="col-12 text-center text-muted py-5">
|
||
<i class="ri-robot-off-line fs-1"></i>
|
||
<p>暂无注册的Agent</p>
|
||
</div>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
list.innerHTML = data.map(a => `
|
||
<div class="col-md-6 col-lg-4">
|
||
<div class="agent-card">
|
||
<div class="d-flex justify-content-between align-items-start mb-3">
|
||
<div>
|
||
<h5><i class="ri-robot-2-fill text-primary"></i> ${a.name}</h5>
|
||
<span class="text-muted small">#${a.id}</span>
|
||
</div>
|
||
<button class="btn btn-outline-danger btn-sm" onclick="removeAgent('${a.id}')">
|
||
<i class="ri-delete-bin-line"></i>
|
||
</button>
|
||
</div>
|
||
<p class="text-muted small">${a.description || '暂无描述'}</p>
|
||
<div class="mb-3">
|
||
${a.capabilities.map(c => `<span class="capability-tag">${c}</span>`).join('')}
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-4">
|
||
<div class="stat-item">
|
||
<small class="text-muted">任务数</small>
|
||
<h6>${a.total_tasks}</h6>
|
||
</div>
|
||
</div>
|
||
<div class="col-4">
|
||
<div class="stat-item">
|
||
<small class="text-muted">成功率</small>
|
||
<h6>${(a.success_rate * 100).toFixed(0)}%</h6>
|
||
</div>
|
||
</div>
|
||
<div class="col-4">
|
||
<div class="stat-item">
|
||
<small class="text-muted">平均时间</small>
|
||
<h6>${a.avg_completion_time.toFixed(0)}s</h6>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`).join('');
|
||
});
|
||
}
|
||
|
||
function addAgent() {
|
||
const id = document.getElementById('agent-id').value.trim();
|
||
const name = document.getElementById('agent-name').value.trim();
|
||
const desc = document.getElementById('agent-desc').value.trim();
|
||
const caps = document.getElementById('agent-caps').value.split(',').map(c => c.trim()).filter(c => c);
|
||
const max = parseInt(document.getElementById('agent-max').value) || 1;
|
||
|
||
if (!id) {
|
||
alert('请填写 Agent ID');
|
||
return;
|
||
}
|
||
|
||
fetch('/api/agent', {
|
||
method: 'POST',
|
||
headers: {'Content-Type': 'application/json'},
|
||
body: JSON.stringify({
|
||
id, name, description: desc,
|
||
capabilities: caps,
|
||
max_concurrent_tasks: max
|
||
})
|
||
})
|
||
.then(r => r.json())
|
||
.then(data => {
|
||
if (data.error) {
|
||
alert('错误: ' + data.error);
|
||
} else {
|
||
bootstrap.Modal.getOrCreateInstance(document.getElementById('addModal')).hide();
|
||
document.getElementById('agent-form').reset();
|
||
loadAgents();
|
||
}
|
||
});
|
||
}
|
||
|
||
function removeAgent(id) {
|
||
if (!confirm('确定注销此Agent?')) return;
|
||
|
||
fetch(`/api/agent/${id}`, {method: 'DELETE'})
|
||
.then(r => r.json())
|
||
.then(data => {
|
||
loadAgents();
|
||
});
|
||
}
|
||
|
||
loadAgents();
|
||
</script>
|
||
</body>
|
||
</html> |