1
This commit is contained in:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user