fix: 使用 NScrollbar 统一内容区滚动条

This commit is contained in:
GouJ
2026-09-01 16:44:30 +08:00
parent db8c176b55
commit 3fe1b3f5c3
17 changed files with 967 additions and 737 deletions
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { NAlert, NButton, NTable } from 'naive-ui'
import { NScrollbar, NAlert, NButton, NTable } from 'naive-ui'
import { computed } from 'vue'
import { Download } from '@lucide/vue'
import { downloadText } from '../../../lib/format'
@@ -42,7 +42,7 @@ function exportReceipt() {
{{ receipt.result.episodeCount }} · 完成 {{ receipt.result.completedEpisodes }} · 跳过
{{ receipt.result.skippedEpisodes }} · 失败 {{ receipt.result.failedEpisodes }}
</p>
<div class="table-scroll">
<NScrollbar x-scrollable class="table-scroll">
<NTable :single-line="false" class="project-table"
><thead>
<tr>
@@ -74,7 +74,7 @@ function exportReceipt() {
</tr>
</tbody></NTable
>
</div>
</NScrollbar>
</template>
<template v-else-if="receipt.kind === 'prompts'">
<p class="mt-4 text-sm">
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { NAlert, NButton, NCheckbox } from 'naive-ui'
import { NScrollbar, NAlert, NButton, NCheckbox } from 'naive-ui'
import { computed, onScopeDispose, ref, watch } from 'vue'
import { Download, ExternalLink, RefreshCw } from '@lucide/vue'
import { storyboardApi } from '../api'
@@ -183,7 +183,9 @@ function exportResult(kind: 'spec' | 'prompt') {
>{{ spec.subjects.length }} 个主体 · {{ spec.durationSeconds }} </span
><NButton @click="exportResult('spec')" text size="small"><Download :size="13" />导出规格</NButton>
</div>
<pre class="storyboard-json mt-3">{{ JSON.stringify(spec, null, 2) }}</pre>
<NScrollbar class="code-scroll mt-3" x-scrollable>
<pre class="storyboard-json">{{ JSON.stringify(spec, null, 2) }}</pre>
</NScrollbar>
</template>
</section>
<section class="border-t border-line pt-6">