ui: update ProductPerformanceProfitability page to enhance table views and tabs management

2026-07-03 00:01:42 +03:00
parent d419f52e3c
commit c536b85a4c
9 changed files with 1716 additions and 199 deletions
@@ -409,6 +409,8 @@ const productImageFullscreenDragOriginX = ref(0)
 const productImageFullscreenDragOriginY = ref(0)
 const IMAGE_LIST_CONCURRENCY = 8
 let imageListActiveRequests = 0
+let productImageBatchTimer = null
+const productImageBatchQueue = new Map()
 const imageListWaitQueue = []
 const activeSchema = ref(storeSchemaByKey.tak)
 const activeGrpKey = ref('tak')
@@ -708,10 +710,70 @@ function getProductImageUrl(code, color, secondColor = '', dim1Id = '', dim3Id =
  const key = buildImageKey(code, color, secondColor, dim1Id, dim3Id)
  const existing = productImageCache.value[key]
  if (existing !== undefined) return existing || ''
-  void ensureProductImage(code, color, secondColor, dim1Id, dim3Id)
+  queueProductImageBatch(code, color, secondColor, dim1Id, dim3Id)
  return ''
 }

+function queueProductImageBatch(code, color, secondColor = '', dim1Id = '', dim3Id = '') {
+  const key = buildImageKey(code, color, secondColor, dim1Id, dim3Id)
+  const codeTrim = String(code || '').trim().toUpperCase()
+  if (!codeTrim || productImageCache.value[key] !== undefined || productImageLoading.value[key]) return
+  productImageLoading.value[key] = true
+  productImageBatchQueue.set(key, {
+    key,
+    code: codeTrim,
+    dim1: String(dim1Id || color || '').trim().toUpperCase(),
+    dim3: String(dim3Id || secondColor || '').trim().toUpperCase(),
+    listKey: buildImageKey(
+      codeTrim,
+      String(color || '').trim().toUpperCase(),
+      String(secondColor || '').trim().toUpperCase(),
+      String(dim1Id || '').trim().toUpperCase(),
+      String(dim3Id || '').trim().toUpperCase()
+    )
+  })
+  if (productImageBatchTimer) window.clearTimeout(productImageBatchTimer)
+  productImageBatchTimer = window.setTimeout(flushProductImageBatch, 80)
+}
+
+async function flushProductImageBatch() {
+  const batch = Array.from(productImageBatchQueue.values()).slice(0, 250)
+  for (const item of batch) productImageBatchQueue.delete(item.key)
+  if (!batch.length) return
+  try {
+    const res = await api.post('/product-images/batch', {
+      items: batch.map(item => ({ key: item.key, code: item.code, dim1: item.dim1, dim3: item.dim3 }))
+    }, { timeout: 30000 })
+    const returned = new Set()
+    for (const item of Array.isArray(res?.data) ? res.data : []) {
+      const key = String(item?.key || '').trim()
+      if (!key) continue
+      returned.add(key)
+      const queued = batch.find(entry => entry.key === key)
+      const list = Array.isArray(item.images) ? item.images : []
+      const first = list[0] || null
+      const resolved = resolveProductImageUrl(first)
+      const url = resolved.thumbUrl || resolved.fullUrl || resolved.publicUrl || resolved.contentUrl || ''
+      productImageCache.value[key] = String(url || '').trim()
+      productImageFallbackByKey.value[key] = resolved.fullUrl || resolved.publicUrl || resolved.contentUrl || ''
+      if (queued) productImageListByCode.value[queued.listKey] = list
+      delete productImageLoading.value[key]
+    }
+    for (const item of batch) {
+      if (!returned.has(item.key)) {
+        productImageCache.value[item.key] = ''
+        productImageListByCode.value[item.listKey] = []
+        delete productImageLoading.value[item.key]
+      }
+    }
+  } catch {
+    for (const item of batch) {
+      delete productImageLoading.value[item.key]
+      void ensureProductImage(item.code, item.dim1, item.dim3)
+    }
+  }
+}
+
 async function onProductImageError(code, color, secondColor = '', dim1Id = '', dim3Id = '') {
  const key = buildImageKey(code, color, secondColor, dim1Id, dim3Id)
  productImageCache.value[key] = String(productImageFallbackByKey.value[key] || '').trim()