feat: merge print/export buttons into a single dropdown in WorkspaceToolbar

src/components/WorkspaceToolbar.test.ts

@@ -42,10 +42,25 @@ describe('WorkspaceToolbar', () => {
     expect(wrapper.get('button[data-testid="back"]').attributes('disabled')).toBeUndefined()
   })
 
-  it('disables print, export and clear when there are no lessons', () => {
+  it('disables the export menu toggle and clear button when there are no lessons', () => {
     const wrapper = mountToolbar(0)
-    expect(wrapper.get('button[data-testid="print"]').attributes('disabled')).toBeDefined()
-    expect(wrapper.get('button[data-testid="export"]').attributes('disabled')).toBeDefined()
+    expect(
+      wrapper.get('button[data-testid="export-menu-toggle"]').attributes('disabled'),
+    ).toBeDefined()
     expect(wrapper.get('button[data-testid="clear"]').attributes('disabled')).toBeDefined()
   })
+
+  it('emits print when the print menu item is clicked', async () => {
+    const wrapper = mountToolbar(3)
+    await wrapper.get('button[data-testid="export-menu-toggle"]').trigger('click')
+    await wrapper.get('button[data-testid="print"]').trigger('click')
+    expect(wrapper.emitted('print')).toHaveLength(1)
+  })
+
+  it('emits export when the export menu item is clicked', async () => {
+    const wrapper = mountToolbar(3)
+    await wrapper.get('button[data-testid="export-menu-toggle"]').trigger('click')
+    await wrapper.get('button[data-testid="export"]').trigger('click')
+    expect(wrapper.emitted('export')).toHaveLength(1)
+  })
 })

src/components/WorkspaceToolbar.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { SaveStatus } from '../composables/useTeachingBook'
+import ExportMenuButton from './ExportMenuButton.vue'
 import GenerateMenuButton from './GenerateMenuButton.vue'
 
 const props = defineProps<{
@@ -30,8 +31,7 @@ const saveStatusLabel: Record<SaveStatus, string> = {
   <header class="workspace-toolbar">
     <button type="button" data-testid="back" @click="$emit('back')">返回列表</button>
     <GenerateMenuButton @generate="$emit('generate')" @batch-generate="$emit('batchGenerate')" />
-    <button type="button" data-testid="print" :disabled="lessonCount === 0" @click="$emit('print')">打印整册</button>
-    <button type="button" data-testid="export" :disabled="lessonCount === 0" @click="$emit('export')">导出 MD</button>
+    <ExportMenuButton :disabled="lessonCount === 0" @print="$emit('print')" @export="$emit('export')" />
     <button type="button" data-testid="clear" :disabled="lessonCount === 0" @click="$emit('clear')">清空</button>
 
     <span class="workspace-toolbar-count">共 {{ lessonCount }} 课</span>

src/components/WorkspaceView.test.ts

@@ -204,6 +204,7 @@ describe('WorkspaceView', () => {
     const wrapper = mount(WorkspaceView, { props: { bookId: 'b1' } })
     await flushPromises()
 
+    await wrapper.get('[data-testid="export-menu-toggle"]').trigger('click')
     await wrapper.get('[data-testid="export"]').trigger('click')
     await flushPromises()