diff --git a/src/pages/ChatPage.tsx b/src/pages/ChatPage.tsx
index 4d23e08..d86e8e8 100644
--- a/src/pages/ChatPage.tsx
+++ b/src/pages/ChatPage.tsx
@@ -1,5 +1,5 @@
import { useEffect, useRef, useState } from 'react';
-import { Button, Input, Space, Tag, App as AntApp, Popconfirm, Empty, Collapse, Switch, Drawer, Slider, InputNumber, Upload, Tooltip, Modal, Image as AntImage, Divider, Dropdown } from 'antd';
+import { Button, Input, Space, Tag, App as AntApp, Popconfirm, Empty, Collapse, Switch, Drawer, Slider, InputNumber, Upload, Tooltip, Modal, Image as AntImage, Divider, Dropdown, Select } from 'antd';
import { SettingOutlined, ApiOutlined, EditOutlined, DeleteOutlined, PaperClipOutlined, BookOutlined, ArrowUpOutlined, CloseOutlined, DownOutlined } from '@ant-design/icons';
import { useNavigate, useParams, useSearchParams } from 'react-router-dom';
import ReactMarkdown from 'react-markdown';
@@ -418,9 +418,15 @@ export default function ChatPage() {
label: modelName
}));
const activeModelValue = overrides.model || '';
- const activeModelOption = modelOptions.find((item) => item.value === activeModelValue);
const defaultModelLabel = allowedModels.length > 0 ? allowedModels.join(', ') : agentModel || '默认模型';
- const currentModelName = activeModelOption?.label || activeModelValue || defaultModelLabel;
+ const selectedModelKey = activeModelValue || '__default__';
+ const modelSelectOptions = [
+ {
+ value: '__default__',
+ label: `跟随默认 · ${defaultModelLabel}`
+ },
+ ...modelOptions
+ ];
return (
@@ -639,7 +645,7 @@ export default function ChatPage() {
-
+
setInput(e.target.value)}
@@ -653,73 +659,23 @@ export default function ChatPage() {
}}
className="chat-input-textarea"
disabled={sending}
- style={{ width: '100%' }}
/>
-
-
-
- setOverrides((o) => ({
- ...o,
- model: String(key) === '__default__' ? undefined : String(key)
- })),
- items: [
- {
- key: '__default__',
- label: `跟随默认 · ${defaultModelLabel}`
- },
- ...modelOptions.map((item) => ({
- key: item.value,
- label: `${item.label}`
- }))
- ]
- }}
- >
-
-
+
+
+ }
+ onChange={(value) =>
+ setOverrides((o) => ({
+ ...o,
+ model: value === '__default__' ? undefined : String(value)
+ }))
+ }
+ />
}
- style={{ width: 40, height: 40, flexShrink: 0 }}
+ icon={}
+ className="chat-send-button"
/>
) : (
}
disabled={!input.trim()}
- style={{ background: 'var(--color-brand)', border: 'none', width: 40, height: 40, flexShrink: 0 }}
+ className="chat-send-button chat-send-button-primary"
/>
)}
-
diff --git a/src/styles.css b/src/styles.css
index 4b35f30..c73bc38 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -561,6 +561,84 @@ body {
box-shadow: var(--shadow-focus);
}
+.chat-input-stack {
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+ width: 100%;
+}
+
+.chat-input-toolbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ padding-top: 8px;
+ border-top: 1px solid var(--color-border);
+}
+
+.chat-input-toolbar-left {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ flex: 1;
+ min-width: 0;
+}
+
+.chat-model-select {
+ min-width: 240px;
+ max-width: 320px;
+}
+
+.chat-model-select .ant-select-selector {
+ border: none !important;
+ box-shadow: none !important;
+ background: transparent !important;
+ padding: 0 24px 0 0 !important;
+}
+
+.chat-model-select .ant-select-selection-item {
+ color: var(--color-text);
+ font-weight: 500;
+ font-size: 13px;
+}
+
+.chat-model-select .ant-select-selection-placeholder {
+ color: var(--color-text-secondary);
+ font-size: 13px;
+}
+
+.chat-model-select-arrow {
+ font-size: 10px;
+ color: var(--color-text-tertiary);
+}
+
+.chat-send-button {
+ width: 40px;
+ height: 40px;
+ flex-shrink: 0;
+}
+
+.chat-send-button-primary {
+ background: var(--color-brand);
+ border: none;
+}
+
+.chat-stop-icon {
+ display: block;
+ width: 10px;
+ height: 10px;
+ background: currentColor;
+ border-radius: 2px;
+}
+
+.chat-disclaimer {
+ text-align: center;
+ font-size: 11px;
+ color: var(--color-text-tertiary);
+ margin-top: 8px;
+}
+
.agent-model-dropdown-trigger {
width: 100%;
min-height: 42px;