feat: 结束视频后保留对话,支持继续文字聊天
- useVisionSession 新增 stopVideo 回调(停媒体流,保持连接和消息) - App.tsx 控制区从二态改为三态(initial/video/textOnly) - 文字对话态显示「重新开始视频」和「结束会话」按钮 - 新增 CSS 样式(video-ended-hint、btn--outline) - 新增 i18n key(stopVideo/endSession/resumeVideo/video.ended) - 新增设计方案文档
This commit is contained in:
@@ -80,6 +80,7 @@ function AppContent() {
|
||||
isObserving,
|
||||
startSession,
|
||||
stopSession,
|
||||
stopVideo,
|
||||
interrupt,
|
||||
isCameraOn,
|
||||
isMicOn,
|
||||
@@ -397,9 +398,9 @@ function AppContent() {
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
) : isCameraOn ? (
|
||||
<>
|
||||
{/* 通话态:核心控制工具栏 */}
|
||||
{/* 视频通话态:核心控制工具栏 */}
|
||||
<div className="video-controls__toolbar">
|
||||
<button
|
||||
className={`btn btn--ctrl ${isCameraOn ? "btn--ctrl-on" : "btn--ctrl-off"}`}
|
||||
@@ -430,8 +431,8 @@ function AppContent() {
|
||||
{tr("controls.interrupt")}
|
||||
</button>
|
||||
)}
|
||||
<button className="btn btn--danger" onClick={stopSession}>
|
||||
{tr("controls.stop")}
|
||||
<button className="btn btn--danger" onClick={stopVideo}>
|
||||
{tr("controls.stopVideo")}
|
||||
</button>
|
||||
</div>
|
||||
{/* 通话态模式切换 */}
|
||||
@@ -456,6 +457,24 @@ function AppContent() {
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{/* 文字对话态:视频已结束 */}
|
||||
<div className="video-controls__text-only">
|
||||
<div className="video-ended-hint">
|
||||
<span className="video-ended-hint__title">📹 {tr("video.ended")}</span>
|
||||
<span className="video-ended-hint__sub">{tr("video.ended.hint")}</span>
|
||||
</div>
|
||||
<div className="video-controls__toolbar">
|
||||
<button className="btn btn--primary" onClick={startSession}>
|
||||
{tr("controls.resumeVideo")}
|
||||
</button>
|
||||
<button className="btn btn--danger btn--outline" onClick={stopSession}>
|
||||
{tr("controls.endSession")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user