jocay
cc9048b799
- 手机上章节列表与工作区分两屏，点章节进入工作区，左上角返回 - 列表页顶部提供「继续下一章」与流程说明；工作区顶栏使用紧凑版控制按钮 - 在列表页启动写作后自动进入即将处理的章节 - 精简标签页文字、正文留白与版本信息，避免小屏截断 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
57 lines
2.3 KiB
Vue
57 lines
2.3 KiB
Vue
<script setup lang="ts">
|
||
/** 流水线控制：继续写作 / 停止 / 模式切换。compact 用于手机端顶栏，只保留主按钮 */
|
||
defineProps<{ compact?: boolean }>()
|
||
const store = useProjectStore()
|
||
const { project, running, runningLabel, connected } = store
|
||
|
||
const settings = computed(() => project.value!.settings)
|
||
const pendingChapter = computed(() => store.chapters.value.find(c => c.status === 'written'))
|
||
|
||
async function toggleAuto(v: boolean) {
|
||
await store.saveProject({ settings: { ...settings.value, autoMode: v } })
|
||
}
|
||
|
||
const starting = ref(false)
|
||
async function run() {
|
||
starting.value = true
|
||
try { await store.run() }
|
||
finally { starting.value = false }
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<div class="flex flex-wrap items-center gap-2">
|
||
<template v-if="!compact">
|
||
<UTooltip :text="connected ? '实时连接正常' : '实时连接断开，正在重连…'">
|
||
<span class="size-2 rounded-full" :class="connected ? 'bg-success' : 'bg-error animate-pulse'" />
|
||
</UTooltip>
|
||
<USwitch
|
||
:model-value="settings.autoMode"
|
||
label="自动模式"
|
||
:disabled="running"
|
||
size="sm"
|
||
@update:model-value="toggleAuto"
|
||
/>
|
||
</template>
|
||
<template v-if="running">
|
||
<UBadge v-if="!compact" color="warning" variant="subtle" icon="i-lucide-loader-circle" :ui="{ leadingIcon: 'animate-spin' }" class="max-w-56 truncate">
|
||
{{ runningLabel || '运行中' }}
|
||
</UBadge>
|
||
<UButton icon="i-lucide-square" label="停止" color="error" variant="soft" size="sm" @click="store.stop()" />
|
||
</template>
|
||
<UTooltip v-else :text="pendingChapter ? `第${pendingChapter.index}章待确认，请先在章节中确认` : (settings.autoMode ? `自动连续写作，最多 ${settings.autoChapterLimit} 章` : '主编写简报 → 作家写下一章，写完后暂停等你确认')">
|
||
<UButton
|
||
icon="i-lucide-play"
|
||
:label="settings.autoMode ? '开始自动写作' : '继续下一章'"
|
||
size="sm"
|
||
:loading="starting"
|
||
:disabled="!!pendingChapter && !settings.autoMode"
|
||
@click="run"
|
||
/>
|
||
</UTooltip>
|
||
<p v-if="!compact && !running && pendingChapter && !settings.autoMode" class="basis-full text-xs text-primary lg:hidden">
|
||
第{{ pendingChapter.index }}章已写完，点进去阅读并确认后才能继续
|
||
</p>
|
||
</div>
|
||
</template>
|