优化讲解详情播放器体验

tests/unit/ExhibitDetailAudioFirst.spec.ts

@@ -16,7 +16,9 @@ const mocks = vi.hoisted(() => ({
   pause: vi.fn(),
   resume: vi.fn(),
   close: vi.fn(),
-  seekToPercent: vi.fn()
+  seekToPercent: vi.fn(),
+  cyclePlaybackRate: vi.fn(),
+  toggleMuted: vi.fn()
 }))
 
 const audioState = vi.hoisted(() => ({
@@ -26,7 +28,9 @@ const audioState = vi.hoisted(() => ({
   loading: { value: false },
   error: { value: '' },
   currentTime: { value: 0 },
-  duration: { value: 0 }
+  duration: { value: 0 },
+  playbackRate: { value: 1 },
+  muted: { value: false }
 }))
 
 vi.mock('@dcloudio/uni-app', () => ({
@@ -65,7 +69,9 @@ vi.mock('@/composables/useGlobalAudioPlayer', () => ({
     resume: mocks.resume,
     switchLanguage: vi.fn(),
     close: mocks.close,
-    seekToPercent: mocks.seekToPercent
+    seekToPercent: mocks.seekToPercent,
+    cyclePlaybackRate: mocks.cyclePlaybackRate,
+    toggleMuted: mocks.toggleMuted
   })
 }))
 
@@ -111,6 +117,8 @@ describe('讲解详情音频优先布局', () => {
     audioState.error.value = ''
     audioState.currentTime.value = 0
     audioState.duration.value = 0
+    audioState.playbackRate.value = 1
+    audioState.muted.value = false
     mocks.enterExplainDetail.mockResolvedValue(exhibit)
     mocks.selectExplainDetailLanguage.mockImplementation((source, lang) => ({
       ...source,
@@ -157,6 +165,9 @@ describe('讲解详情音频优先布局', () => {
     expect(wrapper.get('.detail-chip').text()).toBe('标准解说')
     expect(wrapper.find('.detail-audio-dock').exists()).toBe(true)
     expect(wrapper.get('.detail-audio-dock').classes()).toContain('is-playable')
+    expect(wrapper.get('.detail-audio-subtitle').text()).toBe('0:00 / 1:21')
+    expect(wrapper.get('.detail-audio-rate').text()).toBe('1.0')
+    expect(wrapper.find('.detail-audio-mute').exists()).toBe(true)
     expect(wrapper.find('.language-switch').text()).toContain('English')
     expect(wrapper.find('.detail-language-bar').exists()).toBe(true)
     expect(wrapper.find('.content .language-switch').exists()).toBe(false)
@@ -165,6 +176,20 @@ describe('讲解详情音频优先布局', () => {
     expect(wrapper.get('.section-text').text()).toContain('detailed English narration')
   })
 
+  it('正常音频底栏可切换播放速率和静音', async () => {
+    const wrapper = mount(ExhibitDetail, {
+      global: { stubs: { GuidePageFrame: GuidePageFrameStub } }
+    })
+
+    await mocks.onLoadHandler?.({ id: exhibit.id, lang: 'en-US', targetType: 'STOP', targetId: 'stop-1' })
+    await flushPromises()
+    await wrapper.get('.detail-audio-rate').trigger('tap')
+    await wrapper.get('.detail-audio-mute').trigger('tap')
+
+    expect(mocks.cyclePlaybackRate).toHaveBeenCalledTimes(1)
+    expect(mocks.toggleMuted).toHaveBeenCalledTimes(1)
+  })
+
   it('仅展示 stop-info 声明支持的语言按钮', async () => {
     mocks.enterExplainDetail.mockResolvedValue({
       ...exhibit,
@@ -276,7 +301,7 @@ describe('讲解详情音频优先布局', () => {
     expect(mocks.loadExplainDetailText).not.toHaveBeenCalled()
     expect(mocks.selectExplainDetailLanguage).toHaveBeenCalledWith(expect.any(Object), 'yue-HK')
     expect(wrapper.get('.section-text').text()).toContain('粤语通道使用普通话文案')
-    expect(wrapper.get('.detail-audio-subtitle').text()).toContain('粤语')
+    expect(wrapper.get('.detail-audio-subtitle').text()).toBe('0:00 / 1:23')
   })
 
   it('无音频时禁用播放按钮并显示原因', async () => {