youshang/erp_sb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(amazon):优化商标筛查面板状态指示器与进度逻辑

Browse Source 
- 将 SVG 图标替换为 PNG 图片以提升渲染性能
- 调整状态图标动画效果及连接线样式- 修改任务进度初始值以即时反映进行中状态
- 动态计算配置步骤总数并更新显示逻辑- 移除开发模式下的调试快捷键与相关日志- 微调 CSS 样式以改善界面布局与视觉效果
This commit is contained in:
zhangzijienbplus
2025-11-13 15:33:02 +08:00
parent 007799fb2a
commit dd23d9fe90
4 changed files with 28 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
electron-vue-template/public/icon/waiting.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 533 B

33
electron-vue-template/src/main/main.ts
View File

@@ -434,19 +434,6 @@ app.whenReady().then(() => {
createWindow();
createTray(mainWindow);
// 开发模式快捷键
if (isDev && mainWindow) {
mainWindow.webContents.on('before-input-event', (event, input) => {
if (input.control && input.shift && input.key.toLowerCase() === 'd') {
console.log('[开发模式] 手动跳过后端启动');
openAppIfNotOpened();
} else if (input.control && input.shift && input.key.toLowerCase() === 's') {
console.log('[开发模式] 手动启动后端服务');
startSpringBoot();
}
});
}
// 只有在不需要最小化启动时才显示 splash 窗口
if (!shouldMinimize) {
@@ -488,23 +475,9 @@ app.whenReady().then(() => {
splashWindow.once('ready-to-show', () => splashWindow?.show());
}
console.log('[启动流程] 准备启动 Spring Boot...');
// 开发模式：添加快捷键跳过后端启动
if (isDev) {
console.log('[开发模式] 按 Ctrl+Shift+D 跳过后端启动，直接进入应用');
console.log('[开发模式] 按 Ctrl+Shift+S 手动启动后端服务');
// 5秒后自动跳过，避免卡死
setTimeout(() => {
console.log('[开发模式] 自动跳过后端启动，直接进入应用');
openAppIfNotOpened();
}, 5000);
}
// setTimeout(() => {
// startSpringBoot();
// }, 200);
setTimeout(() => {
startSpringBoot();
}, 200);
app.on('activate', () => {
if (mainWindow && !mainWindow.isDestroyed()) {

66
electron-vue-template/src/renderer/components/amazon/AmazonDashboard.vue
View File

@@ -332,21 +332,8 @@ function handleExportData() {
<path d="M29.6574 18.3428L18.3438 29.6565" stroke="#FAAD14" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18.3438 18.3428L29.6574 29.6565" stroke="#FAAD14" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg v-else-if="(trademarkPanelRef?.taskProgress?.product?.current || 0) > 0" width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" class="status-indicator-icon spinning">
<path d="M8 4H40" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 44H40" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 4V16L21 26" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M36 44V29.5L27 21" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 44V30L18.5 23.5" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M36 4V16L29.5 23.5" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18 33H19" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M29.1484 32.6465L29.8555 33.3536" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M24 38H25" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg v-else width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" class="status-indicator-icon">
<circle cx="24" cy="24" r="20" stroke="#D9D9D9" stroke-width="2" stroke-linejoin="round"/>
<circle cx="24" cy="24" r="4" fill="#D9D9D9"/>
</svg>
<img v-else-if="(trademarkPanelRef?.taskProgress?.product?.current || 0) > 0" src="/icon/inProgress.png" width="24" height="24" class="status-indicator-icon spinning" alt="进行中" />
<img v-else src="/icon/waiting.png" width="24" height="24" class="status-indicator-icon" alt="等待中" />
</div>
<div class="status-connector"></div>
<!-- 任务2：品牌商标筛查 -->
@@ -365,21 +352,8 @@ function handleExportData() {
<path d="M29.6574 18.3428L18.3438 29.6565" stroke="#FAAD14" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18.3438 18.3428L29.6574 29.6565" stroke="#FAAD14" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg v-else-if="(trademarkPanelRef?.taskProgress?.brand?.current || 0) > 0" width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" class="status-indicator-icon spinning">
<path d="M8 4H40" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 44H40" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 4V16L21 26" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M36 44V29.5L27 21" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 44V30L18.5 23.5" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M36 4V16L29.5 23.5" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18 33H19" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M29.1484 32.6465L29.8555 33.3536" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M24 38H25" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg v-else width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" class="status-indicator-icon">
<circle cx="24" cy="24" r="20" stroke="#D9D9D9" stroke-width="2" stroke-linejoin="round"/>
<circle cx="24" cy="24" r="4" fill="#D9D9D9"/>
</svg>
<img v-else-if="(trademarkPanelRef?.taskProgress?.brand?.current || 0) > 0" src="/icon/inProgress.png" width="24" height="24" class="status-indicator-icon spinning" alt="进行中" />
<img v-else src="/icon/waiting.png" width="24" height="24" class="status-indicator-icon" alt="等待中" />
</div>
<div class="status-connector"></div>
<!-- 任务3：跟卖许可筛查 -->
@@ -398,22 +372,10 @@ function handleExportData() {
<path d="M29.6574 18.3428L18.3438 29.6565" stroke="#FAAD14" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18.3438 18.3428L29.6574 29.6565" stroke="#FAAD14" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg v-else-if="(trademarkPanelRef?.taskProgress?.platform?.current || 0) > 0" width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" class="status-indicator-icon spinning">
<path d="M8 4H40" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 44H40" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 4V16L21 26" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M36 44V29.5L27 21" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 44V30L18.5 23.5" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M36 4V16L29.5 23.5" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18 33H19" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M29.1484 32.6465L29.8555 33.3536" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M24 38H25" stroke="#1677FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg v-else width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" class="status-indicator-icon">
<circle cx="24" cy="24" r="20" stroke="#D9D9D9" stroke-width="2" stroke-linejoin="round"/>
<circle cx="24" cy="24" r="4" fill="#D9D9D9"/>
</svg>
<img v-else-if="(trademarkPanelRef?.taskProgress?.platform?.current || 0) > 0" src="/icon/inProgress.png" width="24" height="24" class="status-indicator-icon spinning" alt="进行中" />
<img v-else src="/icon/waiting.png" width="24" height="24" class="status-indicator-icon" alt="等待中" />
</div>
<div class="status-connector"></div>
</div>
<!-- 任务内容列 -->
@@ -1061,7 +1023,7 @@ function handleExportData() {
}
.status-item {
display: flex;
align-items: center;
align-items: flex-start;
justify-content: center;
width: 24px;
height: 24px;
@@ -1075,12 +1037,15 @@ function handleExportData() {
.status-indicator-icon.spinning {
animation: spin 1.5s linear infinite;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
.status-connector {
width: 2px;
flex: 1;
width: 1px;
height: 114px;
background: #e5e7eb;
margin: 6px 0;
min-height: 50px;
margin: 8px 0;
}
/* 任务内容列 */
@@ -1096,6 +1061,7 @@ function handleExportData() {
padding: 0;
padding-bottom: 16px;
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
min-height: 76px;
}
.task-item:first-child {
padding-top: 0;

15
electron-vue-template/src/renderer/components/amazon/TrademarkCheckPanel.vue
View File

@@ -94,16 +94,20 @@ const regionOptions = [
// 查询类型多选（默认全部勾选）
const queryTypes = ref<string[]>(['product', 'brand'])
// 计算已完成的配置步骤数
// 计算已完成的配置步骤数（不包括已隐藏的账号选择）
const completedSteps = computed(() => {
let count = 0
if (trademarkFileName.value) count++
if (selectedAccount.value) count++
if (region.value) count++
if (queryTypes.value.length > 0) count++
return count
})
// 计算总步骤数（动态）
const totalConfigSteps = computed(() => {
return 3 // 1.导入表格 2.选择地区 3.选择查询类型
})
const showTrialExpiredDialog = ref(false)
const trialExpiredType = ref<'device' | 'account' | 'both' | 'subscribe'>('account')
const showExcelExample = ref(false)
@@ -463,8 +467,9 @@ async function startTrademarkQuery() {
if (brandList.length > 0) {
const brandData = taskProgress.value.brand
brandData.total = brandList.length
brandData.current = 0
brandData.current = 1 // 立即显示进行中状态
brandData.completed = 0
isBrandTaskRealData.value = true // 立即标记为真实数据
// 生成任务ID并立即开始轮询
brandTaskId.value = `task_${Date.now()}`
@@ -490,7 +495,6 @@ async function startTrademarkQuery() {
brandData.total = brandResult.data.checked || brandResult.data.total || brandData.total
brandData.current = brandData.total
brandData.completed = brandResult.data.unregistered || 0
isBrandTaskRealData.value = true
await processBrandResult(brandResult)
} else {
throw new Error(brandResult.msg || '品牌筛查失败')
@@ -514,7 +518,6 @@ async function startTrademarkQuery() {
// 更新统计：显示过滤出的实际行数（而不是品牌数）
const brandData = taskProgress.value.brand
brandData.completed = filterResult.data.filteredRows.length
isBrandTaskRealData.value = true
// 将品牌筛查结果作为展示数据
const brandItems = filterResult.data.filteredRows.map((row: any) => ({
@@ -856,7 +859,7 @@ defineExpose({
<!-- 底部开始查询按钮 -->
<div class="bottom-action">
<div class="action-header">
<span class="step-indicator">{{ completedSteps }}/3</span>
<span class="step-indicator">{{ completedSteps }}/{{ totalConfigSteps }}</span>
<el-button v-if="!trademarkLoading" class="start-btn" type="primary" :disabled="!trademarkFileName || queryTypes.length === 0" @click="startTrademarkQuery">
开始筛查
</el-button>