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

更新外观模块

Browse Source
This commit is contained in:
super
2026-05-06 22:41:26 +08:00
parent c3810fdb7b
commit b746812e23
67 changed files with 13159 additions and 39501 deletions
Download Patch File Download Diff File Expand all files Collapse all files

203
frontend-vue/src/pages/brand/components/BrandSimilarAsinTab.vue
View File

@@ -18,15 +18,30 @@
</div>
<div class="prompt-card">
<div class="section-title">AI 提示词</div>
<textarea v-model="aiPrompt" class="prompt-input" rows="8" placeholder="可选，留空时使用下方默认提示词" />
<div class="prompt-default-label">留空时默认使用以下提示词</div>
<div class="prompt-preview">{{ defaultAiPrompt }}</div>
</div>
<div class="secret-card">
<div class="section-title">密钥</div>
<input v-model="cozeApiKey" class="secret-input" type="password" autocomplete="off" spellcheck="false" />
<div class="section-title">筛选条件</div>
<textarea v-model="filterConditionInput" class="prompt-input" rows="4" placeholder="请输入筛选条件" />
<div class="condition-actions">
<button type="button" class="opt-btn" :disabled="savingCondition" @click="saveFilterCondition">
{{ savingCondition ? '保存中...' : '保存' }}
</button>
</div>
<div class="section-title condition-list-title">备选区</div>
<div v-if="!filterConditions.length" class="empty-conditions">暂无筛选条件，输入后保存即可加入备选区</div>
<ul v-else class="condition-list">
<li v-for="condition in filterConditions" :key="condition.id" class="condition-item">
<label class="condition-check">
<input
v-model="selectedFilterConditionId"
type="radio"
name="similar-asin-filter-condition"
:value="condition.id"
@change="applySelectedFilterCondition(condition)"
/>
<span :title="condition.conditionText">{{ condition.conditionText }}</span>
</label>
<button type="button" class="link-danger" @click="removeFilterCondition(condition.id)">删除</button>
</li>
</ul>
</div>
<div class="run-row">
@@ -47,7 +62,7 @@
</aside>
<section class="right-panel">
<div class="panel-header">相似ASIN检测</div>
<div class="panel-header">货源查询</div>
<div class="task-list-wrap">
<div class="clean-result-summary">
<div class="summary-card">
@@ -93,7 +108,7 @@
<ul v-else class="task-list clean-result-list">
<li v-for="item in currentItems" :key="`cur-${item.taskId}`" class="task-item">
<div class="left">
<span class="id">{{ item.sourceFilename || '相似ASIN检测' }}</span>
<span class="id">{{ item.sourceFilename || '货源查询' }}</span>
<div class="files">任务 ID：{{ item.taskId }}</div>
<div class="files">行数：{{ item.rowCount ?? '-' }}</div>
</div>
@@ -113,7 +128,7 @@
<ul v-else class="task-list clean-result-list">
<li v-for="item in historyOnlyItems" :key="`his-${item.resultId}-${item.taskId}`" class="task-item">
<div class="left">
<span class="id">{{ item.sourceFilename || '相似ASIN检测' }}</span>
<span class="id">{{ item.sourceFilename || '货源查询' }}</span>
<div class="files">任务 ID：{{ item.taskId ?? '-' }}</div>
<div v-if="item.resultFilename" class="files">
{{ item.resultFilename || '下载结果' }}
@@ -153,13 +168,17 @@ import { ElMessage } from 'element-plus'
import BrandTopBar from '@/pages/brand/components/BrandTopBar.vue'
import {
activateSimilarAsinTask,
addSimilarAsinFilterCondition,
deleteSimilarAsinFilterCondition,
deleteSimilarAsinHistory,
deleteSimilarAsinTask,
getSimilarAsinDashboard,
getSimilarAsinHistory,
getSimilarAsinResultDownloadUrl,
getSimilarAsinTaskProgressBatch,
listSimilarAsinFilterConditions,
parseSimilarAsin,
type SimilarAsinFilterConditionVo,
type SimilarAsinParsedGroup,
type SimilarAsinDashboardVo,
type SimilarAsinHistoryItem,
@@ -171,6 +190,7 @@ import {
import { expandBrandFolderRecursive, type BrandExpandFolderItem } from '@/shared/api/brand'
import { getPywebviewApi } from '@/shared/bridges/pywebview'
import { getTaskPollIntervalMs } from '@/shared/task-progress-config'
import { getStoredApiSecret } from '@/shared/utils/api-secret-store'
import { createCategorizedTimers } from '@/shared/utils/categorized-timers'
const selectedFileNames = ref<string[]>([])
@@ -179,14 +199,12 @@ const parseResult = ref<SimilarAsinParseVo | null>(null)
const parsedGroups = ref<SimilarAsinParsedGroup[]>([])
type TaskSummary = Pick<SimilarAsinParseVo, 'taskId' | 'totalRows' | 'acceptedRows' | 'groupCount' | 'droppedRows'>
const queuedTaskSummary = ref<TaskSummary | null>(null)
const defaultAiPrompt = `1. 图案与形象限制：不含各国国旗及类似图案，无各国领导人画像；不含圣诞老人形象；排除迪士尼、漫威、三丽鸥等所有指定动漫IP的图案与关联物品，且不涉及知名油画作品图案。
2. 品类排除：非图书、刀具、服装；不含药品、带容器的粉末及液体；与吸烟行为无关，无医疗标志。
3. 功能与配件要求：不可充电且不带电池，无磁吸功能；配件多的情况下需完全匹配。
4. 规格与外观限制：不含体积大的家具类物品（如椅子、桌子、大镜子、柜子）；不带任何品牌logo；无多种款式可选。`
const aiPrompt = ref('')
const cozeApiKey = ref('')
const filterConditionInput = ref('')
const filterConditions = ref<SimilarAsinFilterConditionVo[]>([])
const selectedFilterConditionId = ref<number | null>(null)
const parsing = ref(false)
const pushing = ref(false)
const savingCondition = ref(false)
const queuePayloadText = ref('')
const pollingTaskIds = ref<number[]>([])
const pendingFileTaskIds = ref<number[]>([])
@@ -206,11 +224,7 @@ const dashboard = ref<SimilarAsinDashboardVo>({
})
const historyItems = ref<SimilarAsinHistoryItem[]>([])
const parsedRows = computed<SimilarAsinParsedRow[]>(() =>
parseResult.value?.items?.length
? parseResult.value.items
: parsedGroups.value.flatMap((group) => group.items || []),
)
const parsedRows = computed<SimilarAsinParsedRow[]>(() => parseResult.value?.items || [])
const previewRows = computed(() => parsedRows.value)
const visibleTaskSummary = computed(() => parseResult.value || queuedTaskSummary.value)
const currentItems = computed(() => historyItems.value.filter((i) => i.taskId != null && pollingTaskIds.value.includes(i.taskId)))
@@ -221,12 +235,18 @@ const historyOnlyItems = computed(() =>
}),
)
function effectiveAiPrompt() {
return aiPrompt.value.trim() || defaultAiPrompt
function selectedFilterConditionText() {
const selectedId = selectedFilterConditionId.value
if (selectedId == null) return ''
return filterConditions.value.find((item) => item.id === selectedId)?.conditionText?.trim() || ''
}
function effectiveFilterCondition() {
return filterConditionInput.value.trim() || selectedFilterConditionText()
}
function effectiveCozeApiKey() {
return cozeApiKey.value.trim()
return getStoredApiSecret('similar-asin').trim()
}
function maskSecret(secret: string) {
@@ -347,13 +367,64 @@ async function selectFolder() {
}
}
async function loadFilterConditions() {
try {
filterConditions.value = await listSimilarAsinFilterConditions()
const ids = new Set(filterConditions.value.map((item) => item.id))
if (selectedFilterConditionId.value != null && !ids.has(selectedFilterConditionId.value)) {
selectedFilterConditionId.value = null
}
} catch (e) {
ElMessage.error(e instanceof Error ? e.message : '加载筛选条件失败')
}
}
async function saveFilterCondition() {
const text = filterConditionInput.value.trim()
if (!text) {
ElMessage.warning('请输入筛选条件')
return
}
savingCondition.value = true
try {
const saved = await addSimilarAsinFilterCondition(text)
await loadFilterConditions()
if (saved?.id) selectedFilterConditionId.value = saved.id
ElMessage.success('筛选条件已保存')
} catch (e) {
ElMessage.error(e instanceof Error ? e.message : '保存筛选条件失败')
} finally {
savingCondition.value = false
}
}
function applySelectedFilterCondition(condition: SimilarAsinFilterConditionVo) {
filterConditionInput.value = condition.conditionText || ''
}
async function removeFilterCondition(id: number) {
try {
await deleteSimilarAsinFilterCondition(id)
if (selectedFilterConditionId.value === id) selectedFilterConditionId.value = null
await loadFilterConditions()
ElMessage.success('筛选条件已删除')
} catch (e) {
ElMessage.error(e instanceof Error ? e.message : '删除筛选条件失败')
}
}
async function parseFiles() {
if (!uploadedFiles.value.length) {
ElMessage.warning('请先选择 Excel')
return
}
const filterCondition = effectiveFilterCondition()
if (!filterCondition) {
ElMessage.warning('请输入筛选条件，或在备选区选择一个筛选条件')
return
}
if (!effectiveCozeApiKey()) {
ElMessage.warning('请先填写密钥')
ElMessage.warning('请先在左上角设置中填写货源查询密钥')
return
}
parsing.value = true
@@ -363,20 +434,10 @@ async function parseFiles() {
originalFilename: f.originalFilename,
relativePath: f.relativePath,
}))
const res = await parseSimilarAsin(files, effectiveAiPrompt(), effectiveCozeApiKey())
const res = await parseSimilarAsin(files, filterCondition, effectiveCozeApiKey())
parseResult.value = res
queuedTaskSummary.value = null
parsedGroups.value = res.items?.length
? [{
sourceFileKey: res.items[0]?.sourceFileKey,
sourceFilename: res.items[0]?.sourceFilename,
groupKey: `similar-asin:${res.taskId}`,
baseId: '',
displayId: res.items[0]?.displayId,
itemCount: res.items.length,
items: res.items,
}]
: []
parsedGroups.value = []
queuePayloadText.value = ''
ElMessage.success(`解析完成，共 ${res.acceptedRows} 条`)
} catch (e) {
@@ -390,7 +451,7 @@ async function pushToPythonQueue() {
const api = getPywebviewApi()
const currentParseResult = parseResult.value
const taskId = currentParseResult?.taskId
if (!taskId || !parsedRows.value.length) {
if (!taskId) {
ElMessage.warning('请先解析文件')
return
}
@@ -399,7 +460,7 @@ async function pushToPythonQueue() {
return
}
if (!effectiveCozeApiKey()) {
ElMessage.warning('请先填写密钥')
ElMessage.warning('请先在左上角设置中填写货源查询密钥')
return
}
pushing.value = true
@@ -409,41 +470,12 @@ async function pushToPythonQueue() {
ts: Date.now(),
data: {
taskId,
prompt: currentParseResult.aiPrompt || effectiveAiPrompt(),
prompt: currentParseResult.aiPrompt || effectiveFilterCondition(),
api_key: effectiveCozeApiKey(),
groups: parsedGroups.value.map((group) => ({
sourceFileKey: group.sourceFileKey || '',
sourceFilename: group.sourceFilename || '',
groupKey: group.groupKey || '',
baseId: group.baseId || '',
displayId: group.displayId || '',
items: (group.items || []).map((row) => ({
sourceFileKey: row.sourceFileKey || '',
sourceFilename: row.sourceFilename || '',
rowToken: row.rowToken || '',
groupKey: row.groupKey || '',
id: row.displayId,
asin: row.asin,
country: row.country,
price: row.price || '',
url: row.url || '',
title: row.title || '',
target_urls: [],
})),
})),
rows: parsedRows.value.map((row) => ({
sourceFileKey: row.sourceFileKey || '',
sourceFilename: row.sourceFilename || '',
rowToken: row.rowToken || '',
groupKey: row.groupKey || '',
id: row.displayId,
asin: row.asin,
country: row.country,
price: row.price || '',
url: row.url || '',
title: row.title || '',
target_urls: [],
})),
sourceFileCount: currentParseResult.sourceFileCount || 0,
totalRows: currentParseResult.totalRows || 0,
acceptedRows: currentParseResult.acceptedRows || 0,
groupCount: currentParseResult.groupCount || 0,
},
}
queuePayloadText.value = JSON.stringify(payloadForDisplay(payload), null, 2)
@@ -747,6 +779,7 @@ async function deleteTaskRecord(item: SimilarAsinHistoryItem) {
onMounted(async () => {
loadPollingIds()
await Promise.all([
loadFilterConditions().catch(() => undefined),
loadDashboard().catch(() => undefined),
loadHistory().catch(() => undefined),
])
@@ -779,12 +812,20 @@ onUnmounted(() => {
.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; }
.prompt-card, .secret-card { margin-bottom: 18px; }
.prompt-input { width: 100%; box-sizing: border-box; resize: vertical; min-height: 180px; padding: 10px 12px; border: 1px solid #333; border-radius: 8px; background: #202020; color: #d8d8d8; font-size: 12px; line-height: 1.6; outline: none; }
.secret-input { width: 100%; box-sizing: border-box; height: 38px; padding: 0 12px; border: 1px solid #333; border-radius: 8px; background: #202020; color: #d8d8d8; font-size: 12px; outline: none; }
.prompt-input:focus, .secret-input:focus { border-color: #3498db; }
.prompt-default-label { margin-top: 10px; color: #8d8d8d; font-size: 12px; }
.prompt-preview { margin-top: 10px; padding: 12px; border: 1px solid #2a2a2a; border-radius: 8px; background: #202020; color: #9ea7b3; font-size: 12px; line-height: 1.6; white-space: pre-wrap; }
.prompt-card { margin-bottom: 14px; }
.prompt-input { width: 100%; box-sizing: border-box; resize: vertical; min-height: 96px; max-height: 140px; padding: 8px 12px; border: 1px solid #333; border-radius: 8px; background: #202020; color: #d8d8d8; font-size: 12px; line-height: 1.5; outline: none; }
.prompt-input:focus { border-color: #3498db; }
.condition-actions { display: flex; justify-content: flex-end; margin-top: 8px; }
.condition-actions .opt-btn { padding: 6px 14px; }
.condition-list-title { margin-top: 10px; }
.empty-conditions { color: #666; font-size: 12px; padding: 10px 4px; }
.condition-list { list-style: none; margin: 0; padding: 0; max-height: 96px; overflow: auto; display: flex; flex-direction: column; gap: 6px; }
.condition-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px; border-bottom: 1px solid #303030; }
.condition-item:last-child { border-bottom: none; }
.condition-check { display: flex; align-items: center; gap: 8px; min-width: 0; color: #cfd6df; font-size: 12px; cursor: pointer; }
.condition-check input { width: 16px; height: 16px; margin: 0; flex: 0 0 auto; }
.condition-check span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.link-danger { border: none; background: transparent; color: #ff8f8f; cursor: pointer; font-size: 12px; padding: 2px 0; white-space: nowrap; }
.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; }