188 lines
9.8 KiB
HTML
188 lines
9.8 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="zh-CN">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<title>{{ config ? '编辑' : '添加' }}备用大模型接口 - 后台管理</title>
|
|||
|
|
<link rel="icon" href="/static/img/favicon.svg" type="image/svg+xml">
|
|||
|
|
<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/bootstrap-icons@1.10.0/font/bootstrap-icons.css" rel="stylesheet">
|
|||
|
|
<style>
|
|||
|
|
body { background-color: #f5f5f5; }
|
|||
|
|
.sidebar { position: fixed; top: 0; left: 0; height: 100vh; width: 250px; background: #343a40; padding-top: 60px; }
|
|||
|
|
.sidebar .nav-link { color: #adb5bd; padding: 12px 20px; }
|
|||
|
|
.sidebar .nav-link:hover, .sidebar .nav-link.active { color: #fff; background: rgba(255,255,255,0.1); }
|
|||
|
|
.main-content { margin-left: 250px; padding: 20px; }
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<nav class="sidebar">
|
|||
|
|
<div class="position-absolute top-0 w-100 p-3 border-bottom border-secondary">
|
|||
|
|
<h5 class="text-white mb-0"><i class="bi bi-gear-fill"></i> 后台管理</h5>
|
|||
|
|
</div>
|
|||
|
|
<ul class="nav flex-column">
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.dashboard') }}"><i class="bi bi-speedometer2"></i> 数据概览</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.users') }}"><i class="bi bi-people"></i> 用户管理</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.translations') }}"><i class="bi bi-file-text"></i> 翻译记录</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.cache_list') }}"><i class="bi bi-database"></i> 缓存管理</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.stats') }}"><i class="bi bi-bar-chart"></i> 统计报表</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.logs') }}"><i class="bi bi-list-check"></i> 操作日志</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.llm_config') }}"><i class="bi bi-cpu"></i> 大模型配置</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link active" href="{{ url_for('admin.backup_llm_list') }}"><i class="bi bi-cloud"></i> 备用大模型</a></li>
|
|||
|
|
<li class="nav-item"><a class="nav-link" href="{{ url_for('admin.settings') }}"><i class="bi bi-sliders"></i> 系统配置</a></li>
|
|||
|
|
</ul>
|
|||
|
|
<div class="position-absolute bottom-0 w-100 p-3 border-top border-secondary">
|
|||
|
|
<a href="/" class="btn btn-outline-light btn-sm w-100"><i class="bi bi-house"></i> 返回前台</a>
|
|||
|
|
</div>
|
|||
|
|
</nav>
|
|||
|
|
|
|||
|
|
<main class="main-content">
|
|||
|
|
<div class="card">
|
|||
|
|
<div class="card-header">
|
|||
|
|
<h6 class="mb-0"><i class="bi bi-cloud-plus"></i> {{ config ? '编辑备用大模型接口' : '添加备用大模型接口' }}</h6>
|
|||
|
|
</div>
|
|||
|
|
<div class="card-body">
|
|||
|
|
<form id="configForm" onsubmit="return saveConfig(event)">
|
|||
|
|
<div class="mb-3">
|
|||
|
|
<label class="form-label">服务商名称 <span class="text-danger">*</span></label>
|
|||
|
|
<input type="text" class="form-control" name="provider_name"
|
|||
|
|
value="{{ config.provider_name if config else '' }}"
|
|||
|
|
placeholder="例如: OpenAI, DeepSeek, 阿里百炼" required>
|
|||
|
|
<small class="text-muted">显示名称，方便识别</small>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="mb-3">
|
|||
|
|
<label class="form-label">API地址 <span class="text-danger">*</span></label>
|
|||
|
|
<input type="text" class="form-control" name="api_base"
|
|||
|
|
value="{{ config.api_base if config else '' }}"
|
|||
|
|
placeholder="https://api.openai.com/v1" required>
|
|||
|
|
<small class="text-muted">LLM服务的API endpoint</small>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="mb-3">
|
|||
|
|
<label class="form-label">API Key</label>
|
|||
|
|
<input type="text" class="form-control" name="api_key"
|
|||
|
|
value="{{ config.api_key if config else '' }}"
|
|||
|
|
placeholder="sk-xxx（可选）">
|
|||
|
|
<small class="text-muted">如果不需要可留空</small>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="mb-3">
|
|||
|
|
<label class="form-label">默认模型</label>
|
|||
|
|
<input type="text" class="form-control" name="model"
|
|||
|
|
value="{{ config.model if config else '' }}"
|
|||
|
|
placeholder="gpt-4, deepseek-chat">
|
|||
|
|
<small class="text-muted">推荐使用的模型ID</small>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="mb-3">
|
|||
|
|
<label class="form-label">备注</label>
|
|||
|
|
<input type="text" class="form-control" name="description"
|
|||
|
|
value="{{ config.description if config else '' }}"
|
|||
|
|
placeholder="接口说明">
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="row mb-3">
|
|||
|
|
<div class="col-md-6">
|
|||
|
|
<label class="form-label">排序</label>
|
|||
|
|
<input type="number" class="form-control" name="sort_order"
|
|||
|
|
value="{{ config.sort_order if config else 0 }}">
|
|||
|
|
</div>
|
|||
|
|
<div class="col-md-6">
|
|||
|
|
<label class="form-label">状态</label>
|
|||
|
|
<select class="form-select" name="is_active">
|
|||
|
|
<option value="true" {% if not config or config.is_active %}selected{% endif %}>启用</option>
|
|||
|
|
<option value="false" {% if config and not config.is_active %}selected{% endif %}>禁用</option>
|
|||
|
|
</select>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="mt-3">
|
|||
|
|
<button type="submit" class="btn btn-primary"><i class="bi bi-check-lg"></i> 保存</button>
|
|||
|
|
<button type="button" class="btn btn-outline-secondary" onclick="testConfig()"><i class="bi bi-plug"></i> 测试连接</button>
|
|||
|
|
<a href="{{ url_for('admin.backup_llm_list') }}" class="btn btn-outline-secondary"><i class="bi bi-arrow-left"></i> 返回</a>
|
|||
|
|
</div>
|
|||
|
|
</form>
|
|||
|
|
|
|||
|
|
<div id="testResult" class="mt-3" style="display:none;"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</main>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
function saveConfig(e) {
|
|||
|
|
e.preventDefault();
|
|||
|
|
const formData = new FormData(document.getElementById('configForm'));
|
|||
|
|
const data = {};
|
|||
|
|
formData.forEach((value, key) => {
|
|||
|
|
if (key === 'sort_order') {
|
|||
|
|
data[key] = parseInt(value) || 0;
|
|||
|
|
} else if (key === 'is_active') {
|
|||
|
|
data[key] = value === 'true';
|
|||
|
|
} else {
|
|||
|
|
data[key] = value;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
{% if config %}
|
|||
|
|
const url = `/admin/backup-llm/{{ config.id }}/edit`;
|
|||
|
|
{% else %}
|
|||
|
|
const url = '/admin/backup-llm/add';
|
|||
|
|
{% endif %}
|
|||
|
|
|
|||
|
|
fetch(url, {
|
|||
|
|
method: 'POST',
|
|||
|
|
headers: {'Content-Type': 'application/json'},
|
|||
|
|
body: JSON.stringify(data)
|
|||
|
|
})
|
|||
|
|
.then(r => r.json())
|
|||
|
|
.then(res => {
|
|||
|
|
if (res.success) {
|
|||
|
|
alert('保存成功！');
|
|||
|
|
window.location.href = '/admin/backup-llm';
|
|||
|
|
} else {
|
|||
|
|
alert('保存失败: ' + (res.error || '未知错误'));
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch(err => alert('请求失败: ' + err));
|
|||
|
|
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function testConfig() {
|
|||
|
|
const formData = new FormData(document.getElementById('configForm'));
|
|||
|
|
const resultDiv = document.getElementById('testResult');
|
|||
|
|
resultDiv.style.display = 'block';
|
|||
|
|
resultDiv.innerHTML = '<div class="alert alert-info"><i class="bi bi-hourglass-split"></i> 正在测试连接...</div>';
|
|||
|
|
|
|||
|
|
// 先临时保存，然后测试
|
|||
|
|
{% if config %}
|
|||
|
|
// 已有配置，直接测试
|
|||
|
|
fetch(`/admin/backup-llm/{{ config.id }}/test`, {method: 'POST'})
|
|||
|
|
{% else %}
|
|||
|
|
// 新配置，需要先创建
|
|||
|
|
const data = {};
|
|||
|
|
formData.forEach((value, key) => {
|
|||
|
|
if (key === 'sort_order') data[key] = parseInt(value) || 0;
|
|||
|
|
else if (key === 'is_active') data[key] = value === 'true';
|
|||
|
|
else data[key] = value;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 直接用输入的数据测试（不保存）
|
|||
|
|
resultDiv.innerHTML = '<div class="alert alert-warning"><i class="bi bi-info-circle"></i> 新配置请先保存后再测试</div>';
|
|||
|
|
return;
|
|||
|
|
{% endif %}
|
|||
|
|
.then(r => r.json())
|
|||
|
|
.then(res => {
|
|||
|
|
if (res.success) {
|
|||
|
|
resultDiv.innerHTML = `<div class="alert alert-success"><i class="bi bi-check-circle"></i> ${res.provider} 连接成功！模型: ${res.model}</div>`;
|
|||
|
|
} else {
|
|||
|
|
resultDiv.innerHTML = `<div class="alert alert-danger"><i class="bi bi-x-circle"></i> 连接失败: ${res.error}</div>`;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch(err => {
|
|||
|
|
resultDiv.innerHTML = `<div class="alert alert-danger"><i class="bi bi-x-circle"></i> 请求失败: ${err}</div>`;
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|