NetinaShop
/
web
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

before begaii

master
حسین معصومی پور 2024-02-22 20:45:50 +03:30
parent a3ead155c9
commit e2a947a61a
23 changed files with 285 additions and 204 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
components/Cards/CardCategories/page.jsx
View File

@ -49,16 +49,16 @@ const CardCategories = ({ data }) => {
{!!data.mainImage ? ( {!!data.mainImage ? (
<Image <Image
src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${data.mainImage}`} src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${data.mainImage}`}
width={100} width={200}
height={100} height={200}
className="xs:!w-[110px] lg:!w-[130px] mx-auto !object-cover" className="xs:!w-[110px] lg:!w-[130px] mx-auto"
alt="" alt=""
/> />
) : ( ) : (
<div className="xs:!w-[85px] lg:!w-[85px] h-[90px] mt-10 "> <div className="xs:!w-[85px] lg:!w-[85px] h-[90px] mt-10 ">
<Image <Image
src={logo} src={logo}
className="xs:!w-[70px] lg:!w-[70px] mx-auto !object-cover opacity-25 mt-5" className="xs:!w-[70px] lg:!w-[70px] mx-auto opacity-25 mt-5"
alt="" alt=""
/> />
</div> </div>
@ -69,10 +69,9 @@ const CardCategories = ({ data }) => {
{data.persianName}{" "} {data.persianName}{" "}
</p> </p>
{data.stock <= 3 && ( {data.stock <= 3 && data.stock !== 0 && (
<p className="mb-0 xs:text-[11px] lg:text-[12px] xl:text-[13px] text-red-600 font-medium"> <p className="mb-0 text-[11px] text-red-600 font-medium">
{" "} {data.stock} عدد موجود انبار
{data.stock}عدد موجود انبار
</p> </p>
)} )}
</div> </div>

15
components/Cards/CardCategoriesMobile/page.jsx
View File

@ -19,16 +19,16 @@ const CardCategoriesMobile = ({ data }) => {
{!!data.mainImage ? ( {!!data.mainImage ? (
<Image <Image
src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${data.mainImage}`} src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${data.mainImage}`}
width={100} width={200}
height={100} height={200}
className="xs:!w-[110px] lg:!w-[130px] mx-auto !object-cover" className="xs:!w-[110px] lg:!w-[130px] mx-auto "
alt="" alt=""
/> />
) : ( ) : (
<div className="xs:!w-[85px] lg:!w-[85px] "> <div className="xs:!w-[85px] lg:!w-[85px] ">
<Image <Image
src={logo} src={logo}
className="xs:!w-[70px] lg:!w-[70px] mx-auto !object-cover opacity-25 mt-5" className="xs:!w-[70px] lg:!w-[70px] mx-auto opacity-25 mt-5"
alt="" alt=""
/> />
</div> </div>
@ -43,10 +43,9 @@ const CardCategoriesMobile = ({ data }) => {
{data?.persianName} {data?.persianName}
</p> </p>
</Link> </Link>
{data.stock <= 3 && ( {data.stock <= 3 && data.stock !== 0 && (
<p className="mb-0 xs:text-[11px] lg:text-[12px] xl:text-[13px] text-red-600 font-medium"> <p className="mb-0 text-[11px] text-red-600 font-medium">
{" "} {data.stock} عدد موجود انبار
{data.stock}عدد موجود انبار
</p> </p>
)} )}
<div className=" rounded-full flex ltr pt-2 mt-2 w-full"> <div className=" rounded-full flex ltr pt-2 mt-2 w-full">

26
components/Cards/CardNormal/page.jsx
View File

@ -1,12 +1,13 @@
"use client"; "use client";
import { useContext } from "react"; import React, { useContext } from "react";
import { SwiperSlide } from "swiper/react";
import logo from "../../../public/images/logo.png"; import logo from "../../../public/images/logo.png";
import AppContext from "@ctx/AppContext";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link";
import PersianNumber from "plugins/PersianNumber"; import PersianNumber from "plugins/PersianNumber";
import AddToCart from "../Components/AddToCart/page"; import AppContext from "@ctx/AppContext";
import AddToCart from "../Components/AddToCart/Page";
import Link from "next/link";
const CardNormal = ({ data }) => { const CardNormal = ({ data }) => {
const CTX = useContext(AppContext); const CTX = useContext(AppContext);
@ -41,16 +42,16 @@ const CardNormal = ({ data }) => {
{!!data.mainImage ? ( {!!data.mainImage ? (
<Image <Image
src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${data.mainImage}`} src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${data.mainImage}`}
width={100} width={200}
height={100} height={200}
className="xs:!w-[110px] lg:!w-[130px] mx-auto !object-cover" className="xs:!w-[110px] lg:!w-[130px] mx-auto"
alt="" alt=""
/> />
) : ( ) : (
<div className="xs:!w-[85px] lg:!w-[85px] h-[90px] mt-10 "> <div className="xs:!w-[85px] lg:!w-[85px] h-[90px] xs:mt-5 lg:mt-10 ">
<Image <Image
src={logo} src={logo}
className="xs:!w-[70px] lg:!w-[70px] mx-auto !object-cover opacity-25 mt-5" className="xs:!w-[70px] lg:!w-[70px] mx-auto opacity-25 mt-5"
alt="" alt=""
/> />
</div> </div>
@ -58,13 +59,12 @@ const CardNormal = ({ data }) => {
</div> </div>
<div className="p-3 text-right"> <div className="p-3 text-right">
<p className="mb-0 text-[14px] max-h-[44px] overflow-hidden "> <p className="mb-0 text-[14px] max-h-[44px] overflow-hidden ">
{data.persianName}{" "} {data.persianName}
</p> </p>
{data.stock <= 3 && ( {data.stock <= 3 && data.stock !== 0 && (
<p className="mb-0 text-[11px] text-red-600 font-medium"> <p className="mb-0 text-[11px] text-red-600 font-medium">
{" "} {data.stock} عدد موجود انبار
{data.stock}عدد موجود انبار
</p> </p>
)} )}
</div> </div>

125
components/Cards/CardSurprise/page.jsx
View File

@ -1,60 +1,97 @@
"use client";
import { useContext } from "react";
import logo from "../../../public/images/logo.png";
import AppContext from "@ctx/AppContext";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link";
import PersianNumber from "plugins/PersianNumber"; import PersianNumber from "plugins/PersianNumber";
import p1 from "../../../public/images/product/1.png";
import AddToCart from "../Components/AddToCart/page"; import AddToCart from "../Components/AddToCart/page";
const CardSurprise = () => { const CardSurprise = ({ data }) => {
const CTX = useContext(AppContext);
const cart = CTX.state.cart;
return ( return (
<div> <>
{" "}
<> <>
<div <Link href={`/products/${data.id}`}>
className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[250px] ${ <div
1 == 1 ? "bg-white rounded-xl" : " opacity-70" className={` tr03 py-2 overflow-hidden xs:h-[200px] lg:h-[230px] border border-gray-100 ${
}`} 1 == 1 ? "bg-white rounded-xl" : " opacity-70"
// key={index} }`}
// onClick={() => handleRoutineShiftPlanWithDay(index)} // key={index}
> // onClick={() => handleRoutineShiftPlanWithDay(index)}
<div className="absolute m-3 "> >
<div className="w-fit rounded-full bg-red-900 overflow-hidden px-1 "> {data.hasDiscount && (
<p className="mb-0 text-[10px] text-white pt-[3px] "> <div className="absolute m-3 ">
<PersianNumber number={35} /> <div className="w-fit rounded-lg bg-red-600 overflow-hidden px-1 ">
<small className="text-[10px] ml-1">%</small> <p className="mb-0 text-[10px] text-white pt-[3px] ">
</p> <PersianNumber
</div> number={data.discountPercent}
</div>{" "} style={"!text-[10px]"}
<div className="w-full h-fit "> />
<Image <small className="text-[10px] ml-1">%</small>
src={p1} </p>
className="xs:w-[110px] lg:w-[170px] mx-auto" </div>
alt="" </div>
/> )}
</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 w-full">
<AddToCart />
<div className="w-full text-right rounded-full"> <div className="w-full h-fit flex justify-center ">
{2 == 2 ? ( {!!data.mainImage ? (
<Image
src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${data.mainImage}`}
width={100}
height={100}
className="xs:!w-[110px] lg:!w-[130px] mx-auto !object-cover"
alt=""
/>
) : (
<div className="xs:!w-[85px] lg:!w-[85px] h-[90px] mt-10 ">
<Image
src={logo}
className="xs:!w-[70px] lg:!w-[70px] mx-auto !object-cover opacity-25 mt-5"
alt=""
/>
</div>
)}
</div>
<div className="p-3 text-right">
<p className="mb-0 text-[14px] max-h-[44px] overflow-hidden ">
{data.persianName}{" "}
</p>
{data.stock <= 3 && data.stock !== 0 && (
<p className="mb-0 text-[11px] text-red-600 font-medium">
{data.stock} عدد موجود انبار
</p>
)}
</div>
</div>
</Link>
</>
<div className="bg-gray-50 rounded-lg flex ltr p-1 mt-2 border border-gray-100">
<div className="flex w-full">
<AddToCart data={data} theme={1} />
</div>
<div className="w-full text-right rounded-full pr-2">
{data?.hasDiscount ? (
<> <>
<p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600"> <p className="mb-0 font-bold text-sm absolute right-3 opacity-30 mt-[-5px] text-red-600">
<del> <del>
<PersianNumber number={150000} style={"text-[13px]"} /> <PersianNumber
number={(data?.cost / 10).toLocaleString()}
style="!text-[11px]"
/>
</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?.costWithDiscount / 10).toLocaleString()}
/>
</p> </p>
<small className="mr-1 mt-[3px]">تومان</small> <small className="mr-1 mt-[3px]">تومان</small>
</div> </div>
@ -63,14 +100,14 @@ const CardSurprise = () => {
<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 / 10).toLocaleString()} />
</p> </p>
<small className="mr-1 mt-[6px]">تومان</small> <small className="mr-1 mt-[6px]">تومان</small>
</div> </div>
)} )}
</div> </div>
</div> </div>
</div> </>
); );
}; };

10
components/Cards/Components/AddToCart/page.jsx
View File

@ -7,16 +7,6 @@ const AddToCart = ({ data, theme }) => {
const CTX = useContext(AppContext); const CTX = useContext(AppContext);
const cart = CTX.state.cart; const cart = CTX.state.cart;
console.log(
data?.id,
data?.persianName,
data?.cost,
data?.costWithDiscount,
data?.mainImage,
data?.hasDiscount,
data?.maxOrderCount
);
const handleAddItemToCart = (id) => { const handleAddItemToCart = (id) => {
CTX.AddItemToCart( CTX.AddItemToCart(
data?.id, data?.id,

43
components/Category/Mobile/FilterCategoryMobile/page.jsx
View File

@ -90,40 +90,9 @@ const FilterCategoryMobile = (props) => {
</div> </div>
{trendFilter ? ( {trendFilter ? (
<div className=" flex overflow-auto whitespace-nowrap rtl px-2 mb-5 mt-5 "> <div className=" flex overflow-auto whitespace-nowrap rtl px-2 mb-5 mt-5 hide-scrollBar ">
{/* <div
className="bg-primary-500 p-1 px-2 mx-1 rounded-full"
onClick={() => props.setSortBy(1)}
>
<p className="mb-0 text-sm text-white">پربازدید ترین ها</p>
</div>
<div <div
className="bg-primary-500 p-1 px-2 mx-1 rounded-full" className={`w-fit rounded-full px-2 mx-1 tr03 ${
onClick={() => props.setSortBy(2)}
>
<p className="mb-0 text-sm text-white">پربازدید ها</p>
</div>
<div
className="bg-primary-500 p-1 px-2 mx-1 rounded-full"
onClick={() => props.setSortBy(3)}
>
<p className="mb-0 text-sm text-white"> ترین ها</p>
</div>
<div
className="bg-primary-500 p-1 px-2 mx-1 rounded-full"
onClick={() => props.setSortBy(4)}
>
<p className="mb-0 text-sm text-white">پربازدید ها</p>
</div>
<div
className="bg-primary-500 p-1 px-2 mx-1 rounded-full"
onClick={() => props.setSortBy(5)}
>
<p className="mb-0 text-sm text-white">پربازدید ترین </p>
</div> */}
<div
className={`w-fit rounded-full px-2 mx-2 tr03 ${
props.sortBy == 1 ? "bg-primary-600" : " opacity-60 " props.sortBy == 1 ? "bg-primary-600" : " opacity-60 "
}`} }`}
onClick={() => props.setSortBy(1)} onClick={() => props.setSortBy(1)}
@ -137,7 +106,7 @@ const FilterCategoryMobile = (props) => {
</p> </p>
</div> </div>
<div <div
className={`w-fit rounded-full px-2 mx-2 tr03 ${ className={`w-fit rounded-full px-2 mx-1 tr03 ${
props.sortBy == 2 ? "bg-primary-600" : " opacity-60 " props.sortBy == 2 ? "bg-primary-600" : " opacity-60 "
}`} }`}
onClick={() => props.setSortBy(2)} onClick={() => props.setSortBy(2)}
@ -151,7 +120,7 @@ const FilterCategoryMobile = (props) => {
</p> </p>
</div> </div>
<div <div
className={`w-fit rounded-full px-2 mx-2 tr03 ${ className={`w-fit rounded-full px-2 mx-1 tr03 ${
props.sortBy == 3 ? "bg-primary-600" : " opacity-60 " props.sortBy == 3 ? "bg-primary-600" : " opacity-60 "
}`} }`}
onClick={() => props.setSortBy(3)} onClick={() => props.setSortBy(3)}
@ -165,7 +134,7 @@ const FilterCategoryMobile = (props) => {
</p> </p>
</div> </div>
<div <div
className={`w-fit rounded-full px-2 mx-2 tr03 ${ className={`w-fit rounded-full px-2 mx-1 tr03 ${
props.sortBy == 4 ? "bg-primary-600" : " opacity-60 " props.sortBy == 4 ? "bg-primary-600" : " opacity-60 "
}`} }`}
onClick={() => props.setSortBy(4)} onClick={() => props.setSortBy(4)}
@ -179,7 +148,7 @@ const FilterCategoryMobile = (props) => {
</p> </p>
</div> </div>
<div <div
className={`w-fit rounded-full px-2 mx-2 tr03 ${ className={`w-fit rounded-full px-2 mx-1 tr03 ${
props.sortBy == 5 ? "bg-primary-600" : " opacity-60 " props.sortBy == 5 ? "bg-primary-600" : " opacity-60 "
}`} }`}
onClick={() => props.setSortBy(5)} onClick={() => props.setSortBy(5)}

4
components/LandingPage/HeroSection/page.jsx
View File

@ -12,9 +12,9 @@ const HeroSection = () => {
<div className=" xs:mt-[150px] md:mt-[60px] xl:mt-[180px] relative"> <div className=" xs:mt-[150px] md:mt-[60px] xl:mt-[180px] relative">
<div className="text-center"> <div className="text-center">
<h1 className=" xs:text-3xl lg:text-5xl xl:text-6xl text-white font-bold"> <h1 className=" xs:text-3xl lg:text-5xl xl:text-6xl text-white font-bold">
وسمه ، بن ماضـــــــــــــــــی زیبایی وسمه ، بُن مضـــــــــــارع زیبایی
</h1> </h1>
<h2 className="text-white mt-2 xs:text-sm lg:text-lg xl:text-xl font-light"> <h2 className="text-gray-300 mt-4 xs:text-sm lg:text-lg xl:text-xl font-light ">
پلتفرم زیبایی ایرانی راهی برای زیبایی بهتر پلتفرم زیبایی ایرانی راهی برای زیبایی بهتر
</h2> </h2>
</div> </div>

5
components/LandingPage/HomeSection/page.jsx
View File

@ -2,6 +2,7 @@ import CardNormal from "@comp/Cards/CardNormal/page";
import Image from "next/image"; import Image from "next/image";
import { Swiper, SwiperSlide } from "swiper/react"; import { Swiper, SwiperSlide } from "swiper/react";
import khane from "../../../public/images/khane.jpg"; import khane from "../../../public/images/khane.jpg";
import CardSurprise from "@comp/Cards/CardSurprise/page";
const HomeSection = ({ data }) => { const HomeSection = ({ data }) => {
return ( return (
@ -14,7 +15,7 @@ const HomeSection = ({ data }) => {
</div> </div>
</div> </div>
<div className="bg-gray-100 relative xs:left-[0px] lg:left-[30px] xs:top-[-35px] lg:top-0 col-span-2 z-0 rounded-3xl xs:pr-5 lg:pr-[55px] xs:pt-[55px] lg:pt-3 xl:pt-10 pl-5 xs:pb-10 lg:pb-0"> <div className="relative xs:left-[0px] lg:left-[30px] xs:top-[-35px] lg:top-0 col-span-2 z-0 rounded-3xl xs:pr-5 lg:pr-[55px] xs:pt-[55px] lg:pt-3 xl:pt-10 pl-5 xs:pb-10 lg:pb-0">
<div className="xs:block lg:flex"> <div className="xs:block lg:flex">
<h2 className="xs:text-2xl lg:text-xl xl:text-3xl font-bold"> <h2 className="xs:text-2xl lg:text-xl xl:text-3xl font-bold">
لوازم بهداشتی منزل وسمه لوازم بهداشتی منزل وسمه
@ -51,7 +52,7 @@ const HomeSection = ({ data }) => {
> >
{data?.map((e, index) => ( {data?.map((e, index) => (
<SwiperSlide key={index}> <SwiperSlide key={index}>
<CardNormal data={e} /> <CardSurprise data={e} />
</SwiperSlide> </SwiperSlide>
))} ))}
</Swiper> </Swiper>

3
components/LandingPage/SurpriseSection/page.jsx
View File

@ -1,4 +1,5 @@
import CardNormal from "@comp/Cards/CardNormal/page"; import CardNormal from "@comp/Cards/CardNormal/page";
import TimerDown from "@comp/TimerDown/TimerDown";
import { Swiper, SwiperSlide } from "swiper/react"; import { Swiper, SwiperSlide } from "swiper/react";
const SurpriseSection = ({ data }) => { const SurpriseSection = ({ data }) => {
@ -29,7 +30,7 @@ const SurpriseSection = ({ data }) => {
<p className="mb-0 text-white font-bold xs:text-sm lg:text-2xl xl:text-2xl"> <p className="mb-0 text-white font-bold xs:text-sm lg:text-2xl xl:text-2xl">
پیشنهاد های ویژه امروز{" "} پیشنهاد های ویژه امروز{" "}
</p> </p>
{/* <TimerDown /> */} <TimerDown />
</div> </div>
</div> </div>
<Swiper <Swiper

24
components/Navbar/page.jsx
View File

@ -177,7 +177,7 @@ const Navbar = ({ theme }) => {
<div <div
className={`flex justify-center rtl pt-3 tr03 z-50 tr03 ${ className={`flex justify-center rtl pt-3 tr03 z-50 tr03 ${
navItemHover != null ? "bg-navbar rounded-xl " : "bg-transparent" navItemHover != null ? "bg-white rounded-xl " : "bg-transparent"
}${ }${
isScrolled isScrolled
? " !fixed top-0 w-full bg-white " ? " !fixed top-0 w-full bg-white "
@ -191,10 +191,10 @@ const Navbar = ({ theme }) => {
<p <p
className={`mb-0 pb-4 px-2 tr03 cursor-pointer ${ className={`mb-0 pb-4 px-2 tr03 cursor-pointer ${
navItemHover == index navItemHover == index
? "font-bold border-b-[3px] border-gray-400 text-black " ? " border-y-[5px] border-b-primary-800 border-t-transparent text-primary-900"
: "border-b-[3px] border-transparent " : "border-y-[5px] border-y-transparent text-black"
} }
${theme == 0 ? "text-gray-300" : "text-gray-900"} ${theme == 0 ? "text-gray-400" : "text-gray-900"}
${theme == 0 && isScrolled ? "text-gray-900" : ""}`} ${theme == 0 && isScrolled ? "text-gray-900" : ""}`}
onMouseEnter={() => handleItemNavber(index)} onMouseEnter={() => handleItemNavber(index)}
onMouseLeave={() => setNavItemHover(null)} onMouseLeave={() => setNavItemHover(null)}
@ -347,13 +347,15 @@ const Navbar = ({ theme }) => {
} `} } `}
> >
{" "} {" "}
<div className="w-[70px] mt-[6px] z-10 "> <Link href={"/"}>
{isScrolled ? ( <div className="w-[70px] mt-[6px] z-10 ">
<Image src={theme == 0 ? logoBlack : logoBlack} alt="" /> {isScrolled ? (
) : ( <Image src={theme == 0 ? logoBlack : logoBlack} alt="" />
<Image src={theme == 0 ? logoWhite : logoBlack} alt="" /> ) : (
)} <Image src={theme == 0 ? logoWhite : logoBlack} alt="" />
</div> )}
</div>
</Link>
<div className="flex"> <div className="flex">
<div className="flex"> <div className="flex">
{profile?.length <= 0 ? ( {profile?.length <= 0 ? (

38
components/TimerDown/TimerDown.jsx
View File

@ -4,7 +4,7 @@ import PersianNumber from "plugins/PersianNumber";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
const TimerDown = () => { const TimerDown = () => {
const targetTimestamp = 1707629566 * 1000; // Convert to milliseconds const targetTimestamp = 1710654443 * 1000; // Convert to milliseconds
const [timeRemaining, setTimeRemaining] = useState({ const [timeRemaining, setTimeRemaining] = useState({
days: 0, days: 0,
@ -46,46 +46,46 @@ const TimerDown = () => {
}, []); }, []);
return ( return (
<div className="flex justify-center ltr border-[2px] border-white realtive mr-5 px-2 rounded-full "> <div className=" justify-center ltr realtive mr-5 px-2 xs:hidden lg:flex ">
<div className=""> <div className=" rounded-full bg-red-100 w-[50px] h-[50px] mx-1">
<p className="mb-0 = text-center text-white font-bold pt-1"> <p className="mb-0 = text-center text-red-900 font-bold pt-3 ">
<PersianNumber <PersianNumber
number={timeRemaining.days} number={timeRemaining.days}
style={"text-[27px] text-white"} style={"text-[27px] text-red-900 "}
/> />
<small className="text-[10px] px-2">:</small>
</p> </p>
<p className="text-[12px] pt-6 text-center ">روز</p>
</div> </div>
<div className=""> <div className=" rounded-full bg-red-100 w-[50px] h-[50px] mx-1">
<p className="mb-0 text-center text-white font-bold pt-1"> <p className="mb-0 text-center text-red-900 font-bold pt-3 ">
<PersianNumber <PersianNumber
number={timeRemaining.hours} number={timeRemaining.hours}
style={"text-[27px] text-white"} style={"text-[27px] text-red-900 "}
/> />
<small className="text-[10px] px-2">:</small>
</p> </p>
<p className="text-[12px] pt-6 text-center ">ساعت</p>
</div> </div>
<div className=" rounded-full bg-red-100 w-[50px] h-[50px] mx-1">
<div className=" "> <p className="mb-0 text-center text-red-900 font-bold pt-3 ">
<p className="mb-0 text-center text-white font-bold pt-1">
<PersianNumber <PersianNumber
number={timeRemaining.minutes} number={timeRemaining.minutes}
style={"text-[27px] text-white"} style={"text-[27px] text-red-900 "}
/> />
<small className="text-[10px] px-2">:</small>
</p> </p>
<p className="text-[12px] pt-6 text-center ">دقیقه</p>
</div> </div>
<div className=" rounded-full bg-red-100 w-[50px] h-[50px] mx-1">
<div className="">
<Link href="/login"> <Link href="/login">
{" "} {" "}
<p className="mb-0 text-center text-white font-bold pt-1"> <p className="mb-0 text-center text-red-900 font-bold pt-3 ">
<PersianNumber <PersianNumber
number={timeRemaining.seconds} number={timeRemaining.seconds}
style={"text-[27px] text-white"} style={"text-[27px] text-red-900 "}
/> />
</p> </p>
<p className="text-[12px] pt-6 text-center ">ثانیه</p>
</Link> </Link>
</div> </div>
</div> </div>

19
plugins/Goftino/page.jsx 100644
View File

@ -0,0 +1,19 @@
import Script from "next/script";
export default function Goftino() {
const getGoftiono = () => {
return {
__html: ` !function(){var i="Gk1Yld",a=window,d=document;function g(){var g=d.createElement("script"),s="https://www.goftino.com/widget/"+i,l=localStorage.getItem("goftino_"+i);g.async=!0,g.src=l?s+"?o="+l:s;d.getElementsByTagName("head")[0].appendChild(g);}"complete"===d.readyState?g():a.attachEvent?a.attachEvent("onload",g):a.addEventListener("load",g,!1);}();
`,
};
};
return (
<>
<Script
strategy="afterInteractive"
dangerouslySetInnerHTML={getGoftiono()}
/>
</>
);
}

53
plugins/bottomSheet/BottomSheetAddress.jsx
View File

@ -4,6 +4,7 @@ import AppContext from "@ctx/AppContext";
import { iranCities } from "iranCities"; import { iranCities } from "iranCities";
import { iranProvince } from "iranProvince"; import { iranProvince } from "iranProvince";
import Chapar from "plugins/Chapar"; import Chapar from "plugins/Chapar";
import validateIranPhone from "plugins/IranPhoneRegex";
import { useContext, useEffect, useRef, useState } from "react"; import { useContext, useEffect, useRef, useState } from "react";
import { BottomSheet } from "react-spring-bottom-sheet"; import { BottomSheet } from "react-spring-bottom-sheet";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
@ -51,33 +52,45 @@ const BottomSheetAddress = () => {
}; };
const handleCreateAddress = async () => { const handleCreateAddress = async () => {
if (validator.current.allValid()) { if (validateIranPhone(receiverPhoneNumber)) {
try { if (validator.current.allValid()) {
const data = await Chapar.post( try {
`${process.env.NEXT_PUBLIC_API_URL}/user/address`, const data = await Chapar.post(
JSON.stringify(body), `${process.env.NEXT_PUBLIC_API_URL}/user/address`,
{ JSON.stringify(body),
headers: { {
Authorization: localStorage.getItem("token"), headers: {
}, Authorization: localStorage.getItem("token"),
} },
); }
);
toast.success(`آدرس اضافه شد`, { toast.success(`آدرس اضافه شد`, {
position: "bottom-right", position: "bottom-right",
closeOnClick: true, closeOnClick: true,
}); });
CTX.setBottomSheetAddressOpen(false); CTX.setBottomSheetAddressOpen(false);
CTX.fetchAddressUser(); CTX.fetchAddressUser();
} catch ({ error, status }) { } catch ({ error, status }) {
toast.error(`${error?.response?.data?.message}`, { toast.error(`${error?.response?.data?.message}`, {
position: "bottom-right",
closeOnClick: true,
});
}
} else {
toast.error("پرکردن همه ی فیلد ها واجب است", {
position: "bottom-right", position: "bottom-right",
autoClose: 2000,
hideProgressBar: false,
closeOnClick: true, closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
}); });
} }
} else { } else {
toast.error("پرکردن همه ی فیلد ها واجب است", { toast.error("شماره تماس را درست وارد کنید", {
position: "bottom-right", position: "bottom-right",
autoClose: 2000, autoClose: 2000,
hideProgressBar: false, hideProgressBar: false,

2
plugins/bottomSheet/BottomSheetLogOut.jsx
View File

@ -12,6 +12,8 @@ const BottomSheetLogOut = ({ id }) => {
const handleLogOut = async () => { const handleLogOut = async () => {
localStorage.removeItem("token"); localStorage.removeItem("token");
CTX.setProfile([]);
CTX.setBottomSheetLogOutOpen(false);
router.push("/"); router.push("/");
}; };

36
src/app/cart/checkout/page.jsx
View File

@ -94,6 +94,8 @@ const Page = () => {
}, },
} }
); );
router.push(data?.paymentUrl);
} catch ({ error, status }) { } catch ({ error, status }) {
toast.error(`${error?.response?.data?.message}`, { toast.error(`${error?.response?.data?.message}`, {
position: "bottom-right", position: "bottom-right",
@ -145,9 +147,9 @@ const Page = () => {
{addressData.map((e, index) => ( {addressData.map((e, index) => (
<div <div
className={`flex rtl px-3 py-2 border-2 border-transparent tr03 mx-2 mt-3 ${ className={`flex rtl px-3 py-4 border-2 border-transparent tr03 mx-2 mt-3 cursor-pointer ${
addressId == index addressId == index
? "border-2 border-green-600 rounded-lg bg-green-50" ? "border-2 !border-green-600 rounded-lg bg-green-50"
: "" : ""
}`} }`}
onClick={() => setAddressId(index)} onClick={() => setAddressId(index)}
@ -216,9 +218,9 @@ const Page = () => {
<div> <div>
{shippingData?.map((e, index) => ( {shippingData?.map((e, index) => (
<div <div
className={`flex rtl px-2 py-1 mx-2 mt-5 border-2 border-transparent tr03 cursor-pointer ${ className={`flex rtl px-2 py-2 mx-2 mt-5 border-2 border-transparent tr03 cursor-pointer ${
shippingId == index shippingId == index
? "border-2 border-green-600 rounded-lg bg-green-50" ? "border-2 !border-green-600 rounded-lg bg-green-50"
: "" : ""
}`} }`}
onClick={() => handleShippingID(index)} onClick={() => handleShippingID(index)}
@ -276,8 +278,8 @@ const Page = () => {
<div> <div>
<div <div
className={`flex rtl px-2 py-1 mx-2 border-2 border-transparent mt-5 ${ className={`flex rtl px-2 py-2 mx-2 border-2 border-transparent mt-5 ${
true ? "border-2 border-green-600 rounded-lg bg-green-50" : "" true ? "border-2 !border-green-600 rounded-lg bg-green-50" : ""
}`} }`}
> >
<div> <div>
@ -302,9 +304,10 @@ const Page = () => {
<p className="mb-0 text-[12px] text-gray-500">آسان پرداخت</p> <p className="mb-0 text-[12px] text-gray-500">آسان پرداخت</p>
</div> </div>
</div> </div>
<div <div
className={`flex justify-between rtl px-3 mt-5 ${ className={`flex justify-between rtl px-3 mt-5 ${
checkOutData?.discountCode != "" ? "opacity-30 blur-[1px]" : "" checkOutData?.discountCode != "" ? "" : ""
}`} }`}
onClick={() => { onClick={() => {
if (checkOutData?.discountCode == "") { if (checkOutData?.discountCode == "") {
@ -342,14 +345,17 @@ const Page = () => {
</div> </div>
</div> </div>
<div className="pl-3"> {checkOutData?.discountCode == "" ? (
<span className="text-[30px] opacity-60">+</span> <div className="pl-3">
</div> <span className="text-[30px] opacity-60">+</span>
</div> </div>
<div className="text-right flex justify-end px-2 py-1 mx-2"> ) : (
<p className="text-green-600 mb-0 text-[12px] "> <div className="text-right flex justify-end px-2 py-1 mx-2">
کد تخفیف ثبت شد{" "} <p className="text-green-600 mb-0 text-[12px] ">
</p> کد تخفیف ثبت شد{" "}
</p>
</div>
)}
</div> </div>
</div> </div>

10
src/app/cart/page.jsx
View File

@ -105,7 +105,7 @@ const Page = () => {
<div className=""> <div className="">
<div className="text-right flex rtl justify-between border-y-[1px] border-gray-200 my-3 px-4 "> <div className="text-right flex rtl justify-between border-y-[1px] border-gray-200 my-3 px-4 ">
<p className="mb-0 text-sm font-semibold py-4">حساب نهایی</p> <p className="mb-0 text-sm font-medium py-4">حساب نهایی</p>
{/* <div className="bg-primary-200 w-fit h-fit relative my-3 p-1 rounded-lg"> {/* <div className="bg-primary-200 w-fit h-fit relative my-3 p-1 rounded-lg">
<p className="mb-0 text-[11px] text-white rtl"> <p className="mb-0 text-[11px] text-white rtl">
@ -123,7 +123,7 @@ const Page = () => {
<p className="mb-0 "> <p className="mb-0 ">
<PersianNumber <PersianNumber
number={(calculateTotalCost / 10)?.toLocaleString()} number={(calculateTotalCost / 10)?.toLocaleString()}
style={"!text-[14px] !font-semibold"} style={"!text-[14px] !font-medium"}
/> />
</p> </p>
<small className="text-gray-500 text-[12px] mt-1 mx-1"> <small className="text-gray-500 text-[12px] mt-1 mx-1">
@ -136,7 +136,7 @@ const Page = () => {
<div className="flex justify-between rtl my-2 px-4"> <div className="flex justify-between rtl my-2 px-4">
<p className="mb-0 text-[12px] text-gray-500">تخفیف محصول</p> <p className="mb-0 text-[12px] text-gray-500">تخفیف محصول</p>
<div className="flex justify-center"> <div className="flex justify-center ">
<p className="mb-0 "> <p className="mb-0 ">
<PersianNumber <PersianNumber
number={( number={(
@ -144,7 +144,7 @@ const Page = () => {
calculateTotalCostWithDiscount) / calculateTotalCostWithDiscount) /
10 10
)?.toLocaleString()} )?.toLocaleString()}
style={"!text-[14px] !font-semibold"} style={"!text-[14px] !font-medium"}
/> />
</p> </p>
<small className="text-gray-500 text-[12px] mt-1 mx-1"> <small className="text-gray-500 text-[12px] mt-1 mx-1">
@ -186,7 +186,7 @@ const Page = () => {
<NavBarDownCart <NavBarDownCart
calculateTotalCost={calculateTotalCostWithDiscount / 10} calculateTotalCost={calculateTotalCostWithDiscount / 10}
event={() => handleGoCheckOut()} event={() => handleGoCheckOut()}
permissionGoPay={true} permissionGoPay={!!cart.length > 0}
/> />
</div> </div>
</> </>

13
src/app/layout.jsx
View File

@ -13,6 +13,15 @@ import "react-toastify/dist/ReactToastify.css";
import "swiper/css"; import "swiper/css";
import "../../style/fontiran.css"; import "../../style/fontiran.css";
import "../../style/globals.css"; import "../../style/globals.css";
import Goftino from "plugins/Goftino/page";
export const metadata = {
title: "Acme",
openGraph: {
title: "Acme",
description: "Acme is a...",
},
};
export default function RootLayout({ children }) { export default function RootLayout({ children }) {
const [cart, setCart] = useState([]); const [cart, setCart] = useState([]);
@ -37,8 +46,6 @@ export default function RootLayout({ children }) {
const [isMobile, setIsMobile] = useState(false); const [isMobile, setIsMobile] = useState(false);
const [isOpenLightBox, setIsOpenLightBox] = useState(false); const [isOpenLightBox, setIsOpenLightBox] = useState(false);
console.log("products", products);
const AddItemToCart = ( const AddItemToCart = (
id, id,
persianName, persianName,
@ -337,6 +344,8 @@ export default function RootLayout({ children }) {
<Loading /> <Loading />
<BottomSheetAddress /> <BottomSheetAddress />
<BottomSheetLogOut /> <BottomSheetLogOut />
<Goftino />
</body> </body>
</html> </html>
</AppContext.Provider> </AppContext.Provider>

9
src/app/login/page.jsx
View File

@ -9,6 +9,7 @@ import Chapar from "plugins/Chapar";
import { useContext, useState } from "react"; import { useContext, useState } from "react";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import logo from "../../../public/images/logo.png"; import logo from "../../../public/images/logo.png";
import Head from "next/head";
const Login = () => { const Login = () => {
const CTX = useContext(AppContext); const CTX = useContext(AppContext);
@ -51,19 +52,19 @@ const Login = () => {
verifyCode, verifyCode,
} }
); );
localStorage.setItem("token", "Bearer " + data.access_token);
console.log(data); console.log(data);
if (data.user.signUpStatus == 1) { if (data.user.signUpStatus == 1) {
setStepLogin(2); setStepLogin(2);
CTX.setProfile(data);
} else if (data.user.signUpStatus == 10) { } else if (data.user.signUpStatus == 10) {
// setProfile(data); CTX.setProfile(data.user);
toast.success(` ${data.user.firstName} جان خوش اومدی `, { toast.success(` ${data.user.firstName} جان خوش اومدی `, {
position: "bottom-right", position: "bottom-right",
closeOnClick: true, closeOnClick: true,
}); });
localStorage.setItem("token", "Bearer " + data.access_token);
router.push("/profile"); router.push("/profile");
} }
@ -92,7 +93,7 @@ const Login = () => {
); );
CTX.setLoading(false); CTX.setLoading(false);
CTX.setProfile(data); CTX.setProfile(data.user);
if (data.user.signUpStatus == 10) { if (data.user.signUpStatus == 10) {
// setProfile(data); // setProfile(data);

4
src/app/page.jsx
View File

@ -7,6 +7,7 @@ import HeroSection from "@comp/LandingPage/HeroSection/page";
import HomeSection from "@comp/LandingPage/HomeSection/page"; import HomeSection from "@comp/LandingPage/HomeSection/page";
import SurpriseSection from "@comp/LandingPage/SurpriseSection/page"; import SurpriseSection from "@comp/LandingPage/SurpriseSection/page";
import Navbar from "@comp/Navbar/page"; import Navbar from "@comp/Navbar/page";
import Head from "next/head";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
export default function Page() { export default function Page() {
@ -44,6 +45,9 @@ export default function Page() {
}, []); }, []);
return ( return (
<> <>
<Head>
<title>My new cool app</title>
</Head>
<div className="bg-header"> <div className="bg-header">
<Navbar theme={0} /> <Navbar theme={0} />
<HeroSection /> <HeroSection />

2
src/app/products/[...id]/page.jsx
View File

@ -76,7 +76,7 @@ const Page = ({ params }) => {
</div> </div>
)} )}
{!product?.warranty?.trim() === "" && ( {!product?.warranty == "" && (
<div className="bg-secondary-500 rounded-full py-1 px-3 ml-2"> <div className="bg-secondary-500 rounded-full py-1 px-3 ml-2">
<p className="mb-0 text-sm text-white "> <p className="mb-0 text-sm text-white ">
{product?.warranty} {product?.warranty}

6
src/app/purchase-callback/page.jsx
View File

@ -7,9 +7,11 @@ const Page = () => {
const paymentStatus = params.get("paymentStatus"); const paymentStatus = params.get("paymentStatus");
const factorNumber = params.get("factorNumber"); const factorNumber = params.get("factorNumber");
console.log(paymentStatus);
return ( return (
<> <>
{paymentStatus ? ( {!paymentStatus ? (
<div className="bg-contact-us !min-h-[100vh]"> <div className="bg-contact-us !min-h-[100vh]">
<div className=" pb-20"> <div className=" pb-20">
<div className="pt-[190px] px-10"> <div className="pt-[190px] px-10">
@ -63,7 +65,7 @@ const Page = () => {
) : ( ) : (
<div className="bg-error !min-h-[100vh]"> <div className="bg-error !min-h-[100vh]">
<div className=" pb-20"> <div className=" pb-20">
<div className="pt-[190px] px-10"> <div className="pt-[50px] px-10">
<div className="text-[200px] text-white mx-auto text-center"> <div className="text-[200px] text-white mx-auto text-center">
! !
</div> </div>

19
style/globals.css
View File

@ -217,3 +217,22 @@ body::-webkit-scrollbar-track {
.scroll-1::-webkit-scrollbar-thumb:hover { .scroll-1::-webkit-scrollbar-thumb:hover {
background: #555; background: #555;
} }
.dots {
display: inline-block;
width: 180px;
white-space: nowrap;
overflow: hidden !important;
text-overflow: ellipsis;
}
/* Hide scrollbar for Chrome, Safari and Opera */
.hide-scrollBar::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.hide-scrollBar {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}

8
tailwind.config.js
View File

@ -85,4 +85,12 @@ module.exports = {
}, },
}, },
plugins: [], plugins: [],
corePlugins: {
backdropOpacity: false,
backgroundOpacity: false,
borderOpacity: false,
divideOpacity: false,
ringOpacity: false,
textOpacity: false,
},
}; };