init 2
parent
9581309d67
commit
08c3127390
14
.env
14
.env
|
|
@ -1,8 +1,9 @@
|
||||||
NODE_ENV="development"
|
NODE_ENV="development"
|
||||||
|
NEXT_PUBLIC_SERVER_URL=http://192.168.88.17:32770
|
||||||
|
NEXT_PUBLIC_PUBLIC_URL=http://192.168.88.17:32770
|
||||||
|
NEXT_PUBLIC_API_URL=http://192.168.88.17:32770/api
|
||||||
|
NEXT_PUBLIC_PACKAGE_VERSION=0.1.1
|
||||||
|
|
||||||
NEXT_PUBLIC_SERVER_URL=http://192.168.88.12:32770
|
|
||||||
NEXT_PUBLIC_PUBLIC_URL=http://192.168.88.12:32770
|
|
||||||
NEXT_PUBLIC_API_URL=http://192.168.88.12:32770/api
|
|
||||||
|
|
||||||
# SECURE_LOCAL_STORAGE_HASH_KEY=f1da2b2c7a4c446934267fea631102ec389b5b99
|
# SECURE_LOCAL_STORAGE_HASH_KEY=f1da2b2c7a4c446934267fea631102ec389b5b99
|
||||||
# NEXT_PUBLIC_API_URL_IMAGE=https://192.168.88.12:49154/Files/ReportImages
|
# NEXT_PUBLIC_API_URL_IMAGE=https://192.168.88.12:49154/Files/ReportImages
|
||||||
|
|
@ -14,8 +15,9 @@ NEXT_PUBLIC_API_URL=http://192.168.88.12:32770/api
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
# NEXT_PUBLIC_SERVER_URL=https://api.brizco.io
|
# NEXT_PUBLIC_SERVER_URL=https://apinetinashop.visabartar.com
|
||||||
# NEXT_PUBLIC_PUBLIC_URL=https://api.brizco.io
|
# NEXT_PUBLIC_PUBLIC_URL=https://apinetinashop.visabartar.com
|
||||||
# NEXT_PUBLIC_API_URL=https://api.brizco.io/api
|
# NEXT_PUBLIC_API_URL=https://apinetinashop.visabartar.com/api
|
||||||
|
|
||||||
# NEXT_PUBLIC_API_URL_IMAGE=https://api.macsonline.ir/Files/ReportImages
|
# NEXT_PUBLIC_API_URL_IMAGE=https://api.macsonline.ir/Files/ReportImages
|
||||||
# NEXT_PUBLIC_API_URL_BackUp=https://api.macsonline.ir/Files/BackUps
|
# NEXT_PUBLIC_API_URL_BackUp=https://api.macsonline.ir/Files/BackUps
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
"use client";
|
||||||
|
import { createContext } from "react";
|
||||||
|
|
||||||
|
const AppContext = createContext({
|
||||||
|
state: {},
|
||||||
|
});
|
||||||
|
export default AppContext;
|
||||||
|
|
@ -0,0 +1,106 @@
|
||||||
|
"use client";
|
||||||
|
import Image from "next/image";
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import React, { useContext } from "react";
|
||||||
|
import p1 from "../../../public/images/product/1.png";
|
||||||
|
import p2 from "../../../public/images/product/2.png";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
|
||||||
|
const CardCart = ({ data }) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
|
||||||
|
console.log("data", data);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="group border-t-[1px] border-gray-200 w-full hover:bg-white z-40 tr03 flex rtl pt-2">
|
||||||
|
<div className=" h-fit ">
|
||||||
|
<Image src={p2} className="xs:w-[130px] lg:w-[120px] " />
|
||||||
|
</div>
|
||||||
|
<div className="p-3 text-right w-full">
|
||||||
|
<p className="mb-0 xs:text-[12px] lg:text-[11px] xl:text-[15px] max-h-[50px] tr03 ">
|
||||||
|
{data?.persianName}
|
||||||
|
</p>
|
||||||
|
{data?.hasDiscount && (
|
||||||
|
<p className="mb-0 xs:text-[11px] lg:text-[12px] xl:text-[13px] text-red-600 font-medium">
|
||||||
|
{" "}
|
||||||
|
3 عدد موجود انبار
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<div className=" rounded-full flex ltr pt-2 mt-2 w-full">
|
||||||
|
<div className="flex justify-between w-full ">
|
||||||
|
{/*{cart.find(e=>id)}*/}
|
||||||
|
{data?.count < 0 ? (
|
||||||
|
<div className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full ">
|
||||||
|
<div
|
||||||
|
onClick={() => CTX.AddItemToCart(data.id, data.persianName)}
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 176 176"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto mt-[8px]"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
||||||
|
fill="black"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="flex rtl">
|
||||||
|
<div
|
||||||
|
className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full text-center "
|
||||||
|
onClick={() => CTX.AddItemToCart(data.id)}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-[25px] mt-[-2px]">+</p>
|
||||||
|
</div>
|
||||||
|
<p className="mb-0 mx-2 mt-1 font-bold">
|
||||||
|
<PersianNumber number={data?.count} />
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
className="w-[35px] h-[35px] bg-red-200 overflow-hidden rounded-full text-center "
|
||||||
|
onClick={() => CTX.RemoveItemFromCart(data.id)}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-[30px] mt-[-5px]">-</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="w-full text-right rounded-full">
|
||||||
|
{data?.hasDiscount ? (
|
||||||
|
<div className="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?.cost} style={"text-[13px]"} />
|
||||||
|
</del>
|
||||||
|
</p>
|
||||||
|
<div className="flex rtl mt-[8px]">
|
||||||
|
{" "}
|
||||||
|
<p className="mb-0 font-bold">
|
||||||
|
<PersianNumber number={data?.cost} />
|
||||||
|
</p>
|
||||||
|
<small className="mr-1 mt-[3px]">تومان</small>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="flex rtl mt-[3px]">
|
||||||
|
{" "}
|
||||||
|
<p className="mb-0 font-bold text-lg">
|
||||||
|
<PersianNumber number={data?.cost} />
|
||||||
|
</p>
|
||||||
|
<small className="mr-1 mt-[6px]">تومان</small>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CardCart;
|
||||||
|
|
@ -1,9 +1,16 @@
|
||||||
|
"use client";
|
||||||
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import PersianNumber from "plugins/PersianNumber";
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
import React from "react";
|
import React, { useContext, useState } from "react";
|
||||||
import p1 from "../../../public/images/product/1.png";
|
import p1 from "../../../public/images/product/1.png";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import Link from "next/link";
|
||||||
|
|
||||||
|
const CardCategories = ({ data }) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
const cart = CTX.state.cart;
|
||||||
|
|
||||||
const CardCategories = () => {
|
|
||||||
return (
|
return (
|
||||||
<div className="group border w-full hover:bg-white z-40 tr03">
|
<div className="group border w-full hover:bg-white z-40 tr03">
|
||||||
<>
|
<>
|
||||||
|
|
@ -14,89 +21,110 @@ const CardCategories = () => {
|
||||||
// key={index}
|
// key={index}
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
||||||
>
|
>
|
||||||
<div className=" m-3 ">
|
{data.hasDiscount && (
|
||||||
<div className="absolute mr-2 ">
|
<div className=" m-3 ">
|
||||||
<div className="w-fit rounded-full bg-red-600 overflow-hidden px-1 !py-0 h-fit ">
|
<div className="absolute mr-2 ">
|
||||||
<p className="mb-0 text-white ">
|
<div className="w-fit rounded-full bg-red-600 overflow-hidden px-1 !py-0 h-fit ">
|
||||||
<PersianNumber number={35} style="!text-[11px]" />
|
<p className="mb-0 text-white ">
|
||||||
<small className="text-[9px] ml-1">%</small>
|
<PersianNumber number={35} style="!text-[11px]" />
|
||||||
|
<small className="text-[9px] ml-1">%</small>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>{" "}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{data.hasDiscount && (
|
||||||
|
<div className=" m-3 ">
|
||||||
|
<div className="absolute mr-2 mt-[30px] ">
|
||||||
|
<div className="w-fit rounded-full bg-secondary-600 overflow-hidden px-1 !py-0 h-fit ">
|
||||||
|
<p className="mb-0 text-white text-[10px] ">اصالت کالا</p>
|
||||||
|
</div>
|
||||||
|
</div>{" "}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<Link href={`/products/${data.id}`}>
|
||||||
|
<div className="w-full h-fit ">
|
||||||
|
<Image
|
||||||
|
src={p1}
|
||||||
|
className="xs:w-[110px] lg:w-[120px] xl:w-[150] mx-auto"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="p-3 text-right">
|
||||||
|
<p className="mb-0 xs:text-[12px] lg:text-[12px] xl:text-[15px] max-h-[50px] tr03 ">
|
||||||
|
{data.persianName}{" "}
|
||||||
|
</p>
|
||||||
|
{data.hasDiscount && (
|
||||||
|
<p className="mb-0 xs:text-[11px] lg:text-[12px] xl:text-[13px] text-red-600 font-medium">
|
||||||
|
{" "}
|
||||||
|
3 عدد موجود انبار
|
||||||
</p>
|
</p>
|
||||||
</div>
|
)}
|
||||||
</div>{" "}
|
</div>
|
||||||
</div>{" "}
|
</Link>
|
||||||
<div className=" m-3 ">
|
|
||||||
<div className="absolute mr-2 mt-[30px] ">
|
|
||||||
<div className="w-fit rounded-full bg-secondary-600 overflow-hidden px-1 !py-0 h-fit ">
|
|
||||||
<p className="mb-0 text-white text-[10px] ">اصالت کالا</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p1}
|
|
||||||
className="xs:w-[110px] lg:w-[120px] xl:w-[150] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 xs:text-[12px] lg:text-[12px] xl:text-[15px] max-h-[50px] tr03 ">
|
|
||||||
لوسیون بدن سلامتی | mayasasdsdsda asdsad
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 xs:text-[11px] lg:text-[12px] xl:text-[13px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
||||||
<div className=" rounded-full flex ltr p-3 mt-2">
|
<div className=" rounded-full flex ltr p-3 mt-2">
|
||||||
<div className="flex">
|
<div className="flex">
|
||||||
{/* <div className="w-[30px] h-[30px] rounded-full mx-1">
|
{/*{cart.find(e=>id)}*/}
|
||||||
<div>
|
{!cart.find((item) => item.id === data.id) ? (
|
||||||
<svg
|
<div className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full ">
|
||||||
width="25"
|
<div
|
||||||
height="25"
|
onClick={() =>
|
||||||
viewBox="0 0 145 183"
|
CTX.AddItemToCart(data.id, data.persianName, data.cost)
|
||||||
fill="none"
|
}
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M129.626 183C125.799 182.993 122.118 181.677 119.323 179.317L75.958 143.408C75.0148 142.618 73.7759 142.179 72.4896 142.179C71.2032 142.179 69.9643 142.618 69.0212 143.408L25.6662 179.317C23.4815 181.132 20.7588 182.335 17.83 182.778C14.9012 183.221 11.8929 182.885 9.17199 181.811C6.45107 180.737 4.13509 178.972 2.50646 176.731C0.877836 174.49 0.00695006 171.869 0 169.189V23.0189C0 16.9139 2.68691 11.0589 7.46964 6.74207C12.2524 2.4252 18.7391 0 25.5029 0H119.497C126.26 0 132.747 2.4252 137.53 6.74207C142.313 11.0589 145 16.9139 145 23.0189V169.161C145.023 171.852 144.164 174.489 142.53 176.741C140.896 178.992 138.561 180.757 135.818 181.812C133.868 182.592 131.759 182.996 129.626 183ZM72.4998 132.957C76.3447 132.949 80.0521 134.247 82.8846 136.594L126.25 172.503C126.979 173.11 127.888 173.512 128.866 173.66C129.844 173.808 130.849 173.695 131.757 173.335C132.665 172.976 133.437 172.385 133.979 171.636C134.521 170.886 134.809 170.01 134.809 169.115V23.0189C134.809 19.3559 133.196 15.8429 130.327 13.2528C127.457 10.6627 123.565 9.20755 119.507 9.20755H25.5029C21.4447 9.20755 17.5526 10.6627 14.683 13.2528C11.8133 15.8429 10.2012 19.3559 10.2012 23.0189V169.161C10.2002 170.056 10.4884 170.932 11.0304 171.682C11.5725 172.431 12.3448 173.022 13.253 173.381C14.1611 173.741 15.1657 173.854 16.1438 173.706C17.1219 173.558 18.031 173.156 18.76 172.549L62.1252 136.548C64.9627 134.22 68.6652 132.938 72.4998 132.957Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="w-[35px] h-[35px] tr03 group-hover:bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px] opacity-40 tr03 group-hover:opacity-100"
|
|
||||||
>
|
>
|
||||||
<path
|
<svg
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
width="16"
|
||||||
fill="black"
|
height="16"
|
||||||
/>
|
viewBox="0 0 176 176"
|
||||||
</svg>
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto mt-[8px]"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
||||||
|
fill="black"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
) : (
|
||||||
|
<div className="flex rtl">
|
||||||
|
<div
|
||||||
|
className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full text-center "
|
||||||
|
onClick={() =>
|
||||||
|
CTX.AddItemToCart(data.id, data.persianName, data.cost)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-[25px] mt-[-2px]">+</p>
|
||||||
|
</div>
|
||||||
|
<p className="mb-0 mx-2 mt-1 font-bold">
|
||||||
|
<PersianNumber
|
||||||
|
number={cart.find((item) => item.id === data.id).count}
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
className="w-[35px] h-[35px] bg-red-200 overflow-hidden rounded-full text-center "
|
||||||
|
onClick={() => CTX.RemoveItemFromCart(data.id)}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-[30px] mt-[-5px]">-</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
<div className="w-full text-right rounded-full">
|
||||||
{2 == 2 ? (
|
{data.hasDiscount ? (
|
||||||
<div className="flex justify-end">
|
<div className="flex justify-end">
|
||||||
<p className="mb-0 font-bold text-sm absolute opacity-40 mt-[-7px] ml-[20px] text-red-600">
|
<p className="mb-0 font-bold text-sm absolute opacity-40 mt-[-7px] ml-[20px] text-red-600">
|
||||||
<del>
|
<del>
|
||||||
<PersianNumber number={270000} style={"text-[13px]"} />
|
<PersianNumber number={data.cost} style={"text-[13px]"} />
|
||||||
</del>
|
</del>
|
||||||
</p>
|
</p>
|
||||||
<div className="flex rtl mt-[8px]">
|
<div className="flex rtl mt-[8px]">
|
||||||
{" "}
|
{" "}
|
||||||
<p className="mb-0 font-bold">
|
<p className="mb-0 font-bold">
|
||||||
<PersianNumber number={150000} />
|
<PersianNumber number={data.cost} />
|
||||||
</p>
|
</p>
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
<small className="mr-1 mt-[3px]">تومان</small>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -105,7 +133,7 @@ const CardCategories = () => {
|
||||||
<div className="flex rtl mt-[3px]">
|
<div className="flex rtl mt-[3px]">
|
||||||
{" "}
|
{" "}
|
||||||
<p className="mb-0 font-bold text-lg">
|
<p className="mb-0 font-bold text-lg">
|
||||||
<PersianNumber number={150000} />
|
<PersianNumber number={data.cost} />
|
||||||
</p>
|
</p>
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
<small className="mr-1 mt-[6px]">تومان</small>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,57 +1,96 @@
|
||||||
|
"use client";
|
||||||
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import PersianNumber from "plugins/PersianNumber";
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
import React from "react";
|
import React, { useContext, useState } from "react";
|
||||||
import p1 from "../../../public/images/product/1.png";
|
import p1 from "../../../public/images/product/1.png";
|
||||||
import p2 from "../../../public/images/product/2.png";
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import Link from "next/link";
|
||||||
|
|
||||||
|
const CardCategoriesMobile = ({ data }) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
const cart = CTX.state.cart;
|
||||||
|
|
||||||
|
console.log("data ", data, cart);
|
||||||
|
|
||||||
const CardCategoriesMobile = () => {
|
|
||||||
return (
|
return (
|
||||||
<div className="group border-t-[1px] border-gray-200 w-full hover:bg-white z-40 tr03 flex rtl pt-2">
|
<div className="group border-t-[1px] border-gray-200 w-full hover:bg-white z-40 tr03 flex rtl pt-2 px-3">
|
||||||
<div className=" h-fit ">
|
<div className=" h-fit ">
|
||||||
<Image src={p2} className="xs:w-[130px] lg:w-[120px] " />
|
<Image src={p1} className="xs:w-[130px] lg:w-[120px] " />
|
||||||
</div>
|
</div>
|
||||||
<div className="p-3 text-right">
|
<div className="p-3 text-right w-full">
|
||||||
<p className="mb-0 xs:text-[12px] lg:text-[11px] xl:text-[15px] max-h-[50px] tr03 ">
|
<p className="mb-0 xs:text-[12px] lg:text-[11px] xl:text-[15px] max-h-[50px] tr03 ">
|
||||||
لوسیون بدن سلامتی | mayasasdsdsda asdsad
|
{data?.persianName}
|
||||||
</p>
|
|
||||||
<p className="mb-0 xs:text-[11px] lg:text-[10px] xl:text-[13px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
</p>
|
||||||
|
{data?.hasDiscount && (
|
||||||
|
<p className="mb-0 xs:text-[11px] lg:text-[12px] xl:text-[13px] text-red-600 font-medium">
|
||||||
|
{" "}
|
||||||
|
3 عدد موجود انبار
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
|
||||||
<div className=" rounded-full flex ltr pt-2 mt-2">
|
<div className=" rounded-full flex ltr pt-2 mt-2 w-full">
|
||||||
<div className="flex">
|
<div className="flex">
|
||||||
<div className="w-[35px] h-[35px] tr03 group-hover:bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
{/*{cart.find(e=>id)}*/}
|
||||||
<div>
|
{!cart.find((item) => item.id === data.id) ? (
|
||||||
<svg
|
<div className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full ">
|
||||||
width="20"
|
<div
|
||||||
height="20"
|
onClick={() =>
|
||||||
viewBox="0 0 176 176"
|
CTX.AddItemToCart(data.id, data.persianName, data.cost)
|
||||||
fill="none"
|
}
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px] opacity-40 tr03 group-hover:opacity-100"
|
|
||||||
>
|
>
|
||||||
<path
|
<svg
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
width="16"
|
||||||
fill="black"
|
height="16"
|
||||||
/>
|
viewBox="0 0 176 176"
|
||||||
</svg>
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto mt-[8px]"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
||||||
|
fill="black"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
) : (
|
||||||
|
<div className="flex rtl">
|
||||||
|
<div
|
||||||
|
className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full text-center "
|
||||||
|
onClick={() =>
|
||||||
|
CTX.AddItemToCart(data.id, data.persianName, data.cost)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-[25px] mt-[-2px]">+</p>
|
||||||
|
</div>
|
||||||
|
<p className="mb-0 mx-2 mt-1 font-bold">
|
||||||
|
<PersianNumber
|
||||||
|
number={cart.find((item) => item.id === data.id).count}
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
className="w-[35px] h-[35px] bg-red-200 overflow-hidden rounded-full text-center "
|
||||||
|
onClick={() => CTX.RemoveItemFromCart(data.id)}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-[30px] mt-[-5px]">-</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
<div className="w-full text-right rounded-full">
|
||||||
{2 == 2 ? (
|
{data?.hasDiscount ? (
|
||||||
<div className="flex justify-end">
|
<div className="flex justify-end">
|
||||||
<p className="mb-0 text-sm absolute opacity-40 mt-[-7px] ml-[20px] text-red-600">
|
<p className="mb-0 font-bold text-sm absolute opacity-40 mt-[-7px] ml-[20px] text-red-600">
|
||||||
<del>
|
<del>
|
||||||
<PersianNumber number={270000} style={"!text-[11px]"} />
|
<PersianNumber number={data?.cost} style={"text-[13px]"} />
|
||||||
</del>
|
</del>
|
||||||
</p>
|
</p>
|
||||||
<div className="flex rtl mt-[8px]">
|
<div className="flex rtl mt-[8px]">
|
||||||
{" "}
|
{" "}
|
||||||
<p className="mb-0 font-bold">
|
<p className="mb-0 font-bold">
|
||||||
<PersianNumber number={150000} />
|
<PersianNumber number={data?.cost} />
|
||||||
</p>
|
</p>
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
<small className="mr-1 mt-[3px]">تومان</small>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -60,7 +99,7 @@ const CardCategoriesMobile = () => {
|
||||||
<div className="flex rtl mt-[3px]">
|
<div className="flex rtl mt-[3px]">
|
||||||
{" "}
|
{" "}
|
||||||
<p className="mb-0 font-bold text-lg">
|
<p className="mb-0 font-bold text-lg">
|
||||||
<PersianNumber number={150000} />
|
<PersianNumber number={data?.cost} />
|
||||||
</p>
|
</p>
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
<small className="mr-1 mt-[6px]">تومان</small>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,115 @@
|
||||||
|
"use client";
|
||||||
|
import React, { useContext } from "react";
|
||||||
|
import { SwiperSlide } from "swiper/react";
|
||||||
|
import p1 from "../../../public/images/product/1.png";
|
||||||
|
import p2 from "../../../public/images/product/2.png";
|
||||||
|
import p3 from "../../../public/images/product/3.png";
|
||||||
|
import p4 from "../../../public/images/product/4.png";
|
||||||
|
import Image from "next/image";
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
|
||||||
|
const CardNormal = (props) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
const cart = CTX.state.cart;
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{" "}
|
||||||
|
<>
|
||||||
|
<div
|
||||||
|
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
||||||
|
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
||||||
|
}`}
|
||||||
|
// key={index}
|
||||||
|
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
||||||
|
>
|
||||||
|
<div className="absolute m-3 ">
|
||||||
|
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
||||||
|
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
||||||
|
<PersianNumber number={35} />
|
||||||
|
<small className="text-[10px] ml-1">%</small>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>{" "}
|
||||||
|
<div className="w-full h-fit ">
|
||||||
|
<Image src={p1} className="xs:w-[110px] lg:w-[170px] mx-auto" />
|
||||||
|
</div>
|
||||||
|
<div className="p-3 text-right">
|
||||||
|
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
||||||
|
لوسیون بدن سلامتی | maya
|
||||||
|
</p>
|
||||||
|
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
||||||
|
{" "}
|
||||||
|
3 عدد موجود انبار
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
<div className="bg-white rounded-full flex ltr p-1 mt-2">
|
||||||
|
<div className="flex">
|
||||||
|
{/*{cart.find(e=>id)}*/}
|
||||||
|
{2 == 1 ? (
|
||||||
|
<div className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full ">
|
||||||
|
<div onClick={() => CTX.AddItemToCart(123, 1)}>
|
||||||
|
<svg
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 176 176"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto mt-[8px]"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
||||||
|
fill="black"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="flex rtl">
|
||||||
|
<div className="w-[35px] h-[35px] bg-gray-200 overflow-hidden rounded-full text-center ">
|
||||||
|
<p className="mb-0 text-[25px] mt-[-2px]">+</p>
|
||||||
|
</div>
|
||||||
|
<p className="mb-0 mx-2 mt-1 font-bold">
|
||||||
|
<PersianNumber number={1} />
|
||||||
|
</p>
|
||||||
|
<div className="w-[35px] h-[35px] bg-red-200 overflow-hidden rounded-full text-center ">
|
||||||
|
<p className="mb-0 text-[30px] mt-[-5px]">-</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="w-full text-right rounded-full pr-2">
|
||||||
|
{2 == 2 ? (
|
||||||
|
<>
|
||||||
|
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
||||||
|
<del>
|
||||||
|
<PersianNumber number={150000} style="text-[9px]" />
|
||||||
|
</del>
|
||||||
|
</p>
|
||||||
|
<div className="flex rtl mt-[8px]">
|
||||||
|
{" "}
|
||||||
|
<p className="mb-0 font-bold">
|
||||||
|
<PersianNumber number={150000} />
|
||||||
|
</p>
|
||||||
|
<small className="mr-1 mt-[3px]">تومان</small>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<div className="flex rtl mt-[3px]">
|
||||||
|
{" "}
|
||||||
|
<p className="mb-0 font-bold text-lg">
|
||||||
|
<PersianNumber number={150000} />
|
||||||
|
</p>
|
||||||
|
<small className="mr-1 mt-[6px]">تومان</small>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CardNormal;
|
||||||
|
|
@ -0,0 +1,171 @@
|
||||||
|
"use client";
|
||||||
|
import React, { useContext, useEffect, useState } from "react";
|
||||||
|
import { Switch } from "@headlessui/react";
|
||||||
|
import RangeSlider from "plugins/RangeSlider/page";
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
|
||||||
|
const FilterCategory = ({
|
||||||
|
id,
|
||||||
|
setSelectedBrands,
|
||||||
|
selectedBrands,
|
||||||
|
setIsChecked,
|
||||||
|
isChecked,
|
||||||
|
rangePrice,
|
||||||
|
setRangePrice,
|
||||||
|
sortBy,
|
||||||
|
isRangePrice,
|
||||||
|
}) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
const brands = CTX.state.brands;
|
||||||
|
|
||||||
|
const handleCheckboxChange = () => {
|
||||||
|
setIsChecked(!isChecked);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleRangeChange = (values) => {
|
||||||
|
setRangePrice(values);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleFilterBrand = (name, id) => {
|
||||||
|
// Check if the brand is already selected
|
||||||
|
const isBrandSelected = selectedBrands.some((brand) => brand.id === id);
|
||||||
|
|
||||||
|
if (!isBrandSelected) {
|
||||||
|
// If the brand is not already selected, add it to the state
|
||||||
|
setSelectedBrands((prevBrands) => [...prevBrands, { name, id }]);
|
||||||
|
} else {
|
||||||
|
// If the brand is already selected, remove it from the state
|
||||||
|
setSelectedBrands((prevBrands) =>
|
||||||
|
prevBrands.filter((brand) => brand.id !== id)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
CTX.fetchProducts(
|
||||||
|
id,
|
||||||
|
selectedBrands,
|
||||||
|
isChecked,
|
||||||
|
rangePrice[0],
|
||||||
|
rangePrice[1],
|
||||||
|
sortBy,
|
||||||
|
isRangePrice
|
||||||
|
);
|
||||||
|
}, [selectedBrands, isChecked]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="ml-4 lg:col-span-2 xl:col-span-1">
|
||||||
|
<div className="sticky top-20 ...">
|
||||||
|
<div className=" w-full">
|
||||||
|
<div className=" border-gray-300 rounded-lg bg-white">
|
||||||
|
<div className=" p-5 flex justify-between">
|
||||||
|
<p className="mb-0 lg:text-sm xl:text-base">برند</p>
|
||||||
|
<div>
|
||||||
|
<svg
|
||||||
|
width="15"
|
||||||
|
height="15"
|
||||||
|
viewBox="0 0 151 89"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mt-1"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M13.1436 14.2219L76.3596 75.9976L138.135 12.7815"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="25"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="h-[300px] overflow-y-auto p-5 scroll-1 overflow-hidden">
|
||||||
|
{brands?.map((e) => (
|
||||||
|
<div onClick={() => handleFilterBrand(e.name, e.id)}>
|
||||||
|
<div className="flex my-2 cursor-pointer">
|
||||||
|
<div
|
||||||
|
className={` w-[30px] h-[30px] rounded-lg border ml-3 tr03 ${
|
||||||
|
selectedBrands.find((d) => d.id == e.id)
|
||||||
|
? "bg-primary-200 p-1"
|
||||||
|
: ""
|
||||||
|
} `}
|
||||||
|
></div>
|
||||||
|
<p className="mb-0 text-gray-600 text-sm mt-1">{e.name}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="p-5 border-gray-300 rounded-lg mt-3 flex justify-between bg-white">
|
||||||
|
<p className="mb-0 lg:text-sm xl:text-base">فقط محصولات موجود </p>
|
||||||
|
<Switch
|
||||||
|
checked={isChecked}
|
||||||
|
onChange={handleCheckboxChange}
|
||||||
|
className={`${
|
||||||
|
isChecked ? "bg-primary-500" : "bg-gray-400"
|
||||||
|
} relative inline-flex h-6 w-[50px] items-center rounded-full`}
|
||||||
|
>
|
||||||
|
<span className="sr-only">Enable notifications</span>
|
||||||
|
<span
|
||||||
|
className={`${
|
||||||
|
isChecked ? "translate-x-[-5px]" : "translate-x-[-30px]"
|
||||||
|
} inline-block h-4 w-4 transform rounded-full bg-white transition`}
|
||||||
|
/>
|
||||||
|
</Switch>
|
||||||
|
</div>
|
||||||
|
<div className="p-5 border-gray-300 rounded-lg mt-3 bg-white">
|
||||||
|
<div className="flex justify-between ">
|
||||||
|
<p className="mb-0">محدوده قیمت</p>
|
||||||
|
<div>
|
||||||
|
<svg
|
||||||
|
width="15"
|
||||||
|
height="15"
|
||||||
|
viewBox="0 0 151 89"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mt-1"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M13.1436 14.2219L76.3596 75.9976L138.135 12.7815"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="25"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="mt-10 px-5">
|
||||||
|
<RangeSlider min={0} max={100} onChange={handleRangeChange} />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex mt-5">
|
||||||
|
<div className="w-full text-center">
|
||||||
|
<p className="mb-0 text-sm">تا قیمت</p>
|
||||||
|
<p className="mb-0">
|
||||||
|
<PersianNumber number={rangePrice[0]} style="font-bold" />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="w-full text-center">
|
||||||
|
<p className="mb-0 text-sm">از قیمت</p>
|
||||||
|
<p className="mb-0">
|
||||||
|
<PersianNumber number={rangePrice[1]} style="font-bold" />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mt-4">
|
||||||
|
<button className="btn btn-primary w-full rounded-full text-sm ">
|
||||||
|
اعمال فیلتر
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default FilterCategory;
|
||||||
|
|
@ -0,0 +1,137 @@
|
||||||
|
"use client";
|
||||||
|
import CardCategories from "@comp/Cards/CardCategories/page";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import React, { useContext, useEffect } from "react";
|
||||||
|
|
||||||
|
const ListProdocts = ({
|
||||||
|
sortBy,
|
||||||
|
setSortBy,
|
||||||
|
rangePrice,
|
||||||
|
selectedBrands,
|
||||||
|
isChecked,
|
||||||
|
id,
|
||||||
|
isRangePrice,
|
||||||
|
}) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
const products = CTX.state.products;
|
||||||
|
|
||||||
|
console.log("products", products);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
CTX.fetchProducts(
|
||||||
|
id,
|
||||||
|
selectedBrands,
|
||||||
|
isChecked,
|
||||||
|
rangePrice,
|
||||||
|
rangePrice,
|
||||||
|
sortBy,
|
||||||
|
isRangePrice
|
||||||
|
);
|
||||||
|
}, [sortBy]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="lg:col-span-6 xl:col-span-4 ">
|
||||||
|
<div className=" px-10 ">
|
||||||
|
<div className=" border-b-[1px] border-gray-300 pb-6">
|
||||||
|
<div className="flex justify-between">
|
||||||
|
<div className="flex">
|
||||||
|
<div>
|
||||||
|
<p className="mb-0 lg:text-sm xl:text-base"> فیلتر بر اساس :</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex">
|
||||||
|
<div
|
||||||
|
className={`w-fit rounded-full px-2 mx-2 tr03 ${
|
||||||
|
sortBy == 1 ? "bg-primary-600" : " opacity-60 "
|
||||||
|
}`}
|
||||||
|
onClick={() => setSortBy(1)}
|
||||||
|
>
|
||||||
|
<p
|
||||||
|
className={`mb-0 lg:text-sm xl:text-base ${
|
||||||
|
sortBy == 1 ? "text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
پربازدید ترین
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className={`w-fit rounded-full px-2 mx-2 tr03 ${
|
||||||
|
sortBy == 2 ? "bg-primary-600" : " opacity-60 "
|
||||||
|
}`}
|
||||||
|
onClick={() => setSortBy(2)}
|
||||||
|
>
|
||||||
|
<p
|
||||||
|
className={`mb-0 lg:text-sm xl:text-base ${
|
||||||
|
sortBy == 2 ? "text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
محبوب ترین
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className={`w-fit rounded-full px-2 mx-2 tr03 ${
|
||||||
|
sortBy == 3 ? "bg-primary-600" : " opacity-60 "
|
||||||
|
}`}
|
||||||
|
onClick={() => setSortBy(3)}
|
||||||
|
>
|
||||||
|
<p
|
||||||
|
className={`mb-0 lg:text-sm xl:text-base ${
|
||||||
|
sortBy == 3 ? "text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
گران ترین
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className={`w-fit rounded-full px-2 mx-2 tr03 ${
|
||||||
|
sortBy == 4 ? "bg-primary-600" : " opacity-60 "
|
||||||
|
}`}
|
||||||
|
onClick={() => setSortBy(4)}
|
||||||
|
>
|
||||||
|
<p
|
||||||
|
className={`mb-0 lg:text-sm xl:text-base ${
|
||||||
|
sortBy == 4 ? "text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
ارزان ترین
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className={`w-fit rounded-full px-2 mx-2 tr03 ${
|
||||||
|
sortBy == 5 ? "bg-primary-600" : " opacity-60 "
|
||||||
|
}`}
|
||||||
|
onClick={() => setSortBy(5)}
|
||||||
|
>
|
||||||
|
<p
|
||||||
|
className={`mb-0 lg:text-sm xl:text-base ${
|
||||||
|
sortBy == 5 ? "text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
پرفروش ترین
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="">
|
||||||
|
<p className="mb-0 text-base lg:text-sm xl:text-base">
|
||||||
|
<PersianNumber
|
||||||
|
number={12354}
|
||||||
|
style="text-[16px] mx-2 font-bold"
|
||||||
|
/>
|
||||||
|
کالا
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid xs:grid-cols-1 lg:grid-cols-4 xl:grid-cols-5">
|
||||||
|
<>{products && products.map((e) => <CardCategories data={e} />)}</>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ListProdocts;
|
||||||
|
|
@ -0,0 +1,129 @@
|
||||||
|
"use client";
|
||||||
|
import SideBarNavBarMobile from "@comp/Navbar/SideBarNavBarMobile/page";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import React, { useContext } from "react";
|
||||||
|
|
||||||
|
const FilterCategoryMobile = (props) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="mt-5 px-3">
|
||||||
|
<div className="absolute right-0 mr-[15px] mt-[0px]">
|
||||||
|
<div
|
||||||
|
className="bg-white rounded-r-lg h-[47px] w-[40px] border-l-[1px] mt-[2px] "
|
||||||
|
onClick={() => {
|
||||||
|
CTX.setCloseNavbar(true);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div className="pt-[9px] ">
|
||||||
|
<svg
|
||||||
|
width="25"
|
||||||
|
height="28"
|
||||||
|
viewBox="0 0 235 124"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M145.5 124L145.5 93.4995L235 93.4995L235 124L145.5 124ZM75.5 26.4998L75.5 0.499997L235 0.499997L235 26.4998L75.5 26.4998ZM0.499998 72.4996L0.499997 47.4996L235 47.4996L235 72.4996L0.499998 72.4996Z"
|
||||||
|
fill="black"
|
||||||
|
fill-opacity="0.73"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
className="form-control bg-white !border-[0px] border-gray-100 rounded-lg text-right focus:!border-[0px] !text-sm !pr-[60px] "
|
||||||
|
placeholder="دستت برای جست و جو بازه"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="absolute mt-[-46px] ml-[6px]">
|
||||||
|
<div className="w-[40px] h-[40px] bg-gray-100 rounded-lg pt-2">
|
||||||
|
<svg
|
||||||
|
width="17"
|
||||||
|
height="17"
|
||||||
|
viewBox="0 0 275 275"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto mt-1"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M215.913 215.913L265 265M250.832 130.822C250.832 197.553 196.915 251.644 130.424 251.644C63.9166 251.644 10 197.552 10 130.838C10 64.0759 63.9166 10 130.408 10C196.915 10 250.832 64.0919 250.832 130.822Z"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="18.75"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex my-5 px-3">
|
||||||
|
<div className="w-full flex rtl justify-center">
|
||||||
|
<div>
|
||||||
|
<svg
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 238 214"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-2 opacity-30"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M31.5 107V7M206.5 207V169.5M31.5 207V157M206.5 119.5V7M119 44.5V7M119 207V94.5"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="12.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M31.5 157C45.3071 157 56.5 145.807 56.5 132C56.5 118.193 45.3071 107 31.5 107C17.6929 107 6.5 118.193 6.5 132C6.5 145.807 17.6929 157 31.5 157Z"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="12.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M119 94.5C132.807 94.5 144 83.3071 144 69.5C144 55.6929 132.807 44.5 119 44.5C105.193 44.5 94 55.6929 94 69.5C94 83.3071 105.193 94.5 119 94.5Z"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="12.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M206.5 169.5C220.307 169.5 231.5 158.307 231.5 144.5C231.5 130.693 220.307 119.5 206.5 119.5C192.693 119.5 181.5 130.693 181.5 144.5C181.5 158.307 192.693 169.5 206.5 169.5Z"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="12.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<p className="mb-0 text-sm text-gray-500">فیلتر ها</p>
|
||||||
|
</div>
|
||||||
|
<div className="w-full flex rtl justify-center">
|
||||||
|
<div>
|
||||||
|
<svg
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 300 300"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className=" opacity-30"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M175.462 261.712C173.18 261.701 170.943 261.075 168.987 259.9L127.312 234.9C122.624 232.071 118.743 228.082 116.044 223.318C113.344 218.554 111.917 213.175 111.9 207.7V151.137C111.911 147.145 110.67 143.249 108.35 140L50.1623 58.2247C48.8035 56.3369 47.9927 54.1105 47.8193 51.791C47.6459 49.4716 48.1166 47.1493 49.1795 45.0804C50.2424 43.0116 51.8561 41.2765 53.8427 40.0668C55.8292 38.857 58.1113 38.2195 60.4373 38.2247H239.562C241.89 38.215 244.175 38.8497 246.164 40.0585C248.154 41.2673 249.77 43.003 250.833 45.0736C251.897 47.1441 252.367 49.4686 252.191 51.7897C252.015 54.1108 251.201 56.338 249.837 58.2247L191.65 140C189.326 143.248 188.08 147.143 188.087 151.137V249.062C188.084 252.412 186.754 255.624 184.387 257.995C182.021 260.366 178.812 261.702 175.462 261.712ZM60.4373 50.7872L118.525 132.75C122.363 138.111 124.418 144.544 124.4 151.137V207.687C124.408 211.005 125.272 214.264 126.907 217.15C128.543 220.036 130.895 222.451 133.737 224.162L175.412 249.162L175.587 151.125C175.573 144.53 177.633 138.098 181.475 132.737L239.65 50.9622L60.4373 50.7872Z"
|
||||||
|
fill="black"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<p className="mb-0 text-sm text-gray-500">ترند ها</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<SideBarNavBarMobile />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default FilterCategoryMobile;
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
"use client";
|
||||||
|
import CardCategoriesMobile from "@comp/Cards/CardCategoriesMobile/page";
|
||||||
|
import CardNormal from "@comp/Cards/CardNormal/page";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import React, { useContext } from "react";
|
||||||
|
|
||||||
|
const ListProductsMobile = (props) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
|
||||||
|
const products = CTX.state.products;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="grid xs:grid-cols-1 lg:grid-cols-4 xl:grid-cols-5">
|
||||||
|
<>{products && products.map((e) => <CardCategoriesMobile data={e} />)}</>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ListProductsMobile;
|
||||||
|
|
@ -0,0 +1,87 @@
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
|
const PaginationCategoory = (props) => {
|
||||||
|
return (
|
||||||
|
<div className="flex justify-center rtl mb-10">
|
||||||
|
<div className="w-[40px] h-[40px] rounded-full bg-primary-400 mx-2">
|
||||||
|
<svg
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 88 151"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto mt-3 pr-[2px]"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M12.9525 138.35L75.249 75.6471L12.5462 13.3506"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="25"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
||||||
|
<p className="mb-0 text-center pt-2">
|
||||||
|
<PersianNumber
|
||||||
|
number={1}
|
||||||
|
style="text-white !text-[16px] font-bold "
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
||||||
|
<p className="mb-0 text-center pt-2">
|
||||||
|
<PersianNumber
|
||||||
|
number={2}
|
||||||
|
style="text-white !text-[16px] font-bold "
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
||||||
|
<p className="mb-0 text-center pt-2">
|
||||||
|
<PersianNumber
|
||||||
|
number={3}
|
||||||
|
style="text-white !text-[16px] font-bold "
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
||||||
|
<p className="mb-0 text-center pt-2">
|
||||||
|
<PersianNumber
|
||||||
|
number={4}
|
||||||
|
style="text-white !text-[16px] font-bold "
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
||||||
|
<p className="mb-0 text-center pt-2">
|
||||||
|
<PersianNumber
|
||||||
|
number={5}
|
||||||
|
style="text-white !text-[16px] font-bold "
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="w-[40px] h-[40px] rounded-full bg-primary-400 mx-2">
|
||||||
|
<svg
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 89 151"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="mx-auto mt-3 pr-[2px]"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M74.7462 13.0002L12.7501 76.0001L75.7499 137.996"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="25"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default PaginationCategoory;
|
||||||
|
|
@ -159,7 +159,8 @@ const Footer = () => {
|
||||||
<div className="h-[1px] border-[1px] border-gray-200 my-10 xs:mx-5 lg:mx-20">
|
<div className="h-[1px] border-[1px] border-gray-200 my-10 xs:mx-5 lg:mx-20">
|
||||||
<p className="mb-0 text-gray-400 text-sm text-center py-5 rtl">
|
<p className="mb-0 text-gray-400 text-sm text-center py-5 rtl">
|
||||||
استفاده از مطالب فروشگاه شاواز فقط برای مقاصد غیرتجاری و باذکر منبع
|
استفاده از مطالب فروشگاه شاواز فقط برای مقاصد غیرتجاری و باذکر منبع
|
||||||
بلامانع است. کلیه حقوق این سایت متعلق به شرکت وسمه می باشد.
|
بلامانع است. کلیه حقوق این سایت متعلق به شرکت وسمه می باشد. ورژن
|
||||||
|
{process.env.NEXT_PUBLIC_PACKAGE_VERSION}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,7 @@ import p1 from "../../../public/images/product/1.png";
|
||||||
import p2 from "../../../public/images/product/2.png";
|
import p2 from "../../../public/images/product/2.png";
|
||||||
import p3 from "../../../public/images/product/3.png";
|
import p3 from "../../../public/images/product/3.png";
|
||||||
import p4 from "../../../public/images/product/4.png";
|
import p4 from "../../../public/images/product/4.png";
|
||||||
|
import CardNormal from "@comp/Cards/CardNormal/page";
|
||||||
|
|
||||||
const SurpriseSection = () => {
|
const SurpriseSection = () => {
|
||||||
return (
|
return (
|
||||||
|
|
@ -46,7 +47,7 @@ const SurpriseSection = () => {
|
||||||
className="rtl relative mt-5"
|
className="rtl relative mt-5"
|
||||||
breakpoints={{
|
breakpoints={{
|
||||||
320: {
|
320: {
|
||||||
slidesPerView: 1.6,
|
slidesPerView: 1.4,
|
||||||
},
|
},
|
||||||
480: {
|
480: {
|
||||||
slidesPerView: 2,
|
slidesPerView: 2,
|
||||||
|
|
@ -63,688 +64,13 @@ const SurpriseSection = () => {
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<SwiperSlide>
|
<SwiperSlide>
|
||||||
<>
|
<CardNormal />
|
||||||
<div
|
|
||||||
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
|
||||||
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
|
||||||
}`}
|
|
||||||
// key={index}
|
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
|
||||||
>
|
|
||||||
<div className="absolute m-3 ">
|
|
||||||
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
|
||||||
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
|
||||||
<PersianNumber number={35} />
|
|
||||||
<small className="text-[10px] ml-1">%</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p1}
|
|
||||||
className="xs:w-[110px] lg:w-[170px] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
|
||||||
لوسیون بدن سلامتی | maya
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-full flex ltr p-3 mt-2">
|
|
||||||
<div className="flex">
|
|
||||||
{/* <div className="w-[30px] h-[30px] rounded-full mx-1">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="25"
|
|
||||||
height="25"
|
|
||||||
viewBox="0 0 145 183"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M129.626 183C125.799 182.993 122.118 181.677 119.323 179.317L75.958 143.408C75.0148 142.618 73.7759 142.179 72.4896 142.179C71.2032 142.179 69.9643 142.618 69.0212 143.408L25.6662 179.317C23.4815 181.132 20.7588 182.335 17.83 182.778C14.9012 183.221 11.8929 182.885 9.17199 181.811C6.45107 180.737 4.13509 178.972 2.50646 176.731C0.877836 174.49 0.00695006 171.869 0 169.189V23.0189C0 16.9139 2.68691 11.0589 7.46964 6.74207C12.2524 2.4252 18.7391 0 25.5029 0H119.497C126.26 0 132.747 2.4252 137.53 6.74207C142.313 11.0589 145 16.9139 145 23.0189V169.161C145.023 171.852 144.164 174.489 142.53 176.741C140.896 178.992 138.561 180.757 135.818 181.812C133.868 182.592 131.759 182.996 129.626 183ZM72.4998 132.957C76.3447 132.949 80.0521 134.247 82.8846 136.594L126.25 172.503C126.979 173.11 127.888 173.512 128.866 173.66C129.844 173.808 130.849 173.695 131.757 173.335C132.665 172.976 133.437 172.385 133.979 171.636C134.521 170.886 134.809 170.01 134.809 169.115V23.0189C134.809 19.3559 133.196 15.8429 130.327 13.2528C127.457 10.6627 123.565 9.20755 119.507 9.20755H25.5029C21.4447 9.20755 17.5526 10.6627 14.683 13.2528C11.8133 15.8429 10.2012 19.3559 10.2012 23.0189V169.161C10.2002 170.056 10.4884 170.932 11.0304 171.682C11.5725 172.431 12.3448 173.022 13.253 173.381C14.1611 173.741 15.1657 173.854 16.1438 173.706C17.1219 173.558 18.031 173.156 18.76 172.549L62.1252 136.548C64.9627 134.22 68.6652 132.938 72.4998 132.957Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="w-[35px] h-[35px] bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
|
||||||
{2 == 2 ? (
|
|
||||||
<>
|
|
||||||
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
|
||||||
<del>
|
|
||||||
<PersianNumber number={150000} style={"text-[13px]"} />
|
|
||||||
</del>
|
|
||||||
</p>
|
|
||||||
<div className="flex rtl mt-[8px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div className="flex rtl mt-[3px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold text-lg">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SwiperSlide>
|
</SwiperSlide>
|
||||||
<SwiperSlide>
|
<SwiperSlide>
|
||||||
<>
|
<CardNormal />
|
||||||
<div
|
|
||||||
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
|
||||||
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
|
||||||
}`}
|
|
||||||
// key={index}
|
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
|
||||||
>
|
|
||||||
<div className="absolute m-3 ">
|
|
||||||
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
|
||||||
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
|
||||||
<PersianNumber number={35} />
|
|
||||||
<small className="text-[10px] ml-1">%</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p2}
|
|
||||||
className="xs:w-[110px] lg:w-[170px] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
|
||||||
سلامتی | maya
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-full flex ltr p-3 mt-2">
|
|
||||||
<div className="flex">
|
|
||||||
{/* <div className="w-[30px] h-[30px] rounded-full mx-1">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="25"
|
|
||||||
height="25"
|
|
||||||
viewBox="0 0 145 183"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M129.626 183C125.799 182.993 122.118 181.677 119.323 179.317L75.958 143.408C75.0148 142.618 73.7759 142.179 72.4896 142.179C71.2032 142.179 69.9643 142.618 69.0212 143.408L25.6662 179.317C23.4815 181.132 20.7588 182.335 17.83 182.778C14.9012 183.221 11.8929 182.885 9.17199 181.811C6.45107 180.737 4.13509 178.972 2.50646 176.731C0.877836 174.49 0.00695006 171.869 0 169.189V23.0189C0 16.9139 2.68691 11.0589 7.46964 6.74207C12.2524 2.4252 18.7391 0 25.5029 0H119.497C126.26 0 132.747 2.4252 137.53 6.74207C142.313 11.0589 145 16.9139 145 23.0189V169.161C145.023 171.852 144.164 174.489 142.53 176.741C140.896 178.992 138.561 180.757 135.818 181.812C133.868 182.592 131.759 182.996 129.626 183ZM72.4998 132.957C76.3447 132.949 80.0521 134.247 82.8846 136.594L126.25 172.503C126.979 173.11 127.888 173.512 128.866 173.66C129.844 173.808 130.849 173.695 131.757 173.335C132.665 172.976 133.437 172.385 133.979 171.636C134.521 170.886 134.809 170.01 134.809 169.115V23.0189C134.809 19.3559 133.196 15.8429 130.327 13.2528C127.457 10.6627 123.565 9.20755 119.507 9.20755H25.5029C21.4447 9.20755 17.5526 10.6627 14.683 13.2528C11.8133 15.8429 10.2012 19.3559 10.2012 23.0189V169.161C10.2002 170.056 10.4884 170.932 11.0304 171.682C11.5725 172.431 12.3448 173.022 13.253 173.381C14.1611 173.741 15.1657 173.854 16.1438 173.706C17.1219 173.558 18.031 173.156 18.76 172.549L62.1252 136.548C64.9627 134.22 68.6652 132.938 72.4998 132.957Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="w-[35px] h-[35px] bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
|
||||||
{2 == 2 ? (
|
|
||||||
<>
|
|
||||||
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
|
||||||
<del>
|
|
||||||
<PersianNumber number={150000} style={"text-[13px]"} />
|
|
||||||
</del>
|
|
||||||
</p>
|
|
||||||
<div className="flex rtl mt-[8px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div className="flex rtl mt-[3px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold text-lg">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SwiperSlide>
|
</SwiperSlide>
|
||||||
<SwiperSlide>
|
<SwiperSlide>
|
||||||
<>
|
<CardNormal />
|
||||||
<div
|
|
||||||
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
|
||||||
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
|
||||||
}`}
|
|
||||||
// key={index}
|
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
|
||||||
>
|
|
||||||
<div className="absolute m-3 ">
|
|
||||||
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
|
||||||
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
|
||||||
<PersianNumber number={35} />
|
|
||||||
<small className="text-[10px] ml-1">%</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p3}
|
|
||||||
className="xs:w-[110px] lg:w-[170px] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
|
||||||
لوسیو
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-full flex ltr p-3 mt-2">
|
|
||||||
<div className="flex">
|
|
||||||
{/* <div className="w-[30px] h-[30px] rounded-full mx-1">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="25"
|
|
||||||
height="25"
|
|
||||||
viewBox="0 0 145 183"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M129.626 183C125.799 182.993 122.118 181.677 119.323 179.317L75.958 143.408C75.0148 142.618 73.7759 142.179 72.4896 142.179C71.2032 142.179 69.9643 142.618 69.0212 143.408L25.6662 179.317C23.4815 181.132 20.7588 182.335 17.83 182.778C14.9012 183.221 11.8929 182.885 9.17199 181.811C6.45107 180.737 4.13509 178.972 2.50646 176.731C0.877836 174.49 0.00695006 171.869 0 169.189V23.0189C0 16.9139 2.68691 11.0589 7.46964 6.74207C12.2524 2.4252 18.7391 0 25.5029 0H119.497C126.26 0 132.747 2.4252 137.53 6.74207C142.313 11.0589 145 16.9139 145 23.0189V169.161C145.023 171.852 144.164 174.489 142.53 176.741C140.896 178.992 138.561 180.757 135.818 181.812C133.868 182.592 131.759 182.996 129.626 183ZM72.4998 132.957C76.3447 132.949 80.0521 134.247 82.8846 136.594L126.25 172.503C126.979 173.11 127.888 173.512 128.866 173.66C129.844 173.808 130.849 173.695 131.757 173.335C132.665 172.976 133.437 172.385 133.979 171.636C134.521 170.886 134.809 170.01 134.809 169.115V23.0189C134.809 19.3559 133.196 15.8429 130.327 13.2528C127.457 10.6627 123.565 9.20755 119.507 9.20755H25.5029C21.4447 9.20755 17.5526 10.6627 14.683 13.2528C11.8133 15.8429 10.2012 19.3559 10.2012 23.0189V169.161C10.2002 170.056 10.4884 170.932 11.0304 171.682C11.5725 172.431 12.3448 173.022 13.253 173.381C14.1611 173.741 15.1657 173.854 16.1438 173.706C17.1219 173.558 18.031 173.156 18.76 172.549L62.1252 136.548C64.9627 134.22 68.6652 132.938 72.4998 132.957Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="w-[35px] h-[35px] bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
|
||||||
{2 == 2 ? (
|
|
||||||
<>
|
|
||||||
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
|
||||||
<del>
|
|
||||||
<PersianNumber number={150000} style={"text-[13px]"} />
|
|
||||||
</del>
|
|
||||||
</p>
|
|
||||||
<div className="flex rtl mt-[8px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div className="flex rtl mt-[3px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold text-lg">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SwiperSlide>
|
|
||||||
<SwiperSlide>
|
|
||||||
<>
|
|
||||||
<div
|
|
||||||
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
|
||||||
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
|
||||||
}`}
|
|
||||||
// key={index}
|
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
|
||||||
>
|
|
||||||
<div className="absolute m-3 ">
|
|
||||||
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
|
||||||
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
|
||||||
<PersianNumber number={35} />
|
|
||||||
<small className="text-[10px] ml-1">%</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p4}
|
|
||||||
className="xs:w-[110px] lg:w-[170px] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
|
||||||
لوسیون |mexicano milanono
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-full flex ltr p-3 mt-2">
|
|
||||||
<div className="flex">
|
|
||||||
{/* <div className="w-[30px] h-[30px] rounded-full mx-1">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="25"
|
|
||||||
height="25"
|
|
||||||
viewBox="0 0 145 183"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M129.626 183C125.799 182.993 122.118 181.677 119.323 179.317L75.958 143.408C75.0148 142.618 73.7759 142.179 72.4896 142.179C71.2032 142.179 69.9643 142.618 69.0212 143.408L25.6662 179.317C23.4815 181.132 20.7588 182.335 17.83 182.778C14.9012 183.221 11.8929 182.885 9.17199 181.811C6.45107 180.737 4.13509 178.972 2.50646 176.731C0.877836 174.49 0.00695006 171.869 0 169.189V23.0189C0 16.9139 2.68691 11.0589 7.46964 6.74207C12.2524 2.4252 18.7391 0 25.5029 0H119.497C126.26 0 132.747 2.4252 137.53 6.74207C142.313 11.0589 145 16.9139 145 23.0189V169.161C145.023 171.852 144.164 174.489 142.53 176.741C140.896 178.992 138.561 180.757 135.818 181.812C133.868 182.592 131.759 182.996 129.626 183ZM72.4998 132.957C76.3447 132.949 80.0521 134.247 82.8846 136.594L126.25 172.503C126.979 173.11 127.888 173.512 128.866 173.66C129.844 173.808 130.849 173.695 131.757 173.335C132.665 172.976 133.437 172.385 133.979 171.636C134.521 170.886 134.809 170.01 134.809 169.115V23.0189C134.809 19.3559 133.196 15.8429 130.327 13.2528C127.457 10.6627 123.565 9.20755 119.507 9.20755H25.5029C21.4447 9.20755 17.5526 10.6627 14.683 13.2528C11.8133 15.8429 10.2012 19.3559 10.2012 23.0189V169.161C10.2002 170.056 10.4884 170.932 11.0304 171.682C11.5725 172.431 12.3448 173.022 13.253 173.381C14.1611 173.741 15.1657 173.854 16.1438 173.706C17.1219 173.558 18.031 173.156 18.76 172.549L62.1252 136.548C64.9627 134.22 68.6652 132.938 72.4998 132.957Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="w-[35px] h-[35px] bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
|
||||||
{2 == 2 ? (
|
|
||||||
<>
|
|
||||||
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
|
||||||
<del>
|
|
||||||
<PersianNumber number={150000} style={"text-[13px]"} />
|
|
||||||
</del>
|
|
||||||
</p>
|
|
||||||
<div className="flex rtl mt-[8px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div className="flex rtl mt-[3px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold text-lg">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SwiperSlide>
|
|
||||||
<SwiperSlide>
|
|
||||||
<>
|
|
||||||
<div
|
|
||||||
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
|
||||||
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
|
||||||
}`}
|
|
||||||
// key={index}
|
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
|
||||||
>
|
|
||||||
<div className="absolute m-3 ">
|
|
||||||
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
|
||||||
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
|
||||||
<PersianNumber number={35} />
|
|
||||||
<small className="text-[10px] ml-1">%</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p1}
|
|
||||||
className="xs:w-[110px] lg:w-[170px] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
|
||||||
لوسیون بدن سلامتی | maya
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-full flex ltr p-3 mt-2">
|
|
||||||
<div className="flex">
|
|
||||||
{/* <div className="w-[30px] h-[30px] rounded-full mx-1">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="25"
|
|
||||||
height="25"
|
|
||||||
viewBox="0 0 145 183"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M129.626 183C125.799 182.993 122.118 181.677 119.323 179.317L75.958 143.408C75.0148 142.618 73.7759 142.179 72.4896 142.179C71.2032 142.179 69.9643 142.618 69.0212 143.408L25.6662 179.317C23.4815 181.132 20.7588 182.335 17.83 182.778C14.9012 183.221 11.8929 182.885 9.17199 181.811C6.45107 180.737 4.13509 178.972 2.50646 176.731C0.877836 174.49 0.00695006 171.869 0 169.189V23.0189C0 16.9139 2.68691 11.0589 7.46964 6.74207C12.2524 2.4252 18.7391 0 25.5029 0H119.497C126.26 0 132.747 2.4252 137.53 6.74207C142.313 11.0589 145 16.9139 145 23.0189V169.161C145.023 171.852 144.164 174.489 142.53 176.741C140.896 178.992 138.561 180.757 135.818 181.812C133.868 182.592 131.759 182.996 129.626 183ZM72.4998 132.957C76.3447 132.949 80.0521 134.247 82.8846 136.594L126.25 172.503C126.979 173.11 127.888 173.512 128.866 173.66C129.844 173.808 130.849 173.695 131.757 173.335C132.665 172.976 133.437 172.385 133.979 171.636C134.521 170.886 134.809 170.01 134.809 169.115V23.0189C134.809 19.3559 133.196 15.8429 130.327 13.2528C127.457 10.6627 123.565 9.20755 119.507 9.20755H25.5029C21.4447 9.20755 17.5526 10.6627 14.683 13.2528C11.8133 15.8429 10.2012 19.3559 10.2012 23.0189V169.161C10.2002 170.056 10.4884 170.932 11.0304 171.682C11.5725 172.431 12.3448 173.022 13.253 173.381C14.1611 173.741 15.1657 173.854 16.1438 173.706C17.1219 173.558 18.031 173.156 18.76 172.549L62.1252 136.548C64.9627 134.22 68.6652 132.938 72.4998 132.957Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="w-[35px] h-[35px] bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
|
||||||
{2 == 2 ? (
|
|
||||||
<>
|
|
||||||
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
|
||||||
<del>
|
|
||||||
<PersianNumber number={150000} style={"text-[13px]"} />
|
|
||||||
</del>
|
|
||||||
</p>
|
|
||||||
<div className="flex rtl mt-[8px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div className="flex rtl mt-[3px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold text-lg">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SwiperSlide>
|
|
||||||
<SwiperSlide>
|
|
||||||
<>
|
|
||||||
<div
|
|
||||||
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
|
||||||
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
|
||||||
}`}
|
|
||||||
// key={index}
|
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
|
||||||
>
|
|
||||||
<div className="absolute m-3 ">
|
|
||||||
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
|
||||||
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
|
||||||
<PersianNumber number={35} />
|
|
||||||
<small className="text-[10px] ml-1">%</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p1}
|
|
||||||
className="xs:w-[110px] lg:w-[170px] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
|
||||||
لوسیون بدن سلامتی | maya
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-full flex ltr p-3 mt-2">
|
|
||||||
<div className="flex">
|
|
||||||
{/* <div className="w-[30px] h-[30px] rounded-full mx-1">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="25"
|
|
||||||
height="25"
|
|
||||||
viewBox="0 0 145 183"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M129.626 183C125.799 182.993 122.118 181.677 119.323 179.317L75.958 143.408C75.0148 142.618 73.7759 142.179 72.4896 142.179C71.2032 142.179 69.9643 142.618 69.0212 143.408L25.6662 179.317C23.4815 181.132 20.7588 182.335 17.83 182.778C14.9012 183.221 11.8929 182.885 9.17199 181.811C6.45107 180.737 4.13509 178.972 2.50646 176.731C0.877836 174.49 0.00695006 171.869 0 169.189V23.0189C0 16.9139 2.68691 11.0589 7.46964 6.74207C12.2524 2.4252 18.7391 0 25.5029 0H119.497C126.26 0 132.747 2.4252 137.53 6.74207C142.313 11.0589 145 16.9139 145 23.0189V169.161C145.023 171.852 144.164 174.489 142.53 176.741C140.896 178.992 138.561 180.757 135.818 181.812C133.868 182.592 131.759 182.996 129.626 183ZM72.4998 132.957C76.3447 132.949 80.0521 134.247 82.8846 136.594L126.25 172.503C126.979 173.11 127.888 173.512 128.866 173.66C129.844 173.808 130.849 173.695 131.757 173.335C132.665 172.976 133.437 172.385 133.979 171.636C134.521 170.886 134.809 170.01 134.809 169.115V23.0189C134.809 19.3559 133.196 15.8429 130.327 13.2528C127.457 10.6627 123.565 9.20755 119.507 9.20755H25.5029C21.4447 9.20755 17.5526 10.6627 14.683 13.2528C11.8133 15.8429 10.2012 19.3559 10.2012 23.0189V169.161C10.2002 170.056 10.4884 170.932 11.0304 171.682C11.5725 172.431 12.3448 173.022 13.253 173.381C14.1611 173.741 15.1657 173.854 16.1438 173.706C17.1219 173.558 18.031 173.156 18.76 172.549L62.1252 136.548C64.9627 134.22 68.6652 132.938 72.4998 132.957Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="w-[35px] h-[35px] bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
|
||||||
{2 == 2 ? (
|
|
||||||
<>
|
|
||||||
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
|
||||||
<del>
|
|
||||||
<PersianNumber number={150000} style={"text-[13px]"} />
|
|
||||||
</del>
|
|
||||||
</p>
|
|
||||||
<div className="flex rtl mt-[8px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div className="flex rtl mt-[3px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold text-lg">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SwiperSlide>
|
|
||||||
<SwiperSlide>
|
|
||||||
<>
|
|
||||||
<div
|
|
||||||
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${
|
|
||||||
1 == 1 ? "bg-white rounded-xl" : " opacity-70"
|
|
||||||
}`}
|
|
||||||
// key={index}
|
|
||||||
// onClick={() => handleRoutineShiftPlanWithDay(index)}
|
|
||||||
>
|
|
||||||
<div className="absolute m-3 ">
|
|
||||||
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 ">
|
|
||||||
<p className="mb-0 text-[10px] text-white pt-[3px] ">
|
|
||||||
<PersianNumber number={35} />
|
|
||||||
<small className="text-[10px] ml-1">%</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
<div className="w-full h-fit ">
|
|
||||||
<Image
|
|
||||||
src={p1}
|
|
||||||
className="xs:w-[110px] lg:w-[170px] mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="p-3 text-right">
|
|
||||||
<p className="mb-0 text-[15px] font-bold max-h-[50px] ">
|
|
||||||
لوسیون بدن سلامتی | maya
|
|
||||||
</p>
|
|
||||||
<p className="mb-0 text-[12px] text-red-600 font-medium">
|
|
||||||
{" "}
|
|
||||||
3 عدد موجود انبار
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-full flex ltr p-3 mt-2">
|
|
||||||
<div className="flex">
|
|
||||||
<div className="w-[35px] h-[35px] bg-gray-100 overflow-hidden rounded-full mx-1 ">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 176 176"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-[6px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M163 100.475H100.5V162.975C100.5 166.29 99.183 169.47 96.8388 171.814C94.4946 174.158 91.3152 175.475 88 175.475C84.6848 175.475 81.5054 174.158 79.1612 171.814C76.817 169.47 75.5 166.29 75.5 162.975V100.475H13C9.68479 100.475 6.50537 99.1581 4.16117 96.8139C1.81696 94.4697 0.5 91.2903 0.5 87.9751C0.5 84.6599 1.81696 81.4805 4.16117 79.1363C6.50537 76.7921 9.68479 75.4751 13 75.4751H75.5V12.9751C75.5 9.65989 76.817 6.48046 79.1612 4.13626C81.5054 1.79205 84.6848 0.475098 88 0.475098C91.3152 0.475098 94.4946 1.79205 96.8388 4.13626C99.183 6.48046 100.5 9.65989 100.5 12.9751V75.4751H163C166.315 75.4751 169.495 76.7921 171.839 79.1363C174.183 81.4805 175.5 84.6599 175.5 87.9751C175.5 91.2903 174.183 94.4697 171.839 96.8139C169.495 99.1581 166.315 100.475 163 100.475Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full text-right rounded-full">
|
|
||||||
{2 == 2 ? (
|
|
||||||
<>
|
|
||||||
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
|
|
||||||
<del>
|
|
||||||
<PersianNumber number={150000} style={"text-[13px]"} />
|
|
||||||
</del>
|
|
||||||
</p>
|
|
||||||
<div className="flex rtl mt-[8px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[3px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div className="flex rtl mt-[3px]">
|
|
||||||
{" "}
|
|
||||||
<p className="mb-0 font-bold text-lg">
|
|
||||||
<PersianNumber number={150000} />
|
|
||||||
</p>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SwiperSlide>
|
</SwiperSlide>
|
||||||
</Swiper>
|
</Swiper>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,42 @@
|
||||||
|
"use client";
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
|
const LoginStep = ({ phoneNumber, setPhoneNumber, ConfirmPhoneNumber }) => {
|
||||||
|
return (
|
||||||
|
<div className="text-center mt-5">
|
||||||
|
<p className="mb-0 text-gray-300 text-base">ورود / ثبت نام</p>
|
||||||
|
<p className="mb-0 text-gray-600 text-lg mt-2">
|
||||||
|
شماره موبایل خود را وارد کنید
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="mt-2">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
className="form-control !border-0 !bg-gray-200"
|
||||||
|
onChange={(e) => setPhoneNumber(e.target.value)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="">
|
||||||
|
<button
|
||||||
|
className="btn btn-primary w-full rounded-xl py-3 mt-3"
|
||||||
|
onClick={() => ConfirmPhoneNumber()}
|
||||||
|
>
|
||||||
|
ورود و ثبت نام
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mt-4">
|
||||||
|
<p className="mb-0 text-sm px-4 rtl">
|
||||||
|
با ورود و یا ثبت نام در وسمه شما{" "}
|
||||||
|
<small className="text-primary-400 text-sm font-semibold">
|
||||||
|
شرایط و قوانین
|
||||||
|
</small>{" "}
|
||||||
|
استفاده از سرویس های سایت شاواز و قوانین حریم خصوصی آن را می پذیرید.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default LoginStep;
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
|
const SignUp = ({ setLastName, setFirstName, SignUpLogin }) => {
|
||||||
|
return (
|
||||||
|
<div className="text-center mt-5">
|
||||||
|
<p className="mb-0 text-gray-600 text-lg mt-2">مشخصات را وارد کنید </p>
|
||||||
|
|
||||||
|
<div className="mt-2">
|
||||||
|
<div className="form-group text-right my-2">
|
||||||
|
<label className=" px-2 text-sm"> نام </label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
className="form-control !border-0 !bg-gray-200 text-right"
|
||||||
|
onChange={(e) => setFirstName(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="form-group text-right my-4 ">
|
||||||
|
<label className=" px-2 text-sm">نام خانوادگی </label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
className="form-control !border-0 !bg-gray-200 text-right"
|
||||||
|
onChange={(e) => setLastName(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="">
|
||||||
|
<button
|
||||||
|
className="btn btn-primary w-full rounded-xl py-3 mt-3"
|
||||||
|
onClick={() => SignUpLogin()}
|
||||||
|
>
|
||||||
|
ورود و ثبت نام
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mt-4">
|
||||||
|
<p className="mb-0 text-sm px-4 rtl">
|
||||||
|
با ورود و یا ثبت نام در وسمه شما{" "}
|
||||||
|
<small className="text-primary-400 text-sm font-semibold">
|
||||||
|
شرایط و قوانین
|
||||||
|
</small>{" "}
|
||||||
|
استفاده از سرویس های سایت شاواز و قوانین حریم خصوصی آن را می پذیرید.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SignUp;
|
||||||
|
|
@ -0,0 +1,42 @@
|
||||||
|
"use client";
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
|
const VerifyCodeStep = ({
|
||||||
|
LoginWhitVerifyCode,
|
||||||
|
setVerifyCode,
|
||||||
|
verifyCode,
|
||||||
|
phoneNumber,
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<div className="px-5 mt-6">
|
||||||
|
<p className="mb-0 text-textMain-100 mt-1 text-right text-sm">
|
||||||
|
{" "}
|
||||||
|
پیامک حاوی کد تایید برای شماره
|
||||||
|
<strong className="mx-1">
|
||||||
|
<PersianNumber number={phoneNumber} />
|
||||||
|
</strong>
|
||||||
|
ارسال شده است
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="mt-3">
|
||||||
|
<input
|
||||||
|
placeholder="کد ارسال شده را وارد کنید"
|
||||||
|
type={"number"}
|
||||||
|
className="form-control !border-0 !bg-gray-200 text-center"
|
||||||
|
onChange={(e) => setVerifyCode(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="">
|
||||||
|
<button
|
||||||
|
className="btn btn-primary w-full rounded-xl py-3 mt-3"
|
||||||
|
onClick={() => LoginWhitVerifyCode()}
|
||||||
|
>
|
||||||
|
ورود و ثبت نام
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default VerifyCodeStep;
|
||||||
|
|
@ -0,0 +1,71 @@
|
||||||
|
"use client";
|
||||||
|
import CardCart from "@comp/Cards/CardCart/page";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import React, { useContext, useState } from "react";
|
||||||
|
|
||||||
|
const CartNavbar = (props) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
const cart = CTX.state.cart;
|
||||||
|
const [smallBasket, setSmallBasket] = useState(false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="mr-2">
|
||||||
|
<div
|
||||||
|
className="bg-secondary-600 py-2 px-5 rounded-xl text-sm flex cursor-pointer "
|
||||||
|
onMouseEnter={() => setSmallBasket(true)}
|
||||||
|
onClick={() => setSmallBasket(false)}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-white">سبد خرید</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{smallBasket && (
|
||||||
|
<div
|
||||||
|
className={`relative !z-[100] tr03 ${
|
||||||
|
smallBasket ? "opacity-100" : "opacity-0"
|
||||||
|
} `}
|
||||||
|
onMouseEnter={() => setSmallBasket(true)}
|
||||||
|
onMouseLeave={() => setSmallBasket(false)}
|
||||||
|
>
|
||||||
|
<div className="absolute w-[400px] bg-white rounded-xl mt-2 max-h-[450px] overflow-auto mr-[-310px] scroll-1">
|
||||||
|
<div className="text-center p-3">
|
||||||
|
<p className="mb-0 text-sm pb-3">
|
||||||
|
<PersianNumber
|
||||||
|
number={cart?.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>
|
||||||
|
{cart.map((e) => (
|
||||||
|
<CardCart data={e} />
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="w-full p-3 ">
|
||||||
|
{/* <div className="">
|
||||||
|
<p className="mb-0 text-sm p-3">
|
||||||
|
جمع کل :
|
||||||
|
<PersianNumber
|
||||||
|
number={2546385}
|
||||||
|
style="text-lg mr-2 font-bold text-gray-500"
|
||||||
|
/>
|
||||||
|
<small className="mr-1 mt-[6px]">تومان</small>
|
||||||
|
</p>
|
||||||
|
</div> */}
|
||||||
|
<button className="btn btn-primary text-sm w-full py-3 rounded-3xl">
|
||||||
|
{" "}
|
||||||
|
ثبت خرید
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CartNavbar;
|
||||||
|
|
@ -0,0 +1,78 @@
|
||||||
|
"use client";
|
||||||
|
import Image from "next/image";
|
||||||
|
import React, { useContext } from "react";
|
||||||
|
import logo from "../../../public/images/logo.png";
|
||||||
|
import Link from "next/link";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
|
||||||
|
const SideBarNavBarMobile = () => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
|
||||||
|
const closeNavbar = CTX.state.closeNavbar;
|
||||||
|
console.log("closeNavbar", closeNavbar);
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="sm:block lg:hidden ">
|
||||||
|
<div
|
||||||
|
className={`fixed w-[250px] top-0 right-0 z-50 tr03 ${
|
||||||
|
closeNavbar ? "" : "translate-x-full"
|
||||||
|
} `}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`absolute mt-2 tr03 z-5 ${
|
||||||
|
closeNavbar ? "ml-[-34px] " : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className="w-[30px] h-[30px] bg-white shadow rounded-full text-center "
|
||||||
|
onClick={
|
||||||
|
() => CTX.setCloseNavbar(false)
|
||||||
|
// setOpenResIgType(false) &
|
||||||
|
// setResponsiveNavBarItemStep(0)
|
||||||
|
}
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
<div className=" bg-white h-[100vh] relative overflow-hidden tr03 shadow pt-2 ">
|
||||||
|
<div className="text-center">
|
||||||
|
<div className=" bg-dark rounded-full mx-auto ">
|
||||||
|
<div className="text-center">
|
||||||
|
<Link href="/">
|
||||||
|
<div className="text-center mt-5 ">
|
||||||
|
<Image
|
||||||
|
src={logo}
|
||||||
|
width={50}
|
||||||
|
height={50}
|
||||||
|
alt=""
|
||||||
|
className="mx-auto"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
<Link href="/counseling">
|
||||||
|
<div className="xs:w-full md:w-fit text-center mt-4">
|
||||||
|
<button className=" btn-secondary text-sm px-7 mx-2 mt-2 ">
|
||||||
|
مشاوره رایگان
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
<Link href="/estimate">
|
||||||
|
<div className="xs:w-full md:w-fit text-center">
|
||||||
|
<button className=" btn-outline-primary text-sm px-7 mx-2 mt-2 ">
|
||||||
|
قیمت تخمین{" "}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
<div className="w-[100px] h-[1px] bg-gray-300 mx-auto mt-4 opacity-50"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SideBarNavBarMobile;
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
"use client";
|
"use client";
|
||||||
import React, { useEffect, useState } from "react";
|
import React, { useContext, useEffect, useState } from "react";
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import logo from "../../public/images/logo.png";
|
import logo from "../../public/images/logo.png";
|
||||||
import logoWhite from "../../public/images/logo-white.png";
|
import logoWhite from "../../public/images/logo-white.png";
|
||||||
|
|
@ -11,16 +11,21 @@ import { Menu } from "@headlessui/react";
|
||||||
import { motion } from "framer-motion";
|
import { motion } from "framer-motion";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import PersianNumber from "plugins/PersianNumber";
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
import CardCategoriesMobile from "@comp/Cards/CardCategoriesMobile/page";
|
import CartNavbar from "./CartNavbar/page";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import BottomSheetCart from "plugins/bottomSheet/BottomSheetCart";
|
||||||
|
import { BottomSheet } from "react-spring-bottom-sheet";
|
||||||
|
|
||||||
|
const Navbar = ({ theme }) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
const dataNav = CTX.state.navData;
|
||||||
|
const cart = CTX.state.cart;
|
||||||
|
|
||||||
const Navbar = ({ theme, dataNav }) => {
|
|
||||||
console.log(dataNav);
|
|
||||||
const [navItemHover, setNavItemHover] = useState(null);
|
const [navItemHover, setNavItemHover] = useState(null);
|
||||||
const [isDesktop, setIsDesktop] = useState(null);
|
const [isDesktop, setIsDesktop] = useState(null);
|
||||||
const [closeNavbar, setClosNavbar] = useState(false);
|
const [closeNavbar, setClosNavbar] = useState(false);
|
||||||
const [isScrolled, setIsScrolled] = useState(false);
|
const [isScrolled, setIsScrolled] = useState(false);
|
||||||
const [smallDashboard, setSmallDashboard] = useState(false);
|
const [smallDashboard, setSmallDashboard] = useState(false);
|
||||||
const [smallBasket, setSmallBasket] = useState(false);
|
|
||||||
|
|
||||||
const handleItemNavber = (index) => {
|
const handleItemNavber = (index) => {
|
||||||
setNavItemHover(index);
|
setNavItemHover(index);
|
||||||
|
|
@ -67,11 +72,13 @@ const Navbar = ({ theme, dataNav }) => {
|
||||||
theme == 0 ? "border-white" : "border-black"
|
theme == 0 ? "border-white" : "border-black"
|
||||||
} `}
|
} `}
|
||||||
>
|
>
|
||||||
<Image src={theme == 0 ? logoWhite : logoBlack} />
|
<Link href={"/"}>
|
||||||
|
<Image src={theme == 0 ? logoWhite : logoBlack} />
|
||||||
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex rtl py-5 ">
|
<div className="flex rtl py-5 ">
|
||||||
{2 == 2 ? (
|
{1 == 2 ? (
|
||||||
<div className="flex">
|
<div className="flex">
|
||||||
<div className="bg-white py-2 px-5 rounded-xl text-sm ">
|
<div className="bg-white py-2 px-5 rounded-xl text-sm ">
|
||||||
ورود / عضویت{" "}
|
ورود / عضویت{" "}
|
||||||
|
|
@ -150,63 +157,7 @@ const Navbar = ({ theme, dataNav }) => {
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="mr-2">
|
<CartNavbar />
|
||||||
<div
|
|
||||||
className="bg-secondary-600 py-2 px-5 rounded-xl text-sm flex cursor-pointer "
|
|
||||||
onMouseEnter={() => setSmallBasket(true)}
|
|
||||||
onClick={() => setSmallBasket(false)}
|
|
||||||
>
|
|
||||||
<p className="mb-0 text-white">سبد خرید</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{smallBasket && (
|
|
||||||
<div
|
|
||||||
className={`relative !z-[100] tr03 ${
|
|
||||||
smallBasket ? "opacity-100" : "opacity-0"
|
|
||||||
} `}
|
|
||||||
onMouseEnter={() => setSmallBasket(true)}
|
|
||||||
onMouseLeave={() => setSmallBasket(false)}
|
|
||||||
>
|
|
||||||
<div className="absolute w-[400px] bg-white rounded-xl mt-2 max-h-[450px] overflow-auto mr-[-310px] scroll-1">
|
|
||||||
<div className="text-center p-3">
|
|
||||||
<p className="mb-0 text-sm pb-3">
|
|
||||||
<PersianNumber
|
|
||||||
number={5}
|
|
||||||
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>
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-full p-3 ">
|
|
||||||
<div className="">
|
|
||||||
<p className="mb-0 text-sm p-3">
|
|
||||||
جمع کل :
|
|
||||||
<PersianNumber
|
|
||||||
number={2546385}
|
|
||||||
style="text-lg mr-2 font-bold text-gray-500"
|
|
||||||
/>
|
|
||||||
<small className="mr-1 mt-[6px]">تومان</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<button className="btn btn-primary text-sm w-full py-3 rounded-3xl">
|
|
||||||
{" "}
|
|
||||||
ثبت خرید
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -283,9 +234,11 @@ const Navbar = ({ theme, dataNav }) => {
|
||||||
<li className=" my-2">
|
<li className=" my-2">
|
||||||
<div className="flex">
|
<div className="flex">
|
||||||
<div className="w-[10px] h-[10px] rounded-full bg-primary-500 mt-1 mx-2"></div>
|
<div className="w-[10px] h-[10px] rounded-full bg-primary-500 mt-1 mx-2"></div>
|
||||||
<p className="mb-0 font-bold text-sm hover:text-primary-500 tr03 cursor-pointer">
|
<Link href={`/categories/${e.id}`}>
|
||||||
{e.name}
|
<p className="mb-0 font-bold text-sm hover:text-primary-500 tr03 cursor-pointer">
|
||||||
</p>
|
{e.name}
|
||||||
|
</p>
|
||||||
|
</Link>
|
||||||
|
|
||||||
{e.children.length > 0 && (
|
{e.children.length > 0 && (
|
||||||
<div>
|
<div>
|
||||||
|
|
@ -313,12 +266,14 @@ const Navbar = ({ theme, dataNav }) => {
|
||||||
{e.children && e.children.length > 0 && (
|
{e.children && e.children.length > 0 && (
|
||||||
<div>
|
<div>
|
||||||
{e.children.map((child) => (
|
{e.children.map((child) => (
|
||||||
<p
|
<Link href={`/categories/${child.id}`}>
|
||||||
key={child.id}
|
<p
|
||||||
className="mb-0 mt-2 text-[14px] mr-2 hover:bg-primary-400 hover:text-white w-fit rounded-full px-2 tr03 cursor-pointer"
|
key={child.id}
|
||||||
>
|
className="mb-0 mt-2 text-[14px] mr-2 hover:bg-primary-400 hover:text-white w-fit rounded-full px-2 tr03 cursor-pointer"
|
||||||
{child.name}
|
>
|
||||||
</p>
|
{child.name}
|
||||||
|
</p>
|
||||||
|
</Link>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
@ -382,102 +337,121 @@ const Navbar = ({ theme, dataNav }) => {
|
||||||
<div className="w-[90px] z-10 ">
|
<div className="w-[90px] z-10 ">
|
||||||
<Image src={theme == 0 ? logoWhite : logoBlack} />
|
<Image src={theme == 0 ? logoWhite : logoBlack} />
|
||||||
</div>
|
</div>
|
||||||
<div onClick={() => setClosNavbar(true)}>
|
<div className="flex">
|
||||||
<svg
|
<div className="flex">
|
||||||
width="20"
|
{1 == 2 ? (
|
||||||
height="30"
|
<div className="flex">
|
||||||
viewBox="0 0 144 217"
|
<div className="bg-white py-2 px-3 rounded-xl text-sm ">
|
||||||
fill="none"
|
ورود / عضویت{" "}
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M58.047 184.449C57.9469 180.136 56.5336 175.951 53.9858 172.422C51.4379 168.893 47.8699 166.179 43.7331 164.624C39.5962 163.069 35.0762 162.741 30.7447 163.684C26.4132 164.626 22.4647 166.796 19.3985 169.918C16.3323 173.041 14.2862 176.976 13.5188 181.226C12.7515 185.476 13.2974 189.85 15.0875 193.795C16.8776 197.74 19.8316 201.079 23.5758 203.39C27.32 205.7 31.6863 206.878 36.1226 206.776"
|
|
||||||
stroke="white"
|
|
||||||
stroke-width="18.75"
|
|
||||||
stroke-linecap="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M56.2765 108.128C55.9971 96.0846 45.7282 86.5546 33.3404 86.842C20.9525 87.1294 11.1366 97.1253 11.416 109.168C11.6954 121.212 21.9642 130.742 34.3521 130.454C46.74 130.167 56.5559 120.171 56.2765 108.128Z"
|
|
||||||
stroke="#BE2222"
|
|
||||||
stroke-width="18.75"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M31.5698 10.5202C36.0061 10.4173 40.3725 11.5956 44.1167 13.9061C47.8609 16.2166 50.8148 19.5556 52.605 23.5007C54.3951 27.4459 54.941 31.8201 54.1737 36.0701C53.4063 40.3202 51.3602 44.2552 48.294 47.3776C45.2278 50.5001 41.2793 52.6696 36.9478 53.612C32.6163 54.5543 28.0963 54.2271 23.9594 52.6717C19.8225 51.1163 16.2546 48.4027 13.7067 44.8738C11.1589 41.345 9.74554 37.1595 9.64549 32.8467"
|
|
||||||
stroke="white"
|
|
||||||
stroke-width="18.75"
|
|
||||||
stroke-linecap="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M140.956 181.409C141.186 164.842 127.942 151.226 111.375 150.996C94.8082 150.766 81.1916 164.009 80.9615 180.576C80.7314 197.143 93.9751 210.76 110.542 210.99C127.109 211.22 140.726 197.976 140.956 181.409Z"
|
|
||||||
fill="white"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M141.997 106.417C142.227 89.8497 128.983 76.233 112.416 76.0029C95.8492 75.7729 82.2326 89.0165 82.0025 105.583C81.7724 122.15 95.0161 135.767 111.583 135.997C128.15 136.227 141.767 122.984 141.997 106.417Z"
|
|
||||||
fill="white"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M143.039 31.4239C143.269 14.857 130.025 1.24031 113.458 1.01025C96.8912 0.780182 83.2746 14.0238 83.0445 30.5908C82.8144 47.1577 96.0581 60.7744 112.625 61.0045C129.192 61.2345 142.809 47.9909 143.039 31.4239Z"
|
|
||||||
fill="white"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="sm:block lg:hidden ">
|
|
||||||
<div
|
|
||||||
className={`fixed w-[250px] top-0 left-0 z-50 tr03 ${
|
|
||||||
closeNavbar ? "" : "-translate-x-full"
|
|
||||||
} `}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className={`absolute mt-2 tr03 z-5 ${
|
|
||||||
closeNavbar ? "ml-[255px] " : "ml-[-30px]"
|
|
||||||
}`}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className="w-[30px] h-[30px] bg-white shadow rounded-full text-center "
|
|
||||||
onClick={
|
|
||||||
() => setClosNavbar(false)
|
|
||||||
// setOpenResIgType(false) &
|
|
||||||
// setResponsiveNavBarItemStep(0)
|
|
||||||
}
|
|
||||||
></div>
|
|
||||||
</div>
|
|
||||||
<div className=" bg-white h-[100vh] relative overflow-hidden tr03 shadow pt-2 ">
|
|
||||||
<div className="text-center">
|
|
||||||
<div className=" bg-dark rounded-full mx-auto ">
|
|
||||||
<div className="text-center">
|
|
||||||
<Link href="/">
|
|
||||||
<div className="text-center mt-5 ">
|
|
||||||
<Image
|
|
||||||
src={logo}
|
|
||||||
width={50}
|
|
||||||
height={50}
|
|
||||||
alt=""
|
|
||||||
className="mx-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<Link href="/counseling">
|
|
||||||
<div className="xs:w-full md:w-fit text-center mt-4">
|
|
||||||
<button className=" btn-secondary text-sm px-7 mx-2 mt-2 ">
|
|
||||||
مشاوره رایگان
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<Link href="/estimate">
|
|
||||||
<div className="xs:w-full md:w-fit text-center">
|
|
||||||
<button className=" btn-outline-primary text-sm px-7 mx-2 mt-2 ">
|
|
||||||
قیمت تخمین{" "}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<div className="w-[100px] h-[1px] bg-gray-300 mx-auto mt-4 opacity-50"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="flex">
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
className="bg-white py-2 px-3 rounded-xl text-sm flex cursor-pointer "
|
||||||
|
onClick={() => setSmallDashboard(!smallDashboard)}
|
||||||
|
>
|
||||||
|
<p className="mb-0 text-sm">حسین معصومی پور</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{smallDashboard && (
|
||||||
|
<div
|
||||||
|
className={`relative !z-[100] tr03 ${
|
||||||
|
smallDashboard ? "opacity-100" : "opacity-0"
|
||||||
|
} `}
|
||||||
|
onMouseEnter={() => setSmallDashboard(true)}
|
||||||
|
onMouseLeave={() => setSmallDashboard(false)}
|
||||||
|
>
|
||||||
|
<div className="absolute w-[270px] bg-white rounded-xl mt-2 mr-[-87px] overflow-hidden">
|
||||||
|
<div>
|
||||||
|
<ul className="p-2 ">
|
||||||
|
<li className="group cursor-pointer">
|
||||||
|
<div className="flex justify-between p-2 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>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li className="group cursor-pointer">
|
||||||
|
<div className="flex justify-between p-2 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>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li className="group cursor-pointer">
|
||||||
|
<div className="flex justify-between p-2 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>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li className="group cursor-pointer">
|
||||||
|
<div className="flex justify-between p-2 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>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li className="flex justify-between p-2 rounded-full group hover:bg-red-200 tr03 cursor-pointer">
|
||||||
|
<p className="mb-0 text-sm text-red-500 group-hover: ">
|
||||||
|
خروج{" "}
|
||||||
|
</p>
|
||||||
|
<div className="w-[20px] h-[20px] rounded-full bg-red-200 group-hover:bg-red-500 tr03 "></div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className="mx-2 mt-2"
|
||||||
|
onClick={() => CTX.setBottomSheetCart(true)}
|
||||||
|
>
|
||||||
|
<div className="absolute mt-[-15px] mr-[6px] ">
|
||||||
|
<div className="">
|
||||||
|
<PersianNumber
|
||||||
|
number={cart?.length}
|
||||||
|
style={"!text-[10px] text-primary-900 font-bold"}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<svg
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 248 232"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="opacity-80"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M18.4371 138.212C9.46208 96.3 4.96208 75.3375 16.2246 61.425C27.4746 47.5 48.9121 47.5 91.7746 47.5H156.225C199.1 47.5 220.512 47.5 231.775 61.425C243.025 75.35 238.537 96.3 229.562 138.212L224.2 163.212C218.112 191.625 215.075 205.825 204.762 214.163C194.45 222.5 179.925 222.5 150.875 222.5H97.1246C68.0746 222.5 53.5496 222.5 43.2496 214.163C32.9246 205.825 29.8746 191.625 23.7996 163.212L18.4371 138.212Z"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="18.75"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
opacity="0.6"
|
||||||
|
d="M199 85L161.5 10M49 85L86.5 10"
|
||||||
|
stroke="black"
|
||||||
|
stroke-width="18.75"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -18,6 +18,7 @@
|
||||||
"react-dom": "^18",
|
"react-dom": "^18",
|
||||||
"react-grid-gallery": "^1.0.1-alpha.0",
|
"react-grid-gallery": "^1.0.1-alpha.0",
|
||||||
"react-image-gallery": "^1.3.0",
|
"react-image-gallery": "^1.3.0",
|
||||||
|
"react-spring-bottom-sheet": "^3.4.1",
|
||||||
"react-toastify": "^9.1.3",
|
"react-toastify": "^9.1.3",
|
||||||
"swiper": "^11.0.5"
|
"swiper": "^11.0.5"
|
||||||
},
|
},
|
||||||
|
|
@ -228,6 +229,11 @@
|
||||||
"@jridgewell/sourcemap-codec": "^1.4.14"
|
"@jridgewell/sourcemap-codec": "^1.4.14"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/@juggle/resize-observer": {
|
||||||
|
"version": "3.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@juggle/resize-observer/-/resize-observer-3.4.0.tgz",
|
||||||
|
"integrity": "sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA=="
|
||||||
|
},
|
||||||
"node_modules/@next/env": {
|
"node_modules/@next/env": {
|
||||||
"version": "14.0.4",
|
"version": "14.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/@next/env/-/env-14.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/@next/env/-/env-14.0.4.tgz",
|
||||||
|
|
@ -432,6 +438,11 @@
|
||||||
"integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==",
|
"integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"node_modules/@types/warning": {
|
||||||
|
"version": "3.0.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.3.tgz",
|
||||||
|
"integrity": "sha512-D1XC7WK8K+zZEveUPY+cf4+kgauk8N4eHr/XIHXGlGYkHLud6hK9lYfZk1ry1TNh798cZUCgb6MqGEG8DkJt6Q=="
|
||||||
|
},
|
||||||
"node_modules/@typescript-eslint/parser": {
|
"node_modules/@typescript-eslint/parser": {
|
||||||
"version": "6.14.0",
|
"version": "6.14.0",
|
||||||
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.14.0.tgz",
|
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.14.0.tgz",
|
||||||
|
|
@ -935,6 +946,11 @@
|
||||||
"readable-stream": "^3.4.0"
|
"readable-stream": "^3.4.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/body-scroll-lock": {
|
||||||
|
"version": "3.1.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/body-scroll-lock/-/body-scroll-lock-3.1.5.tgz",
|
||||||
|
"integrity": "sha512-Yi1Xaml0EvNA0OYWxXiYNqY24AfWkbA6w5vxE7GWxtKfzIbZM+Qw+aSmkgsbWzbHiy/RCSkUZBplVxTA+E4jJg=="
|
||||||
|
},
|
||||||
"node_modules/brace-expansion": {
|
"node_modules/brace-expansion": {
|
||||||
"version": "1.1.11",
|
"version": "1.1.11",
|
||||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||||
|
|
@ -2102,6 +2118,14 @@
|
||||||
"integrity": "sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==",
|
"integrity": "sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"node_modules/focus-trap": {
|
||||||
|
"version": "6.9.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.9.4.tgz",
|
||||||
|
"integrity": "sha512-v2NTsZe2FF59Y+sDykKY+XjqZ0cPfhq/hikWVL88BqLivnNiEffAsac6rP6H45ff9wG9LL5ToiDqrLEP9GX9mw==",
|
||||||
|
"dependencies": {
|
||||||
|
"tabbable": "^5.3.3"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/follow-redirects": {
|
"node_modules/follow-redirects": {
|
||||||
"version": "1.15.4",
|
"version": "1.15.4",
|
||||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.4.tgz",
|
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.4.tgz",
|
||||||
|
|
@ -3399,7 +3423,6 @@
|
||||||
"version": "4.1.1",
|
"version": "4.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
||||||
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
|
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
|
||||||
"dev": true,
|
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
}
|
}
|
||||||
|
|
@ -3870,7 +3893,6 @@
|
||||||
"version": "15.8.1",
|
"version": "15.8.1",
|
||||||
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
|
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
|
||||||
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
|
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
|
||||||
"dev": true,
|
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"loose-envify": "^1.4.0",
|
"loose-envify": "^1.4.0",
|
||||||
"object-assign": "^4.1.1",
|
"object-assign": "^4.1.1",
|
||||||
|
|
@ -3988,8 +4010,111 @@
|
||||||
"node_modules/react-is": {
|
"node_modules/react-is": {
|
||||||
"version": "16.13.1",
|
"version": "16.13.1",
|
||||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
|
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||||
"dev": true
|
},
|
||||||
|
"node_modules/react-spring": {
|
||||||
|
"version": "8.0.27",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-spring/-/react-spring-8.0.27.tgz",
|
||||||
|
"integrity": "sha512-nDpWBe3ZVezukNRandTeLSPcwwTMjNVu1IDq9qA/AMiUqHuRN4BeSWvKr3eIxxg1vtiYiOLy4FqdfCP5IoP77g==",
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/runtime": "^7.3.1",
|
||||||
|
"prop-types": "^15.5.8"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": ">= 16.8.0",
|
||||||
|
"react-dom": ">= 16.8.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/react-spring-bottom-sheet": {
|
||||||
|
"version": "3.4.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-spring-bottom-sheet/-/react-spring-bottom-sheet-3.4.1.tgz",
|
||||||
|
"integrity": "sha512-yDFqiPMm/fjefjnOe6Q9zxccbCl6HMUKsK5bWgfGHJIj4zmXVKio5d4icQvmOLuwpuCA2pwv4J6nGWS6fUZidQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"@juggle/resize-observer": "^3.2.0",
|
||||||
|
"@reach/portal": "^0.13.0",
|
||||||
|
"@xstate/react": "^1.2.0",
|
||||||
|
"body-scroll-lock": "^3.1.5",
|
||||||
|
"focus-trap": "^6.2.2",
|
||||||
|
"react-spring": "^8.0.27",
|
||||||
|
"react-use-gesture": "^8.0.1",
|
||||||
|
"xstate": "^4.15.1"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^16.14.0 || 17 || 18"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/react-spring-bottom-sheet/node_modules/@reach/portal": {
|
||||||
|
"version": "0.13.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@reach/portal/-/portal-0.13.2.tgz",
|
||||||
|
"integrity": "sha512-g74BnCdtuTGthzzHn2cWW+bcyIYb0iIE/yRsm89i8oNzNgpopbkh9UY8TPbhNlys52h7U60s4kpRTmcq+JqsTA==",
|
||||||
|
"dependencies": {
|
||||||
|
"@reach/utils": "0.13.2",
|
||||||
|
"tslib": "^2.1.0"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^16.8.0 || 17.x",
|
||||||
|
"react-dom": "^16.8.0 || 17.x"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/react-spring-bottom-sheet/node_modules/@reach/portal/node_modules/@reach/utils": {
|
||||||
|
"version": "0.13.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@reach/utils/-/utils-0.13.2.tgz",
|
||||||
|
"integrity": "sha512-3ir6cN60zvUrwjOJu7C6jec/samqAeyAB12ZADK+qjnmQPdzSYldrFWwDVV5H0WkhbYXR3uh+eImu13hCetNPQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"@types/warning": "^3.0.0",
|
||||||
|
"tslib": "^2.1.0",
|
||||||
|
"warning": "^4.0.3"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^16.8.0 || 17.x",
|
||||||
|
"react-dom": "^16.8.0 || 17.x"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/react-spring-bottom-sheet/node_modules/@xstate/react": {
|
||||||
|
"version": "1.6.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/@xstate/react/-/react-1.6.3.tgz",
|
||||||
|
"integrity": "sha512-NCUReRHPGvvCvj2yLZUTfR0qVp6+apc8G83oXSjN4rl89ZjyujiKrTff55bze/HrsvCsP/sUJASf2n0nzMF1KQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"use-isomorphic-layout-effect": "^1.0.0",
|
||||||
|
"use-subscription": "^1.3.0"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"@xstate/fsm": "^1.0.0",
|
||||||
|
"react": "^16.8.0 || ^17.0.0",
|
||||||
|
"xstate": "^4.11.0"
|
||||||
|
},
|
||||||
|
"peerDependenciesMeta": {
|
||||||
|
"@xstate/fsm": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"xstate": {
|
||||||
|
"optional": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/react-spring-bottom-sheet/node_modules/react-dom": {
|
||||||
|
"version": "17.0.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
|
||||||
|
"integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"loose-envify": "^1.1.0",
|
||||||
|
"object-assign": "^4.1.1",
|
||||||
|
"scheduler": "^0.20.2"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "17.0.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/react-spring-bottom-sheet/node_modules/scheduler": {
|
||||||
|
"version": "0.20.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
|
||||||
|
"integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"loose-envify": "^1.1.0",
|
||||||
|
"object-assign": "^4.1.1"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"node_modules/react-toastify": {
|
"node_modules/react-toastify": {
|
||||||
"version": "9.1.3",
|
"version": "9.1.3",
|
||||||
|
|
@ -4003,6 +4128,15 @@
|
||||||
"react-dom": ">=16"
|
"react-dom": ">=16"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/react-use-gesture": {
|
||||||
|
"version": "8.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-use-gesture/-/react-use-gesture-8.0.1.tgz",
|
||||||
|
"integrity": "sha512-CXzUNkulUdgouaAlvAsC5ZVo0fi9KGSBSk81WrE4kOIcJccpANe9zZkAYr5YZZhqpicIFxitsrGVS4wmoMun9A==",
|
||||||
|
"deprecated": "This package is no longer maintained. Please use @use-gesture/react instead",
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": ">= 16.8.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/read-cache": {
|
"node_modules/read-cache": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
|
||||||
|
|
@ -4591,6 +4725,11 @@
|
||||||
"node": ">= 4.7.0"
|
"node": ">= 4.7.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/tabbable": {
|
||||||
|
"version": "5.3.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.3.3.tgz",
|
||||||
|
"integrity": "sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA=="
|
||||||
|
},
|
||||||
"node_modules/tailwindcss": {
|
"node_modules/tailwindcss": {
|
||||||
"version": "3.4.0",
|
"version": "3.4.0",
|
||||||
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.0.tgz",
|
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.0.tgz",
|
||||||
|
|
@ -4884,11 +5023,51 @@
|
||||||
"punycode": "^2.1.0"
|
"punycode": "^2.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/use-isomorphic-layout-effect": {
|
||||||
|
"version": "1.1.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz",
|
||||||
|
"integrity": "sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==",
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
||||||
|
},
|
||||||
|
"peerDependenciesMeta": {
|
||||||
|
"@types/react": {
|
||||||
|
"optional": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/use-subscription": {
|
||||||
|
"version": "1.8.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/use-subscription/-/use-subscription-1.8.0.tgz",
|
||||||
|
"integrity": "sha512-LISuG0/TmmoDoCRmV5XAqYkd3UCBNM0ML3gGBndze65WITcsExCD3DTvXXTLyNcOC0heFQZzluW88bN/oC1DQQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"use-sync-external-store": "^1.2.0"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/use-sync-external-store": {
|
||||||
|
"version": "1.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz",
|
||||||
|
"integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==",
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/util-deprecate": {
|
"node_modules/util-deprecate": {
|
||||||
"version": "1.0.2",
|
"version": "1.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
|
||||||
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
|
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
|
||||||
},
|
},
|
||||||
|
"node_modules/warning": {
|
||||||
|
"version": "4.0.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
|
||||||
|
"integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
|
||||||
|
"dependencies": {
|
||||||
|
"loose-envify": "^1.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/watchpack": {
|
"node_modules/watchpack": {
|
||||||
"version": "2.4.0",
|
"version": "2.4.0",
|
||||||
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz",
|
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz",
|
||||||
|
|
@ -5019,6 +5198,15 @@
|
||||||
"integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
|
"integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"node_modules/xstate": {
|
||||||
|
"version": "4.38.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/xstate/-/xstate-4.38.3.tgz",
|
||||||
|
"integrity": "sha512-SH7nAaaPQx57dx6qvfcIgqKRXIh4L0A1iYEqim4s1u7c9VoCgzZc+63FY90AKU4ZzOC2cfJzTnpO4zK7fCUzzw==",
|
||||||
|
"funding": {
|
||||||
|
"type": "opencollective",
|
||||||
|
"url": "https://opencollective.com/xstate"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/yallist": {
|
"node_modules/yallist": {
|
||||||
"version": "4.0.0",
|
"version": "4.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "vesmeh",
|
"name": "vesmeh",
|
||||||
"version": "0.1.0",
|
"version": "0.1.1",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "next dev",
|
"dev": "next dev",
|
||||||
|
|
@ -19,6 +19,7 @@
|
||||||
"react-dom": "^18",
|
"react-dom": "^18",
|
||||||
"react-grid-gallery": "^1.0.1-alpha.0",
|
"react-grid-gallery": "^1.0.1-alpha.0",
|
||||||
"react-image-gallery": "^1.3.0",
|
"react-image-gallery": "^1.3.0",
|
||||||
|
"react-spring-bottom-sheet": "^3.4.1",
|
||||||
"react-toastify": "^9.1.3",
|
"react-toastify": "^9.1.3",
|
||||||
"swiper": "^11.0.5"
|
"swiper": "^11.0.5"
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,6 @@
|
||||||
|
"use client";
|
||||||
import React, { useContext } from "react";
|
import React, { useContext } from "react";
|
||||||
|
|
||||||
import AppContext from "@ctx/AppContext";
|
import AppContext from "@ctx/AppContext";
|
||||||
import gif from "@img/loading.gif";
|
|
||||||
import Image from "next/image";
|
|
||||||
|
|
||||||
const Loading = ({ rateId }) => {
|
const Loading = ({ rateId }) => {
|
||||||
const CTX = useContext(AppContext);
|
const CTX = useContext(AppContext);
|
||||||
|
|
@ -17,9 +15,6 @@ const Loading = ({ rateId }) => {
|
||||||
>
|
>
|
||||||
<div className="bg-primary-300 w-fit rounded-full px-1 py-2 flex rtl m-3 ">
|
<div className="bg-primary-300 w-fit rounded-full px-1 py-2 flex rtl m-3 ">
|
||||||
<p className="mb-0 text-white mx-2 blacj ">لطفا صبر کنید</p>
|
<p className="mb-0 text-white mx-2 blacj ">لطفا صبر کنید</p>
|
||||||
<div className="w-[30px] ml-3">
|
|
||||||
<Image src={gif} alt="" className="" />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import React, { useContext } from "react";
|
||||||
|
import { BottomSheet } from "react-spring-bottom-sheet";
|
||||||
|
import { toast } from "react-toastify";
|
||||||
|
|
||||||
|
const BottomSheetCart = (props) => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<BottomSheet
|
||||||
|
open={CTX.state.bottomSheetCart}
|
||||||
|
onDismiss={() => CTX.setBottomSheetCart(false)}
|
||||||
|
>
|
||||||
|
<div className="text-center py-2 bg-primary-300 ">
|
||||||
|
<p className="mb-0 text-white relative top-[-5px]">افزودن نقش جدید</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-body-100 p-4"></div>
|
||||||
|
</BottomSheet>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default BottomSheetCart;
|
||||||
|
|
@ -1,412 +1,75 @@
|
||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import CardCategories from "@comp/Cards/CardCategories/page";
|
|
||||||
import CardSurprise from "@comp/Cards/CardSurprise/page";
|
|
||||||
import Navbar from "@comp/Navbar/page";
|
import Navbar from "@comp/Navbar/page";
|
||||||
import PersianNumber from "plugins/PersianNumber";
|
import React, { useContext, useEffect, useState } from "react";
|
||||||
import React, { useState } from "react";
|
|
||||||
import { Switch } from "@headlessui/react";
|
|
||||||
import RangeSlider from "plugins/RangeSlider/page";
|
|
||||||
import Footer from "@comp/Footer/page";
|
import Footer from "@comp/Footer/page";
|
||||||
import CardCategoriesMobile from "@comp/Cards/CardCategoriesMobile/page";
|
import ListProdocts from "@comp/Category/ListProdocts/page";
|
||||||
|
import FilterCategoryMobile from "@comp/Category/Mobile/FilterCategoryMobile/page";
|
||||||
|
import FilterCategory from "@comp/Category/FilterCategory/page";
|
||||||
|
import ListProductsMobile from "@comp/Category/Mobile/ListProductsMobile/page";
|
||||||
|
import PaginationCategoory from "@comp/Category/PaginationCategoory/page";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
|
||||||
const page = () => {
|
export default function page({ params }) {
|
||||||
|
// const res = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/product?page=0`);
|
||||||
|
// const products = await res.json();
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
const [isChecked, setIsChecked] = useState(false);
|
const [isChecked, setIsChecked] = useState(false);
|
||||||
|
const [selectedBrands, setSelectedBrands] = useState([]);
|
||||||
|
const [rangePrice, setRangePrice] = useState([1000, 100]);
|
||||||
|
const [isRangePrice, setIsRangePrice] = useState(false);
|
||||||
|
const [sortBy, setSortBy] = useState(null);
|
||||||
|
|
||||||
const handleCheckboxChange = () => {
|
const fetchBarnds = async () => {
|
||||||
setIsChecked(!isChecked);
|
const res = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/brand`);
|
||||||
|
const brands = await res.json();
|
||||||
|
CTX.setBrands(brands);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleRangeChange = (values) => {
|
useEffect(() => {
|
||||||
console.log("Range values:", values);
|
CTX.fetchProducts(params.id);
|
||||||
};
|
fetchBarnds();
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className=" pb-20">
|
<div className=" pb-20">
|
||||||
<Navbar theme={1} />
|
<Navbar theme={1} />
|
||||||
<div className="xs:block lg:hidden px-5">
|
|
||||||
<div className="mt-5">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
className="form-control bg-white !border-[0px] border-gray-100 rounded-lg text-right focus:!border-[0px] !text-sm "
|
|
||||||
placeholder="دستت برای جست و جو بازه"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div className="absolute mt-[-46px] ml-[6px]">
|
|
||||||
<div className="w-[40px] h-[40px] bg-gray-100 rounded-lg pt-2">
|
|
||||||
<svg
|
|
||||||
width="22"
|
|
||||||
height="22"
|
|
||||||
viewBox="0 0 275 275"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M215.913 215.913L265 265M250.832 130.822C250.832 197.553 196.915 251.644 130.424 251.644C63.9166 251.644 10 197.552 10 130.838C10 64.0759 63.9166 10 130.408 10C196.915 10 250.832 64.0919 250.832 130.822Z"
|
|
||||||
stroke="black"
|
|
||||||
stroke-width="18.75"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* <div className="text-right flex rtl mt-5">
|
|
||||||
<p className="mb-0 rtl text-[12px] text-gray-400 mx-1"> سلاکم</p>
|
|
||||||
<span>
|
|
||||||
{" "}
|
|
||||||
<svg
|
|
||||||
width="7"
|
|
||||||
height="7"
|
|
||||||
viewBox="0 0 151 89"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mt-2 rotate-90 opacity-30"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M13.1436 14.2219L76.3596 75.9976L138.135 12.7815"
|
|
||||||
stroke="black"
|
|
||||||
stroke-width="25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
<p className="mb-0 rtl text-[12px] text-gray-400 mx-1">خانه اصلی</p>
|
|
||||||
</div> */}
|
|
||||||
|
|
||||||
<div className="flex my-5">
|
|
||||||
<div className="w-full flex rtl justify-center">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 238 214"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-2 opacity-30"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M31.5 107V7M206.5 207V169.5M31.5 207V157M206.5 119.5V7M119 44.5V7M119 207V94.5"
|
|
||||||
stroke="black"
|
|
||||||
stroke-width="12.5"
|
|
||||||
stroke-linecap="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M31.5 157C45.3071 157 56.5 145.807 56.5 132C56.5 118.193 45.3071 107 31.5 107C17.6929 107 6.5 118.193 6.5 132C6.5 145.807 17.6929 157 31.5 157Z"
|
|
||||||
stroke="black"
|
|
||||||
stroke-width="12.5"
|
|
||||||
stroke-linecap="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M119 94.5C132.807 94.5 144 83.3071 144 69.5C144 55.6929 132.807 44.5 119 44.5C105.193 44.5 94 55.6929 94 69.5C94 83.3071 105.193 94.5 119 94.5Z"
|
|
||||||
stroke="black"
|
|
||||||
stroke-width="12.5"
|
|
||||||
stroke-linecap="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M206.5 169.5C220.307 169.5 231.5 158.307 231.5 144.5C231.5 130.693 220.307 119.5 206.5 119.5C192.693 119.5 181.5 130.693 181.5 144.5C181.5 158.307 192.693 169.5 206.5 169.5Z"
|
|
||||||
stroke="black"
|
|
||||||
stroke-width="12.5"
|
|
||||||
stroke-linecap="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<p className="mb-0 text-sm text-gray-500">فیلتر ها</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-full flex rtl justify-center">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 300 300"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className=" opacity-30"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M175.462 261.712C173.18 261.701 170.943 261.075 168.987 259.9L127.312 234.9C122.624 232.071 118.743 228.082 116.044 223.318C113.344 218.554 111.917 213.175 111.9 207.7V151.137C111.911 147.145 110.67 143.249 108.35 140L50.1623 58.2247C48.8035 56.3369 47.9927 54.1105 47.8193 51.791C47.6459 49.4716 48.1166 47.1493 49.1795 45.0804C50.2424 43.0116 51.8561 41.2765 53.8427 40.0668C55.8292 38.857 58.1113 38.2195 60.4373 38.2247H239.562C241.89 38.215 244.175 38.8497 246.164 40.0585C248.154 41.2673 249.77 43.003 250.833 45.0736C251.897 47.1441 252.367 49.4686 252.191 51.7897C252.015 54.1108 251.201 56.338 249.837 58.2247L191.65 140C189.326 143.248 188.08 147.143 188.087 151.137V249.062C188.084 252.412 186.754 255.624 184.387 257.995C182.021 260.366 178.812 261.702 175.462 261.712ZM60.4373 50.7872L118.525 132.75C122.363 138.111 124.418 144.544 124.4 151.137V207.687C124.408 211.005 125.272 214.264 126.907 217.15C128.543 220.036 130.895 222.451 133.737 224.162L175.412 249.162L175.587 151.125C175.573 144.53 177.633 138.098 181.475 132.737L239.65 50.9622L60.4373 50.7872Z"
|
|
||||||
fill="black"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<p className="mb-0 text-sm text-gray-500">ترند ها</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="grid xs:grid-cols-1 lg:grid-cols-4 xl:grid-cols-5">
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
<CardCategoriesMobile />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="xs:hidden lg:block">
|
<div className="xs:hidden lg:block">
|
||||||
<div className="pl-20 pr-10 grid lg:grid-cols-8 xl:grid-cols-5 rtl mt-20 ">
|
<div className="pl-20 pr-10 grid lg:grid-cols-8 xl:grid-cols-5 rtl mt-20 ">
|
||||||
<div className="ml-4 lg:col-span-2 xl:col-span-1">
|
<FilterCategory
|
||||||
<div className="sticky top-20 ...">
|
id={params.id}
|
||||||
<div className=" w-full">
|
isChecked={isChecked}
|
||||||
<div className="p-5 border-gray-300 rounded-lg flex justify-between bg-white">
|
setIsChecked={setIsChecked}
|
||||||
<p className="mb-0 lg:text-sm xl:text-base">برند</p>
|
selectedBrands={selectedBrands}
|
||||||
<div>
|
setSelectedBrands={setSelectedBrands}
|
||||||
<svg
|
rangePrice={rangePrice}
|
||||||
width="15"
|
setRangePrice={setRangePrice}
|
||||||
height="15"
|
sortBy={sortBy}
|
||||||
viewBox="0 0 151 89"
|
setIsRangePrice={setIsRangePrice}
|
||||||
fill="none"
|
isRangePrice={isRangePrice}
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
/>
|
||||||
className="mt-1"
|
<ListProdocts
|
||||||
>
|
id={params.id}
|
||||||
<path
|
isChecked={isChecked}
|
||||||
d="M13.1436 14.2219L76.3596 75.9976L138.135 12.7815"
|
selectedBrands={selectedBrands}
|
||||||
stroke="black"
|
rangePrice={rangePrice}
|
||||||
stroke-width="25"
|
setSortBy={setSortBy}
|
||||||
stroke-linecap="round"
|
sortBy={sortBy}
|
||||||
stroke-linejoin="round"
|
isRangePrice={isRangePrice}
|
||||||
/>
|
/>
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="p-5 border-gray-300 rounded-lg mt-3 flex justify-between bg-white">
|
|
||||||
<p className="mb-0 lg:text-sm xl:text-base">
|
|
||||||
فقط محصولات موجود{" "}
|
|
||||||
</p>
|
|
||||||
<Switch
|
|
||||||
checked={isChecked}
|
|
||||||
onChange={handleCheckboxChange}
|
|
||||||
className={`${
|
|
||||||
isChecked ? "bg-primary-500" : "bg-gray-400"
|
|
||||||
} relative inline-flex h-6 w-[50px] items-center rounded-full`}
|
|
||||||
>
|
|
||||||
<span className="sr-only">Enable notifications</span>
|
|
||||||
<span
|
|
||||||
className={`${
|
|
||||||
isChecked
|
|
||||||
? "translate-x-[-5px]"
|
|
||||||
: "translate-x-[-30px]"
|
|
||||||
} inline-block h-4 w-4 transform rounded-full bg-white transition`}
|
|
||||||
/>
|
|
||||||
</Switch>
|
|
||||||
</div>
|
|
||||||
<div className="p-5 border-gray-300 rounded-lg mt-3 bg-white">
|
|
||||||
<div className="flex justify-between ">
|
|
||||||
<p className="mb-0">محدوده قیمت</p>
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
width="15"
|
|
||||||
height="15"
|
|
||||||
viewBox="0 0 151 89"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mt-1"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M13.1436 14.2219L76.3596 75.9976L138.135 12.7815"
|
|
||||||
stroke="black"
|
|
||||||
stroke-width="25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="mt-10 px-5">
|
|
||||||
<RangeSlider
|
|
||||||
min={0}
|
|
||||||
max={100}
|
|
||||||
onChange={handleRangeChange}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex mt-5">
|
|
||||||
<div className="w-full text-center">
|
|
||||||
<p className="mb-0 text-sm">تا قیمت</p>
|
|
||||||
<p className="mb-0">
|
|
||||||
<PersianNumber number={1316464} style="font-bold" />
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-full text-center">
|
|
||||||
<p className="mb-0 text-sm">تا قیمت</p>
|
|
||||||
<p className="mb-0">
|
|
||||||
<PersianNumber number={1316464} style="font-bold" />
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="mt-4">
|
|
||||||
<button className="btn btn-primary w-full rounded-full text-sm ">
|
|
||||||
اعمال فیلتر
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="lg:col-span-6 xl:col-span-4 ">
|
|
||||||
<div className=" px-10 ">
|
|
||||||
<div className=" border-b-[1px] border-gray-300 pb-6">
|
|
||||||
<div className="flex justify-between">
|
|
||||||
<div className="flex">
|
|
||||||
<div>
|
|
||||||
<p className="mb-0 lg:text-sm xl:text-base">
|
|
||||||
{" "}
|
|
||||||
فیلتر بر اساس :
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex">
|
|
||||||
<div className="w-fit bg-primary-600 rounded-full px-2 mx-2">
|
|
||||||
<p className="mb-0 lg:text-sm xl:text-base text-white">
|
|
||||||
پرفروش ترین
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-fit opacity-60 rounded-full px-2 mx-2">
|
|
||||||
<p className="mb-0 lg:text-sm xl:text-base">
|
|
||||||
کم فروش ترین
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-fit opacity-60 rounded-full px-2 mx-2">
|
|
||||||
<p className="mb-0 lg:text-sm xl:text-base">
|
|
||||||
ارزان ترین
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-fit opacity-60 rounded-full px-2 mx-2">
|
|
||||||
<p className="mb-0 lg:text-sm xl:text-base">
|
|
||||||
گران ترین
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-fit opacity-60 rounded-full px-2 mx-2">
|
|
||||||
<p className="mb-0 lg:text-sm xl:text-base">
|
|
||||||
اقتصادی ترین
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="">
|
|
||||||
<p className="mb-0 text-base lg:text-sm xl:text-base">
|
|
||||||
<PersianNumber
|
|
||||||
number={12354}
|
|
||||||
style="text-[16px] mx-2 font-bold"
|
|
||||||
/>
|
|
||||||
کالا
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="grid xs:grid-cols-1 lg:grid-cols-4 xl:grid-cols-5">
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
<CardCategories />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex justify-center rtl mb-10">
|
<div className="xs:block lg:hidden ">
|
||||||
<div className="w-[40px] h-[40px] rounded-full bg-primary-400 mx-2">
|
<FilterCategoryMobile />
|
||||||
<svg
|
<ListProductsMobile />
|
||||||
width="16"
|
|
||||||
height="16"
|
|
||||||
viewBox="0 0 88 151"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-3 pr-[2px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M12.9525 138.35L75.249 75.6471L12.5462 13.3506"
|
|
||||||
stroke="white"
|
|
||||||
stroke-width="25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
|
||||||
<p className="mb-0 text-center pt-2">
|
|
||||||
<PersianNumber
|
|
||||||
number={1}
|
|
||||||
style="text-white !text-[16px] font-bold "
|
|
||||||
/>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
|
||||||
<p className="mb-0 text-center pt-2">
|
|
||||||
<PersianNumber
|
|
||||||
number={2}
|
|
||||||
style="text-white !text-[16px] font-bold "
|
|
||||||
/>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
|
||||||
<p className="mb-0 text-center pt-2">
|
|
||||||
<PersianNumber
|
|
||||||
number={3}
|
|
||||||
style="text-white !text-[16px] font-bold "
|
|
||||||
/>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
|
||||||
<p className="mb-0 text-center pt-2">
|
|
||||||
<PersianNumber
|
|
||||||
number={4}
|
|
||||||
style="text-white !text-[16px] font-bold "
|
|
||||||
/>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-[40px] h-[40px] rounded-full bg-primary-800 mx-2">
|
|
||||||
<p className="mb-0 text-center pt-2">
|
|
||||||
<PersianNumber
|
|
||||||
number={5}
|
|
||||||
style="text-white !text-[16px] font-bold "
|
|
||||||
/>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="w-[40px] h-[40px] rounded-full bg-primary-400 mx-2">
|
|
||||||
<svg
|
|
||||||
width="16"
|
|
||||||
height="16"
|
|
||||||
viewBox="0 0 89 151"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
className="mx-auto mt-3 pr-[2px]"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M74.7462 13.0002L12.7501 76.0001L75.7499 137.996"
|
|
||||||
stroke="white"
|
|
||||||
stroke-width="25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<PaginationCategoory />
|
||||||
|
|
||||||
<Footer />
|
<Footer />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
}
|
||||||
|
|
||||||
export default page;
|
|
||||||
|
|
|
||||||
|
|
@ -1,18 +1,138 @@
|
||||||
|
"use client";
|
||||||
import "../../style/globals.css";
|
import "../../style/globals.css";
|
||||||
import "../../style/fontiran.css";
|
import "../../style/fontiran.css";
|
||||||
import "swiper/css";
|
import "swiper/css";
|
||||||
import "react-image-gallery/styles/css/image-gallery.css";
|
import "react-image-gallery/styles/css/image-gallery.css";
|
||||||
import Chapar from "plugins/Chapar";
|
import Chapar from "plugins/Chapar";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
import { useEffect, useState } from "react";
|
||||||
|
import "react-toastify/dist/ReactToastify.css";
|
||||||
|
import { ToastContainer } from "react-toastify";
|
||||||
|
import Loading from "plugins/Loading/page";
|
||||||
|
|
||||||
export const metadata = {
|
export default function RootLayout({ children }) {
|
||||||
title: "Create Next App",
|
const [cart, setCart] = useState([]);
|
||||||
description: "Generated by create next app",
|
const [products, setProducts] = useState([]);
|
||||||
};
|
const [navData, setNavData] = useState([]);
|
||||||
|
const [brands, setBrands] = useState([]);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
const [closeNavbar, setCloseNavbar] = useState(false);
|
||||||
|
const [bottomSheetCart, setBottomSheetCart] = useState(false);
|
||||||
|
|
||||||
|
const AddItemToCart = (id, persianName, cost) => {
|
||||||
|
console.log("persianName", persianName);
|
||||||
|
setCart((prevCart) => {
|
||||||
|
// Check if the item is already in the cart
|
||||||
|
const existingItem = prevCart.find((item) => item.id === id);
|
||||||
|
|
||||||
|
if (existingItem) {
|
||||||
|
// If the item is already in the cart, update its count
|
||||||
|
return prevCart.map((item) =>
|
||||||
|
item.id === id ? { ...item, count: item.count + 1 } : item
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
// If the item is not in the cart, add it with a count of 1
|
||||||
|
return [...prevCart, { id, count: 1, persianName, cost }];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const RemoveItemFromCart = (id) => {
|
||||||
|
setCart((prevCart) => {
|
||||||
|
// Check if the item is already in the cart
|
||||||
|
const existingItem = prevCart.find((item) => item.id === id);
|
||||||
|
|
||||||
|
if (existingItem) {
|
||||||
|
// If the item is already in the cart
|
||||||
|
if (existingItem.count === 1) {
|
||||||
|
// If the item count is 1, remove it from the cart
|
||||||
|
return prevCart.filter((item) => item.id !== id);
|
||||||
|
} else {
|
||||||
|
// If the item count is greater than 1, update its count
|
||||||
|
return prevCart.map((item) =>
|
||||||
|
item.id === id ? { ...item, count: item.count - 1 } : item
|
||||||
|
);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// If the item is not in the cart, do nothing
|
||||||
|
return prevCart;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const fetchNavData = async (id) => {
|
||||||
|
const res = await fetch(
|
||||||
|
`${process.env.NEXT_PUBLIC_API_URL}/product/category?sortByMain=true`
|
||||||
|
);
|
||||||
|
const post = await res.json();
|
||||||
|
setNavData(post);
|
||||||
|
};
|
||||||
|
|
||||||
|
const fetchProducts = async (
|
||||||
|
id,
|
||||||
|
selectedBrands,
|
||||||
|
isChecked,
|
||||||
|
minPrice,
|
||||||
|
maxPrice,
|
||||||
|
sort,
|
||||||
|
isRangePrice
|
||||||
|
) => {
|
||||||
|
const brandIds = selectedBrands?.map((brand) => brand.id);
|
||||||
|
|
||||||
|
const queryString = `page=0${id ? `&categoryId=${id}` : ""}${
|
||||||
|
brandIds?.length > 0 ? `&brandIds=${brandIds?.join("&brandIds=")}` : ""
|
||||||
|
}${isChecked ? `&isActive=${isChecked}` : ""}${
|
||||||
|
isRangePrice ? `&minPrice=${minPrice}` : ""
|
||||||
|
}${isRangePrice ? `&maxPrice=${maxPrice}` : ""}${
|
||||||
|
!!sort ? `&sortBy=${sort}` : ""
|
||||||
|
}`;
|
||||||
|
|
||||||
|
const cleanQueryString = decodeURIComponent(
|
||||||
|
queryString.replace(/\%20/g, " ")
|
||||||
|
);
|
||||||
|
const res = await fetch(
|
||||||
|
`${process.env.NEXT_PUBLIC_API_URL}/product?${cleanQueryString}`
|
||||||
|
);
|
||||||
|
const post = await res.json();
|
||||||
|
setProducts(post);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
fetchNavData();
|
||||||
|
}, []);
|
||||||
|
|
||||||
export default async function RootLayout({ children }) {
|
|
||||||
return (
|
return (
|
||||||
<html lang="en">
|
<AppContext.Provider
|
||||||
<body>{children}</body>
|
value={{
|
||||||
</html>
|
state: {
|
||||||
|
cart,
|
||||||
|
products,
|
||||||
|
navData,
|
||||||
|
loading,
|
||||||
|
brands,
|
||||||
|
closeNavbar,
|
||||||
|
bottomSheetCart,
|
||||||
|
},
|
||||||
|
setCart,
|
||||||
|
setProducts,
|
||||||
|
setNavData,
|
||||||
|
setLoading,
|
||||||
|
setBrands,
|
||||||
|
setBottomSheetCart,
|
||||||
|
AddItemToCart,
|
||||||
|
RemoveItemFromCart,
|
||||||
|
fetchNavData,
|
||||||
|
fetchProducts,
|
||||||
|
setCloseNavbar,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<html lang="en">
|
||||||
|
<body>
|
||||||
|
{children}
|
||||||
|
<ToastContainer position="bottom-right" closeOnClick={true} rtl />
|
||||||
|
<Loading />
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
</AppContext.Provider>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,118 @@
|
||||||
import React from "react";
|
"use client";
|
||||||
|
import React, { useContext, useState } from "react";
|
||||||
import logo from "../../../public/images/logo.png";
|
import logo from "../../../public/images/logo.png";
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
|
import Chapar from "plugins/Chapar";
|
||||||
|
import { toast } from "react-toastify";
|
||||||
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
import LoginStep from "@comp/Login/LoginStep";
|
||||||
|
import VerifyCodeStep from "@comp/Login/VerifyCodeStep";
|
||||||
|
import SignUp from "@comp/Login/SignUp";
|
||||||
|
import { useRouter } from "next/navigation";
|
||||||
|
import AppContext from "@ctx/AppContext";
|
||||||
|
|
||||||
const Login = () => {
|
const Login = () => {
|
||||||
|
const CTX = useContext(AppContext);
|
||||||
|
|
||||||
|
const [phoneNumber, setPhoneNumber] = useState("");
|
||||||
|
const [verifyCode, setVerifyCode] = useState("");
|
||||||
|
const [firstName, setFirstName] = useState("");
|
||||||
|
const [lastName, setLastName] = useState("");
|
||||||
|
const [stepLogin, setStepLogin] = useState(0);
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
const ConfirmPhoneNumber = async () => {
|
||||||
|
CTX.setLoading(true);
|
||||||
|
try {
|
||||||
|
const data = await Chapar.get(
|
||||||
|
`${process.env.NEXT_PUBLIC_API_URL}/auth/verifycode?phoneNumber=${phoneNumber}`
|
||||||
|
);
|
||||||
|
setStepLogin(1);
|
||||||
|
localStorage.removeItem("token");
|
||||||
|
CTX.setLoading(false);
|
||||||
|
} catch ({ error, status }) {
|
||||||
|
toast.error(" اطلاعات را صحیح وارد کنید ", {
|
||||||
|
position: "bottom-right",
|
||||||
|
closeOnClick: true,
|
||||||
|
});
|
||||||
|
CTX.setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const LoginWhitVerifyCode = async () => {
|
||||||
|
CTX.setLoading(true);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const data = await Chapar.post(
|
||||||
|
`${process.env.NEXT_PUBLIC_API_URL}/auth/login/code`,
|
||||||
|
{
|
||||||
|
userName: phoneNumber,
|
||||||
|
password: null,
|
||||||
|
verifyCode,
|
||||||
|
}
|
||||||
|
);
|
||||||
|
localStorage.setItem("token", "Bearer " + data.access_token);
|
||||||
|
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
|
if (data.user.signUpStatus == 1) {
|
||||||
|
setStepLogin(2);
|
||||||
|
} else if (data.user.signUpStatus == 10) {
|
||||||
|
// setProfile(data);
|
||||||
|
toast.success(` ${data.user.firstName} جان خوش اومدی `, {
|
||||||
|
position: "bottom-right",
|
||||||
|
closeOnClick: true,
|
||||||
|
});
|
||||||
|
router.push("/profile");
|
||||||
|
}
|
||||||
|
|
||||||
|
CTX.setLoading(false);
|
||||||
|
} catch ({ error, status }) {
|
||||||
|
toast.error(`${error?.response?.data?.message}`, {
|
||||||
|
position: "bottom-right",
|
||||||
|
closeOnClick: true,
|
||||||
|
});
|
||||||
|
CTX.setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const SignUpLogin = async () => {
|
||||||
|
CTX.setLoading(true);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const data = await Chapar.post(
|
||||||
|
`${process.env.NEXT_PUBLIC_API_URL}/auth/signup`,
|
||||||
|
{ lastName, firstName },
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
Authorization: localStorage.getItem("token"),
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
CTX.setLoading(false);
|
||||||
|
|
||||||
|
if (data.user.signUpStatus == 10) {
|
||||||
|
// setProfile(data);
|
||||||
|
|
||||||
|
toast.success(` ${data.user.firstName} جان خوش اومدی `, {
|
||||||
|
position: "bottom-right",
|
||||||
|
closeOnClick: true,
|
||||||
|
});
|
||||||
|
localStorage.setItem("token", data.access_token);
|
||||||
|
|
||||||
|
router.push("/profile");
|
||||||
|
}
|
||||||
|
} catch ({ error, status }) {
|
||||||
|
toast.error(`${error?.response?.data?.message}`, {
|
||||||
|
position: "bottom-right",
|
||||||
|
closeOnClick: true,
|
||||||
|
});
|
||||||
|
CTX.setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="bg-login">
|
<div className="bg-login">
|
||||||
<div className="xs:w-11/12 lg:w-4/12 xl:w-3/12 mx-auto pt-[150px]">
|
<div className="xs:w-11/12 lg:w-4/12 xl:w-3/12 mx-auto pt-[150px]">
|
||||||
|
|
@ -12,36 +122,28 @@ const Login = () => {
|
||||||
<Image src={logo} className="mx-auto" />
|
<Image src={logo} className="mx-auto" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-center mt-5">
|
{stepLogin == 0 ? (
|
||||||
<p className="mb-0 text-gray-300 text-base">ورود / ثبت نام</p>
|
<LoginStep
|
||||||
<p className="mb-0 text-gray-600 text-lg mt-2">
|
phoneNumber={phoneNumber}
|
||||||
شماره موبایل خود را وارد کنید
|
setPhoneNumber={setPhoneNumber}
|
||||||
</p>
|
ConfirmPhoneNumber={ConfirmPhoneNumber}
|
||||||
|
/>
|
||||||
<div className="mt-2">
|
) : stepLogin == 1 ? (
|
||||||
<input
|
<VerifyCodeStep
|
||||||
type="text"
|
phoneNumber={phoneNumber}
|
||||||
className="form-control !border-0 !bg-gray-200"
|
verifyCode={verifyCode}
|
||||||
/>
|
setVerifyCode={setVerifyCode}
|
||||||
|
LoginWhitVerifyCode={LoginWhitVerifyCode}
|
||||||
<div className="">
|
/>
|
||||||
<button className="btn btn-primary w-full rounded-xl py-3 mt-3">
|
) : stepLogin == 2 ? (
|
||||||
ورود و ثبت نام
|
<SignUp
|
||||||
</button>
|
setLastName={setLastName}
|
||||||
</div>
|
setFirstName={setFirstName}
|
||||||
|
SignUpLogin={SignUpLogin}
|
||||||
<div className="mt-4">
|
/>
|
||||||
<p className="mb-0 text-sm px-4 rtl">
|
) : (
|
||||||
با ورود و یا ثبت نام در وسمه شما{" "}
|
""
|
||||||
<small className="text-primary-400 text-sm font-semibold">
|
)}
|
||||||
شرایط و قوانین
|
|
||||||
</small>{" "}
|
|
||||||
استفاده از سرویس های سایت شاواز و قوانین حریم خصوصی آن را می
|
|
||||||
پذیرید.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>{" "}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -8,27 +8,11 @@ import BrandsLogoSection from "@comp/LandingPage/BrandsLogoSection/page";
|
||||||
import BeautySection from "@comp/LandingPage/BeautySection/page";
|
import BeautySection from "@comp/LandingPage/BeautySection/page";
|
||||||
import HomeSection from "@comp/LandingPage/HomeSection/page";
|
import HomeSection from "@comp/LandingPage/HomeSection/page";
|
||||||
|
|
||||||
async function getData() {
|
export default function Page() {
|
||||||
const res = await fetch("http://192.168.88.12:32770/api/product/category");
|
|
||||||
// The return value is *not* serialized
|
|
||||||
// You can return Date, Map, Set, etc.
|
|
||||||
|
|
||||||
if (!res.ok) {
|
|
||||||
// This will activate the closest `error.js` Error Boundary
|
|
||||||
throw new Error("Failed to fetch data");
|
|
||||||
}
|
|
||||||
|
|
||||||
return res.json();
|
|
||||||
}
|
|
||||||
|
|
||||||
export default async function Page() {
|
|
||||||
const dataNav = await getData();
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="bg-header">
|
<div className="bg-header">
|
||||||
<Navbar theme={0} dataNav={dataNav} />
|
<Navbar theme={0} />
|
||||||
|
|
||||||
<HeroSection />
|
<HeroSection />
|
||||||
</div>
|
</div>
|
||||||
<SurpriseSection />
|
<SurpriseSection />
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,27 @@
|
||||||
|
"use client";
|
||||||
import Footer from "@comp/Footer/page";
|
import Footer from "@comp/Footer/page";
|
||||||
import Navbar from "@comp/Navbar/page";
|
import Navbar from "@comp/Navbar/page";
|
||||||
import GalleryBox from "plugins/Gallery/page";
|
import GalleryBox from "plugins/Gallery/page";
|
||||||
import React from "react";
|
import React, { useEffect, useState } from "react";
|
||||||
|
|
||||||
import l1 from "../../../../public/images/logobrand/2.png";
|
import l1 from "../../../../public/images/logobrand/2.png";
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import PersianNumber from "plugins/PersianNumber";
|
import PersianNumber from "plugins/PersianNumber";
|
||||||
|
|
||||||
const page = () => {
|
const page = ({ params }) => {
|
||||||
|
const [product, setProduct] = useState([]);
|
||||||
|
const fetchPost = async (id) => {
|
||||||
|
const res = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/product/${id}`);
|
||||||
|
const post = await res.json();
|
||||||
|
setProduct(post);
|
||||||
|
};
|
||||||
|
|
||||||
|
console.log("product", product);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
fetchPost(params.id);
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Navbar theme={1} />
|
<Navbar theme={1} />
|
||||||
|
|
@ -19,9 +33,7 @@ const page = () => {
|
||||||
|
|
||||||
<div className="lg:col-span-3 xs:px-[20px] lg:px-[100px]">
|
<div className="lg:col-span-3 xs:px-[20px] lg:px-[100px]">
|
||||||
<div className="text-right mt-7">
|
<div className="text-right mt-7">
|
||||||
<h1 className="text-lg font-semibold ">
|
<h1 className="text-lg font-semibold ">{product.persianName} </h1>
|
||||||
ماسک دو فاز مناسب موهای آسیب دیده تاپ شاپ ظرفیت 200 میلی لیتر
|
|
||||||
</h1>
|
|
||||||
<p className="mb-0 text-sm text-gray-400">
|
<p className="mb-0 text-sm text-gray-400">
|
||||||
Top Shop Biphasic Hair Mask 200 ml
|
Top Shop Biphasic Hair Mask 200 ml
|
||||||
</p>
|
</p>
|
||||||
|
|
|
||||||
|
|
@ -139,21 +139,20 @@ body {
|
||||||
background-size: var(--s) var(--s);
|
background-size: var(--s) var(--s);
|
||||||
}
|
}
|
||||||
|
|
||||||
.scroll-1 {
|
|
||||||
overflow: auto;
|
|
||||||
scrollbar-width: thin; /* Firefox */
|
|
||||||
scrollbar-color: #2ab1da57 #b1b1b1; /* Firefox */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Styles for WebKit browsers (Chrome, Safari) */
|
/* Styles for WebKit browsers (Chrome, Safari) */
|
||||||
.scroll-1::-webkit-scrollbar {
|
.scroll-1::-webkit-scrollbar {
|
||||||
width: 5px;
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
body::-webkit-scrollbar-track {
|
||||||
|
background: #f1f1f1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.scroll-1::-webkit-scrollbar-thumb {
|
.scroll-1::-webkit-scrollbar-thumb {
|
||||||
background-color: #2ab1da1c;
|
background: #88888842;
|
||||||
|
border-radius: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.scroll-1::-webkit-scrollbar-track {
|
.scroll-1::-webkit-scrollbar-thumb:hover {
|
||||||
background-color: #f5f5f5;
|
background: #555;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue