feat: 实现会话配置与多轮上下文
- 新增 ConfigPanel 组件:TTS 开关、detail level、语言选择 - 新增 storage.ts:配置持久化到 localStorage - useVisionSession:连接后自动发送 config,维护最近 10 轮对话历史 - App:齿轮按钮展开配置面板,HD 角标,TTS 播放联动 ttsEnabled Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
55
frontend/src/components/ConfigPanel/index.tsx
Normal file
55
frontend/src/components/ConfigPanel/index.tsx
Normal file
@@ -0,0 +1,55 @@
|
||||
// ============================================================
|
||||
// ConfigPanel — 会话配置面板
|
||||
// 职责:TTS 开关、detail level 切换、语言选择
|
||||
// ============================================================
|
||||
|
||||
import type { SessionConfig } from "../../types";
|
||||
|
||||
interface ConfigPanelProps {
|
||||
config: SessionConfig;
|
||||
onUpdate: (partial: Partial<SessionConfig>) => void;
|
||||
onClose: () => void;
|
||||
}
|
||||
|
||||
export function ConfigPanel({ config, onUpdate, onClose }: ConfigPanelProps) {
|
||||
return (
|
||||
<div className="config-panel">
|
||||
<div className="config-panel__header">
|
||||
<span>设置</span>
|
||||
<button className="config-panel__close" onClick={onClose}>✕</button>
|
||||
</div>
|
||||
|
||||
<label className="config-row">
|
||||
<span>语音回答</span>
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={config.ttsEnabled}
|
||||
onChange={(e) => onUpdate({ ttsEnabled: e.target.checked })}
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label className="config-row">
|
||||
<span>图像精度</span>
|
||||
<select
|
||||
value={config.detailLevel}
|
||||
onChange={(e) => onUpdate({ detailLevel: e.target.value as "low" | "high" })}
|
||||
>
|
||||
<option value="low">低(省流量)</option>
|
||||
<option value="high">高(细节丰富)</option>
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<label className="config-row">
|
||||
<span>语言</span>
|
||||
<select
|
||||
value={config.language}
|
||||
onChange={(e) => onUpdate({ language: e.target.value })}
|
||||
>
|
||||
<option value="zh-CN">中文</option>
|
||||
<option value="en-US">English</option>
|
||||
<option value="ja-JP">日本語</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user