From 945a439c03fc288468a4664b68a5c52da52e7815 Mon Sep 17 00:00:00 2001
From: M_Kececi <you@example.com>
Date: Mon, 16 Mar 2026 01:02:40 +0300
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 ui/src/pages/ProductStockByAttributes.vue | 38 +++++++++++++++++++++--
 ui/src/pages/ProductStockQuery.vue        | 38 +++++++++++++++++++++--
 2 files changed, 72 insertions(+), 4 deletions(-)

diff --git a/ui/src/pages/ProductStockByAttributes.vue b/ui/src/pages/ProductStockByAttributes.vue
index f1c7c43..d69e1b5 100644
--- a/ui/src/pages/ProductStockByAttributes.vue
+++ b/ui/src/pages/ProductStockByAttributes.vue
@@ -275,6 +275,7 @@
                 arrows
                 height="100%"
                 class="product-card-carousel rounded-borders"
+                @update:model-value="onProductCardSlideChange"
               >
                 <q-carousel-slide
                   v-for="(img, idx) in productCardImages"
@@ -668,13 +669,36 @@ function sortImagesForDisplay(list) {
 function parseGalleryHashIndex() {
   if (typeof window === 'undefined') return 0
   const hash = String(window.location?.hash || '').trim()
-  const m = hash.match(/^#gallery-(\d+)$/i)
+  const m = hash.match(/^#([a-z0-9_-]+)-(\d+)$/i)
   if (!m) return 0
-  const n = Number(m[1] || 1)
+  const group = String(m[1] || '').toLowerCase()
+  if (group !== 'gallery') return 0
+  const n = Number(m[2] || 1)
   if (!Number.isFinite(n) || n < 1) return 0
   return n - 1
 }
 
+function setGalleryHashIndex(idx) {
+  if (typeof window === 'undefined') return
+  const n = Math.max(1, Number(idx || 0) + 1)
+  const targetHash = `#gallery-${n}`
+  if (window.location.hash === targetHash) return
+  const url = `${window.location.pathname}${window.location.search}${targetHash}`
+  window.history.replaceState(null, '', url)
+}
+
+function applyGalleryHashIndex() {
+  const idx = parseGalleryHashIndex()
+  const maxCard = Math.max(productCardImages.value.length - 1, 0)
+  if (productCardDialog.value && productCardImages.value.length) {
+    productCardSlide.value = Math.min(Math.max(idx, 0), maxCard)
+  }
+  const maxFull = Math.max(fullscreenImages.value.length - 1, 0)
+  if (productImageFullscreenDialog.value && fullscreenImages.value.length) {
+    productImageFullscreenSlide.value = Math.min(Math.max(idx, 0), maxFull)
+  }
+}
+
 async function resolveProductImageUrlForCarousel(item) {
   const resolved = resolveProductImageUrl(item)
   const contentUrl = String(resolved.contentUrl || '').trim()
@@ -1332,6 +1356,7 @@ async function openProductCard(grp1, grp2) {
   productCardImages.value = uniqueImages
   const hashIndex = parseGalleryHashIndex()
   productCardSlide.value = Math.min(Math.max(hashIndex, 0), Math.max(uniqueImages.length - 1, 0))
+  setGalleryHashIndex(productCardSlide.value)
   productCardData.value = {
     productCode,
     colorCode,
@@ -1356,6 +1381,7 @@ function openProductImageFullscreen(src) {
   productImageFullscreenSrc.value = value
   const idx = Math.max(0, fullscreenImages.value.findIndex((x) => String(x || '').trim() === value))
   productImageFullscreenSlide.value = idx
+  setGalleryHashIndex(idx)
   productImageFullscreenZoom.value = 1
   productImageFullscreenOffsetX.value = 0
   productImageFullscreenOffsetY.value = 0
@@ -1414,12 +1440,17 @@ function onFullscreenMouseUp() {
 }
 
 function onFullscreenSlideChange() {
+  setGalleryHashIndex(productImageFullscreenSlide.value)
   productImageFullscreenZoom.value = 1
   productImageFullscreenOffsetX.value = 0
   productImageFullscreenOffsetY.value = 0
   productImageFullscreenDragging.value = false
 }
 
+function onProductCardSlideChange() {
+  setGalleryHashIndex(productCardSlide.value)
+}
+
 function resetForm() {
   filters.value = createEmptyFilters()
   rawRows.value = []
@@ -1452,11 +1483,14 @@ onMounted(() => {
   void loadFilterOptions(true)
   window.addEventListener('mousemove', onFullscreenMouseMove)
   window.addEventListener('mouseup', onFullscreenMouseUp)
+  window.addEventListener('hashchange', applyGalleryHashIndex)
+  applyGalleryHashIndex()
 })
 
 onUnmounted(() => {
   window.removeEventListener('mousemove', onFullscreenMouseMove)
   window.removeEventListener('mouseup', onFullscreenMouseUp)
+  window.removeEventListener('hashchange', applyGalleryHashIndex)
   if (filterOptionsDebounceTimer) {
     clearTimeout(filterOptionsDebounceTimer)
     filterOptionsDebounceTimer = null
diff --git a/ui/src/pages/ProductStockQuery.vue b/ui/src/pages/ProductStockQuery.vue
index c4b1798..e3b7289 100644
--- a/ui/src/pages/ProductStockQuery.vue
+++ b/ui/src/pages/ProductStockQuery.vue
@@ -260,6 +260,7 @@
                 arrows
                 height="100%"
                 class="product-card-carousel rounded-borders"
+                @update:model-value="onProductCardSlideChange"
               >
                 <q-carousel-slide
                   v-for="(img, idx) in productCardImages"
@@ -647,13 +648,36 @@ function sortImagesForDisplay(list) {
 function parseGalleryHashIndex() {
   if (typeof window === 'undefined') return 0
   const hash = String(window.location?.hash || '').trim()
-  const m = hash.match(/^#gallery-(\d+)$/i)
+  const m = hash.match(/^#([a-z0-9_-]+)-(\d+)$/i)
   if (!m) return 0
-  const n = Number(m[1] || 1)
+  const group = String(m[1] || '').toLowerCase()
+  if (group !== 'gallery') return 0
+  const n = Number(m[2] || 1)
   if (!Number.isFinite(n) || n < 1) return 0
   return n - 1
 }
 
+function setGalleryHashIndex(idx) {
+  if (typeof window === 'undefined') return
+  const n = Math.max(1, Number(idx || 0) + 1)
+  const targetHash = `#gallery-${n}`
+  if (window.location.hash === targetHash) return
+  const url = `${window.location.pathname}${window.location.search}${targetHash}`
+  window.history.replaceState(null, '', url)
+}
+
+function applyGalleryHashIndex() {
+  const idx = parseGalleryHashIndex()
+  const maxCard = Math.max(productCardImages.value.length - 1, 0)
+  if (productCardDialog.value && productCardImages.value.length) {
+    productCardSlide.value = Math.min(Math.max(idx, 0), maxCard)
+  }
+  const maxFull = Math.max(fullscreenImages.value.length - 1, 0)
+  if (productImageFullscreenDialog.value && fullscreenImages.value.length) {
+    productImageFullscreenSlide.value = Math.min(Math.max(idx, 0), maxFull)
+  }
+}
+
 async function resolveProductImageUrlForCarousel(item) {
   const resolved = resolveProductImageUrl(item)
   const contentUrl = String(resolved.contentUrl || '').trim()
@@ -1142,6 +1166,7 @@ async function openProductCard(grp1, grp2) {
   productCardImages.value = uniqueImages
   const hashIndex = parseGalleryHashIndex()
   productCardSlide.value = Math.min(Math.max(hashIndex, 0), Math.max(uniqueImages.length - 1, 0))
+  setGalleryHashIndex(productCardSlide.value)
   productCardData.value = {
     productCode,
     colorCode,
@@ -1166,6 +1191,7 @@ function openProductImageFullscreen(src) {
   productImageFullscreenSrc.value = value
   const idx = Math.max(0, fullscreenImages.value.findIndex((x) => String(x || '').trim() === value))
   productImageFullscreenSlide.value = idx
+  setGalleryHashIndex(idx)
   productImageFullscreenZoom.value = 1
   productImageFullscreenOffsetX.value = 0
   productImageFullscreenOffsetY.value = 0
@@ -1224,12 +1250,17 @@ function onFullscreenMouseUp() {
 }
 
 function onFullscreenSlideChange() {
+  setGalleryHashIndex(productImageFullscreenSlide.value)
   productImageFullscreenZoom.value = 1
   productImageFullscreenOffsetX.value = 0
   productImageFullscreenOffsetY.value = 0
   productImageFullscreenDragging.value = false
 }
 
+function onProductCardSlideChange() {
+  setGalleryHashIndex(productCardSlide.value)
+}
+
 function resetForm() {
   selectedProductCode.value = ''
   rawRows.value = []
@@ -1259,6 +1290,7 @@ function resetForm() {
 onUnmounted(() => {
   window.removeEventListener('mousemove', onFullscreenMouseMove)
   window.removeEventListener('mouseup', onFullscreenMouseUp)
+  window.removeEventListener('hashchange', applyGalleryHashIndex)
   for (const url of productImageBlobUrls.value) {
     try { URL.revokeObjectURL(url) } catch {}
   }
@@ -1269,6 +1301,8 @@ onMounted(() => {
   loadProductOptions()
   window.addEventListener('mousemove', onFullscreenMouseMove)
   window.addEventListener('mouseup', onFullscreenMouseUp)
+  window.addEventListener('hashchange', applyGalleryHashIndex)
+  applyGalleryHashIndex()
 })
 </script>