order bag history
parent
ffb3e3e922
commit
101d650a2e
|
@ -16,6 +16,8 @@ export default function CategoriesData({ params, products }) {
|
|||
const CTX = useContext(AppContext);
|
||||
const searchParams = useSearchParams();
|
||||
|
||||
console.log("products :products", products);
|
||||
|
||||
useEffect(() => {
|
||||
if (
|
||||
Number(searchParams.get("page")) === 0 ||
|
||||
|
|
|
@ -54,10 +54,20 @@ const CategoriesHero = () => {
|
|||
];
|
||||
return (
|
||||
<>
|
||||
<div className="grid xs:grid-cols-2 lg:grid-cols-5 gap-4 xs:px-5 lg:px-20">
|
||||
<div className="grid xs:grid-cols-2 lg:grid-cols-5 gap-4 xs:px-2 lg:px-20">
|
||||
{categories.map((category, index) => (
|
||||
<Link href={category.url} key={index}>
|
||||
<div className="rounded-lg overflow-hidden relative h-64 group cursor-pointer">
|
||||
<Link
|
||||
href={category.url}
|
||||
key={index}
|
||||
className={` ${
|
||||
index === categories.length - 1
|
||||
? "xs:col-span-2 lg:col-span-1"
|
||||
: " "
|
||||
}`}
|
||||
>
|
||||
<div
|
||||
className={`rounded-lg overflow-hidden relative xs:h-40 lg:h-64 group cursor-pointer `}
|
||||
>
|
||||
{/* Image as a background */}
|
||||
<div
|
||||
className="absolute inset-0 bg-cover bg-center transition-transform duration-300 group-hover:scale-105"
|
||||
|
|
|
@ -98,6 +98,8 @@ const Navbar = ({ theme }) => {
|
|||
setSearchValue(event.target.value);
|
||||
};
|
||||
|
||||
console.log(dataNav);
|
||||
|
||||
return (
|
||||
<>
|
||||
{isDesktop && (
|
||||
|
@ -309,20 +311,25 @@ const Navbar = ({ theme }) => {
|
|||
>
|
||||
<div className="flex rtl">
|
||||
{dataNav?.map((e, index) => (
|
||||
<p
|
||||
className={`mb-0 pt-2 pb-3 px-2 tr03 cursor-pointer ${
|
||||
navItemHover == index
|
||||
? " border-y-[5px] border-b-primary-800 border-t-transparent text-primary-900"
|
||||
: "border-y-[5px] border-y-transparent text-black"
|
||||
}
|
||||
<Link
|
||||
key={index}
|
||||
href={`/categories/${e.id}/${e.name.split(" ").join("-")}`}
|
||||
>
|
||||
<p
|
||||
className={`mb-0 pt-2 pb-3 px-2 tr03 cursor-pointer ${
|
||||
navItemHover == index
|
||||
? " border-y-[5px] border-b-primary-800 border-t-transparent text-primary-900"
|
||||
: "border-y-[5px] border-y-transparent text-black"
|
||||
}
|
||||
${theme == 0 ? "text-gray-400" : "text-gray-900"}
|
||||
${theme == 0 && isScrolled ? "text-gray-900" : ""}`}
|
||||
onMouseEnter={() => handleItemNavber(index)}
|
||||
onMouseLeave={() => setNavItemHover(null)}
|
||||
key={index}
|
||||
>
|
||||
{e.name}{" "}
|
||||
</p>
|
||||
onMouseEnter={() => handleItemNavber(index)}
|
||||
onMouseLeave={() => setNavItemHover(null)}
|
||||
key={index}
|
||||
>
|
||||
{e.name}{" "}
|
||||
</p>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
|
||||
|
@ -413,9 +420,9 @@ const Navbar = ({ theme }) => {
|
|||
{e.children.map((child, index) => (
|
||||
<Link
|
||||
key={index}
|
||||
href={`/categories/${child.id}/${e.name
|
||||
.split(" ")
|
||||
.join("-")}`}
|
||||
href={`/categories/${
|
||||
child.id
|
||||
}/${child.name.split(" ").join("-")}`}
|
||||
>
|
||||
<p
|
||||
key={child.id}
|
||||
|
|
|
@ -46,102 +46,98 @@ const BottomSheetSeeOrder = ({ id }) => {
|
|||
>
|
||||
{/* {bag && bag.length > 0 && ( */}
|
||||
<div className="h-[900px]">
|
||||
{bag.orderProducts?.map((e) => (
|
||||
<div className="p-3 text-center">
|
||||
<p className="pb-3 mb-0 text-sm rtl">
|
||||
<PersianNumber
|
||||
number={bag.orderProducts?.length}
|
||||
style="text-xl font-bold text-base font-bold mx-2 !text-primary-500"
|
||||
/>
|
||||
محصول موجود در سبد
|
||||
</p>
|
||||
<div className="p-3 text-center">
|
||||
<p className="pb-3 mb-0 text-sm rtl">
|
||||
<PersianNumber
|
||||
number={bag.orderProducts?.length}
|
||||
style="text-xl font-bold text-base font-bold mx-2 !text-primary-500"
|
||||
/>
|
||||
محصول موجود در سبد
|
||||
</p>
|
||||
|
||||
{/* <div className="w-5/12 mx-auto h-[1px] bg-gray-200 my-3"></div> */}
|
||||
<div>
|
||||
{bag.orderProducts.map((e, index) => (
|
||||
<div className="group border-t-[1px] border-gray-100 w-full hover:bg-white z-40 tr03 flex rtl pt-2">
|
||||
<Link href={`/products/${e.id}/${e.persianName}`}>
|
||||
<div className=" h-fit">
|
||||
{!!e.mainImage ? (
|
||||
{/* <div className="w-5/12 mx-auto h-[1px] bg-gray-200 my-3"></div> */}
|
||||
<div>
|
||||
{bag?.orderProducts?.map((e, index) => (
|
||||
<div className="group border-t-[1px] border-gray-100 w-full hover:bg-white z-40 tr03 flex rtl pt-2">
|
||||
<Link href={`/products/${e.productId}/${e.persianName}`}>
|
||||
<div className=" h-fit">
|
||||
{!!e.mainImage ? (
|
||||
<Image
|
||||
src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${e?.mainImage}`}
|
||||
width={100}
|
||||
height={100}
|
||||
className="xs:!w-[110px] lg:!w-[130px] mx-auto !object-cover"
|
||||
alt={`${e.productName} - ${e.productName}`}
|
||||
/>
|
||||
) : (
|
||||
<div className="xs:!w-[85px] lg:!w-[85px] ">
|
||||
<Image
|
||||
src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${e?.mainImage}`}
|
||||
width={100}
|
||||
height={100}
|
||||
className="xs:!w-[110px] lg:!w-[130px] mx-auto !object-cover"
|
||||
alt={`${e.productName} - ${e.productName}`}
|
||||
src={logo}
|
||||
className="xs:!w-[70px] lg:!w-[70px] mx-auto !object-cover opacity-25 mt-5"
|
||||
alt="وسمه"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</Link>
|
||||
<div className="w-full p-3 text-right">
|
||||
<Link href={`/products/${e.productId}/${e.productName}`}>
|
||||
<p className="mb-0 xs:text-[12px] lg:text-[11px] xl:text-[15px] max-h-[50px] tr03 ">
|
||||
{e?.productName}
|
||||
</p>
|
||||
</Link>
|
||||
|
||||
<div className="flex w-full rounded-full ltr">
|
||||
<div className="mt-3">
|
||||
<p className="mb-0 text-sm rtl">
|
||||
<PersianNumber
|
||||
number={e?.count}
|
||||
style={"text-sm ml-1"}
|
||||
/>
|
||||
عدد
|
||||
</p>
|
||||
</div>
|
||||
<div className="w-full text-right rounded-full">
|
||||
{e?.hasDiscount ? (
|
||||
<div className="relative flex justify-end">
|
||||
<p className="mb-0 font-bold text-sm absolute opacity-40 mt-[-7px] ml-[20px] text-red-600">
|
||||
<del>
|
||||
<PersianNumber
|
||||
number={(e?.productFee / 10).toLocaleString()}
|
||||
style={"text-[13px]"}
|
||||
/>
|
||||
</del>
|
||||
</p>
|
||||
<div className="flex rtl mt-[8px]">
|
||||
{" "}
|
||||
<p className="mb-0 font-bold">
|
||||
<PersianNumber
|
||||
number={(
|
||||
e?.productFeeWithDiscount / 10
|
||||
).toLocaleString()}
|
||||
/>
|
||||
</p>
|
||||
<small className="mr-1 mt-[3px]">تومان</small>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="xs:!w-[85px] lg:!w-[85px] ">
|
||||
<Image
|
||||
src={logo}
|
||||
className="xs:!w-[70px] lg:!w-[70px] mx-auto !object-cover opacity-25 mt-5"
|
||||
alt="وسمه"
|
||||
/>
|
||||
<div className="flex rtl mt-[3px]">
|
||||
{" "}
|
||||
<p className="mb-0 text-lg font-bold">
|
||||
<PersianNumber
|
||||
number={(e?.productFee / 10).toLocaleString()}
|
||||
/>
|
||||
</p>
|
||||
<small className="mr-1 mt-[6px]">تومان</small>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</Link>
|
||||
<div className="w-full p-3 text-right">
|
||||
<Link href={`/products/${e.id}/${e.productName}`}>
|
||||
<p className="mb-0 xs:text-[12px] lg:text-[11px] xl:text-[15px] max-h-[50px] tr03 ">
|
||||
{e?.productName}
|
||||
</p>
|
||||
</Link>
|
||||
|
||||
<div className="flex w-full rounded-full ltr">
|
||||
<div className="mt-3">
|
||||
<p className="mb-0 text-sm rtl">
|
||||
<PersianNumber
|
||||
number={e?.count}
|
||||
style={"text-sm ml-1"}
|
||||
/>
|
||||
عدد
|
||||
</p>
|
||||
</div>
|
||||
<div className="w-full text-right rounded-full">
|
||||
{e?.hasDiscount ? (
|
||||
<div className="relative flex justify-end">
|
||||
<p className="mb-0 font-bold text-sm absolute opacity-40 mt-[-7px] ml-[20px] text-red-600">
|
||||
<del>
|
||||
<PersianNumber
|
||||
number={(
|
||||
data?.productFee / 10
|
||||
).toLocaleString()}
|
||||
style={"text-[13px]"}
|
||||
/>
|
||||
</del>
|
||||
</p>
|
||||
<div className="flex rtl mt-[8px]">
|
||||
{" "}
|
||||
<p className="mb-0 font-bold">
|
||||
<PersianNumber
|
||||
number={(
|
||||
e?.productFeeWithDiscount / 10
|
||||
).toLocaleString()}
|
||||
/>
|
||||
</p>
|
||||
<small className="mr-1 mt-[3px]">تومان</small>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex rtl mt-[3px]">
|
||||
{" "}
|
||||
<p className="mb-0 text-lg font-bold">
|
||||
<PersianNumber
|
||||
number={(e?.productFee / 10).toLocaleString()}
|
||||
/>
|
||||
</p>
|
||||
<small className="mr-1 mt-[6px]">تومان</small>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
{/* )} */}
|
||||
</BottomSheet>
|
||||
|
|
|
@ -3,10 +3,14 @@ import React from "react";
|
|||
|
||||
export async function generateMetadata({ params }) {
|
||||
const decodedName = decodeURIComponent(params.id[1]);
|
||||
const products = await fetchProducts(params?.["id"]?.[0]);
|
||||
|
||||
return {
|
||||
title: decodedName,
|
||||
description: ` خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
|
||||
description:
|
||||
products.seo.description != ""
|
||||
? products.seo.description
|
||||
: ` خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
|
||||
metadataBase: new URL(
|
||||
`https://www.vesmeh.com/categories/${params.id[0]}/${decodedName}`
|
||||
),
|
||||
|
@ -22,13 +26,19 @@ export async function generateMetadata({ params }) {
|
|||
},
|
||||
openGraph: {
|
||||
title: decodedName,
|
||||
description: ` خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
|
||||
description:
|
||||
products.seo.description != ""
|
||||
? products.seo.description
|
||||
: ` خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
|
||||
url: `https://www.vesmeh.com/categories/${params.id[0]}/${decodedName}`,
|
||||
type: "website",
|
||||
},
|
||||
twitter: {
|
||||
site: "@vesmehstore",
|
||||
description: ` خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
|
||||
description:
|
||||
products.seo.description != ""
|
||||
? products.seo.description
|
||||
: ` خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
|
||||
title: decodedName,
|
||||
creator: "@vesmehstore",
|
||||
},
|
||||
|
@ -42,7 +52,8 @@ export async function generateMetadata({ params }) {
|
|||
// minPrice
|
||||
// maxPrice
|
||||
// sortBy
|
||||
const fetchProducts = async (categoryId, searchParams) => {
|
||||
|
||||
const fetchProducts = async (categoryId, searchParams = {}) => {
|
||||
const {
|
||||
brandIds: brandIdsString,
|
||||
isActive,
|
||||
|
@ -53,19 +64,23 @@ const fetchProducts = async (categoryId, searchParams) => {
|
|||
const query = {
|
||||
...(categoryId != 0 ? { categoryId } : {}),
|
||||
page: 0,
|
||||
...(!!isActive ? { isActive: !!isActive } : {}),
|
||||
...(!!specialOffer ? { specialOffer: !!specialOffer } : {}),
|
||||
...(typeof isActive !== "undefined" ? { isActive: !!isActive } : {}),
|
||||
...(typeof specialOffer !== "undefined"
|
||||
? { specialOffer: !!specialOffer }
|
||||
: {}),
|
||||
...params,
|
||||
};
|
||||
|
||||
const brandIds = brandIdsString?.split(",") ?? [];
|
||||
const brandIdsQuery =
|
||||
brandIds?.length > 0 ? `&brandIds=${brandIds?.join("&brandIds=")}` : "";
|
||||
brandIds.length > 0
|
||||
? `&${brandIds.map((id) => `brandIds=${id}`).join("&")}`
|
||||
: "";
|
||||
|
||||
try {
|
||||
const res = await fetch(
|
||||
`${process.env.NEXT_PUBLIC_API_URL}/product?` +
|
||||
new URLSearchParams({ ...query }) +
|
||||
new URLSearchParams(query).toString() +
|
||||
brandIdsQuery,
|
||||
{
|
||||
cache: "no-cache",
|
||||
|
@ -74,9 +89,10 @@ const fetchProducts = async (categoryId, searchParams) => {
|
|||
if (!res.ok) return [];
|
||||
const products = await res.json();
|
||||
|
||||
console.log("products++++++++++++++++++++++++++++++++", products);
|
||||
console.log("Fetched products:", products);
|
||||
return products;
|
||||
} catch (error) {
|
||||
console.error("Error fetching products:", error);
|
||||
return [];
|
||||
}
|
||||
};
|
||||
|
|
|
@ -41,7 +41,7 @@ const SideBarProfile = () => {
|
|||
<Link href={"/profile/orders"}>
|
||||
<div className="flex justify-between p-4 rounded-full group-hover:bg-primary-200 tr03">
|
||||
<p className="mb-0 text-sm text-gray-500 group-hover:text-black tr03">
|
||||
پیگیری سغارشات
|
||||
پیگیری سفارشات
|
||||
</p>
|
||||
<div className="w-[20px] h-[20px] rounded-full bg-primary-200 group-hover:bg-primary-500 tr03 "></div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue