frontend update

frontend/components/global/Header.vue

@@ -169,13 +169,18 @@ const megaMenuCategories = computed(() => {
                     fetch-priority="high"
                     class="h-2/3"
                 /> -->
-                <NuxtImg
+                <NuxtLink
-                    src="/img/heymlz/heymlz-logomotion.gif"
+                    to="/"
-                    preload
-                    loading="eager"
-                    fetch-priority="high"
                     class="h-2/3"
-                />
+                >
+                    <NuxtImg
+                        src="/img/heymlz/heymlz-logomotion.gif"
+                        preload
+                        loading="eager"
+                        fetch-priority="high"
+                        class="h-full"
+                    />
+                </NuxtLink>
             </div>
         </div>
     </header>

frontend/components/home/ComingSoonSection.vue

@@ -5,7 +5,7 @@
         <div class="flex flex-col items-center gap-3 mb-10 lg:mb-16 typo-h-6 md:typo-h-5 lg:typo-h-3 text-black">
             منتظر یک اتفاق جذاب باشید...
         </div>
-        <div class="overflow-hidden rounded-3xl w-full bg-neutral-200">
+        <div class="overflow-hidden rounded-xl lg:rounded-3xl w-full bg-neutral-200">
             <video
                 src="/video/curtain-red.webm"
                 class="w-full"

frontend/components/product/ProductDetails.vue

@@ -17,7 +17,10 @@ const { selectedVariant } = inject("productVariant") as ProductVariantProvideTyp
             <div class="flex-1 w-full">
                 <Accordion />
             </div>
-            <div class="w-full lg:w-[450px] xl:w-[600px]">
+            <div
+                v-if="selectedVariant!.in_pack_items.length > 0"
+                class="w-full lg:w-[450px] xl:w-[600px]"
+            >
                 <div class="w-full bg-slate-50 rounded-xl flex-col-center px-5 py-16 sm:p-[5rem] gap-[1.5rem]">
                     <span class="typo-h-6 mb-8">داخل جعبه چیه؟</span>
                     <div class="w-full grid grid-cols-2 gap-y-[1.5rem] sm:gap-x-[3rem]">

frontend/components/profile/purchases-and-orders/index/PurchasesTableRow.vue

@@ -15,7 +15,7 @@ const props = defineProps<Props>();
 
 const { data } = toRefs(props);
 
-// states
+// queries
 
 const { downloadFn, downloadIsLoading } = useDownloadInvoice(String(data.value.id));
 </script>
@@ -66,7 +66,7 @@ const { downloadFn, downloadIsLoading } = useDownloadInvoice(String(data.value.i
                 />
                 <Icon
                     v-else
-                    name="ci:download"
+                    name="ci:bi-download"
                     class="**:stroke-black"
                     size="20"
                 />

frontend/composables/api/orders/useDownloadInvoice.ts

@@ -2,10 +2,13 @@
 
 import { API_ENDPOINTS } from "~/constants";
 import { useQuery } from "@tanstack/vue-query";
+import { useToast } from "~/composables/global/useToast";
 
 const useDownloadInvoice = (transactionId: string) => {
     // state
 
+    const { addToast } = useToast();
+
     const { $queryClient: queryClient, $axios: axios } = useNuxtApp();
 
     const enabled = ref(false);
@@ -33,6 +36,10 @@ const useDownloadInvoice = (transactionId: string) => {
         queryFn: () => handleDownloadInvoice(),
         enabled,
         refetchOnWindowFocus: false,
+        retry: 0,
+        throwOnError(error) {
+            addToast({ message: "خطایی در دانلود فاکتور رخ داد", options: { status: "error" } });
+        },
     });
 
     // watch

frontend/layouts/Cart.vue

@@ -67,7 +67,10 @@ const hasCartItem = computed(() => !!cart.value && cart.value.items.length! > 0)
                     <CartSummary v-if="hasCartItem && !cartIsLoading" />
                 </div>
             </div>
-            <ProductsSlider title="دیگر محصولات" />
+            <ProductsSlider
+                title="دیگر محصولات"
+                icon-image="/img/simulare-products-section.gif"
+            />
         </main>
         <div class="w-full flex-col flex mt-20">
             <ServiceHighlights />

frontend/pages/index.vue

@@ -11,10 +11,6 @@ const { data: homeData, suspense } = useHomeData();
 
 const response = await suspense();
 
-console.log(response.error)
-console.log("----- END ERROR ------")
-console.log(response)
-
 if (response.isError) {
     throw createError({
         statusCode: 500,
@@ -40,7 +36,7 @@ if (response.isError) {
         <div class="py-20">
             <ProductsSlider
                 title="محصولات محبوب"
-                 icon-image="/img/most-popular-section.gif"
+                icon-image="/img/most-popular-section.gif"
                 :products="homeData!.trends_products"
             />
         </div>
@@ -48,14 +44,14 @@ if (response.isError) {
         <div class="py-20">
             <ProductsSlider
                 title="محصولات پرفروش"
-                 icon-image="/img/most-sell-section.gif"
+                icon-image="/img/most-sell-section.gif"
                 :products="homeData!.top_seller_products"
             />
         </div>
         <div class="py-20">
             <ProductsSlider
                 title="محصولات پربازدید"
-                 icon-image="/img/most-viewed-section.gif"
+                icon-image="/img/most-viewed-section.gif"
                 :products="homeData!.most_viewed_products"
             />
         </div>

frontend/pages/product/[id].vue

@@ -43,7 +43,7 @@ provide("productVariant", {
 
 const productResponse = await suspenseProduct();
 
-if (productResponse.isError ) {
+if (productResponse.isError) {
     throw createError({
         statusCode: 404,
         statusMessage: `error : product ${id} prefetch error`,
@@ -55,12 +55,13 @@ if (productResponse.isError ) {
     <div class="w-full flex flex-col">
         <ProductHero />
         <ProductVideo v-model:showChatButton="showChatButton" />
-        <ProductComments />
         <ProductDetails />
         <ProductsSlider
             title="محصولات مشابه"
             :products="product!.related_products"
+            iconImage="/img/simulare-products-section.gif"
         />
+        <ProductComments />
         <ChatButton :showChatButton="showChatButton" />
     </div>
 </template>

frontend/pages/products/[...slug].vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-
 // import
 
 import { useAppParams } from "~/composables/global/useAppParams";
@@ -48,7 +47,13 @@ useSeoMeta({
     <div class="w-full container flex flex-col">
         <div class="w-full flex flex-col lg:flex-row justify-end items-end py-[3.5rem] lg:py-[5rem] gap-10 lg:gap-5">
             <div class="flex flex-col items-center lg:items-start gap-[1rem] lg:gap-[1.5rem] text-black w-full">
-                <h1 class="typo-h-5 lg:typo-h-4">لیست محصولات</h1>
+                <div class="flex gap-2 items-center">
+                    <NuxtImg
+                        src="/img/poducts-list-section.gif"
+                        class="size-10 sm:size-14"
+                    />
+                    <h1 class="typo-h-5 lg:typo-h-4">لیست محصولات</h1>
+                </div>
             </div>
 
             <div class="w-full flex items-center justify-between lg:justify-end gap-4">

frontend/pages/profile/index.vue

@@ -167,7 +167,7 @@ const handleSubmit = (withValidation: boolean) => {
                     </div>
                 </div>
 
-                <div class="flex flex-col items-start gap-3 w-full lg:w-4/12">
+                <!-- <div class="flex flex-col items-start gap-3 w-full lg:w-4/12">
                     <span class="typo-sub-h-md lg:typo-sub-h-lg">لقب های شما</span>
                     <span class="flex w-full flex-wrap gap-2">
                         <span
@@ -178,7 +178,7 @@ const handleSubmit = (withValidation: boolean) => {
                             <span class="text-[10px] lg:text-xs text-black">{{ alise }}</span>
                         </span>
                     </span>
-                </div>
+                </div> -->
             </div>
             <ProfileSection title="اطلاعات شما">
                 <template #button>

frontend/pages/transaction.vue

@@ -3,6 +3,7 @@
 
 import useGetTransaction from "~/composables/api/orders/useGetTransaction";
 import usePersianDate from "~/composables/global/usePersianDate";
+import useDownloadInvoice from "~/composables/api/orders/useDownloadInvoice";
 
 // meta
 
@@ -30,6 +31,8 @@ const tracking_code = computed(() => route.query["tc"] as string);
 
 const { data: transaction, isLoading: transactionIsLoading, suspense } = useGetTransaction(tracking_code);
 
+const { downloadFn, downloadIsLoading } = useDownloadInvoice(String(transaction.value?.bank_result?.tracking_code));
+
 await suspense();
 
 // computed
@@ -181,6 +184,8 @@ const statusTitle = computed(() => {
                         >
                     </NuxtLink>
                     <Button
+                        @click="!downloadIsLoading ? downloadFn() : undefined"
+                        :disabled="downloadIsLoading"
                         v-if="transaction?.bank_result?.status == 'succeeded'"
                         class="w-full rounded-full max-lg:py-2 bg-success-500 hover:text-success-500 hover:border-success-500 hover:**:!stroke-success-500"
                         start-icon="ci:share"

frontend/public/icons/bi-download.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 16 16"><!-- Icon from Bootstrap Icons by The Bootstrap Authors - https://github.com/twbs/icons/blob/main/LICENSE.md --><g fill="currentColor"><path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5"/><path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708z"/></g></svg>