feat: 重构工具配置为通用模型,增加使用统计
- ToolConfig 模型:支持多种工具类型(搜索、计算器、代码执行等) - ToolUsageLog 模型:记录工具调用日志 - 工具使用统计:调用次数、成功率、错误记录 - 后台管理界面:工具列表+统计展示 - API 重构:/api/v2/tools(替代 search-tools)
This commit is contained in:
@@ -42,7 +42,7 @@
|
||||
<div class="nav-item active" data-page="llm-providers"><i class="ri-cloud-line"></i> 大模型池</div>
|
||||
<div class="nav-item" data-page="agents"><i class="ri-robot-2-line"></i> Agent管理</div>
|
||||
<div class="nav-item" data-page="channels"><i class="ri-chat-3-line"></i> 渠道管理</div>
|
||||
<div class="nav-item" data-page="search-tools"><i class="ri-search-line"></i> 搜索工具</div>
|
||||
<div class="nav-item" data-page="tools"><i class="ri-tools-line"></i> 工具管理</div>
|
||||
<div class="nav-item" data-page="stats"><i class="ri-bar-chart-box-line"></i> 统计数据</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -110,19 +110,29 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 搜索工具 -->
|
||||
<div class="page-section" id="page-search-tools">
|
||||
<div class="page-header"><h2><i class="ri-search-line"></i> 搜索工具配置</h2></div>
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between">
|
||||
<span>搜索工具列表(Tavily、Google等)</span>
|
||||
<button class="btn btn-primary btn-sm" onclick="showAddSearchToolModal()"><i class="ri-add-line"></i> 添加</button>
|
||||
<!-- 工具管理 -->
|
||||
<div class="page-section" id="page-tools">
|
||||
<div class="page-header"><h2><i class="ri-tools-line"></i> 工具管理</h2></div>
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between">
|
||||
<span>工具列表(搜索、计算器、代码执行等)</span>
|
||||
<button class="btn btn-primary btn-sm" onclick="showAddToolModal()"><i class="ri-add-line"></i> 添加工具</button>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<table class="table">
|
||||
<thead><tr><th>名称</th><th>类型</th><th>提供商</th><th>调用次数</th><th>成功率</th><th>默认</th><th>状态</th><th>操作</th></tr></thead>
|
||||
<tbody id="tools-list"><tr><td colspan="8" class="text-center">加载中...</td></tr></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<table class="table">
|
||||
<thead><tr><th>名称</th><th>提供商</th><th>API Key</th><th>最大结果</th><th>默认</th><th>状态</th><th>操作</th></tr></thead>
|
||||
<tbody id="search-tools-list"><tr><td colspan="7" class="text-center">加载中...</td></tr></tbody>
|
||||
</table>
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-header"><i class="ri-bar-chart-line"></i> 工具使用统计(近7天)</div>
|
||||
<div class="card-body" id="tool-stats">加载中...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -200,20 +210,41 @@
|
||||
<div class="modal-footer"><button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button><button type="button" class="btn btn-primary" onclick="saveMatrixConfig()">保存</button></div>
|
||||
</div></div></div>
|
||||
|
||||
<!-- Search Tool Modal -->
|
||||
<div class="modal fade" id="searchToolModal"><div class="modal-dialog"><div class="modal-content">
|
||||
<div class="modal-header"><h5 class="modal-title">添加/编辑搜索工具</h5><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
|
||||
<div class="modal-body"><form id="search-tool-form">
|
||||
<input type="hidden" id="search-tool-id">
|
||||
<div class="mb-3"><label class="form-label">名称</label><input type="text" class="form-control" id="search-tool-name" value="Tavily Search"></div>
|
||||
<div class="mb-3"><label class="form-label">提供商</label><select class="form-select" id="search-tool-provider"><option value="tavily">Tavily</option><option value="google">Google</option><option value="bing">Bing</option></select></div>
|
||||
<div class="mb-3"><label class="form-label">API Key *</label><input type="text" class="form-control" id="search-tool-api-key" required></div>
|
||||
<div class="mb-3"><label class="form-label">API地址(可选)</label><input type="text" class="form-control" id="search-tool-api-base"></div>
|
||||
<div class="row"><div class="col-md-6"><label class="form-label">最大结果数</label><input type="number" class="form-control" id="search-tool-max-results" value="5"></div><div class="col-md-6"><label class="form-label">搜索深度</label><select class="form-select" id="search-tool-depth"><option value="basic">Basic</option><option value="advanced">Advanced</option></select></div></div>
|
||||
<div class="mt-3 form-check"><input type="checkbox" class="form-check-input" id="search-tool-active" checked><label class="form-check-label">启用</label></div>
|
||||
<div class="mt-2 form-check"><input type="checkbox" class="form-check-input" id="search-tool-default"><label class="form-check-label">设为默认</label></div>
|
||||
<!-- Tool Modal -->
|
||||
<div class="modal fade" id="toolModal"><div class="modal-dialog modal-lg"><div class="modal-content">
|
||||
<div class="modal-header"><h5 class="modal-title">添加/编辑工具</h5><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
|
||||
<div class="modal-body"><form id="tool-form">
|
||||
<input type="hidden" id="tool-id">
|
||||
<div class="row">
|
||||
<div class="col-md-6"><label class="form-label">名称 *</label><input type="text" class="form-control" id="tool-name" required></div>
|
||||
<div class="col-md-6"><label class="form-label">类型 *</label><select class="form-select" id="tool-type" onchange="updateToolForm()">
|
||||
<option value="search">搜索工具</option>
|
||||
<option value="calculator">计算器</option>
|
||||
<option value="code_runner">代码执行</option>
|
||||
<option value="image_gen">图像生成</option>
|
||||
<option value="translator">翻译</option>
|
||||
<option value="weather">天气查询</option>
|
||||
<option value="custom">自定义</option>
|
||||
</select></div>
|
||||
</div>
|
||||
<div class="row mt-3">
|
||||
<div class="col-md-6"><label class="form-label">提供商</label><select class="form-select" id="tool-provider">
|
||||
<option value="">无</option>
|
||||
<option value="tavily">Tavily</option>
|
||||
<option value="google">Google</option>
|
||||
<option value="bing">Bing</option>
|
||||
<option value="wolfram">Wolfram</option>
|
||||
<option value="openai">OpenAI</option>
|
||||
<option value="anthropic">Anthropic</option>
|
||||
<option value="custom">自定义</option>
|
||||
</select></div>
|
||||
<div class="col-md-6"><label class="form-label">API Key</label><input type="text" class="form-control" id="tool-api-key"></div>
|
||||
</div>
|
||||
<div class="mt-3"><label class="form-label">配置参数(JSON格式)</label><textarea class="form-control" id="tool-config" rows="3">{"max_results": 5, "search_depth": "basic"}</textarea></div>
|
||||
<div class="mt-3 form-check"><input type="checkbox" class="form-check-input" id="tool-active" checked><label class="form-check-label">启用</label></div>
|
||||
<div class="mt-2 form-check"><input type="checkbox" class="form-check-input" id="tool-default"><label class="form-check-label">设为该类型默认</label></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="saveSearchTool()">保存</button></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="saveTool()">保存</button></div>
|
||||
</div></div></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||
@@ -226,7 +257,7 @@
|
||||
if (page === 'llm-providers') loadProviders();
|
||||
if (page === 'agents') loadAgents();
|
||||
if (page === 'channels') loadChannels();
|
||||
if (page === 'search-tools') loadSearchTools();
|
||||
if (page === 'tools') loadTools();
|
||||
if (page === 'stats') loadStats();
|
||||
}
|
||||
|
||||
@@ -527,96 +558,172 @@
|
||||
document.getElementById('stat-agents').textContent = (agentsData.agents || []).length;
|
||||
}
|
||||
|
||||
// ===== 搜索工具 =====
|
||||
async function loadSearchTools() {
|
||||
const res = await fetch('/api/v2/search-tools');
|
||||
// ===== 工具管理 =====
|
||||
async function loadTools() {
|
||||
const res = await fetch('/api/v2/tools');
|
||||
const data = await res.json();
|
||||
const tools = data.configs || [];
|
||||
const tbody = document.getElementById('search-tools-list');
|
||||
const tools = data.tools || [];
|
||||
const tbody = document.getElementById('tools-list');
|
||||
if (tools.length === 0) {
|
||||
tbody.innerHTML = '<tr><td colspan="7" class="text-center text-muted">暂无配置,点击添加按钮创建</td></tr>';
|
||||
tbody.innerHTML = '<tr><td colspan="8" class="text-center text-muted">暂无工具,点击添加按钮创建</td></tr>';
|
||||
} else {
|
||||
tbody.innerHTML = tools.map(t => {
|
||||
const successRate = t.total_calls > 0 ? Math.round(t.success_calls / t.total_calls * 100) : 0;
|
||||
return `
|
||||
<tr>
|
||||
<td>${t.name}</td>
|
||||
<td><span class="badge bg-info">${t.tool_type}</span></td>
|
||||
<td>${t.provider || '-'}</td>
|
||||
<td>${t.total_calls}</td>
|
||||
<td><span class="badge ${successRate >= 90 ? 'bg-success' : successRate >= 70 ? 'bg-warning' : 'bg-danger'}">${successRate}%</span></td>
|
||||
<td>${t.is_default ? '<i class="ri-check-line text-success"></i>' : ''}</td>
|
||||
<td>${t.is_active ? '<span class="badge bg-success">启用</span>' : '<span class="badge bg-secondary">禁用</span>'}</td>
|
||||
<td>
|
||||
<button class="btn btn-sm btn-outline-primary" onclick="editTool(${t.id})"><i class="ri-edit-line"></i></button>
|
||||
<button class="btn btn-sm btn-outline-danger" onclick="deleteTool(${t.id})"><i class="ri-delete-bin-line"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
`;
|
||||
}).join('');
|
||||
}
|
||||
|
||||
// 加载统计
|
||||
loadToolStats();
|
||||
}
|
||||
|
||||
async function loadToolStats() {
|
||||
const res = await fetch('/api/v2/tools/stats?days=7');
|
||||
const stats = await res.json();
|
||||
const container = document.getElementById('tool-stats');
|
||||
|
||||
if (stats.total_calls === 0) {
|
||||
container.innerHTML = '<p class="text-muted">暂无使用记录</p>';
|
||||
return;
|
||||
}
|
||||
tbody.innerHTML = tools.map(t => `
|
||||
<tr>
|
||||
<td>${t.name}</td>
|
||||
<td>${t.provider}</td>
|
||||
<td><small class="text-muted">${t.api_key ? t.api_key.substring(0, 10) + '...' : '-'}</small></td>
|
||||
<td>${t.max_results}</td>
|
||||
<td>${t.is_default ? '<i class="ri-check-line text-success"></i>' : ''}</td>
|
||||
<td>${t.is_active ? '<span class="badge bg-success">启用</span>' : '<span class="badge bg-secondary">禁用</span>'}</td>
|
||||
<td>
|
||||
<button class="btn btn-sm btn-outline-primary" onclick="editSearchTool(${t.id})"><i class="ri-edit-line"></i></button>
|
||||
<button class="btn btn-sm btn-outline-danger" onclick="deleteSearchTool(${t.id})"><i class="ri-delete-bin-line"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
`).join('');
|
||||
|
||||
let html = `<p><strong>总调用:</strong> ${stats.total_calls} 次</p>`;
|
||||
html += `<p><strong>成功率:</strong> ${Math.round(stats.success_rate)}%</p>`;
|
||||
|
||||
if (stats.by_type) {
|
||||
html += '<hr><h6>按类型:</h6>';
|
||||
for (const [type, data] of Object.entries(stats.by_type)) {
|
||||
html += `<p><span class="badge bg-info">${type}</span> ${data.total}次 (成功${data.success})</p>`;
|
||||
}
|
||||
}
|
||||
|
||||
if (stats.recent_errors && stats.recent_errors.length > 0) {
|
||||
html += '<hr><h6>最近错误:</h6>';
|
||||
stats.recent_errors.slice(0, 3).forEach(e => {
|
||||
html += `<p class="text-danger small">${e.tool}: ${e.error}</p>`;
|
||||
});
|
||||
}
|
||||
|
||||
container.innerHTML = html;
|
||||
}
|
||||
|
||||
function showAddSearchToolModal() {
|
||||
document.getElementById('search-tool-id').value = '';
|
||||
document.getElementById('search-tool-name').value = 'Tavily Search';
|
||||
document.getElementById('search-tool-provider').value = 'tavily';
|
||||
document.getElementById('search-tool-api-key').value = '';
|
||||
document.getElementById('search-tool-api-base').value = '';
|
||||
document.getElementById('search-tool-max-results').value = 5;
|
||||
document.getElementById('search-tool-depth').value = 'basic';
|
||||
document.getElementById('search-tool-active').checked = true;
|
||||
document.getElementById('search-tool-default').checked = false;
|
||||
new bootstrap.Modal(document.getElementById('searchToolModal')).show();
|
||||
function showAddToolModal() {
|
||||
document.getElementById('tool-id').value = '';
|
||||
document.getElementById('tool-name').value = '';
|
||||
document.getElementById('tool-type').value = 'search';
|
||||
document.getElementById('tool-provider').value = 'tavily';
|
||||
document.getElementById('tool-api-key').value = '';
|
||||
document.getElementById('tool-config').value = '{"max_results": 5, "search_depth": "basic"}';
|
||||
document.getElementById('tool-active').checked = true;
|
||||
document.getElementById('tool-default').checked = false;
|
||||
updateToolForm();
|
||||
new bootstrap.Modal(document.getElementById('toolModal')).show();
|
||||
}
|
||||
|
||||
async function editSearchTool(id) {
|
||||
const res = await fetch('/api/v2/search-tools');
|
||||
const data = await res.json();
|
||||
const tool = (data.configs || []).find(t => t.id === id);
|
||||
if (!tool) return;
|
||||
document.getElementById('search-tool-id').value = tool.id;
|
||||
document.getElementById('search-tool-name').value = tool.name;
|
||||
document.getElementById('search-tool-provider').value = tool.provider;
|
||||
document.getElementById('search-tool-api-key').value = tool.api_key || '';
|
||||
document.getElementById('search-tool-api-base').value = tool.api_base || '';
|
||||
document.getElementById('search-tool-max-results').value = tool.max_results;
|
||||
document.getElementById('search-tool-depth').value = tool.search_depth;
|
||||
document.getElementById('search-tool-active').checked = tool.is_active;
|
||||
document.getElementById('search-tool-default').checked = tool.is_default;
|
||||
new bootstrap.Modal(document.getElementById('searchToolModal')).show();
|
||||
}
|
||||
|
||||
async function saveSearchTool() {
|
||||
const id = document.getElementById('search-tool-id').value;
|
||||
const data = {
|
||||
name: document.getElementById('search-tool-name').value,
|
||||
provider: document.getElementById('search-tool-provider').value,
|
||||
api_key: document.getElementById('search-tool-api-key').value,
|
||||
api_base: document.getElementById('search-tool-api-base').value,
|
||||
max_results: parseInt(document.getElementById('search-tool-max-results').value),
|
||||
search_depth: document.getElementById('search-tool-depth').value,
|
||||
is_active: document.getElementById('search-tool-active').checked,
|
||||
is_default: document.getElementById('search-tool-default').checked
|
||||
function updateToolForm() {
|
||||
const type = document.getElementById('tool-type').value;
|
||||
const providerSelect = document.getElementById('tool-provider');
|
||||
const configTextarea = document.getElementById('tool-config');
|
||||
|
||||
// 根据类型设置默认配置
|
||||
const defaults = {
|
||||
'search': { provider: 'tavily', config: '{"api_key": "", "max_results": 5, "search_depth": "basic"}' },
|
||||
'calculator': { provider: 'wolfram', config: '{"api_key": ""}' },
|
||||
'code_runner': { provider: '', config: '{"timeout": 30, "language": "python"}' },
|
||||
'image_gen': { provider: 'openai', config: '{"api_key": "", "model": "dall-e-3"}' },
|
||||
'translator': { provider: '', config: '{"source": "auto", "target": "zh"}' },
|
||||
'weather': { provider: '', config: '{"api_key": ""}' },
|
||||
'custom': { provider: '', config: '{}' }
|
||||
};
|
||||
|
||||
const def = defaults[type] || defaults['custom'];
|
||||
providerSelect.value = def.provider;
|
||||
configTextarea.value = def.config;
|
||||
}
|
||||
|
||||
async function editTool(id) {
|
||||
const res = await fetch('/api/v2/tools');
|
||||
const data = await res.json();
|
||||
const tool = (data.tools || []).find(t => t.id === id);
|
||||
if (!tool) return;
|
||||
|
||||
document.getElementById('tool-id').value = tool.id;
|
||||
document.getElementById('tool-name').value = tool.name;
|
||||
document.getElementById('tool-type').value = tool.tool_type;
|
||||
document.getElementById('tool-provider').value = tool.provider || '';
|
||||
document.getElementById('tool-config').value = JSON.stringify(tool.config || {});
|
||||
document.getElementById('tool-active').checked = tool.is_active;
|
||||
document.getElementById('tool-default').checked = tool.is_default;
|
||||
|
||||
// 提取 API Key
|
||||
const apiKey = tool.config?.api_key || '';
|
||||
document.getElementById('tool-api-key').value = apiKey;
|
||||
|
||||
new bootstrap.Modal(document.getElementById('toolModal')).show();
|
||||
}
|
||||
|
||||
async function saveTool() {
|
||||
const id = document.getElementById('tool-id').value;
|
||||
|
||||
// 解析配置 JSON
|
||||
let config = {};
|
||||
try {
|
||||
config = JSON.parse(document.getElementById('tool-config').value);
|
||||
} catch (e) {
|
||||
alert('配置 JSON 格式错误');
|
||||
return;
|
||||
}
|
||||
|
||||
// 添加 API Key 到配置
|
||||
const apiKey = document.getElementById('tool-api-key').value;
|
||||
if (apiKey) config.api_key = apiKey;
|
||||
|
||||
const data = {
|
||||
name: document.getElementById('tool-name').value,
|
||||
tool_type: document.getElementById('tool-type').value,
|
||||
provider: document.getElementById('tool-provider').value,
|
||||
config: config,
|
||||
is_active: document.getElementById('tool-active').checked,
|
||||
is_default: document.getElementById('tool-default').checked
|
||||
};
|
||||
|
||||
let res;
|
||||
if (id) {
|
||||
res = await fetch(`/api/v2/search-tools/${id}`, { method: 'PUT', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data) });
|
||||
res = await fetch(`/api/v2/tools/${id}`, { method: 'PUT', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data) });
|
||||
} else {
|
||||
res = await fetch('/api/v2/search-tools', { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data) });
|
||||
res = await fetch('/api/v2/tools', { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data) });
|
||||
}
|
||||
|
||||
const result = await res.json();
|
||||
if (result.success) {
|
||||
bootstrap.Modal.getInstance(document.getElementById('searchToolModal')).hide();
|
||||
loadSearchTools();
|
||||
bootstrap.Modal.getInstance(document.getElementById('toolModal')).hide();
|
||||
loadTools();
|
||||
alert('保存成功');
|
||||
} else {
|
||||
alert('保存失败: ' + result.message);
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteSearchTool(id) {
|
||||
if (!confirm('确定删除此搜索工具配置?')) return;
|
||||
const res = await fetch(`/api/v2/search-tools/${id}`, { method: 'DELETE' });
|
||||
async function deleteTool(id) {
|
||||
if (!confirm('确定删除此工具配置?')) return;
|
||||
const res = await fetch(`/api/v2/tools/${id}`, { method: 'DELETE' });
|
||||
const result = await res.json();
|
||||
if (result.success) {
|
||||
loadSearchTools();
|
||||
loadTools();
|
||||
alert('删除成功');
|
||||
} else {
|
||||
alert('删除失败');
|
||||
|
||||
Reference in New Issue
Block a user