feat(syb): confirm one-click replacement from latest collection #258

web/tests/e2e/syb-quick-link.spec.ts

@@ -1,7 +1,8 @@
 import { expect, test } from '@playwright/test'
 
-async function setup(page: any) {
+async function setup(page: any, replacing = false) {
   const state = { userId: 1, role: 'purchaser', links: [] as any[], matches: [] as any[], linked: new Set<number>(), matched: new Set<number>(), aiFailure: false }
+  const replaced = new Set<number>()
   await page.context().addCookies([{ name: 'Admin-Token', value: 'mock-token', domain: 'localhost', path: '/' }])
   await page.route('**/api/**', async (route: any) => {
     const url = new URL(route.request().url()), path = url.pathname
@@ -11,13 +12,18 @@ async function setup(page: any) {
     if (path.endsWith('/menurole')) return ok([{ path: '/workbench', component: 'Layout', menuName: 'Workbench', title: '工作台', visible: '0', children: [{ path: '/syb-products', component: '/goauto/syb-products/index', menuName: 'GoAutoSybProducts', title: 'SYB 商品', visible: '0' }] }])
     if (path.endsWith('/syb-products')) return ok({ items: [1, 2].map(id => ({ id, orderCode: `TEST-${id}`, shopeeItemId: `100${id}`, shopeeProductId: id + 10, productTitle: '测试商品', targetColor: '黑色', targetSize: 'XL', quantity: 1, parseStatus: 'success' })), total: 2 })
     if (path.endsWith('/devices')) return ok({ items: [{ id: 10, name: '手机A', status: 'offline' }, { id: 20, name: '手机B', status: 'online' }], total: 2 })
-    if (path.endsWith('/batch-preview')) return ok({ items: route.request().postDataJSON().sybProductIds.map((id: number) => ({ sybProductId: id, pddProductId: state.linked.has(id) ? 55 : null, eligible: state.matched.has(id), aiMatchEligible: state.linked.has(id) && !state.matched.has(id), processStage: state.matched.has(id) ? 'purchase_ready' : state.linked.has(id) ? 'color_mapping' : 'pdd_unlinked', processNextAction: state.linked.has(id) ? 'open_mapping' : 'open_pdd_link' })) })
+    if (path.endsWith('/batch-preview')) return ok({ items: route.request().postDataJSON().sybProductIds.map((id: number) => replacing && !replaced.has(id)
+      ? { sybProductId: id, pddProductId: 44, processStage: 'pdd_collection_failed', processNextAction: 'open_pdd' }
+      : { sybProductId: id, pddProductId: state.linked.has(id) ? 55 : null, eligible: state.matched.has(id), aiMatchEligible: state.linked.has(id) && !state.matched.has(id), processStage: state.matched.has(id) ? 'purchase_ready' : state.linked.has(id) ? 'color_mapping' : 'pdd_unlinked', processNextAction: state.linked.has(id) ? 'open_mapping' : 'open_pdd_link' }) })
     const match = path.match(/shopee-products\/(\d+)(.*)/)
     if (match) {
       const productId = Number(match[1]), id = productId - 10
       const product = { id: productId, pddProductId: state.linked.has(id) ? 55 : null, specContextVersion: state.linked.has(id) ? 'after' : 'before', specs: [] }
+      if (replacing && !replaced.has(id)) product.pddProductId = 44
       if (match[2] === '/link-pdd') {
-        const body = route.request().postDataJSON(); state.links.push(body); state.linked.add(id)
+        const body = route.request().postDataJSON()
+        if (body.latestCollection.replacement?.preview) return ok({ product, collectionSource: { taskId: 7, deviceId: 10, pddProductId: 55, targetVersion: 'frozen', title: '新测试商品', previousTitle: '原测试商品', deviceName: '手机A' } })
+        state.links.push(body); state.linked.add(id); replaced.add(id)
         return ok({ product: { ...product, pddProductId: 55, specContextVersion: 'after' }, collectionSource: { taskId: 7, deviceId: body.latestCollection.deviceId, pddProductId: 55 } })
       }
       if (match[2] === '/specs/mapping/auto-match') {
@@ -30,12 +36,30 @@ async function setup(page: any) {
     return ok([])
   })
   await page.goto('/#/syb-products')
-  await expect(page.getByRole('button', { name: '一键关联', exact: true })).toHaveCount(2)
+  await expect(page.getByRole('button', { name: replacing ? '一键替换' : '一键关联', exact: true })).toHaveCount(2)
   return state
 }
 
+test('replacement reuses row position; cancel writes nothing; confirm freezes target and matches', async ({ page }) => {
+  const state = await setup(page, true)
+  await expect(page.getByRole('button', { name: '查看 PDD 商品', exact: true })).toHaveCount(2)
+  await expect(page.getByRole('button', { name: '一键关联', exact: true })).toHaveCount(0)
+  await page.getByRole('button', { name: '一键替换', exact: true }).first().click()
+  await choose(page, '手机A', '选择并继续')
+  const confirm = page.getByRole('dialog', { name: '确认替换 PDD 商品' })
+  await expect(confirm).toContainText('共用此蝦皮商品')
+  await confirm.getByRole('button', { name: '取消', exact: true }).click()
+  expect(state.links).toHaveLength(0); expect(state.matches).toHaveLength(0)
+  await page.getByRole('button', { name: '一键替换', exact: true }).first().click()
+  await confirm.getByRole('button', { name: '确认替换并匹配', exact: true }).click()
+  await expect.poll(() => state.matches.length).toBe(1)
+  expect(state.links).toHaveLength(1)
+  expect(state.links[0].latestCollection.replacement).toMatchObject({ expectedPddProductId: 44, taskId: 7, targetPddProductId: 55, targetVersion: 'frozen' })
+  await expect(page.locator('tbody').getByText('可创建采购', { exact: true })).toBeVisible()
+})
+
 async function choose(page: any, name: string, button: string) {
-  const dialog = page.getByRole('dialog')
+  const dialog = page.getByRole('dialog', { name: /^(选择|切换)采集手机$/ })
   await dialog.locator('.el-select').click()
   await page.getByRole('option', { name: new RegExp(name) }).click()
   await dialog.getByRole('button', { name: button, exact: true }).click()

web/tests/unit/syb-quick-link.test.cjs

@@ -10,6 +10,7 @@ function instance(overrides = {}) {
   const calls = { link: [], match: [], reads: 0, saved: [], refresh: 0 }
   const dependencies = {
     ElMessage: { warning() {} },
+    ElMessageBox: { confirm: async () => {}, close() {} },
     listDevices: async () => ({ data: { items: [{ id: 10, status: 'offline', name: 'A' }, { id: 20, status: 'online', name: 'B' }] } }),
     getShopeeProduct: async id => { calls.reads++; return { data: { product: { id, specContextVersion: 'before', pddProductId: calls.link.length ? 55 : null }, autoMatchTimeoutSeconds: 370 } } },
     linkShopeeProductPdd: async (id, body) => { calls.link.push(body); return { data: { product: { id, specContextVersion: 'after' }, collectionSource: { taskId: 9, pddProductId: 55 } } } },
@@ -87,3 +88,48 @@ test('preference isolates user and API environment, handles storage failure', ()
   process.env.VUE_APP_BASE_API = '/b'; assert.equal(p.readQuickLinkDevice(1), null)
   storage.setItem = () => { throw new Error('denied') }; assert.equal(p.rememberQuickLinkDevice(1, 20), false)
 })
+
+function replacementInstance(overrides = {}) {
+  const writes = [], previews = [], confirms = []
+  const context = instance({
+    getShopeeProduct: async () => ({ data: { product: { pddProductId: 44, specContextVersion: 'old' }, autoMatchTimeoutSeconds: 130 } }),
+    ElMessageBox: { confirm: async (...args) => { confirms.push(args) }, close() {} },
+    linkShopeeProductPdd: async (id, body) => {
+      const r = body.latestCollection.replacement
+      ;(r.preview ? previews : writes).push(body)
+      return { data: { product: { specContextVersion: 'new', pddProductId: r.preview ? 44 : 55 }, collectionSource: { taskId: 9, pddProductId: 55, targetVersion: 'target', title: '新商品', previousTitle: '原商品', deviceName: 'A' } } }
+    }, ...overrides
+  })
+  context.vm.purchaseReady = () => ({ pddProductId: 44, processNextAction: 'open_pdd', processStage: 'pdd_collection_failed' })
+  context.vm.quickDeviceId = 10
+  return { ...context, writes, previews, confirms }
+}
+test('replacement confirms once and submits the frozen source', async () => {
+  const { vm, writes, previews, confirms, calls } = replacementInstance()
+  await vm.quickStart(row)
+  assert.equal(previews.length, 1); assert.equal(confirms.length, 1); assert.equal(writes.length, 1)
+  assert.deepEqual(writes[0].latestCollection.replacement, { preview: false, expectedPddProductId: 44, taskId: 9, targetPddProductId: 55, targetVersion: 'target' })
+  assert.equal(calls.match.length, 1)
+})
+test('cancel replacement never writes or matches', async () => {
+  const { vm, writes, calls } = replacementInstance({ ElMessageBox: { confirm: async () => { throw 'cancel' } } })
+  await vm.quickStart(row)
+  assert.equal(writes.length, 0); assert.equal(calls.match.length, 0); assert.match(vm.quickMessages[1], /已取消/)
+})
+test('same product continues matching without replacement confirmation', async () => {
+  const { vm, confirms, calls } = replacementInstance({ linkShopeeProductPdd: async () => ({ data: { product: { specContextVersion: 'old' }, collectionSource: { taskId: 9, pddProductId: 44, targetVersion: 'same' } } }) })
+  await vm.quickStart(row)
+  assert.equal(confirms.length, 0); assert.equal(calls.match.length, 1)
+})
+test('failed replacement readback does not call old association a success', async () => {
+  const { vm, calls } = replacementInstance({ linkShopeeProductPdd: async () => { throw new Error('timeout') } })
+  await vm.quickStart(row)
+  assert.match(vm.quickMessages[1], /仍为原商品/); assert.equal(calls.match.length, 0)
+})
+test('replacement is not shown for collecting, successful, unknown or other manual stages', () => {
+  const { vm } = replacementInstance()
+  for (const stage of ['pdd_collecting', 'purchase_succeeded', 'order_review', 'task_created', 'color_mapping', 'manual_action']) {
+    vm.purchaseReady = () => ({ pddProductId: 44, processNextAction: 'open_pdd', processStage: stage })
+    assert.equal(vm.quickCanLink(row), false, stage)
+  }
+})