This commit is contained in:
zhu
2026-05-06 14:04:05 +08:00
parent d78d70bde0
commit 40df507300
17 changed files with 691 additions and 163 deletions

View File

@@ -18,7 +18,9 @@ const selectedPlatform = computed(() =>
);
const isLoggedIn = computed(() => token.value !== null);
const isCrawling = computed(() => crawlState.value?.status === 'running');
const shouldShowCrawlProgress = computed(() =>
crawlState.value ? ['running', 'paused', 'completed', 'failed'].includes(crawlState.value.status) : false,
);
onMounted(async () => {
token.value = await getToken();
@@ -82,6 +84,11 @@ async function handleCancelCrawl() {
crawlState.value = response.data ?? null;
}
async function handleResumeCrawl() {
const response = await sendBackgroundMessage<CrawlTaskState>({ action: 'RESUME_CRAWL' });
crawlState.value = response.data ?? null;
}
async function refreshCrawlState() {
const response = await sendBackgroundMessage<CrawlTaskState | null>({ action: 'GET_CRAWL_STATE' });
@@ -162,17 +169,31 @@ function sendBackgroundMessage<T>(message: unknown): Promise<{ ok: boolean; data
</button>
</template>
<template v-else-if="isCrawling && crawlState">
<template v-else-if="shouldShowCrawlProgress && crawlState">
<section class="space-y-4">
<div class="flex items-center justify-between rounded-md bg-white px-3 py-2 shadow-sm">
<div>
<p class="text-sm font-medium text-slate-800">{{ crawlState.platformName }}</p>
<p class="text-xs text-slate-500">已运行 {{ formatElapsed(elapsedSeconds) }}</p>
<p class="text-xs text-slate-500">
{{ crawlState.status === 'paused' ? '已暂停' : '已运行 ' + formatElapsed(elapsedSeconds) }}
</p>
</div>
<button type="button" class="text-xs text-red-600 transition hover:text-red-700"
@click="handleCancelCrawl">
取消
</button>
<div class="flex items-center gap-2">
<button v-if="crawlState.status === 'paused'" type="button"
class="text-xs text-emerald-600 transition hover:text-emerald-700"
@click="handleResumeCrawl">
继续
</button>
<button type="button" class="text-xs text-red-600 transition hover:text-red-700"
@click="handleCancelCrawl">
取消
</button>
</div>
</div>
<div v-if="crawlState.status === 'paused' && crawlState.pause"
class="rounded-md border border-amber-200 bg-amber-50 px-3 py-2 text-sm text-amber-800">
{{ crawlState.pause.message }}
</div>
<ol class="space-y-3">
@@ -187,6 +208,8 @@ function sendBackgroundMessage<T>(message: unknown): Promise<{ ok: boolean; data
<span class="text-xs">{{ getStepText(step.status) }}</span>
</div>
<p v-if="step.message" class="mt-1 text-xs">{{ step.message }}</p>
<pre v-if="step.result !== undefined"
class="mt-2 max-h-32 overflow-auto rounded bg-slate-950 p-2 text-[11px] leading-4 text-slate-100">{{ JSON.stringify(step.result, null, 2) }}</pre>
</div>
</li>
</ol>