Files
teaching-design/src/components/WorkspaceToolbar.vue
2026-06-16 07:51:38 -06:00

50 lines
1.7 KiB
Vue

<script setup lang="ts">
import type { SaveStatus } from '../composables/useTeachingBook'
const props = defineProps<{
lessonCount: number
warningCount: number
saveStatus: SaveStatus
}>()
defineEmits<{
upload: []
print: []
export: []
clear: []
generate: []
batchGenerate: []
fixBroken: []
back: []
}>()
const saveStatusLabel: Record<SaveStatus, string> = {
idle: '',
saving: '保存中…',
saved: '已保存',
error: '保存失败',
}
</script>
<template>
<header class="workspace-toolbar">
<button type="button" data-testid="back" @click="$emit('back')">返回列表</button>
<button type="button" data-testid="upload" @click="$emit('upload')">导入教案</button>
<button type="button" data-testid="generate" @click="$emit('generate')">生成一篇</button>
<button type="button" data-testid="batch-generate" @click="$emit('batchGenerate')">批量生成</button>
<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>
<button type="button" data-testid="clear" :disabled="lessonCount === 0" @click="$emit('clear')">清空</button>
<span class="workspace-toolbar-count"> {{ lessonCount }} </span>
<template v-if="warningCount > 0">
<button type="button" data-testid="fix-broken" @click="$emit('fixBroken')">
修复 {{ warningCount }} 处提示
</button>
</template>
<span class="workspace-toolbar-status" :class="`workspace-toolbar-status--${saveStatus}`">
{{ saveStatusLabel[props.saveStatus] }}
</span>
</header>
</template>