From d90d392cfcefb5fba5be9b0ec3ab9e37ba2df02c Mon Sep 17 00:00:00 2001
From: Thanaphon Frappet <thanaphon@frappet.com>
Date: Fri, 6 Dec 2024 15:32:47 +0700
Subject: [PATCH] refactor: handle qr code

---
 src/components/01_branch-management/FormBank.vue |  9 +++++++--
 src/components/ImageHover.vue                    | 12 ++++++++++--
 src/components/QrCodeUploadDialog.vue            |  1 +
 3 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/components/01_branch-management/FormBank.vue b/src/components/01_branch-management/FormBank.vue
index 275b6ff3..eef5f3a1 100644
--- a/src/components/01_branch-management/FormBank.vue
+++ b/src/components/01_branch-management/FormBank.vue
@@ -173,9 +173,10 @@ watch(
 
       <div
         class="bordered q-mr-sm rounded"
-        :class="{ 'cursor-pointer': !readonly }"
+        :class="{ 'pointer-none': readonly }"
       >
         <ImageHover
+          :readonly="readonly"
           :img="book.bankUrl"
           @view="() => $emit('viewQr', i)"
           @edit="
@@ -347,4 +348,8 @@ watch(
     </div>
   </div>
 </template>
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.pointer-none {
+  pointer-events: none;
+}
+</style>
diff --git a/src/components/ImageHover.vue b/src/components/ImageHover.vue
index e3c1f00c..fd6fc513 100644
--- a/src/components/ImageHover.vue
+++ b/src/components/ImageHover.vue
@@ -44,7 +44,11 @@ defineEmits<{
         style="z-index: 1; cursor: pointer"
         @mouseover="showOverlay = true"
         @mouseleave="showOverlay = false"
-        @click.stop="$emit('view')"
+        @click.stop="
+          () => {
+            if (readonly === false) $emit('view');
+          }
+        "
       >
         <div
           v-if="img"
@@ -108,7 +112,11 @@ defineEmits<{
           >
             <div
               class="upload-overlay absolute-bottom flex items-center justify-center"
-              @click.stop="$emit('edit')"
+              @click.stop="
+                () => {
+                  if (readonly === false) $emit('edit');
+                }
+              "
             >
               {{
                 labelAction === undefined
diff --git a/src/components/QrCodeUploadDialog.vue b/src/components/QrCodeUploadDialog.vue
index e5d870c8..1b0298a7 100644
--- a/src/components/QrCodeUploadDialog.vue
+++ b/src/components/QrCodeUploadDialog.vue
@@ -159,6 +159,7 @@ async function downloadImage(url: string) {
           v-close-popup
         />
         <SaveButton
+          :label="$t('general.confirm')"
           outlined
           @click="$emit('save', inputFile?.files?.[0] || null, imageUrl)"
         />