From 75474ec4aeed2b0cbff9d7979615ab8d743c3504 Mon Sep 17 00:00:00 2001 From: hamid zarghami Date: Mon, 21 Apr 2025 14:38:37 +0330 Subject: [PATCH] slider product --- src/app/products/ProductsPage.tsx | 186 +++++++-------------- src/app/products/hooks/useProductData.ts | 11 ++ src/app/products/page.tsx | 3 +- src/app/products/service/ProductService.ts | 8 + src/app/products/types/ProductTypes.ts | 4 + 5 files changed, 81 insertions(+), 131 deletions(-) diff --git a/src/app/products/ProductsPage.tsx b/src/app/products/ProductsPage.tsx index 9488739..ddd7ddd 100644 --- a/src/app/products/ProductsPage.tsx +++ b/src/app/products/ProductsPage.tsx @@ -5,9 +5,13 @@ import { Swiper, SwiperSlide } from 'swiper/react' import DanakSuggestedService from './DanakSuggestedService' import { FC } from 'react' import DanakServices from './DanakServices' +import { useGetSliderProducts } from './hooks/useProductData' +import Link from 'next/link' const Products: FC = () => { + const getSliderProducts = useGetSliderProducts() + return (
@@ -25,141 +29,63 @@ const Products: FC = () => { spaceBetween={15} slidesPerView={'auto'} > - -
- product + { + getSliderProducts.data?.data?.danakServices?.map((item) => { + return ( + +
+ + product + -
-
-
- منو دیجیتال رستوران -
- -
- دسته بندی -
-
-
-
-
-
-

- دی منو -

-
-
- داناک +
+
+
+ {item.name}
+ +
+ {item.category.title} +
+
+
+
+
+ product +
+
+

+ {item.title} +

+
+
+ داناک +
+
+
+
+ +
+
جزییات
+ +
+
-
-
جزییات
- -
-
-
-
- - -
- product - -
-
-
- منو دیجیتال رستوران -
- -
- دسته بندی -
-
-
-
-
-
-

- دی منو -

-
-
- داناک -
-
-
-
-
-
جزییات
- -
-
-
-
- - -
- product - -
-
-
- منو دیجیتال رستوران -
- -
- دسته بندی -
-
-
-
-
-
-

- دی منو -

-
-
- داناک -
-
-
-
-
-
جزییات
- -
-
-
-
- + + ) + }) + }
diff --git a/src/app/products/hooks/useProductData.ts b/src/app/products/hooks/useProductData.ts index 04b7191..a6a5016 100644 --- a/src/app/products/hooks/useProductData.ts +++ b/src/app/products/hooks/useProductData.ts @@ -29,11 +29,22 @@ export const useGetCategories = () => queryFn: () => api.getCategoriesPublic(), }); +export const useGetSliderProducts = () => + useQuery({ + queryKey: ["slider-products"], + queryFn: () => api.getSliderProducts(), + }); + export const categoriesQueryOptions = { queryKey: ["service-categories"], queryFn: () => api.getCategoriesPublic(), }; +export const sliderProductsQueryOptions = { + queryKey: ["slider-products"], + queryFn: () => api.getSliderProducts(), +}; + export const useGetDetailService = (serviceId: string) => useQuery({ queryKey: ["service-detail", serviceId], diff --git a/src/app/products/page.tsx b/src/app/products/page.tsx index e8a53a5..bdffd95 100644 --- a/src/app/products/page.tsx +++ b/src/app/products/page.tsx @@ -3,7 +3,7 @@ import { Suspense } from 'react' import { HydrationBoundary } from '@tanstack/react-query' import { dehydrate } from '@tanstack/react-query' import { QueryClient } from '@tanstack/react-query' -import { categoriesQueryOptions, danakServiceSuggestedQueryOptions, servicesQueryOptions } from './hooks/useProductData' +import { categoriesQueryOptions, danakServiceSuggestedQueryOptions, servicesQueryOptions, sliderProductsQueryOptions } from './hooks/useProductData' import Products from './ProductsPage' import Loading from './loading' @@ -20,6 +20,7 @@ async function ProductsContent() { await queryClient.prefetchQuery(servicesQueryOptions) await queryClient.prefetchQuery(categoriesQueryOptions) await queryClient.prefetchQuery(danakServiceSuggestedQueryOptions) + await queryClient.prefetchQuery(sliderProductsQueryOptions) return ( diff --git a/src/app/products/service/ProductService.ts b/src/app/products/service/ProductService.ts index 4f79cb8..4ceebb4 100644 --- a/src/app/products/service/ProductService.ts +++ b/src/app/products/service/ProductService.ts @@ -4,6 +4,7 @@ import { DanakServiceSuggestedResponse, ServiceDetailResponse, ServiceResponse, + SliderProductResponse, } from "../types/ProductTypes"; export const getServicesByCategory = async (categoryId?: string) => { @@ -37,3 +38,10 @@ export const getDetailService = async (serviceId: string) => { ); return data; }; + +export const getSliderProducts = async () => { + const { data } = await axios.get( + `/danak-services/slider` + ); + return data; +}; diff --git a/src/app/products/types/ProductTypes.ts b/src/app/products/types/ProductTypes.ts index 05425b9..705fb42 100644 --- a/src/app/products/types/ProductTypes.ts +++ b/src/app/products/types/ProductTypes.ts @@ -88,3 +88,7 @@ export type ServiceDetailResponse = ApiResponse<{ deletedAt: string | null; averageRating: number; }>; + +export type SliderProductResponse = ApiResponse<{ + danakServices: DanakService[]; +}>;