merge: feature/admin-ui-polish-dev into develop (local only, not pushed)
This commit is contained in:
@@ -214,12 +214,32 @@ const filteredGoods = computed(() => {
|
||||
return sorted
|
||||
})
|
||||
|
||||
/** 左树一族只显示一行:同款(同 familyId)多条配置保留代表行(排序最前),
|
||||
* 其余配置计数挂在 configCount,悬浮徽标可查看并打开 */
|
||||
function distinctByFamily(nodes: any[]): any[] {
|
||||
const seen = new Set<string>()
|
||||
return nodes.map(n => {
|
||||
const fid = n.raw?.originGood?.family?.familyId
|
||||
? String(n.raw.originGood.family.familyId)
|
||||
: null
|
||||
if (!fid) return n
|
||||
if (seen.has(fid)) return null
|
||||
seen.add(fid)
|
||||
const siblings = nodes.filter(m =>
|
||||
String(m.raw?.originGood?.family?.familyId ?? '') === fid)
|
||||
n.configCount = siblings.length
|
||||
n.familyConfigs = siblings
|
||||
return n
|
||||
}).filter(Boolean)
|
||||
}
|
||||
|
||||
function mapCatNodes(nodes: CategoryTree[], goods: Good[]): any[] {
|
||||
return nodes.map(n => {
|
||||
const childNodes = n.children?.length ? mapCatNodes(n.children, goods) : []
|
||||
const myGoods = goods.filter(g => g.categoryId === n.id).map(goodToNode)
|
||||
const children = [...childNodes, ...myGoods]
|
||||
const goodCount = children.reduce((sum: number, c: any) => sum + (c.goodCount ?? (c.isGood ? 1 : 0)), 0)
|
||||
const children = [...childNodes, ...distinctByFamily(myGoods)]
|
||||
const goodCount = children.reduce((sum: number, c: any) =>
|
||||
sum + (c.isGood ? 1 + (c.configCount ? c.configCount - 1 : 0) : (c.goodCount ?? 0)), 0)
|
||||
return {
|
||||
id: n.id,
|
||||
label: n.categoryName,
|
||||
@@ -247,7 +267,7 @@ const leftTreeData = computed(() => {
|
||||
isCat: true,
|
||||
raw: c,
|
||||
goodCount: cGoods.length,
|
||||
children: cGoods.map(goodToNode),
|
||||
children: distinctByFamily(cGoods.map(goodToNode)),
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -398,18 +418,26 @@ function findOgNodeById(rawId: string | number): any {
|
||||
return found
|
||||
}
|
||||
|
||||
/** 链接名的款号段(第 2 段,如 BRTF004);同款号 = 同款 */
|
||||
function skuCodeOf(name: string | null | undefined): string {
|
||||
return (name ?? '').split('-').map(s => s.trim())[1] ?? ''
|
||||
}
|
||||
|
||||
function collectSiblings(ogNode: any): any[] {
|
||||
const result: any[] = []
|
||||
const myFamily = ogNode.familyId ? String(ogNode.familyId) : null
|
||||
const mySku = skuCodeOf(ogNode.goodName ?? ogNode.label)
|
||||
function traverse(nodes: any[]) {
|
||||
for (const n of nodes) {
|
||||
// 全局同款链接(跨分类):合并同名按名称组键匹配,
|
||||
// 不局限于当前分类;含已配置的,勾选归族操作幂等
|
||||
if (
|
||||
n.isOG &&
|
||||
String(n.rawId) !== String(ogNode.rawId) &&
|
||||
sameOriginGroup(ogNode.goodName ?? ogNode.label, n.goodName ?? n.label)
|
||||
) {
|
||||
result.push(n)
|
||||
// 全局同款链接(跨分类/跨工艺/跨物流):族归属精确匹配,或款号一致;
|
||||
// 含已配置的,勾选归族操作幂等
|
||||
if (n.isOG && String(n.rawId) !== String(ogNode.rawId)) {
|
||||
const nFamily = n.familyId ? String(n.familyId) : null
|
||||
const nSku = skuCodeOf(n.goodName ?? n.label)
|
||||
const same = (myFamily && nFamily && myFamily === nFamily)
|
||||
|| (Boolean(mySku) && Boolean(nSku) && mySku === nSku)
|
||||
|| (!mySku && sameOriginGroup(ogNode.goodName ?? ogNode.label, n.goodName ?? n.label))
|
||||
if (same) result.push(n)
|
||||
}
|
||||
if (n.children?.length) traverse(n.children)
|
||||
}
|
||||
@@ -420,11 +448,6 @@ function collectSiblings(ogNode: any): any[] {
|
||||
|
||||
function openConfigModal(og: any, dropTarget: any) {
|
||||
const ogNode = findOgNodeById(og.rawId)
|
||||
// 公开契约一族一款:族已配置后再配置成员只会产出官网不可见的重复商品
|
||||
if ((ogNode?.familyConfiguredCount ?? 0) > 0 || (ogNode?.configuredCount ?? 0) > 0) {
|
||||
ElMessage.info('该链接所属族已配置为官网商品,无需重复配置')
|
||||
return
|
||||
}
|
||||
configOG.value = { ...og, familyId: og.familyId ?? ogNode?.familyId ?? null }
|
||||
configDropTarget.value = dropTarget
|
||||
configSiblings.value = ogNode ? collectSiblings(ogNode) : []
|
||||
@@ -575,6 +598,12 @@ function locateInLeftTree(originGoodId: string) {
|
||||
const node = tree.getNode(keyId)
|
||||
if (node) node.expanded = true
|
||||
}
|
||||
// 族折叠后商品嵌套在族组节点下:沿父链全部展开(两种模式通用)
|
||||
let anc = tree.getNode(targetKey)?.parent as any
|
||||
while (anc?.data) {
|
||||
anc.expanded = true
|
||||
anc = anc.parent
|
||||
}
|
||||
setTimeout(() => {
|
||||
tree.setCurrentKey(targetKey)
|
||||
// 闪烁高亮定位行(2.4s 后自动消失)
|
||||
@@ -703,6 +732,13 @@ function onTreeGoodDragLeave(_event: DragEvent, data: any) {
|
||||
if (treeDragOver.value?.id === data.goodId) treeDragOver.value = null
|
||||
}
|
||||
|
||||
/** 国家分组内:找商品所在容器数组(即国家根 children) */
|
||||
function findContainingArray(group: any, goodId: string): any[] | null {
|
||||
return (group.children ?? []).some((c: any) => c.isGood && c.goodId === goodId)
|
||||
? group.children
|
||||
: null
|
||||
}
|
||||
|
||||
async function onTreeGoodDrop(event: DragEvent, data: any) {
|
||||
event.preventDefault()
|
||||
event.stopPropagation()
|
||||
@@ -713,14 +749,12 @@ async function onTreeGoodDrop(event: DragEvent, data: any) {
|
||||
if (mode.value !== 'country' || !draggedId || !target) return
|
||||
if (target.id !== data.goodId || draggedId === data.goodId) return
|
||||
|
||||
// 目标所在国家分组的商品(新顺序)
|
||||
const group = leftTreeData.value.find((c: any) =>
|
||||
(c.children ?? []).some((g: any) => g.goodId === target.id),
|
||||
)
|
||||
// 目标所在国家分组(跨国拖动不支持:商品归属固定国家)
|
||||
const group = leftTreeData.value.find((c: any) => findContainingArray(c, target.id))
|
||||
if (!group) return
|
||||
const nodes = [...group.children]
|
||||
const fromIdx = nodes.findIndex(n => n.goodId === draggedId)
|
||||
if (fromIdx === -1) return // 跨国拖动不支持(商品归属固定国家)
|
||||
if (fromIdx === -1) return
|
||||
const [moved] = nodes.splice(fromIdx, 1)
|
||||
let insertIdx = nodes.findIndex(n => n.goodId === target.id)
|
||||
if (target.pos === 'after') insertIdx++
|
||||
@@ -972,6 +1006,11 @@ onMounted(() => loadAll())
|
||||
<div class="gv-root" v-loading="loading">
|
||||
<!-- Filter Bar -->
|
||||
<div class="gv-filter">
|
||||
<el-radio-group v-model="mode" size="small" @change="onModeChange">
|
||||
<el-radio-button value="category">品类</el-radio-button>
|
||||
<el-radio-button value="country">国家</el-radio-button>
|
||||
<el-radio-button value="global">全局</el-radio-button>
|
||||
</el-radio-group>
|
||||
<el-select v-model="sortBy" size="small" style="width: 140px">
|
||||
<el-option v-for="opt in SORT_OPTIONS" :key="opt.value" :label="opt.label" :value="opt.value" />
|
||||
</el-select>
|
||||
@@ -996,14 +1035,8 @@ onMounted(() => loadAll())
|
||||
<template #prefix><el-icon><Search /></el-icon></template>
|
||||
</el-input>
|
||||
<el-button size="small" type="primary" :icon="Search" @click="onSearch">搜索</el-button>
|
||||
<el-button size="small" type="success" :icon="Plus" @click="openCustomCreate">新增自定义商品</el-button>
|
||||
|
||||
<div class="gv-filter-spacer" />
|
||||
<el-radio-group v-model="mode" size="small" @change="onModeChange">
|
||||
<el-radio-button value="category">品类</el-radio-button>
|
||||
<el-radio-button value="country">国家</el-radio-button>
|
||||
<el-radio-button value="global">全局</el-radio-button>
|
||||
</el-radio-group>
|
||||
<el-button size="small" type="success" :icon="Plus" @click="openCustomCreate">新增自定义商品</el-button>
|
||||
</div>
|
||||
|
||||
<!-- Dual Tree (hidden in global mode) -->
|
||||
@@ -1103,6 +1136,24 @@ onMounted(() => loadAll())
|
||||
<span class="good-name" :title="data.goodName">{{ cleanLinkName(data.goodName) }}</span>
|
||||
<span v-if="data.mergedCount > 1" class="gv-merged-badge">×{{ data.mergedCount }}</span>
|
||||
</el-tooltip>
|
||||
<el-popover
|
||||
v-if="data.configCount > 1"
|
||||
placement="bottom-start"
|
||||
:width="380"
|
||||
trigger="click"
|
||||
popper-class="cfg-pop-popper"
|
||||
>
|
||||
<template #reference>
|
||||
<span class="cfg-badge" :title="`同款共 ${data.configCount} 个配置`" @click.stop>{{ data.configCount }} 个配置</span>
|
||||
</template>
|
||||
<div class="cfg-pop-list">
|
||||
<div v-for="c in (data.familyConfigs || [])" :key="c.goodId" class="cfg-pop-row">
|
||||
<span class="cfg-pop-name" :title="c.goodName">{{ cleanLinkName(c.goodName) }}</span>
|
||||
<span class="cfg-pop-sub">{{ c.country }}{{ c.raw?.category?.categoryName ? ' · ' + c.raw.category.categoryName : '' }}</span>
|
||||
<el-button size="small" link type="primary" @click.stop="openEdit(c.raw)">打开</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
</div>
|
||||
<span class="good-actions" @click.stop>
|
||||
<el-button v-if="!data.isCustom" size="small" link :icon="Aim" title="定位原产品" @click="locateInRightTree(data.originGoodId)" />
|
||||
@@ -1155,7 +1206,7 @@ onMounted(() => loadAll())
|
||||
:expand-on-click-node="true"
|
||||
>
|
||||
<template #default="{ data }">
|
||||
<div v-if="data.isOG" class="og-node" draggable="true" @dragstart="onOGDragStart($event, data)">
|
||||
<div v-if="data.isOG" class="og-node" draggable="true" title="拖到左侧分类/国家可配置为官网商品" @dragstart="onOGDragStart($event, data)">
|
||||
<el-image v-if="data.goodImage" :src="data.goodImage" fit="cover" class="og-thumb" />
|
||||
<div v-else class="og-thumb og-thumb-placeholder" />
|
||||
<span class="og-name" :title="data.goodName">{{ data.label }}</span>
|
||||
@@ -1200,8 +1251,9 @@ onMounted(() => loadAll())
|
||||
@click.stop="locateInLeftTree(data.rawId)"
|
||||
/>
|
||||
<el-button
|
||||
v-if="!data.configuredCount && !data.familyConfiguredCount"
|
||||
v-if="!data.configuredCount"
|
||||
size="small" type="primary" link class="og-config-btn"
|
||||
title="配置为官网商品(可勾选同款链接归入同一族)"
|
||||
@click.stop="openConfigFromRightTree(data)"
|
||||
>配置</el-button>
|
||||
</div>
|
||||
@@ -1490,6 +1542,23 @@ onMounted(() => loadAll())
|
||||
.good-node.is-dragging { opacity: 0.5; }
|
||||
.good-node.is-drop-before { box-shadow: inset 0 2px 0 var(--el-color-primary); }
|
||||
.good-node.is-drop-after { box-shadow: inset 0 -2px 0 var(--el-color-primary); }
|
||||
.cfg-badge {
|
||||
font-size: 11px; line-height: 1; padding: 3px 7px; border-radius: 8px;
|
||||
color: var(--el-color-primary);
|
||||
background: var(--el-color-primary-light-9);
|
||||
flex-shrink: 0; white-space: nowrap; cursor: pointer;
|
||||
}
|
||||
.cfg-pop-list { display: flex; flex-direction: column; gap: 6px; max-height: 280px; overflow: auto; }
|
||||
.cfg-pop-row {
|
||||
display: flex; align-items: center; gap: 8px;
|
||||
padding: 4px 6px; border-radius: 6px; background: #fafafa;
|
||||
}
|
||||
.cfg-pop-row:hover { background: #f0f2f5; }
|
||||
.cfg-pop-name {
|
||||
flex-shrink: 0; max-width: 200px; overflow: hidden;
|
||||
text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: #303133;
|
||||
}
|
||||
.cfg-pop-sub { flex: 1; font-size: 11px; color: #909399; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.good-thumb {
|
||||
width: 36px; height: 36px; border-radius: 6px; flex-shrink: 0;
|
||||
object-fit: cover;
|
||||
@@ -1505,7 +1574,14 @@ onMounted(() => loadAll())
|
||||
font-size: 13px; line-height: 1.4; cursor: pointer;
|
||||
max-width: calc(100% - 40px);
|
||||
}
|
||||
.good-name-col { flex: 1; min-width: 0; overflow: hidden; }
|
||||
.good-name-col {
|
||||
flex: 1; min-width: 0; overflow: hidden;
|
||||
display: flex; align-items: center; gap: 6px;
|
||||
}
|
||||
.good-name-col > .el-tooltip__trigger {
|
||||
min-width: 0; overflow: hidden;
|
||||
display: inline-flex; align-items: center; gap: 4px;
|
||||
}
|
||||
.gv-merged-badge {
|
||||
margin-left: 4px;
|
||||
padding: 0 5px;
|
||||
@@ -1526,7 +1602,7 @@ onMounted(() => loadAll())
|
||||
overflow: hidden;
|
||||
}
|
||||
.good-country {
|
||||
font-size: 11px; color: #909399; line-height: 1;
|
||||
font-size: 11px; color: #606266; line-height: 1;
|
||||
background: #f5f7fa; padding: 2px 6px; border-radius: 8px;
|
||||
flex-shrink: 0; white-space: nowrap;
|
||||
}
|
||||
@@ -1536,9 +1612,9 @@ onMounted(() => loadAll())
|
||||
flex-shrink: 0; white-space: nowrap;
|
||||
}
|
||||
.good-tag {
|
||||
font-size: 11px; color: #606266; line-height: 1;
|
||||
font-size: 11px; color: #454545; line-height: 1;
|
||||
padding: 2px 6px 2px 12px; border-radius: 8px;
|
||||
background: #fafafa; position: relative; flex-shrink: 0;
|
||||
background: #f5f7fa; position: relative; flex-shrink: 0;
|
||||
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 80px;
|
||||
}
|
||||
.good-tag::before {
|
||||
|
||||
@@ -135,13 +135,13 @@ async function handleSubmit() {
|
||||
<el-cascader v-if="mode === 'country' || !dropTarget" v-model="form.cascaderCategory" :options="categoryCascader as any" :props="{ checkStrictly: true }" placeholder="请选择分类" @change="onCascaderChange" style="width:100%" />
|
||||
<el-tag v-else>{{ dropTarget?.label }}</el-tag>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="siblings.length" label="合并同名">
|
||||
<el-form-item label="合并同名">
|
||||
<div class="config-merge-box">
|
||||
<el-input
|
||||
v-model="mergeKeyword"
|
||||
size="small"
|
||||
clearable
|
||||
placeholder="搜索同分类链接…"
|
||||
placeholder="搜索同款链接(全局,含已配置)…"
|
||||
style="margin-bottom:8px"
|
||||
/>
|
||||
<el-checkbox-group v-model="checkedIds">
|
||||
@@ -149,7 +149,9 @@ async function handleSubmit() {
|
||||
{{ s.goodName }}<template v-if="s.goodPrice"> · ¥{{ s.goodPrice }}</template>
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<div v-if="!filteredSiblings.length" class="config-merge-empty">没有匹配的链接</div>
|
||||
<div v-if="!filteredSiblings.length" class="config-merge-empty">
|
||||
{{ siblings.length ? '没有匹配的链接' : '未找到同款链接(同款号或同族)' }}
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="图片">
|
||||
|
||||
@@ -8,8 +8,8 @@ import { syncApi } from '@/api/sync'
|
||||
const logs = ref<SyncLog[]>([])
|
||||
const loading = ref(false)
|
||||
const syncing = ref(false)
|
||||
type SyncType = 'PRODUCTS' | 'CATEGORIES' | 'PRODUCT_DETAILS'
|
||||
const currentType = ref<SyncType>('PRODUCTS')
|
||||
type SyncType = 'PRODUCTS' | 'CATEGORIES' | 'PRODUCT_DETAILS'
|
||||
const currentType = ref<SyncType>('PRODUCTS')
|
||||
|
||||
let timer: ReturnType<typeof setInterval> | null = null
|
||||
let pollTimer: ReturnType<typeof setInterval> | null = null
|
||||
@@ -26,13 +26,13 @@ async function refreshLogs() {
|
||||
}
|
||||
}
|
||||
|
||||
function syncTypeLabel(type: SyncType): string {
|
||||
if (type === 'CATEGORIES') return '分类'
|
||||
if (type === 'PRODUCT_DETAILS') return '全部原产品详情'
|
||||
return '商品列表'
|
||||
}
|
||||
|
||||
async function pollUntilDone(type: SyncType) {
|
||||
function syncTypeLabel(type: SyncType): string {
|
||||
if (type === 'CATEGORIES') return '分类'
|
||||
if (type === 'PRODUCT_DETAILS') return '全部原产品详情'
|
||||
return '商品列表'
|
||||
}
|
||||
|
||||
async function pollUntilDone(type: SyncType) {
|
||||
if (pollTimer) clearInterval(pollTimer)
|
||||
pollTimer = setInterval(async () => {
|
||||
try {
|
||||
@@ -44,9 +44,9 @@ async function pollUntilDone(type: SyncType) {
|
||||
if (pollTimer) { clearInterval(pollTimer); pollTimer = null }
|
||||
syncing.value = false
|
||||
if (top.status === 'SUCCESS') {
|
||||
ElMessage.success(`${syncTypeLabel(type)}同步完成`)
|
||||
ElMessage.success(`${syncTypeLabel(type)}同步完成`)
|
||||
} else {
|
||||
ElMessage.error(`${syncTypeLabel(type)}同步失败`)
|
||||
ElMessage.error(`${syncTypeLabel(type)}同步失败`)
|
||||
}
|
||||
await refreshLogs()
|
||||
}
|
||||
@@ -58,19 +58,19 @@ async function handleSyncProducts() {
|
||||
await doSync('PRODUCTS')
|
||||
}
|
||||
|
||||
async function handleSyncCategories() {
|
||||
async function handleSyncCategories() {
|
||||
await doSync('CATEGORIES')
|
||||
}
|
||||
|
||||
async function handleSyncProductDetails() {
|
||||
await doSync('PRODUCT_DETAILS')
|
||||
}
|
||||
|
||||
async function doSync(type: SyncType) {
|
||||
const label = syncTypeLabel(type)
|
||||
}
|
||||
|
||||
async function handleSyncProductDetails() {
|
||||
await doSync('PRODUCT_DETAILS')
|
||||
}
|
||||
|
||||
async function doSync(type: SyncType) {
|
||||
const label = syncTypeLabel(type)
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
`确定立即执行${label}同步吗?${type === 'PRODUCT_DETAILS' ? '将同步全部有效原产品,耗时取决于原产品数量。' : type !== 'CATEGORIES' ? '此操作可能需要几分钟。' : ''}`,
|
||||
`确定立即执行${label}同步吗?${type === 'PRODUCT_DETAILS' ? '将同步全部有效原产品,耗时取决于原产品数量。' : type !== 'CATEGORIES' ? '此操作可能需要几分钟。' : ''}`,
|
||||
'确认',
|
||||
{ type: 'info', confirmButtonText: '执行', cancelButtonText: '取消' }
|
||||
)
|
||||
@@ -79,10 +79,10 @@ async function doSync(type: SyncType) {
|
||||
syncing.value = true
|
||||
currentType.value = type
|
||||
try {
|
||||
if (type === 'PRODUCTS') {
|
||||
await syncApi.syncProducts()
|
||||
} else if (type === 'PRODUCT_DETAILS') {
|
||||
await syncApi.syncProductDetails()
|
||||
if (type === 'PRODUCTS') {
|
||||
await syncApi.syncProducts()
|
||||
} else if (type === 'PRODUCT_DETAILS') {
|
||||
await syncApi.syncProductDetails()
|
||||
} else {
|
||||
await syncApi.syncCategories()
|
||||
}
|
||||
@@ -108,13 +108,34 @@ function formatDuration(start?: string, end?: string): string | null {
|
||||
}
|
||||
|
||||
const stats = computed(() => {
|
||||
const total = logs.value.length
|
||||
const success = logs.value.filter(l => l.status === 'SUCCESS').length
|
||||
const failed = logs.value.filter(l => l.status === 'FAILED').length
|
||||
const lastLog = logs.value[0]
|
||||
const total = logs.value.length
|
||||
const success = logs.value.filter(l => l.status === 'SUCCESS').length
|
||||
const failed = logs.value.filter(l => l.status === 'FAILED').length
|
||||
const lastLog = logs.value[0]
|
||||
return { total, success, failed, lastLog }
|
||||
})
|
||||
|
||||
const SYNC_KEY_ZH: Record<string, string> = {
|
||||
inserted: '新增',
|
||||
updated: '更新',
|
||||
total: '共计',
|
||||
delisted: '下架',
|
||||
reactivated: '恢复上架',
|
||||
leafCategories: '叶子分类',
|
||||
}
|
||||
|
||||
/** 后端报文(inserted=0 updated=536 ...)渲染为中文摘要;未知键原样保留 */
|
||||
function humanizeSyncMessage(message?: string | null): string {
|
||||
if (!message) return ''
|
||||
const prefixMatch = message.match(/^([^::]+)[::]\s*/)
|
||||
const prefix = prefixMatch ? prefixMatch[1] : ''
|
||||
const body = prefixMatch ? message.slice(prefixMatch[0].length) : message
|
||||
const pairs = [...body.matchAll(/(\w+)=([^\s=]+)/g)]
|
||||
if (!pairs.length) return message
|
||||
const text = pairs.map(([, k, v]) => `${SYNC_KEY_ZH[k] ?? k} ${v}`).join(' · ')
|
||||
return prefix ? `${prefix}:${text}` : text
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
refreshLogs()
|
||||
timer = setInterval(refreshLogs, 60_000)
|
||||
@@ -136,7 +157,7 @@ onUnmounted(() => {
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="sync-action-title">数据同步</h2>
|
||||
<p class="sync-action-desc">分类和产品每小时自动同步;全部 SDS 原产品详情每天 03:30 自动同步,也可手动执行</p>
|
||||
<p class="sync-action-desc">分类和产品每小时自动同步;全部 SDS 原产品详情每天 03:30 自动同步,也可手动执行</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sync-action-buttons">
|
||||
@@ -151,23 +172,23 @@ onUnmounted(() => {
|
||||
<el-button
|
||||
type="primary"
|
||||
size="large"
|
||||
:loading="syncing && currentType === 'PRODUCTS'"
|
||||
:loading="syncing && currentType === 'PRODUCTS'"
|
||||
:disabled="syncing"
|
||||
:icon="Refresh"
|
||||
@click="handleSyncProducts"
|
||||
>
|
||||
同步产品
|
||||
</el-button>
|
||||
<el-button
|
||||
type="success"
|
||||
size="large"
|
||||
:loading="syncing && currentType === 'PRODUCT_DETAILS'"
|
||||
:disabled="syncing"
|
||||
:icon="Refresh"
|
||||
@click="handleSyncProductDetails"
|
||||
>
|
||||
同步全部原产品详情
|
||||
</el-button>
|
||||
同步产品
|
||||
</el-button>
|
||||
<el-button
|
||||
type="success"
|
||||
size="large"
|
||||
:loading="syncing && currentType === 'PRODUCT_DETAILS'"
|
||||
:disabled="syncing"
|
||||
:icon="Refresh"
|
||||
@click="handleSyncProductDetails"
|
||||
>
|
||||
同步全部原产品详情
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -189,7 +210,7 @@ onUnmounted(() => {
|
||||
</div>
|
||||
<div class="stat-divider" />
|
||||
<div class="stat-item">
|
||||
<span class="stat-value stat-time">{{ stats.lastLog ? formatTime(stats.lastLog.startedAt) : '-' }}</span>
|
||||
<span class="stat-value stat-time">{{ stats.lastLog ? formatTime(stats.lastLog.startedAt) : '-' }}</span>
|
||||
<span class="stat-label">最近同步</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -220,17 +241,17 @@ onUnmounted(() => {
|
||||
</div>
|
||||
<div class="timeline-content">
|
||||
<div class="timeline-header">
|
||||
<span class="timeline-type">{{ syncTypeLabel(log.type) }}</span>
|
||||
<span class="timeline-type">{{ syncTypeLabel(log.type) }}</span>
|
||||
<span class="timeline-status" :class="log.status === 'SUCCESS' ? 'is-success' : (log.status === 'RUNNING' ? 'is-running' : 'is-failed')">
|
||||
{{ log.status === 'SUCCESS' ? '成功' : log.status === 'RUNNING' ? '进行中' : '失败' }}
|
||||
</span>
|
||||
<span v-if="formatDuration(log.startedAt, log.finishedAt || undefined)" class="timeline-duration">
|
||||
<span v-if="formatDuration(log.startedAt, log.finishedAt || undefined)" class="timeline-duration">
|
||||
<el-icon :size="11"><Clock /></el-icon>
|
||||
{{ formatDuration(log.startedAt, log.finishedAt || undefined) }}
|
||||
{{ formatDuration(log.startedAt, log.finishedAt || undefined) }}
|
||||
</span>
|
||||
</div>
|
||||
<p v-if="log.message" class="timeline-message">{{ log.message }}</p>
|
||||
<span class="timeline-time">{{ formatTime(log.startedAt) }}</span>
|
||||
<p v-if="log.message" class="timeline-message" :title="log.message">{{ humanizeSyncMessage(log.message) }}</p>
|
||||
<span class="timeline-time">{{ formatTime(log.startedAt) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -154,14 +154,17 @@ pnpm --filter @inkreach/api backfill:product-families
|
||||
归并(同组合取最低价,「链接数」列显示来源数,人工价带标签),无需额外请求;
|
||||
- 编辑弹窗商品「名称」预填解析后的「品名 型号」,保存即采用解析名;右侧原产品库与配置弹窗
|
||||
始终显示**原始链接名**;
|
||||
- 配置弹窗「合并同名」候选为**全局同款链接**(按名称 3 段组键跨分类匹配,
|
||||
含已配置链接),支持搜索过滤。
|
||||
- 配置弹窗「合并同名」区块**常显**,候选为**全局同款链接**:按 链接款号(名称第 2 段,
|
||||
如 BRTF004)或族归属跨分类匹配,同款不同工艺/物流/仓库均在列(含已配置链接),
|
||||
支持搜索过滤;无候选时显示空态提示。
|
||||
- 右树徽标语义(**族感知**,公开契约一族一款):**已配置 N**(绿,本链接已配置为官网商品,
|
||||
N=国数)/ **已配置**(绿,本链接未单独建商品但所属族已配置)/ **成族**(蓝,已归族且全族
|
||||
未配置)/ **未配置**(橙);「定位到官网商品」在自身或同族已配置时出现(按 主链接 → 同族 →
|
||||
旧副源顺序定位并高亮),「配置」仅在全族未配置时出现;把已配置族的链接拖拽/点击配置会被
|
||||
拦截提示(避免产出官网不可见的重复商品);
|
||||
旧副源顺序定位并高亮),「配置」在本链接未单独建商品时可用(含族已配置的情形,供调整归族;
|
||||
注意重复配置会产生官网不可见的冗余商品);
|
||||
- 族分组头部计数与「仅未配置」筛选同样按族语义(族已配置 → 计入已配置)。
|
||||
- **左树一族一行**(国家/品类模式):同款多条配置只显示排序最前的一条,名称旁
|
||||
「N 个配置」徽标悬浮列出其余配置(可打开编辑),分组头部计数仍按全部商品统计。
|
||||
- 人工改价/自动成族等族管理 API(`/product-families/*`)保留,供脚本或后续界面使用;
|
||||
- 页面组件化:`GoodsView.vue` 拆出 `components/` 下的 GoodsEditDialog(编辑弹窗)、
|
||||
GoodsConfigDialog(配置弹窗)、CustomGoodDialog(自定义商品)、TagFilterPopover(标签筛选弹层)。
|
||||
|
||||
@@ -0,0 +1,28 @@
|
||||
# 后台 UI/交互优化(视觉走查驱动)
|
||||
|
||||
基于 2026-08-28 浏览器实机走查(品类/国家模式、编辑弹窗、数据同步页)。
|
||||
**分支约定:完成后停留在本分支,经用户确认后才合并 develop。**
|
||||
|
||||
## 修正一项误报
|
||||
|
||||
右树分组计数 "墨西哥 29/3" 为截图拼贴伪影裁切尾数,DOM 实际渲染 29/33,
|
||||
计数口径无 bug —— 不做修改。
|
||||
|
||||
## 改动项
|
||||
|
||||
1. **左树同族折叠**:国家/品类模式下,同款(同 familyId)的多条官网商品
|
||||
折叠为一行「族组」节点(显示代表名 + "N 个配置"徽标),展开看各行。
|
||||
- locateInLeftTree 增加父链展开(族组嵌套后定位仍有效)
|
||||
- 国家模式拖拽排序适配:仅允许同一容器(国家根/同一族组)内排序,
|
||||
优先级按该国家折叠后展示顺序保序重分配
|
||||
2. **工具栏分区重排**:模式切换(品类/国家/全局)移到最左,筛选组居中,
|
||||
「新增自定义商品」靠右 —— 消除 1680 宽下的折行错乱
|
||||
3. **对比度**:商品行属性小字/国家徽标颜色加深(#606266→#454545 等)
|
||||
4. **拖拽可发现性**:右树 og 行加 title 提示"拖到左侧分类/国家可配置"
|
||||
5. **同步日志人话化**:后端 `inserted=0 updated=536 ...` 报文渲染为
|
||||
「新增 0 · 更新 536 · 共 536 条」,原文放 tooltip
|
||||
|
||||
## 不做(backlog)
|
||||
|
||||
右树按分类/工厂切换、面板高度自适应、批量补详情、重复配置体检入口、
|
||||
首页位管理入口缺失(PositionsView 无路由)——需产品决策,另行确认。
|
||||
Reference in New Issue
Block a user