super/crawler-plugin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新需求更新 同步更新

Browse Source
This commit is contained in:
supernijia
2026-08-06 01:11:54 +08:00
parent 9048bbb7f8
commit 28e7fce11c
112 changed files with 7739 additions and 637 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend-vue/src/pages/brand/components/BrandAppearancePatentTab.vue
+5 -3
View File
@@ -3,7 +3,7 @@
<BrandTopBar active="appearance-patent" />
<div class="main-content">
<aside class="left-panel">
<aside class="left-panel left-panel--with-template">
<div class="section-title">上传文件</div>
<div class="upload-zone">
<div class="hint">选择 Excel 后点击解析，后端会提取 id、ASIN、国家，并保留整数 id 与子数据的第一条。</div>
@@ -37,6 +37,7 @@
<div>总行数：{{ visibleTaskSummary.totalRows }}，有效：{{ visibleTaskSummary.acceptedRows }}，分组：{{ visibleTaskSummary.groupCount || 0 }}，过滤：{{ visibleTaskSummary.droppedRows }}</div>
</div>
<pre v-if="queuePayloadText" class="queue-payload">{{ queuePayloadText }}</pre>
<ModuleTemplateDownload module-code="appearance-patent" filename="外观专利检测 文档格式.xlsx" />
</aside>
<section class="right-panel">
@@ -139,6 +140,7 @@
import { computed, onMounted, onUnmounted, ref } from 'vue'
import { ElMessage } from 'element-plus'
import BrandTopBar from '@/pages/brand/components/BrandTopBar.vue'
import ModuleTemplateDownload from '@/shared/components/ModuleTemplateDownload.vue'
import {
activateAppearancePatentTask,
deleteAppearancePatentHistory,
@@ -767,17 +769,17 @@ function statusText(item: AppearancePatentHistoryItem) {
if (status === 'PENDING') return '已解析待推送'
if (isResultPreparing(item)) return '结果生成中'
if (isResultBuildFailed(item)) return '结果生成失败'
if (status === 'FAILED') return '失败'
if (hasDownloadableResult(item)) return '已完成'
if (status === 'SUCCESS' || item.success) return '已完成'
if (status === 'FAILED') return '失败'
return '等待中'
}
function statusClass(item: AppearancePatentHistoryItem) {
const status = normalizeTaskStatus(item)
if (status === 'RUNNING' || isResultPreparing(item)) return 'running'
if (hasDownloadableResult(item)) return 'success'
if (isResultBuildFailed(item) || status === 'FAILED') return 'failed'
if (hasDownloadableResult(item)) return 'success'
if (status === 'SUCCESS' || item.success) return 'success'
return 'pending'
}
frontend-vue/src/pages/brand/components/BrandCollectDataTab.vue
+63 -9
View File
@@ -3,7 +3,7 @@
<BrandTopBar active="collect-data" />
<div class="main-content">
<aside class="left-panel">
<aside class="left-panel left-panel--with-template">
<div class="section-title">上传文件</div>
<div class="upload-zone">
<div class="hint">选择需要采集的 Excel 文件或文件夹（默认根目录：采集前数据.xlsx），后续将按下方筛选条件交给 Python 端进行数据采集。</div>
@@ -112,6 +112,8 @@
<div class="queue-debug-line">{{ queuePushResult }}</div>
<pre v-if="queuePayloadText" class="queue-debug-payload">{{ queuePayloadText }}</pre>
</div>
<ModuleTemplateDownload module-code="collect-data" filename="数据采集 文档格式.xlsx" />
</aside>
<section class="right-panel">
@@ -151,6 +153,12 @@
<div class="files">行数：{{ item.rowCount ?? '-' }}</div>
<div class="files">总数据去重过滤：{{ item.dedupeFilteredCount ?? 0 }}</div>
<div class="files">不符合 ASIN 过滤：{{ item.invalidFilteredCount ?? 0 }}</div>
<div v-if="taskKeywordProgress(item)" class="files">{{ taskKeywordProgress(item) }}</div>
<div v-if="taskStageProgress(item)" class="files">{{ taskStageProgress(item) }}</div>
<div class="task-progress">
<div class="task-progress-meta"><span>任务进度</span><span>{{ taskProgressPercent(item) }}%</span></div>
<div class="task-progress-track"><div class="task-progress-fill" :style="{ width: `${taskProgressPercent(item)}%` }"></div></div>
</div>
</div>
<div class="task-right">
<span class="status running">{{ statusText(item) }}</span>
@@ -176,6 +184,10 @@
<div class="files">不符合 ASIN 过滤：{{ item.invalidFilteredCount ?? 0 }}</div>
<div v-if="item.resultFilename" class="files">{{ item.resultFilename }}</div>
<div v-if="item.error" class="files">错误：{{ item.error }}</div>
<div class="task-progress">
<div class="task-progress-meta"><span>任务进度</span><span>{{ taskProgressPercent(item) }}%</span></div>
<div class="task-progress-track"><div class="task-progress-fill" :style="{ width: `${taskProgressPercent(item)}%` }"></div></div>
</div>
</div>
<div class="task-right">
<span class="status" :class="statusClass(item)">{{ statusText(item) }}</span>
@@ -195,6 +207,7 @@
import { computed, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
import { ElMessage } from 'element-plus'
import BrandTopBar from '@/pages/brand/components/BrandTopBar.vue'
import ModuleTemplateDownload from '@/shared/components/ModuleTemplateDownload.vue'
import { expandBrandFolderRecursive, type BrandExpandFolderItem } from '@/shared/api/brand'
import { getPywebviewApi } from '@/shared/bridges/pywebview'
import { useTaskProgressLoop } from '@/shared/composables/useTaskProgressLoop'
@@ -210,6 +223,7 @@ import {
getCollectDataTaskProgressBatch,
deleteCollectDataTask,
deleteCollectDataHistory,
failCollectDataTask,
type CollectDataDashboardVo,
type CollectDataHistoryItem,
type CollectDataParseVo,
@@ -284,6 +298,10 @@ const progressLoop = useTaskProgressLoop<CollectDataTaskDetailVo>({
? { ...prev, task: { ...(prev.task || {}), ...(detail.task || {}) }, items: detail.items ?? prev.items }
: detail,
}
const latestItem = detail.items?.[0]
currentItems.value = currentItems.value.map((item) => item.taskId === taskId
? { ...item, ...(latestItem || {}), taskStatus: detail.task?.status ?? latestItem?.taskStatus ?? item.taskStatus }
: item)
},
onTerminal: async (taskId) => {
if (taskSnapshots.value[taskId]) {
@@ -451,9 +469,6 @@ async function submitCollect() {
})
lastParseVo.value = vo
lastTaskId.value = vo.taskId ?? null
if (vo.taskId) {
progressLoop.add(vo.taskId)
}
ElMessage.success(`提交成功：任务 ${vo.taskNo || vo.taskId}，落库 ${vo.acceptedRows ?? 0} 行`)
await Promise.all([loadDashboard(), loadHistory()])
} catch (error) {
@@ -474,8 +489,10 @@ async function pushToPythonQueue() {
return
}
pushing.value = true
let activated = false
try {
await activateCollectDataTask(lastTaskId.value)
activated = true
const payload = {
type: 'collect-data-run',
ts: Date.now(),
@@ -500,7 +517,15 @@ async function pushToPythonQueue() {
ElMessage.success('已推送到 Python 队列')
await loadDashboard()
} catch (error) {
if (activated && lastTaskId.value) {
try {
await failCollectDataTask(lastTaskId.value, error instanceof Error ? error.message : 'Python queue dispatch failed')
} catch {
/* 保留原始入队错误 */
}
}
ElMessage.error(error instanceof Error ? error.message : '推送失败')
await Promise.all([loadDashboard(), loadHistory()])
} finally {
pushing.value = false
}
@@ -540,6 +565,30 @@ function statusClass(item: CollectDataHistoryItem) {
return 'pending'
}
function taskProgressPercent(item: CollectDataHistoryItem) {
const value = Number(item.progressPercent)
if (Number.isFinite(value)) return Math.max(0, Math.min(100, Math.round(value)))
const status = normalizeTaskStatus(item)
return status === 'SUCCESS' || item.success ? 100 : 0
}
function taskStageProgress(item: CollectDataHistoryItem) {
if (item.collectStage === 'search') {
return `搜索页面：${item.searchCurrentPage ?? 0}/${item.searchTotalPages ?? '-'} 页`
}
if (item.collectStage === 'detail') {
return `商品详情采集：${item.detailProcessedAsins ?? 0}/${item.detailTotalAsins ?? 0} 个商品`
}
return ''
}
function taskKeywordProgress(item: CollectDataHistoryItem) {
const total = Number(item.totalRows)
if (!Number.isFinite(total) || total <= 0) return ''
const completed = Math.max(0, Number(item.processedRows) || 0)
return `关键词进度：第 ${Math.min(total, completed + 1)}/${total} 个`
}
function canDownload(item: CollectDataHistoryItem) {
const status = normalizeTaskStatus(item)
return Boolean(item.downloadUrl && (item.success || status === 'SUCCESS'))
@@ -573,15 +622,16 @@ async function loadHistory() {
try {
const vo = await getCollectDataHistory(50)
const items = vo.items || []
const running = items.filter((it) => {
const currentTasks = items.filter((it) => {
const s = (it.taskStatus || '').toUpperCase()
return s === 'PENDING' || s === 'RUNNING'
})
const running = currentTasks.filter((it) => (it.taskStatus || '').toUpperCase() === 'RUNNING')
historyItems.value = items.filter((it) => {
const s = (it.taskStatus || '').toUpperCase()
return s === 'SUCCESS' || s === 'FAILED'
})
// 历史接口里运行中的任务自动加入轮询；若返回里已没有该 taskId，则停掉对应轮询
// 仅轮询已入 Python 队列的 RUNNING 任务；PENDING 任务等待用户主动推送。
const seenTaskIds = new Set<number>()
for (const item of running) {
if (item.taskId) {
@@ -590,14 +640,14 @@ async function loadHistory() {
}
}
for (const taskId of [...progressLoop.taskIds.value]) {
const onScreen = items.some((it) => it.taskId === taskId)
const onScreen = running.some((it) => it.taskId === taskId)
if (!onScreen) {
progressLoop.remove(taskId)
}
}
// 合并：历史里 RUNNING/PENDING 的条目 + 轮询缓存里有快照但尚未在历史返回中的占位
const seen = new Set<number>(running.map((it) => it.taskId).filter((id): id is number => typeof id === 'number'))
const merged: CollectDataHistoryItem[] = [...running]
const seen = new Set<number>(currentTasks.map((it) => it.taskId).filter((id): id is number => typeof id === 'number'))
const merged: CollectDataHistoryItem[] = [...currentTasks]
for (const taskId of progressLoop.taskIds.value) {
if (seen.has(taskId)) continue
const detail = taskSnapshots.value[taskId]
@@ -746,6 +796,10 @@ onBeforeUnmount(() => {
.status.pending { background: rgba(149, 165, 166, .18); color: #bdc3c7; }
.download { padding: 6px 10px; color: #d6ecff; background: rgba(52, 152, 219, .18); }
.btn-delete { padding: 6px 10px; color: #ff8f8f; background: rgba(231, 76, 60, .12); }
.task-progress { margin-top: 8px; max-width: 520px; }
.task-progress-meta { display: flex; justify-content: space-between; color: #888; font-size: 11px; margin-bottom: 4px; }
.task-progress-track { height: 5px; border-radius: 3px; background: #333; overflow: hidden; }
.task-progress-fill { height: 100%; border-radius: inherit; background: #3498db; transition: width .25s ease; }
@media (max-width: 1100px) {
.main-content { flex-direction: column; height: auto; }
.left-panel { width: 100%; border-right: none; border-bottom: 1px solid #2a2a2a; }
frontend-vue/src/pages/brand/components/BrandDeleteBrandTab.vue
+4 -1
View File
@@ -3,7 +3,7 @@
<BrandTopBar active="delete-brand" />
<div class="main-content">
<aside class="left-panel">
<aside class="left-panel left-panel--with-template">
<div class="section-title">选择文件</div>
<div class="upload-zone">
<div class="hint">上传删除品牌 Excel；无论是直接上传文件还是上传文件夹批量导入，都会按每个 Excel 文件名作为店铺名。</div>
@@ -72,6 +72,8 @@
</div>
<pre v-if="queuePayloadText" class="queue-debug-payload">{{ queuePayloadText }}</pre>
</div>
<ModuleTemplateDownload module-code="delete-brand" filename="删除指定待售 文档格式.xlsx" />
</aside>
<section class="right-panel">
@@ -213,6 +215,7 @@
import { computed, onMounted, onUnmounted, ref } from 'vue'
import { ElMessage } from 'element-plus'
import BrandTopBar from './BrandTopBar.vue'
import ModuleTemplateDownload from '@/shared/components/ModuleTemplateDownload.vue'
import ZiniaoVersionSetting from '@/shared/components/ZiniaoVersionSetting.vue'
import { expandBrandFolderRecursive, type BrandExpandFolderItem } from '@/shared/api/brand'
import {
frontend-vue/src/pages/brand/components/BrandPriceTrackTab.vue
+34 -28
View File
@@ -3,7 +3,7 @@
<BrandTopBar active="pricing" />
<div class="main-content">
<aside class="left-panel">
<aside class="left-panel left-panel--with-template">
<!-- 运行模式 -->
<div class="section-title">跟价模式</div>
<div class="mode-zone">
@@ -55,37 +55,36 @@
</div>
</template>
<template v-if="statusModeEnabled">
<div class="price-track-shop-candidates">
<!-- 店铺输入和备选店铺在两种 ASIN 来源模式下都可用。 -->
<div class="section-title">店铺名称</div>
<div class="input-zone">
<div class="hint">输入店铺名后点「确认」加入下方备选区。可同时配合上方模式使用。</div>
<div class="input-row">
<el-input v-model="shopInput" clearable placeholder="请输入店铺名称" @keyup.enter="confirmAdd" />
<button type="button" class="opt-btn" :disabled="adding" @click="confirmAdd">
{{ adding ? '保存中…' : '确认' }}
</button>
</div>
</div>
<!-- 店铺输入 -->
<div class="section-title">店铺名称</div>
<div class="input-zone">
<div class="hint">输入店铺名后点「确认」加入下方备选区。可同时配合上方模式使用。</div>
<div class="input-row">
<el-input v-model="shopInput" clearable placeholder="请输入店铺名称" @keyup.enter="confirmAdd" />
<button type="button" class="opt-btn" :disabled="adding" @click="confirmAdd">
{{ adding ? '保存中…' : '确认' }}
</button>
<!-- 备选区域 -->
<div class="section-title">备选店铺</div>
<div v-if="!candidates.length" class="empty-candidates">暂无备选店铺，请先输入并确认</div>
<div v-else class="candidate-table-scroll">
<el-table :data="candidates" row-key="id" height="160" class="candidate-table"
@selection-change="onSelectionChange">
<el-table-column type="selection" width="42" />
<el-table-column prop="shopName" label="店铺名" min-width="120" show-overflow-tooltip />
<el-table-column label="操作" width="72" align="center">
<template #default="{ row }">
<button type="button" class="link-danger" @click="removeCandidate(row)">删除</button>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 备选区域 -->
<div class="section-title">备选店铺</div>
<div v-if="!candidates.length" class="empty-candidates">暂无备选店铺，请先输入并确认</div>
<div v-else class="candidate-table-scroll">
<el-table :data="candidates" row-key="id" height="160" class="candidate-table"
@selection-change="onSelectionChange">
<el-table-column type="selection" width="42" />
<el-table-column prop="shopName" label="店铺名" min-width="120" show-overflow-tooltip />
<el-table-column label="操作" width="72" align="center">
<template #default="{ row }">
<button type="button" class="link-danger" @click="removeCandidate(row)">删除</button>
</template>
</el-table-column>
</el-table>
</div>
</template>
<template v-if="!asinModeEnabled">
<!-- 国家顺序 -->
<div class="section-title">处理国家与顺序</div>
@@ -148,6 +147,8 @@
<div class="queue-debug-line">{{ queuePushResult }}</div>
<pre v-if="queuePayloadText" class="queue-debug-payload">{{ queuePayloadText }}</pre>
</div>
<ModuleTemplateDownload module-code="price-track" filename="指定ASIN跟价 文档格式.xlsx" />
</aside>
<section class="right-panel">
@@ -263,6 +264,7 @@
import { computed, onMounted, onUnmounted, ref } from 'vue'
import { ElMessage } from 'element-plus'
import BrandTopBar from '@/pages/brand/components/BrandTopBar.vue'
import ModuleTemplateDownload from '@/shared/components/ModuleTemplateDownload.vue'
import ZiniaoVersionSetting from '@/shared/components/ZiniaoVersionSetting.vue'
import { LISTING_FILTER_OPTIONS, type ListingFilterValue } from '@/pages/brand/components/listingFilters'
import { expandBrandFolderRecursive } from '@/shared/api/brand'
@@ -1761,6 +1763,10 @@ onUnmounted(() => {
border-right: 1px solid #2a2a2a;
}
.price-track-shop-candidates {
flex: 0 0 auto;
}
.right-panel {
flex: 1;
display: flex;
frontend-vue/src/pages/brand/components/BrandPublishTab.vue
+5 -1
View File
@@ -3,7 +3,7 @@
<BrandTopBar active="publish" />
<div class="main-content">
<aside class="left-panel">
<aside class="left-panel left-panel--with-template">
<div class="section-title">上传模块</div>
<div class="upload-zone">
<div class="hint">
@@ -86,6 +86,8 @@
<div class="section-title queue-status-title">任务状态</div>
<div>{{ queueMessage }}</div>
</div>
<ModuleTemplateDownload module-code="publish" filename="上架 文档格式.xlsx" />
</aside>
<section class="right-panel">
@@ -203,6 +205,7 @@ import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import BrandTopBar from './BrandTopBar.vue'
import ModuleTemplateDownload from '@/shared/components/ModuleTemplateDownload.vue'
import ZiniaoVersionSetting from '@/shared/components/ZiniaoVersionSetting.vue'
import { expandBrandFolderRecursive, type BrandExpandFolderItem } from '@/shared/api/brand'
import {
@@ -338,6 +341,7 @@ function applyTaskSnapshot(taskId: number, detail: PublishTaskDetailVo) {
}
}
// The backend advances processedRows when Python submits result chunks; heartbeat is liveness only.
const progressLoop = useTaskProgressLoop<PublishTaskDetailVo>({
scope: 'publish-tab',
storageKey: pollingStorageKey(),
frontend-vue/src/pages/brand/components/BrandSimilarAsinTab.vue
+421 -69
View File
@@ -3,7 +3,7 @@
<BrandTopBar active="similar-asin" />
<div class="main-content">
<aside class="left-panel">
<aside class="left-panel left-panel--with-template">
<div class="section-title">上传文件</div>
<div class="upload-zone">
<div class="hint">选择 Excel 后点击解析，后端会提取 id、ASIN、国家、价格，每一行都会独立送检。</div>
@@ -22,18 +22,25 @@
<label class="switch-row">
<span>
<strong>图片检测</strong>
<em>开启后请求 Coze 时携带 img_switch=true</em>
</span>
<input v-model="imgSwitch" type="checkbox" />
<i></i>
</label>
<label class="switch-row">
<span>
<strong>类目检测</strong>
</span>
<input v-model="categorySwitch" type="checkbox" />
<i></i>
</label>
</div>
<div class="run-row">
<button type="button" class="btn-run" :disabled="parsing || !uploadedFiles.length" @click="parseFiles">
{{ parsing ? '解析中...' : '解析并创建任务' }}
</button>
<button type="button" class="btn-run btn-queue" :disabled="pushing || !parseResult?.taskId" @click="pushToPythonQueue">
<button type="button" class="btn-run btn-queue" :disabled="pushing || !parseResult?.taskId"
@click="pushToPythonQueue">
{{ pushing ? '推送中...' : '推送到 Python 队列' }}
</button>
</div>
@@ -41,9 +48,11 @@
<div v-if="visibleTaskSummary" class="parse-card">
<div>任务 ID：{{ visibleTaskSummary.taskId }}</div>
<div>总行数：{{ visibleTaskSummary.totalRows }}，有效：{{ visibleTaskSummary.acceptedRows }}，过滤：{{ visibleTaskSummary.droppedRows }}</div>
<div>总行数：{{ visibleTaskSummary.totalRows }}，有效：{{ visibleTaskSummary.acceptedRows }}，过滤：{{
visibleTaskSummary.droppedRows }}</div>
</div>
<pre v-if="queuePayloadText" class="queue-payload">{{ queuePayloadText }}</pre>
<ModuleTemplateDownload module-code="similar-asin" filename="货源查询 文档格式.xlsx" />
</aside>
<section class="right-panel">
@@ -136,8 +145,10 @@
</div>
<div class="task-right">
<span class="status" :class="statusClass(item)">{{ statusText(item) }}</span>
<button v-if="canDownload(item)" type="button" class="download" @click="downloadResult(item)">下载</button>
<button v-if="item.resultId" type="button" class="btn-delete" @click="deleteTaskRecord(item)">删除</button>
<button v-if="canDownload(item)" type="button" class="download"
@click="downloadResult(item)">下载</button>
<button v-if="item.resultId" type="button" class="btn-delete"
@click="deleteTaskRecord(item)">删除</button>
</div>
</li>
</ul>
@@ -153,6 +164,7 @@
import { computed, onMounted, onUnmounted, ref } from 'vue'
import { ElMessage } from 'element-plus'
import BrandTopBar from '@/pages/brand/components/BrandTopBar.vue'
import ModuleTemplateDownload from '@/shared/components/ModuleTemplateDownload.vue'
import {
activateSimilarAsinTask,
deleteSimilarAsinHistory,
@@ -184,6 +196,7 @@ const queuedTaskSummary = ref<TaskSummary | null>(null)
const parsing = ref(false)
const pushing = ref(false)
const imgSwitch = ref(false)
const categorySwitch = ref(false)
const queuePayloadText = ref('')
const pollingTaskIds = ref<number[]>([])
const pendingFileTaskIds = ref<number[]>([])
@@ -291,9 +304,9 @@ function payloadForDisplay<T extends { data?: Record<string, unknown> }>(payload
...payload,
data: payload.data
? {
...payload.data,
api_key: maskSecret(String(payload.data.api_key || '')),
}
...payload.data,
api_key: maskSecret(String(payload.data.api_key || '')),
}
: payload.data,
}
}
@@ -416,8 +429,9 @@ async function parseFiles() {
originalFilename: f.originalFilename,
relativePath: f.relativePath,
}))
const res = await parseSimilarAsin(files, effectiveCozeApiKey(), imgSwitch.value)
const res = await parseSimilarAsin(files, effectiveCozeApiKey(), imgSwitch.value, categorySwitch.value)
parseResult.value = res
categorySwitch.value = Boolean(res.categorySwitch)
queuedTaskSummary.value = null
queuePayloadText.value = ''
ElMessage.success(`解析完成，共 ${res.acceptedRows} 条`)
@@ -962,65 +976,403 @@ onUnmounted(() => {
</script>
<style scoped>
.module-page { min-height: 100vh; background: #1a1a1a; }
.main-content { display: flex; height: calc(100vh - 56px); min-height: calc(100vh - 56px); }
.left-panel { width: 400px; background: #1e1e1e; padding: 20px; overflow-y: auto; border-right: 1px solid #2a2a2a; }
.right-panel { flex: 1; min-width: 0; background: #1a1a1a; display: flex; flex-direction: column; }
.section-title, .subsection-title { font-size: 13px; color: #bbb; margin-bottom: 10px; }
.upload-zone { border: 1px dashed #3a3a3a; border-radius: 10px; padding: 18px; background: #252525; margin-bottom: 18px; }
.condition-card { margin-bottom: 18px; padding: 14px 16px; border: 1px solid #2f3a34; border-radius: 10px; background: linear-gradient(135deg, #222a25, #202020); }
.switch-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; color: #d8e4dc; cursor: pointer; user-select: none; }
.switch-row span { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.switch-row strong { font-size: 13px; font-weight: 600; }
.switch-row em { color: #8d9a91; font-size: 12px; font-style: normal; line-height: 1.4; }
.switch-row input { position: absolute; opacity: 0; pointer-events: none; }
.switch-row i { position: relative; width: 46px; height: 24px; flex: 0 0 auto; border-radius: 999px; background: #3a3a3a; box-shadow: inset 0 0 0 1px #4b4b4b; transition: background .2s ease, box-shadow .2s ease; }
.switch-row i::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #c7c7c7; transition: transform .2s ease, background .2s ease; }
.switch-row input:checked + i { background: #27ae60; box-shadow: inset 0 0 0 1px #42d17a; }
.switch-row input:checked + i::after { transform: translateX(22px); background: #fff; }
.hint, .loading-msg, .files, .muted { color: #888; font-size: 12px; line-height: 1.5; }
.link { color: #6ea8fe; text-decoration: none; }
.link:hover { color: #9fc5ff; }
.btns, .run-row { display: flex; gap: 10px; flex-wrap: wrap; }
.opt-btn, .btn-run, .btn-delete, .download { border: none; cursor: pointer; border-radius: 7px; }
.opt-btn { padding: 8px 14px; color: #ccc; background: #2a2a2a; border: 1px solid #3a3a3a; }
.btn-run { padding: 10px 18px; color: #fff; background: #3498db; font-weight: 600; }
.btn-queue { background: #27ae60; }
.btn-run:disabled { opacity: .55; cursor: not-allowed; }
.selected-files { margin-top: 14px; color: #999; font-size: 12px; word-break: break-all; }
.selected-files span { display: block; margin: 4px 0; }
.parse-card, .queue-payload { margin-top: 14px; padding: 12px; border: 1px solid #2a2a2a; border-radius: 8px; background: #202020; color: #b8c1cc; font-size: 12px; }
.queue-payload { max-height: 220px; overflow: auto; color: #8fd3ff; white-space: pre-wrap; }
.panel-header { padding: 16px 20px; border-bottom: 1px solid #2a2a2a; font-size: 15px; font-weight: 600; color: #ddd; }
.task-list-wrap { flex: 1; padding: 16px 20px; overflow: auto; }
.clean-result-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.summary-card { padding: 14px 16px; border: 1px solid #2a2a2a; border-radius: 8px; background: #1e1e1e; }
.summary-card strong { display: block; margin-top: 8px; color: #eaf4ff; font-size: 22px; }
.summary-label { color: #8d8d8d; font-size: 12px; }
.result-list-wrap { border: 1px solid #2a2a2a; border-radius: 8px; background: #1e1e1e; min-height: 180px; margin: 0 0 16px; }
.result-list-header { display: flex; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid #2a2a2a; color: #ddd; font-size: 14px; }
.empty-tasks { color: #666; font-size: 13px; padding: 18px; text-align: center; }
.task-list { list-style: none; margin: 0; padding: 12px; }
.task-item { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid #2a2a2a; border-radius: 8px; margin-bottom: 8px; background: #222; }
.left { flex: 1; min-width: 0; }
.id { color: #e0e0e0; font-size: 13px; font-weight: 600; }
.task-right { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.status { padding: 4px 10px; border-radius: 6px; font-size: 12px; }
.status.success { background: rgba(46, 204, 113, .18); color: #2ecc71; }
.status.failed { background: rgba(231, 76, 60, .18); color: #ff6b6b; }
.status.running { background: rgba(52, 152, 219, .18); color: #3498db; }
.status.pending { background: rgba(149, 165, 166, .18); color: #bdc3c7; }
.result-hint { margin-top: 6px; color: #e0b96d; }
.file-progress { margin-top: 8px; max-width: 520px; }
.file-progress-meta { display: flex; justify-content: space-between; gap: 12px; color: #d8c278; font-size: 12px; }
.file-progress-track { margin-top: 5px; height: 8px; border-radius: 999px; overflow: hidden; background: #303030; border: 1px solid #3b3b3b; }
.file-progress-bar { height: 100%; border-radius: inherit; background: linear-gradient(90deg, #4aa3ff, #f0c75e); transition: width .25s ease; }
.file-progress-count { margin-top: 4px; color: #858585; font-size: 11px; }
.download { padding: 6px 10px; color: #d6ecff; background: rgba(52, 152, 219, .18); }
.btn-delete { padding: 6px 10px; color: #ff8f8f; background: rgba(231, 76, 60, .12); }
.module-page {
min-height: 100vh;
background: #1a1a1a;
}
.main-content {
display: flex;
height: calc(100vh - 56px);
min-height: calc(100vh - 56px);
}
.left-panel {
width: 400px;
background: #1e1e1e;
padding: 20px;
overflow-y: auto;
border-right: 1px solid #2a2a2a;
}
.right-panel {
flex: 1;
min-width: 0;
background: #1a1a1a;
display: flex;
flex-direction: column;
}
.section-title,
.subsection-title {
font-size: 13px;
color: #bbb;
margin-bottom: 10px;
}
.upload-zone {
border: 1px dashed #3a3a3a;
border-radius: 10px;
padding: 18px;
background: #252525;
margin-bottom: 18px;
}
.condition-card {
margin-bottom: 18px;
padding: 14px 16px;
border: 1px solid #2f3a34;
border-radius: 10px;
background: linear-gradient(135deg, #222a25, #202020);
}
.switch-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
color: #d8e4dc;
cursor: pointer;
user-select: none;
}
.switch-row span {
display: flex;
flex-direction: column;
gap: 4px;
min-width: 0;
}
.switch-row strong {
font-size: 13px;
font-weight: 600;
}
.switch-row em {
color: #8d9a91;
font-size: 12px;
font-style: normal;
line-height: 1.4;
}
.switch-row input {
position: absolute;
opacity: 0;
pointer-events: none;
}
.switch-row i {
position: relative;
width: 46px;
height: 24px;
flex: 0 0 auto;
border-radius: 999px;
background: #3a3a3a;
box-shadow: inset 0 0 0 1px #4b4b4b;
transition: background .2s ease, box-shadow .2s ease;
}
.switch-row i::after {
content: '';
position: absolute;
top: 3px;
left: 3px;
width: 18px;
height: 18px;
border-radius: 50%;
background: #c7c7c7;
transition: transform .2s ease, background .2s ease;
}
.switch-row input:checked+i {
background: #27ae60;
box-shadow: inset 0 0 0 1px #42d17a;
}
.switch-row input:checked+i::after {
transform: translateX(22px);
background: #fff;
}
.hint,
.loading-msg,
.files,
.muted {
color: #888;
font-size: 12px;
line-height: 1.5;
}
.link {
color: #6ea8fe;
text-decoration: none;
}
.link:hover {
color: #9fc5ff;
}
.btns,
.run-row {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.opt-btn,
.btn-run,
.btn-delete,
.download {
border: none;
cursor: pointer;
border-radius: 7px;
}
.opt-btn {
padding: 8px 14px;
color: #ccc;
background: #2a2a2a;
border: 1px solid #3a3a3a;
}
.btn-run {
padding: 10px 18px;
color: #fff;
background: #3498db;
font-weight: 600;
}
.btn-queue {
background: #27ae60;
}
.btn-run:disabled {
opacity: .55;
cursor: not-allowed;
}
.selected-files {
margin-top: 14px;
color: #999;
font-size: 12px;
word-break: break-all;
}
.selected-files span {
display: block;
margin: 4px 0;
}
.parse-card,
.queue-payload {
margin-top: 14px;
padding: 12px;
border: 1px solid #2a2a2a;
border-radius: 8px;
background: #202020;
color: #b8c1cc;
font-size: 12px;
}
.queue-payload {
max-height: 220px;
overflow: auto;
color: #8fd3ff;
white-space: pre-wrap;
}
.panel-header {
padding: 16px 20px;
border-bottom: 1px solid #2a2a2a;
font-size: 15px;
font-weight: 600;
color: #ddd;
}
.task-list-wrap {
flex: 1;
padding: 16px 20px;
overflow: auto;
}
.clean-result-summary {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 12px;
margin-bottom: 16px;
}
.summary-card {
padding: 14px 16px;
border: 1px solid #2a2a2a;
border-radius: 8px;
background: #1e1e1e;
}
.summary-card strong {
display: block;
margin-top: 8px;
color: #eaf4ff;
font-size: 22px;
}
.summary-label {
color: #8d8d8d;
font-size: 12px;
}
.result-list-wrap {
border: 1px solid #2a2a2a;
border-radius: 8px;
background: #1e1e1e;
min-height: 180px;
margin: 0 0 16px;
}
.result-list-header {
display: flex;
justify-content: space-between;
padding: 12px 16px;
border-bottom: 1px solid #2a2a2a;
color: #ddd;
font-size: 14px;
}
.empty-tasks {
color: #666;
font-size: 13px;
padding: 18px;
text-align: center;
}
.task-list {
list-style: none;
margin: 0;
padding: 12px;
}
.task-item {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
padding: 12px 14px;
border: 1px solid #2a2a2a;
border-radius: 8px;
margin-bottom: 8px;
background: #222;
}
.left {
flex: 1;
min-width: 0;
}
.id {
color: #e0e0e0;
font-size: 13px;
font-weight: 600;
}
.task-right {
display: flex;
gap: 8px;
align-items: center;
flex-wrap: wrap;
}
.status {
padding: 4px 10px;
border-radius: 6px;
font-size: 12px;
}
.status.success {
background: rgba(46, 204, 113, .18);
color: #2ecc71;
}
.status.failed {
background: rgba(231, 76, 60, .18);
color: #ff6b6b;
}
.status.running {
background: rgba(52, 152, 219, .18);
color: #3498db;
}
.status.pending {
background: rgba(149, 165, 166, .18);
color: #bdc3c7;
}
.result-hint {
margin-top: 6px;
color: #e0b96d;
}
.file-progress {
margin-top: 8px;
max-width: 520px;
}
.file-progress-meta {
display: flex;
justify-content: space-between;
gap: 12px;
color: #d8c278;
font-size: 12px;
}
.file-progress-track {
margin-top: 5px;
height: 8px;
border-radius: 999px;
overflow: hidden;
background: #303030;
border: 1px solid #3b3b3b;
}
.file-progress-bar {
height: 100%;
border-radius: inherit;
background: linear-gradient(90deg, #4aa3ff, #f0c75e);
transition: width .25s ease;
}
.file-progress-count {
margin-top: 4px;
color: #858585;
font-size: 11px;
}
.download {
padding: 6px 10px;
color: #d6ecff;
background: rgba(52, 152, 219, .18);
}
.btn-delete {
padding: 6px 10px;
color: #ff8f8f;
background: rgba(231, 76, 60, .12);
}
@media (max-width: 1100px) {
.main-content { flex-direction: column; height: auto; }
.left-panel { width: 100%; border-right: none; border-bottom: 1px solid #2a2a2a; }
.clean-result-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.main-content {
flex-direction: column;
height: auto;
}
.left-panel {
width: 100%;
border-right: none;
border-bottom: 1px solid #2a2a2a;
}
.clean-result-summary {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
</style>