Browse Source

增加fallback 链功能的使用说明

pull/1/head
wanghanlin 3 months ago
parent
commit
b50401c381
  1. 48
      src/main/resources/static/components/ModelConfigManager.js

48
src/main/resources/static/components/ModelConfigManager.js

@ -172,7 +172,50 @@ export default {
<!-- F6: Fallback 链可视化(仅当有活跃配置时显示) -->
<div v-if="fallbackChains.length > 0" style="margin:12px 0;padding:12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;">
<div style="font-size:13px;font-weight:600;color:#1e40af;margin-bottom:8px;">🔗 Fallback 链(按优先级排列,主模型在顶部)</div>
<div style="display:flex;align-items:center;gap:8px;margin-bottom:8px;">
<span style="font-size:13px;font-weight:600;color:#1e40af;">🔗 Fallback 链(按优先级排列,主模型在顶部)</span>
<span class="help-tip" @click="showFallbackHelp = !showFallbackHelp"
style="cursor:help;font-size:12px;color:#3b82f6;background:#dbeafe;padding:2px 6px;border-radius:4px;">
❓ 什么是 Fallback 链?
</span>
</div>
<!-- Fallback 链帮助说明 -->
<div v-if="showFallbackHelp"
style="margin-bottom:12px;padding:12px;background:white;border:1px solid #93c5fd;border-radius:6px;font-size:12px;line-height:1.6;">
<div style="font-weight:600;color:#1e40af;margin-bottom:8px;">📖 Fallback 链使用说明</div>
<div style="color:#374151;">
<p><strong>什么是 Fallback 链?</strong></p>
<p>Fallback 链是一种<span style="color:#059669;font-weight:600;">高可用性机制</span>,当主模型出现故障时,系统会<span style="color:#059669;font-weight:600;">自动切换到备用模型</span>,保证服务不中断。</p>
<p style="margin-top:8px;"><strong>如何工作?</strong></p>
<ul style="margin:4px 0;padding-left:20px;">
<li>📌 <strong>主模型</strong>:优先级最高(数值最大)的配置,优先使用</li>
<li>🔄 <strong>自动切换</strong>:主模型连续失败 3 次后,自动切换到下一个备用模型</li>
<li>⏰ <strong>自动恢复</strong>:故障模型 5 分钟后自动恢复,重新加入 Fallback 链</li>
<li>💚 <strong>健康检查</strong>:系统每 5 分钟自动检测所有模型的健康状态</li>
</ul>
<p style="margin-top:8px;"><strong>如何配置?</strong></p>
<ul style="margin:4px 0;padding-left:20px;">
<li>✅ 勾选「设为活跃配置」启用模型</li>
<li>📊 调整「优先级」数值(数值越大,优先级越高)</li>
<li>🔀 拖拽列表项可快速调整顺序</li>
<li>🟢🟡🔴 查看健康状态指示灯(绿=在线,黄=未知,红=离线)</li>
</ul>
<p style="margin-top:8px;"><strong>典型场景:</strong></p>
<ul style="margin:4px 0;padding-left:20px;">
<li>🎯 <strong>API 限流</strong>:主模型触发限流 → 自动切换到备用模型</li>
<li>🚨 <strong>服务故障</strong>:提供商宕机 → 自动接管备用模型</li>
<li>⚡ <strong>性能优化</strong>:手动调整优先级,将响应更快的模型设为主模型</li>
</ul>
</div>
<div style="margin-top:8px;padding-top:8px;border-top:1px solid #e5e7eb;color:#6b7280;font-size:11px;">
💡 提示:至少配置 2 个同类型的模型才能启用 Fallback 链功能
</div>
</div>
<div v-for="chain in fallbackChains" :key="chain.appType" style="margin-bottom:8px;">
<div style="font-size:12px;color:#1e40af;font-weight:600;">{{ getAppTypeLabel(chain.appType) }}</div>
<div v-for="(item, idx) in chain.configs" :key="item.id"
@ -541,6 +584,7 @@ export default {
// F6: Fallback 链
const fallbackChains = ref([])
const showFallbackHelp = ref(false)
// F7: 导入导出
const showImportDialog = ref(false)
@ -1096,7 +1140,7 @@ export default {
// F5
selectedModelMeta, getModelMeta, onModelChange, formatTokens,
// F6
fallbackChains, onDragStart, onDrop, deactivateConfig,
fallbackChains, showFallbackHelp, onDragStart, onDrop, deactivateConfig,
// F7
showImportDialog, importPreview, importConflict, importResult,
onImportFileSelect, doImport, closeImportDialog, exportConfigs,

Loading…
Cancel
Save