Add zoom ability

frontend/components/global/product-detail/Slider.vue

@@ -57,12 +57,17 @@ const changeSlide = (id: number) => {
                     name="zoom"
                     mode="out-in"
                 >
-                    <NuxtImg
+                    <div :key="selectedSlideDetail.id">
-                        :key="selectedSlideDetail.id"
+                        <vue-image-zoomer
-                        class="size-full absolute object-contain"
+                            class="size-full absolute object-contain"
-                        :src="selectedSlideDetail.image"
+                            :show-message="false"
-                        :alt="selectedSlideDetail.name"
+                            :show-message-touch="false"
-                    />
+                            click-message="برای مشاهده کلیک کنید"
+                            hover-message="برای مشاهده موس را وارد عکس کنید"
+                            :regular="selectedSlideDetail.image"
+                            :alt="selectedSlideDetail.name"
+                        />
+                    </div>
                 </Transition>
             </div>