From 379995e0abe6563c4f35201ef23056d07bd062f3 Mon Sep 17 00:00:00 2001
From: safavimohadeseh78 <safavimohadeseh78@gmail.com>
Date: Sat, 7 Nov 2026 12:24:47 +0330
Subject: [PATCH] fix: allow mobile gallery file picker for banner upload

---
 .../banners/components/BannerImageUpload.vue  | 22 +++++++++++++++----
 src/utils/fixFileCapture.ts                   | 11 +++++++++-
 2 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/src/pages/menuPages/banners/components/BannerImageUpload.vue b/src/pages/menuPages/banners/components/BannerImageUpload.vue
index f528370..df83da9 100644
--- a/src/pages/menuPages/banners/components/BannerImageUpload.vue
+++ b/src/pages/menuPages/banners/components/BannerImageUpload.vue
@@ -1,10 +1,10 @@
 <template>
-  <div class="banner-image-upload">
+  <div class="banner-image-upload fix-capture" @pointerdown="ensureGalleryCapture" @click="ensureGalleryCapture">
     <a-upload
       v-if="!displayUrl"
-      class="banner-image-upload__zone"
+      class="banner-image-upload__zone fix-capture"
       name="file"
-      accept="image/*"
+      accept="image/jpeg,image/png,image/webp,image/jpg,.jpg,.jpeg,.png,.webp"
       :show-upload-list="false"
       :action="uploadURL"
       :headers="fileHeader"
@@ -37,8 +37,9 @@
       </div>
       <div class="banner-image-upload__bar">
         <a-upload
+          class="fix-capture"
           name="file"
-          accept="image/*"
+          accept="image/jpeg,image/png,image/webp,image/jpg,.jpg,.jpeg,.png,.webp"
           :show-upload-list="false"
           :action="uploadURL"
           :headers="fileHeader"
@@ -63,11 +64,13 @@
 </template>
 
 <script setup lang="ts">
+import { computed, ref, watch, onMounted, nextTick } from 'vue'
 import { LoadingOutlined } from '@ant-design/icons-vue'
 import { message } from 'ant-design-vue'
 import { uploadURL } from '@root/config'
 import { getToken } from '@/utils'
 import { fileUrlCandidates, normalizeUploadFileResponse, toAbsoluteFileUrl } from '@/utils/file'
+import { fixFileCapture } from '@/utils/fixFileCapture'
 import {
   createImageBeforeUpload,
   createImageCustomRequest
@@ -89,11 +92,22 @@ const candidateIndex = ref(0)
 const candidates = computed(() => fileUrlCandidates(props.imageUrl))
 const displayUrl = computed(() => candidates.value[candidateIndex.value] ?? '')
 
+function ensureGalleryCapture() {
+  fixFileCapture()
+}
+
+onMounted(() => {
+  fixFileCapture()
+})
+
 watch(
   () => props.imageUrl,
   () => {
     previewFailed.value = false
     candidateIndex.value = 0
+    nextTick(() => {
+      fixFileCapture()
+    })
   },
 )
 
diff --git a/src/utils/fixFileCapture.ts b/src/utils/fixFileCapture.ts
index 901d8ab..c6c379e 100644
--- a/src/utils/fixFileCapture.ts
+++ b/src/utils/fixFileCapture.ts
@@ -1,6 +1,15 @@
 /** جلوگیری از باز شدن مستقیم دوربین روی موبایل — انتخاب از گالری */
 export function fixFileCapture(root: ParentNode | Document = document): void {
-  root.querySelectorAll<HTMLInputElement>('.fix-capture input[type="file"]').forEach((input) => {
+  root.querySelectorAll<HTMLInputElement>('.fix-capture input[type="file"], .banner-image-upload input[type="file"], .ant-upload input[type="file"]').forEach((input) => {
     input.removeAttribute('capture')
   })
 }
+
+if (typeof document !== 'undefined') {
+  document.addEventListener('pointerdown', (e) => {
+    const target = e.target as HTMLElement | null
+    if (target?.closest?.('.fix-capture, .banner-image-upload, .ant-upload')) {
+      fixFileCapture()
+    }
+  }, { capture: true, passive: true })
+}