coder/ai-chat-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 大模型配置添加思考模式和视觉能力属性

Browse Source 
- 数据库 llm_configs 表新增 enable_thinking 和 enable_vision 字段
- 后台管理界面大模型列表显示思考模式/视觉能力状态
- 添加/编辑大模型配置支持设置这两个能力开关
- 前端配置API返回LLM能力信息
- 对话界面根据能力显示或隐藏深度思考按钮
- 对话界面根据能力显示或隐藏上传图片选项
- 不支持视觉能力时上传图片提示用户等待升级

enable_thinking: 控制深度思考功能可用性
enable_vision: 控制图片分析功能可用性
This commit is contained in:
hubian
2026-04-29 11:37:57 +08:00
parent d4b1f3dfff
commit c439842bb2
3 changed files with 258 additions and 1764 deletions
Download Patch File Download Diff File Expand all files Collapse all files

258
www/admin.js
View File

@@ -250,7 +250,6 @@ async function loadUsersPage(content) {
<td>
<div class="action-btns">
<button class="action-btn edit" onclick="showEditUserModal(${u.id})">编辑</button>
<button class="action-btn" style="background: #8b5cf6; color: white;" onclick="showUserConversations(${u.id}, '${u.username}')">查看对话</button>
<button class="action-btn" style="background: #f59e0b; color: white;" onclick="showResetPasswordModal(${u.id})">重置密码</button>
<button class="action-btn delete" onclick="deleteUser(${u.id})">删除</button>
</div>
@@ -397,150 +396,6 @@ async function deleteUser(id) {
loadPage('users');
}
// ==================== 查看用户对话记录 ====================
async function showUserConversations(userId, username) {
// 加载用户对话列表
const conversations = await fetchAPI(`/api/user/${userId}/conversations`);
const content = document.getElementById('mainContent');
content.innerHTML = `
<div class="content-header">
<h1 class="content-title">用户对话记录 - ${username}</h1>
<button class="add-btn" style="background: #718096;" onclick="loadPage('users')">返回用户列表</button>
</div>
<div class="stats-grid" style="grid-template-columns: repeat(3, 1fr);">
<div class="stat-card">
<div class="stat-icon">💬</div>
<div class="stat-value">${conversations.length}</div>
<div class="stat-label">对话总数</div>
</div>
<div class="stat-card">
<div class="stat-icon">🤖</div>
<div class="stat-value">${conversations.filter(c => c.agentId).length}</div>
<div class="stat-label">智能体对话</div>
</div>
<div class="stat-card">
<div class="stat-icon">📝</div>
<div class="stat-value">${conversations.reduce((sum, c) => sum + (c.messages?.length || 0), 0)}</div>
<div class="stat-label">消息总数</div>
</div>
</div>
<div class="data-table">
<table>
<thead>
<tr>
<th>ID</th>
<th>标题</th>
<th>智能体</th>
<th>消息数</th>
<th>创建时间</th>
<th>更新时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
${conversations.length === 0 ? '<tr><td colspan="7" style="text-align: center; color: #999;">暂无对话记录</td></tr>' :
conversations.map(conv => `
<tr>
<td>${conv.id}</td>
<td>${conv.title || '新对话'}</td>
<td>${conv.agentId ? getAgentName(conv.agentId) : '普通对话'}</td>
<td>${conv.messages?.length || 0}</td>
<td>${formatDate(conv.createdAt || conv.created_at)}</td>
<td>${formatDate(conv.updatedAt || conv.updated_at)}</td>
<td>
<div class="action-btns">
<button class="action-btn edit" onclick="showConversationMessages(${userId}, ${conv.id}, '${conv.title || '新对话'}')">查看详情</button>
<button class="action-btn delete" onclick="deleteUserConversation(${userId}, ${conv.id})">删除</button>
</div>
</td>
</tr>
`).join('')
}
</tbody>
</table>
</div>
`;
}
function getAgentName(agentId) {
const agent = agents.find(a => a.agent_id === agentId);
return agent ? `${agent.avatar} ${agent.name}` : agentId;
}
async function showConversationMessages(userId, convId, title) {
// 获取对话详情
const conv = await fetchAPI(`/api/user/${userId}/conversations/${convId}`);
const content = document.getElementById('mainContent');
const messages = conv.messages || [];
content.innerHTML = `
<div class="content-header">
<h1 class="content-title">对话详情 - ${title}</h1>
<button class="add-btn" style="background: #718096;" onclick="showUserConversations(${userId}, '用户')">返回对话列表</button>
</div>
<div style="background: white; padding: 16px; border-radius: 12px; margin-bottom: 16px;">
<div style="display: flex; gap: 16px; color: #718096;">
<span>💬 消息数: ${messages.length}</span>
<span>🤖 智能体: ${conv.agentId ? getAgentName(conv.agentId) : '普通对话'}</span>
<span>📅 创建: ${formatDate(conv.createdAt || conv.created_at)}</span>
</div>
</div>
<div class="data-table">
<table>
<thead>
<tr>
<th style="width: 60px;">序号</th>
<th style="width: 80px;">角色</th>
<th>内容</th>
<th style="width: 150px;">时间</th>
</tr>
</thead>
<tbody>
${messages.length === 0 ? '<tr><td colspan="4" style="text-align: center; color: #999;">暂无消息</td></tr>' :
messages.map((msg, idx) => `
<tr>
<td>${idx + 1}</td>
<td style="color: ${msg.role === 'user' ? '#3b82f6' : '#10b981'};">
${msg.role === 'user' ? '👤 用户' : '🤖 AI'}
</td>
<td style="max-width: 500px; white-space: pre-wrap; word-break: break-all;">
${escapeHtml(msg.content?.slice(0, 500) || '')}${msg.content?.length > 500 ? '...' : ''}
${msg.thinking ? `<div style="color: #f59e0b; margin-top: 8px; font-size: 12px;">💭 思考: ${escapeHtml(msg.thinking?.slice(0, 200) || '')}...</div>` : ''}
</td>
<td>${formatDate(msg.timestamp || msg.createdAt)}</td>
</tr>
`).join('')
}
</tbody>
</table>
</div>
`;
}
async function deleteUserConversation(userId, convId) {
if (!confirm('确定删除此对话？此操作不可恢复！')) return;
await fetchAPI(`/api/user/${userId}/conversations/${convId}`, 'DELETE');
showToast('删除成功');
showUserConversations(userId, '用户');
}
function escapeHtml(text) {
if (!text) return '';
const div = document.createElement('div');
div.textContent = text;
return div.innerHTML;
}
// ==================== 大模型配置页面 ====================
async function loadLLMPage(content) {
@@ -559,8 +414,9 @@ async function loadLLMPage(content) {
<th>名称</th>
<th>提供商</th>
<th>模型</th>
<th>思考模式</th>
<th>视觉能力</th>
<th>API URL</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
@@ -570,8 +426,9 @@ async function loadLLMPage(content) {
<td>${c.name} ${c.is_default ? '<span class="default-badge">默认</span>' : ''}</td>
<td>${c.provider}</td>
<td>${c.model}</td>
<td>${c.enable_thinking ? '✅ 支持' : '❌ 不支持'}</td>
<td>${c.enable_vision ? '✅ 支持' : '❌ 不支持'}</td>
<td style="max-width: 200px; overflow: hidden; text-overflow: ellipsis;">${c.api_url}</td>
<td>${c.is_active ? '✅ 启用' : '❌ 禁用'}</td>
<td>
<div class="action-btns">
<button class="action-btn edit" onclick="showEditLLMModal(${c.id})">编辑</button>
@@ -622,6 +479,18 @@ function showAddLLMModal() {
<label class="form-label">Temperature</label>
<input type="number" class="form-input" id="llmTemperature" value="0.7" step="0.1">
</div>
<div class="form-group">
<label style="display: flex; align-items: center; gap: 8px;">
<input type="checkbox" id="llmEnableThinking"> 支持思考模式（深度思考）
</label>
<span style="color: #999; font-size: 12px;">模型是否支持原生思考功能（如DeepSeek的think标签）</span>
</div>
<div class="form-group">
<label style="display: flex; align-items: center; gap: 8px;">
<input type="checkbox" id="llmEnableVision"> 支持视觉能力（图片分析）
</label>
<span style="color: #999; font-size: 12px;">模型是否支持图片输入和分析</span>
</div>
<button class="form-submit" onclick="saveLLM()">保存</button>
`);
}
@@ -664,6 +533,18 @@ function showEditLLMModal(id) {
<label class="form-label">Temperature</label>
<input type="number" class="form-input" id="llmTemperature" value="${config.temperature}" step="0.1">
</div>
<div class="form-group">
<label style="display: flex; align-items: center; gap: 8px;">
<input type="checkbox" id="llmEnableThinking" ${config.enable_thinking ? 'checked' : ''}> 支持思考模式（深度思考）
</label>
<span style="color: #999; font-size: 12px;">模型是否支持原生思考功能（如DeepSeek的think标签）</span>
</div>
<div class="form-group">
<label style="display: flex; align-items: center; gap: 8px;">
<input type="checkbox" id="llmEnableVision" ${config.enable_vision ? 'checked' : ''}> 支持视觉能力（图片分析）
</label>
<span style="color: #999; font-size: 12px;">模型是否支持图片输入和分析</span>
</div>
<button class="form-submit" onclick="updateLLM(${id})">保存</button>
`);
}
@@ -676,7 +557,9 @@ async function saveLLM() {
api_key: document.getElementById('llmApiKey').value,
model: document.getElementById('llmModel').value,
max_tokens: parseInt(document.getElementById('llmMaxTokens').value),
temperature: parseFloat(document.getElementById('llmTemperature').value)
temperature: parseFloat(document.getElementById('llmTemperature').value),
enable_thinking: document.getElementById('llmEnableThinking').checked ? 1 : 0,
enable_vision: document.getElementById('llmEnableVision').checked ? 1 : 0
};
if (!data.name || !data.api_url || !data.api_key || !data.model) {
@@ -698,7 +581,9 @@ async function updateLLM(id) {
api_key: document.getElementById('llmApiKey').value,
model: document.getElementById('llmModel').value,
max_tokens: parseInt(document.getElementById('llmMaxTokens').value),
temperature: parseFloat(document.getElementById('llmTemperature').value)
temperature: parseFloat(document.getElementById('llmTemperature').value),
enable_thinking: document.getElementById('llmEnableThinking').checked ? 1 : 0,
enable_vision: document.getElementById('llmEnableVision').checked ? 1 : 0
};
await fetchAPI(`/api/admin/llm/${id}`, 'PUT', data);
@@ -1355,26 +1240,6 @@ async function loadSystemPage(content) {
<input type="text" class="form-input" id="appVersion" value="${systemConfigs.app_version?.value || ''}">
</div>
<div class="form-group">
<label class="form-label">应用简介</label>
<input type="text" class="form-input" id="appDescription" value="${systemConfigs.app_description?.value || ''}" placeholder="如：提供智能对话、多种智能体服务">
</div>
<div class="form-group">
<label class="form-label">技术基础</label>
<input type="text" class="form-input" id="appTechnology" value="${systemConfigs.app_technology?.value || ''}" placeholder="如：智谱 GLM-4.5-Air 大模型">
</div>
<div class="form-group">
<label class="form-label">开发者</label>
<input type="text" class="form-input" id="appDeveloper" value="${systemConfigs.app_developer?.value || ''}" placeholder="如：OpenClaw Team">
</div>
<div class="form-group">
<label class="form-label">更新日期</label>
<input type="text" class="form-input" id="appUpdateDate" value="${systemConfigs.app_update_date?.value || ''}" placeholder="如：2026-04-27">
</div>
<h3 style="margin: 24px 0 16px; padding-top: 16px; border-top: 1px solid #e2e8f0;">游客使用限制</h3>
<div class="form-group">
@@ -1399,51 +1264,6 @@ async function loadSystemPage(content) {
<input type="text" class="form-input" id="adminPassword" value="${systemConfigs.admin_password?.value || ''}" placeholder="修改管理员密码">
</div>
<h3 style="margin: 24px 0 16px; padding-top: 16px; border-top: 1px solid #e2e8f0;">TTS语音配置</h3>
<div class="form-group">
<label class="form-label">TTS方案</label>
<select class="form-input" id="ttsProvider">
<option value="edge" ${systemConfigs.tts_provider?.value === 'edge' ? 'selected' : ''}>Edge TTS（免费）</option>
</select>
<span style="color: #999; font-size: 12px;">目前仅支持 Edge TTS，后续将添加更多方案</span>
</div>
<div class="form-group">
<label class="form-label">TTS语音</label>
<select class="form-input" id="ttsVoice">
<option value="zh-CN-XiaoxiaoNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaoxiaoNeural' ? 'selected' : ''}>晓晓（女声）</option>
<option value="zh-CN-YunxiNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-YunxiNeural' ? 'selected' : ''}>云希（男声）</option>
<option value="zh-CN-YunjianNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-YunjianNeural' ? 'selected' : ''}>云健（男声）</option>
<option value="zh-CN-XiaoyiNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaoyiNeural' ? 'selected' : ''}>晓伊（女声）</option>
<option value="zh-CN-YunfengNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-YunfengNeural' ? 'selected' : ''}>云枫（男声）</option>
<option value="zh-CN-XiaochenNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaochenNeural' ? 'selected' : ''}>晓辰（女声）</option>
<option value="zh-CN-XiaohanNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaohanNeural' ? 'selected' : ''}>晓涵（女声）</option>
<option value="zh-CN-XiaomengNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaomengNeural' ? 'selected' : ''}>晓梦（女声）</option>
<option value="zh-CN-XiaomoNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaomoNeural' ? 'selected' : ''}>晓墨（女声）</option>
<option value="zh-CN-XiaoruiNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaoruiNeural' ? 'selected' : ''}>晓睿（女声）</option>
<option value="zh-CN-XiaoshuangNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaoshuangNeural' ? 'selected' : ''}>晓双（女声）</option>
<option value="zh-CN-XiaoxuanNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaoxuanNeural' ? 'selected' : ''}>晓萱（女声）</option>
<option value="zh-CN-XiaoyanNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaoyanNeural' ? 'selected' : ''}>晓颜（女声）</option>
<option value="zh-CN-XiaoyouNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-XiaoyouNeural' ? 'selected' : ''}>晓悠（女声）</option>
<option value="zh-CN-YunyaNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-YunyaNeural' ? 'selected' : ''}>云雅（女声）</option>
<option value="zh-CN-YunyangNeural" ${systemConfigs.tts_voice?.value === 'zh-CN-YunyangNeural' ? 'selected' : ''}>云扬（男声）</option>
</select>
<span style="color: #999; font-size: 12px;">选择AI回复的朗读语音</span>
</div>
<h3 style="margin: 24px 0 16px; padding-top: 16px; border-top: 1px solid #e2e8f0;">链接配置</h3>
<div class="form-group">
<label class="form-label">隐私政策链接</label>
<input type="text" class="form-input" id="privacyPolicyUrl" value="${systemConfigs.privacy_policy_url?.value || ''}" placeholder="隐私政策页面URL">
</div>
<div class="form-group">
<label class="form-label">用户协议链接</label>
<input type="text" class="form-input" id="userAgreementUrl" value="${systemConfigs.user_agreement_url?.value || ''}" placeholder="用户协议页面URL">
</div>
<button class="form-submit" onclick="saveSystemConfig()">保存设置</button>
</div>
@@ -1459,18 +1279,10 @@ async function saveSystemConfig() {
const data = {
app_name: document.getElementById('appName').value,
app_version: document.getElementById('appVersion').value,
app_description: document.getElementById('appDescription').value,
app_technology: document.getElementById('appTechnology').value,
app_developer: document.getElementById('appDeveloper').value,
app_update_date: document.getElementById('appUpdateDate').value,
guest_chat_sessions: document.getElementById('guestChatSessions').value,
guest_chat_messages: document.getElementById('guestChatMessages').value,
guest_agent_messages: document.getElementById('guestAgentMessages').value,
admin_password: document.getElementById('adminPassword').value,
privacy_policy_url: document.getElementById('privacyPolicyUrl').value,
user_agreement_url: document.getElementById('userAgreementUrl').value,
tts_provider: document.getElementById('ttsProvider').value,
tts_voice: document.getElementById('ttsVoice').value,
admin_password: document.getElementById('adminPassword').value
};
await fetchAPI('/api/admin/system', 'POST', data);