You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
buffer_platform/app/static/ai_config.html

290 lines
18 KiB

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI模型配置 - 期货智析</title>
<link rel="stylesheet" href="/static/ai_config.css">
</head>
<body>
<div class="app-container">
<header class="top-nav">
<div class="nav-left">
<a href="/static/futures_analysis.html" class="back-link">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 12L6 8L10 4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
返回期货智析
</a>
<div class="page-title">
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="3" y="6" width="14" height="10" rx="2" stroke="currentColor" stroke-width="1.5"/>
<circle cx="8" cy="11" r="1.5" fill="currentColor"/>
<circle cx="12" cy="11" r="1.5" fill="currentColor"/>
<path d="M7 6V4C7 2.89543 7.89543 2 9 2H11C12.1046 2 13 2.89543 13 4V6" stroke="currentColor" stroke-width="1.5"/>
</svg>
<span>AI模型配置</span>
</div>
</div>
<div class="nav-right">
<a href="/" class="nav-icon-btn" title="返回首页">
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3 7.5L9 1.5L15 7.5V15C15 15.5523 14.5523 16 14 16H10V11H8V16H4C3.44772 16 3 15.5523 3 15V7.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</a>
</div>
</header>
<main class="main-content">
<div class="config-container">
<!-- 当前启用的AI -->
<div class="config-card active-ai-card" id="active-ai-card" style="display:none;">
<div class="card-header">
<h3>
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="9" cy="9" r="8" stroke="currentColor" stroke-width="1.5"/>
<path d="M5.5 9L7.5 11L12.5 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
当前启用
</h3>
</div>
<div class="active-ai-display">
<div class="active-ai-icon" id="active-ai-icon">
<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="4" y="8" width="18" height="12" rx="2" stroke="currentColor" stroke-width="1.5"/>
<circle cx="10" cy="14" r="1.5" fill="currentColor"/>
<circle cx="16" cy="14" r="1.5" fill="currentColor"/>
<path d="M9 8V6C9 4.89543 9.89543 4 11 4H15C16.1046 4 17 4.89543 17 6V8" stroke="currentColor" stroke-width="1.5"/>
</svg>
</div>
<div class="active-ai-info">
<div class="active-ai-name" id="active-ai-name">--</div>
<div class="active-ai-model" id="active-ai-model">--</div>
</div>
</div>
</div>
<!-- AI提供商选择 -->
<div class="config-card">
<div class="card-header">
<h3>
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4 12C2.34315 12 1 10.6569 1 9C1 7.51487 2.08333 6.28542 3.5 6.03687C4.10687 3.57091 6.33434 1.75 9 1.75C12.1756 1.75 14.75 4.32436 14.75 7.5C14.75 7.61229 14.7466 7.7238 14.7401 7.83428C16.0567 8.04571 17 9.20887 17 10.5C17 12.1569 15.6569 13.5 14 13.5H4Z" stroke="currentColor" stroke-width="1.5"/>
</svg>
AI提供商
</h3>
</div>
<div class="provider-grid" id="provider-grid">
<!-- 动态生成 -->
</div>
</div>
<!-- API配置 -->
<div class="config-card">
<div class="card-header">
<h3>
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="2" y="5" width="14" height="9" rx="2" stroke="currentColor" stroke-width="1.5"/>
<path d="M5 5V4C5 2.34315 6.34315 1 8 1H10C11.6569 1 13 2.34315 13 4V5" stroke="currentColor" stroke-width="1.5"/>
<circle cx="9" cy="9.5" r="1.5" fill="currentColor"/>
<path d="M9 11V12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
</svg>
API配置
</h3>
</div>
<div class="form-grid">
<div class="form-group">
<label>提供商</label>
<select id="api-provider" class="form-control">
<option value="openai">OpenAI</option>
<option value="anthropic">Anthropic Claude</option>
<option value="google">Google Gemini</option>
<option value="aliyun">阿里云通义千问</option>
<option value="aliyun_coding">阿里云通义灵码</option>
<option value="bailian">阿里百炼</option>
<option value="baidu">百度文心一言</option>
<option value="zhipu">智谱清言</option>
<option value="custom">自定义</option>
</select>
</div>
<div class="form-group">
<label>API Key</label>
<div class="input-with-toggle">
<input type="password" id="api-key" class="form-control" placeholder="sk-...">
<button type="button" class="toggle-visibility" onclick="toggleApiKeyVisibility()">
<svg class="eye-icon" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 9C1 9 4 3 9 3C14 3 17 9 17 9C17 9 14 15 9 15C4 15 1 9 1 9Z" stroke="currentColor" stroke-width="1.5"/>
<circle cx="9" cy="9" r="2.5" stroke="currentColor" stroke-width="1.5"/>
</svg>
</button>
</div>
</div>
<div class="form-group">
<label>API Base URL</label>
<input type="text" id="api-base" class="form-control" placeholder="https://api.openai.com/v1">
</div>
<div class="form-group">
<label>模型ID</label>
<select id="model-id" class="form-control">
<option value="gpt-4o">gpt-4o</option>
<option value="gpt-4-turbo">gpt-4-turbo</option>
<option value="gpt-3.5-turbo">gpt-3.5-turbo</option>
</select>
</div>
<div class="form-group">
<label>自定义模型</label>
<input type="text" id="custom-model" class="form-control" placeholder="输入自定义模型名称(留空使用上方选择)">
</div>
</div>
<div class="form-actions">
<button class="btn btn-secondary" onclick="testConnection()">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 2L2 6L6 10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 2L14 6L10 10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M2 6H14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
</svg>
测试连接
</button>
<span id="test-result" class="test-result"></span>
</div>
</div>
<!-- 模型参数 -->
<div class="config-card">
<div class="card-header">
<h3>
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2 5H16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
<path d="M2 9H16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
<path d="M2 13H16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
<circle cx="6" cy="5" r="2" fill="currentColor"/>
<circle cx="12" cy="9" r="2" fill="currentColor"/>
<circle cx="8" cy="13" r="2" fill="currentColor"/>
</svg>
模型参数
</h3>
</div>
<div class="form-grid">
<div class="form-group">
<label>Temperature (创造力): <span id="temp-value">0.7</span></label>
<input type="range" id="temperature" class="form-range" min="0" max="2" step="0.1" value="0.7">
<div class="range-labels">
<span>精确</span>
<span>创造</span>
</div>
</div>
<div class="form-group">
<label>Max Tokens (最大输出)</label>
<input type="number" id="max-tokens" class="form-control" value="2000" min="100" max="8000">
</div>
</div>
</div>
<!-- 分析设置 -->
<div class="config-card">
<div class="card-header">
<h3>
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7" cy="7" r="5" stroke="currentColor" stroke-width="1.5"/>
<path d="M10.5 10.5L15 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
</svg>
分析设置
</h3>
</div>
<div class="settings-list">
<div class="setting-item">
<div class="setting-info">
<span class="setting-name">技术分析</span>
<span class="setting-desc">基于K线和技术指标进行分析</span>
</div>
<label class="switch">
<input type="checkbox" id="enable-technical" checked>
<span class="slider"></span>
</label>
</div>
<div class="setting-item">
<div class="setting-info">
<span class="setting-name">基本面分析</span>
<span class="setting-desc">结合宏观经济和行业数据</span>
</div>
<label class="switch">
<input type="checkbox" id="enable-fundamental">
<span class="slider"></span>
</label>
</div>
<div class="setting-item">
<div class="setting-info">
<span class="setting-name">情绪分析</span>
<span class="setting-desc">分析市场情绪和新闻舆情</span>
</div>
<label class="switch">
<input type="checkbox" id="enable-sentiment">
<span class="slider"></span>
</label>
</div>
<div class="form-group">
<label>风险偏好</label>
<select id="risk-tolerance" class="form-control">
<option value="conservative">保守型</option>
<option value="medium" selected>平衡型</option>
<option value="aggressive">激进型</option>
</select>
</div>
<div class="form-group">
<label>最大仓位比例 (%)</label>
<input type="number" id="max-position" class="form-control" value="10" min="1" max="100">
</div>
</div>
</div>
<!-- 已保存的模型 -->
<div class="config-card">
<div class="card-header">
<h3>
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<ellipse cx="9" cy="4" rx="7" ry="2.5" stroke="currentColor" stroke-width="1.5"/>
<path d="M2 4V7C2 8.65685 5.13401 10 9 10C12.866 10 16 8.65685 16 7V4" stroke="currentColor" stroke-width="1.5"/>
<path d="M2 7V10C2 11.6569 5.13401 13 9 13C12.866 13 16 11.6569 16 10V7" stroke="currentColor" stroke-width="1.5"/>
<path d="M2 10V13C2 14.6569 5.13401 16 9 16C12.866 16 16 14.6569 16 13V10" stroke="currentColor" stroke-width="1.5"/>
</svg>
已保存的模型
</h3>
<button class="btn btn-primary btn-sm" onclick="addNewModel()">
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7 1V13" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
<path d="M1 7H13" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
</svg>
添加模型
</button>
</div>
<div class="models-list" id="models-list">
<!-- 动态生成 -->
</div>
</div>
<!-- 保存按钮 -->
<div class="save-actions">
<button class="btn btn-primary btn-lg" onclick="saveConfig()">
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.5 16H3.5C2.67157 16 2 15.3284 2 14.5V3.5C2 2.67157 2.67157 2 3.5 2H11.5L16 6.5V14.5C16 15.3284 15.3284 16 14.5 16Z" stroke="currentColor" stroke-width="1.5"/>
<path d="M11 16V11H7V16" stroke="currentColor" stroke-width="1.5"/>
<path d="M2 2H11V7H2V2Z" stroke="currentColor" stroke-width="1.5"/>
</svg>
保存配置
</button>
<button class="btn btn-secondary btn-lg" onclick="loadConfig()">
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1V5H5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M3.51 8.99C3.90192 10.279 4.64537 11.4272 5.65284 12.2985C6.6603 13.1698 7.88941 13.7278 9.19961 13.9085C10.5098 14.0892 11.8475 13.8851 13.0663 13.3185C14.2852 12.7518 15.3381 11.8446 16.1054 10.6995C16.8727 9.55439 17.3233 8.21691 17.4085 6.83162C17.4938 5.44634 17.2104 4.06538 16.5907 2.84419C15.9711 1.62299 15.0404 0.61021 13.8981 0.913653C12.7558 1.2171 11.8753 2.29247 11.5 3.5L1 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
重新加载
</button>
</div>
</div>
</main>
</div>
<script src="/static/ai_config.js"></script>
</body>
</html>