feat: 前台AI聊天模型列表只显示显示名称+能力,不再显示供应商
This commit is contained in:
1 parent
821438cfe4
commit
0c017d380c
2 files changed
+49
-23
No files matched your search
@@ -667,20 +667,38 @@
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 模型能力徽标(图像/视频) */
|
||||
/* 模型能力徽标(能力标签) */
|
||||
.model-cap-badge {
|
||||
margin-left: auto;
|
||||
flex-shrink: 0;
|
||||
font-size: 11px;
|
||||
line-height: 1;
|
||||
padding: 3px 7px;
|
||||
border-radius: 999px;
|
||||
background: linear-gradient(135deg, #6C63FF 0%, #8B7CFF 100%);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
background: rgba(108, 99, 255, 0.1);
|
||||
color: #6C63FF;
|
||||
border: 1px solid rgba(108, 99, 255, 0.25);
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
|
||||
.model-cap-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.model-display-name {
|
||||
font-weight: 500;
|
||||
color: var(--color-text-primary);
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.dropdown-item.danger {
|
||||
color: var(--color-error);
|
||||
}
|
||||
@@ -704,17 +722,13 @@
|
||||
.model-dropdown-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--space-sm);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.model-provider-tag {
|
||||
font-size: 10px;
|
||||
color: var(--color-text-tertiary);
|
||||
margin-left: auto;
|
||||
background: var(--color-bg-tertiary);
|
||||
padding: 1px 6px;
|
||||
border-radius: var(--radius-full);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.attach-dropdown-title {
|
||||
|
||||
@@ -466,6 +466,21 @@ const ChatPage: React.FC = () => {
|
||||
|
||||
// Selected model info(Auto 为按能力自动匹配平台默认模型)
|
||||
const AUTO_MODEL = { id: 'auto', name: 'Auto 自动', display_name: 'Auto 自动', status: 'free', provider_name: '按能力匹配', price_per_million_tokens: 0, capabilities: [] as string[] };
|
||||
|
||||
// 能力标签映射(用于模型选项列表展示)
|
||||
const CAPABILITY_LABELS: Record<string, string> = {
|
||||
text: '文本对话',
|
||||
thinking: '推理思考',
|
||||
vision: '视觉理解',
|
||||
tool: '工具调用',
|
||||
image: '图像生成',
|
||||
audio: '语音合成',
|
||||
asr: '语音识别',
|
||||
ocr: 'OCR识别',
|
||||
embedding: '嵌入向量',
|
||||
rerank: '重排序',
|
||||
video: '视频生成',
|
||||
};
|
||||
const selectedModel = selectedModelId === 'auto'
|
||||
? AUTO_MODEL
|
||||
: (chatModels.find(m => m.id === selectedModelId) || chatModels[0] || AUTO_MODEL);
|
||||
@@ -790,7 +805,7 @@ const ChatPage: React.FC = () => {
|
||||
trigger={
|
||||
<div className="model-selector">
|
||||
<IconModel />
|
||||
<span className="model-name">{selectedModel.name}</span>
|
||||
<span className="model-name">{selectedModel.display_name || selectedModel.name}</span>
|
||||
<span className="model-badge">{(selectedModel.status === 'free' || selectedModel.price_per_million_tokens === 0) ? '免费' : '付费'}</span>
|
||||
<IconChevronDown />
|
||||
</div>
|
||||
@@ -815,15 +830,12 @@ const ChatPage: React.FC = () => {
|
||||
onClick={() => setSelectedModelId(model.id)}
|
||||
>
|
||||
<div className="model-dropdown-item">
|
||||
<span>{model.name}</span>
|
||||
<span className="model-provider-tag">{model.provider_name || model.providerName || ''}</span>
|
||||
{(() => {
|
||||
const caps = model.capabilities || [];
|
||||
const label = caps.includes('image') && caps.includes('video') ? '图像/视频'
|
||||
: caps.includes('image') ? '图像'
|
||||
: caps.includes('video') ? '视频' : '';
|
||||
return label ? <span className="model-cap-badge">{label}</span> : null;
|
||||
})()}
|
||||
<span className="model-display-name">{model.display_name || model.name}</span>
|
||||
<span className="model-cap-list">
|
||||
{(model.capabilities || []).map((cap: string) => (
|
||||
<span key={cap} className="model-cap-badge">{CAPABILITY_LABELS[cap] || cap}</span>
|
||||
))}
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
))}
|
||||
@@ -845,7 +857,7 @@ const ChatPage: React.FC = () => {
|
||||
<IconEmpty />
|
||||
<p className="empty-title">开始一段新对话</p>
|
||||
<p className="empty-desc">
|
||||
向 {selectedModel.name} 发送消息,开始对话
|
||||
向 {selectedModel.display_name || selectedModel.name} 发送消息,开始对话
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
@@ -1007,7 +1019,7 @@ const ChatPage: React.FC = () => {
|
||||
<textarea
|
||||
ref={inputRef}
|
||||
className="chat-textarea"
|
||||
placeholder={`向 ${selectedModel.name} 发送消息...`}
|
||||
placeholder={`向 ${selectedModel.display_name || selectedModel.name} 发送消息...`}
|
||||
value={inputValue}
|
||||
onChange={(e) => setInputValue(e.target.value)}
|
||||
onKeyDown={handleKeyDown}
|
||||
|
||||
Reference in new issue
Block a user