reza added something

temp
Reza_ashrafi 3 years ago
parent 40256c162a
commit be5c38ce5d
  1. 2
      src/App.scss
  2. 2
      src/components/AddToCart/index.js
  3. 1
      src/components/Checkbox/index.js
  4. 3
      src/components/Footer/index.js
  5. 10
      src/components/Navbar/index.js
  6. 145
      src/components/ProductDescription/index.js
  7. 5
      src/components/ProductImage/index.js
  8. 2
      src/components/ProductTab/table/index.js
  9. 6
      src/components/QandA/index.js
  10. 2
      src/components/Timer/index.js
  11. 1
      src/components/VerticalExpandableProductFilter/index.js
  12. 112
      src/components/VodProduct/index.js
  13. 16
      src/redux/reducers/book.js
  14. 2
      src/redux/reducers/public.js
  15. 1
      src/redux/reducers/userFactor.js
  16. 2
      src/router.js
  17. 2
      src/utils/comments.js
  18. 1
      src/utils/scroll.js
  19. 19
      src/views/Address/index.js
  20. 1
      src/views/Auth/Profile/index.js
  21. 16
      src/views/Auth/SignUp/index.js
  22. 1
      src/views/BugsAndProblems/index.js
  23. 15
      src/views/Dashboard/index.js
  24. 2
      src/views/Dashboard/layouts/Main/MyBooks/index.js
  25. 2
      src/views/Dashboard/layouts/Main/UserItems/ProductSuggestion/index.js
  26. 3
      src/views/Dashboard/layouts/Main/index.js
  27. 54
      src/views/Dashboard/layouts/SidebarMenu/index.js
  28. 51
      src/views/DeliveryForm/Address/index.js
  29. 4
      src/views/DeliveryForm/PaymentMethod/index.js
  30. 2
      src/views/DeliveryForm/TransportMethod/index.js
  31. 2
      src/views/Home/Desktop/Part2/index.js
  32. 2
      src/views/Home/Portrait/Private/MyBooks/index.js
  33. 4
      src/views/Home/Portrait/Private/Videos/index.js
  34. 8
      src/views/Orders/components/Order.js
  35. 8
      src/views/Orders/index.js
  36. 77
      src/views/Products/layouts/Main.js
  37. 26
      src/views/Products/layouts/Sidebar.js
  38. 2
      src/views/QR/Content/index.js
  39. 1
      src/views/QR/Scan/index.js
  40. 7
      src/views/ShoppingCart/Product/index.js
  41. 26
      src/views/ShoppingCart/index.js
  42. 2
      src/views/Video/components/Desktop/Table.js
  43. 19
      src/views/Video/components/Desktop/Videos.js

@ -32,7 +32,7 @@
//slider //slider
.styles-module_item-tracker__3bypy{ .styles-module_item-tracker__3bypy{
padding-top : 20px; padding-top : 20px !important;
// transform: translateY(-20px) !important; // transform: translateY(-20px) !important;
} }

@ -47,7 +47,7 @@ const AddToCartCard = ({
</div> </div>
)} )}
{specialities.map((item, index) => ( {specialities.map((item, index) => (
<div className="flex items-center p-2 w-full border-0 border-b border-solid border-gray-300"> <div className="flex items-center p-2 w-full border-0 border-b border-solid border-gray-300" key={index}>
{item.icon && <img src={item.icon} className="pl-3" />} {item.icon && <img src={item.icon} className="pl-3" />}
<p className="text-sm text-blue52 text-right">{item.description}</p> <p className="text-sm text-blue52 text-right">{item.description}</p>
</div> </div>

@ -2,7 +2,6 @@ import React from "react";
import './index.css'; import './index.css';
export default function Checkbox(props) { export default function Checkbox(props) {
// console.log(props)
return ( return (
<div> <div>
<svg className="checkbox-symbol"> <svg className="checkbox-symbol">

@ -11,9 +11,6 @@ import bazarIcon from "./Bazar.svg";
import lightBlueLine from "./light-blue-line.svg"; import lightBlueLine from "./light-blue-line.svg";
const FooterDesign1 = ({ color, bg, items, hasHeader }) => { const FooterDesign1 = ({ color, bg, items, hasHeader }) => {
useEffect(() => {
console.log(window.location.host);
}, []);
const enamad = const enamad =
'<a referrerpolicy="origin" target="_blank" href="https://trustseal.enamad.ir/?id=224965&amp;Code=x8oNSO7tTnqAniyPpPyN"><img referrerpolicy="origin" src="https://Trustseal.eNamad.ir/logo.aspx?id=224965&amp;Code=x8oNSO7tTnqAniyPpPyN" alt="" style="cursor:pointer" id="x8oNSO7tTnqAniyPpPyN"></a>'; '<a referrerpolicy="origin" target="_blank" href="https://trustseal.enamad.ir/?id=224965&amp;Code=x8oNSO7tTnqAniyPpPyN"><img referrerpolicy="origin" src="https://Trustseal.eNamad.ir/logo.aspx?id=224965&amp;Code=x8oNSO7tTnqAniyPpPyN" alt="" style="cursor:pointer" id="x8oNSO7tTnqAniyPpPyN"></a>';
return ( return (

@ -203,7 +203,7 @@ function Navbar({
<div className="flex flex-row items-center"> <div className="flex flex-row items-center">
<Link <Link
to="/" to="/"
className="flex flex-row items-center text-2xl font-medium" className="flex flex-row items-center text-2xl font-black text-green7B"
> >
<img src={logoIcon} className="w-8 relative bottom-1 ml-1" /> <img src={logoIcon} className="w-8 relative bottom-1 ml-1" />
دانوین دانوین
@ -213,7 +213,7 @@ function Navbar({
<li key={index}> <li key={index}>
<Link <Link
to={page.link} to={page.link}
className="text-tiny font-medium text-blue3D py-2 px-4 mx-4" className="text-tiny font-semibold text-green7B py-2 px-4 mx-4"
> >
{page.name} {page.name}
</Link> </Link>
@ -301,7 +301,7 @@ Navbar.defaultProps = {
pages: [ pages: [
{ {
link: "/products", link: "/products",
name: "محصولات", name: "فروشگاه",
}, },
{ {
link: "/contact-us", link: "/contact-us",
@ -309,11 +309,11 @@ Navbar.defaultProps = {
}, },
{ {
link: "/about-us", link: "/about-us",
name: "درباره ما", name: "درباره دانوین",
}, },
{ {
link: "/blogs", link: "/blogs",
name: "وبلاگ", name: "مجله دانوین",
}, },
], ],
logo: true, logo: true,

@ -1,135 +1,126 @@
import React from "react"; import React from "react";
import { useState } from "react"; import { useState } from "react";
const ProductDescription = ({ const ProductDescription = ({ navTitles, items, addToCart }) => {
navTitles,
items,
addToCart
}) =>{
const [name, setName] = useState(navTitles[0].name); const [name, setName] = useState(navTitles[0].name);
const [type, setType] = useState([]); const [type, setType] = useState([]);
return( return (
<> <>
<div className="flex w-full rounded bg-gray-200 justify-center mt-6 "> <div className="flex w-full rounded bg-gray-200 justify-center mt-6 ">
<ul className="w-full flex justify-center"> <ul className="w-full flex justify-center">
{navTitles.map(item => <li key={`NavTitle_${item.id}`} {navTitles.map((item, index) => (
<li
key={index}
className={`p-6 mx-4 cursor-pointer className={`p-6 mx-4 cursor-pointer
${type[item.id] ? 'border-0 border-b-4 border-solid border-blue-500' : null}` ${
} type[item.id]
? "border-0 border-b-4 border-solid border-blue-500"
: null
}`}
onClick={() => { onClick={() => {
// type[item.id] = type setName(item.name);
// type[item.id] = !type[item.id] }}
setName(item.name) >
// setType(type) {item.title}
// console.log(type) </li>
// console.log(item.id) ))}
// console.log(type[item.id])
}}>
{item.title}</li>)}
</ul> </ul>
</div> </div>
<div className="flex w-full "> <div className="flex w-full ">
<div className="flex-1 "> <div className="flex-1 ">
{items.map((item, index) =>
{items.map(e => ( item.name == name
e.name == name ? ? item.items.map((item, index) => (
e.items.map(item => ( <ul className="flex w-full flex-1 my-2 items-center" key={index}>
<ul className="flex w-full flex-1 my-2 items-center"> {item.title ? (
<li
{item.title ? className="py-4 px-8 min-w-md bg-gray-200 ml-4 text-blueC0"
<li className="py-4 px-8 min-w-md bg-gray-200 ml-4 text-blueC0" style={{minWidth: '300px'}}>{item.title}</li> : null} style={{ minWidth: "300px" }}
<li className="py-4 px-8 min-w-md bg-gray-200 ml-4 w-full">{item.description}</li> >
{item.title}
</li>
) : null}
<li className="py-4 px-8 min-w-md bg-gray-200 ml-4 w-full">
{item.description}
</li>
</ul> </ul>
))
)) : null : null
)}
))}
</div> </div>
<div className="my-2"> <div className="my-2">{addToCart}</div>
{addToCart}
</div>
</div> </div>
</> </>
); );
}; };
export default ProductDescription; export default ProductDescription;
ProductDescription.defaultProps = { ProductDescription.defaultProps = {
navTitles: [ navTitles: [
{ {
id: 0, id: 0,
title: 'مشخصات', title: "مشخصات",
isActive: true, isActive: true,
name: 'moshakhasat' name: "moshakhasat",
}, },
{ {
id: 1, id: 1,
title: 'نقد و بررسی', title: "نقد و بررسی",
isActive: false, isActive: false,
name: 'review' name: "review",
}, },
{ {
id: 2, id: 2,
title: 'برسش و باسخ', title: "برسش و باسخ",
isActive:false isActive: false,
}, },
], ],
items: [ items: [
{ {
name: 'moshakhasat', name: "moshakhasat",
items: [ items: [
{ {
title : 'وزن کتاب', title: "وزن کتاب",
description: '۱ کیلوگرم' description: "۱ کیلوگرم",
}, },
{ {
title : 'تعداد صفحات', title: "تعداد صفحات",
description: '400 صفحه' description: "400 صفحه",
}, },
{ {
title : 'نوع کاغذ', title: "نوع کاغذ",
description: 'گلاسه' description: "گلاسه",
}, },
{ {
title : 'شماره شابک', title: "شماره شابک",
description: '1225548218000005818765' description: "1225548218000005818765",
}, },
{ {
title : 'انتشارات', title: "انتشارات",
description: 'رزمندگان' description: "رزمندگان",
}, },
{ {
title : 'نویسنده و یا معلف', title: "نویسنده و یا معلف",
description: 'یک نویسنده گمنام' description: "یک نویسنده گمنام",
}, },
{ {
title : 'قطع', title: "قطع",
description: 'خشتی' description: "خشتی",
}, },
{ {
title : 'سال انتشار', title: "سال انتشار",
description: '1399' description: "1399",
}, },
] ],
}, },
{ {
name: 'review', name: "review",
items: [{ items: [
description: 'لورم ایبسوم' {
}] description: "لورم ایبسوم",
} },
] ],
},
} ],
};

@ -7,13 +7,11 @@ import productImg from "./product-image.jpg";
const ProductImage = ({ images }) => { const ProductImage = ({ images }) => {
const [list, setList] = useState([]); const [list, setList] = useState([]);
const [activeImage, setActiveImage] = useState(null); const [activeImage, setActiveImage] = useState(null);
// console.log(images.length);
useEffect(() => { useEffect(() => {
if (images) { if (images) {
let mylist = images?.split(","); let mylist = images?.split(",");
setList(() => mylist); setList(() => mylist);
setActiveImage(() => mylist[0]); setActiveImage(() => mylist[0]);
console.log(images);
} }
}, [images]); }, [images]);
return ( return (
@ -67,8 +65,5 @@ const ProductImage = ({ images }) => {
</div> </div>
); );
}; };
// {[0, 1, 2, 3, 4].map((item, index) => (
// ))}
export default ProductImage; export default ProductImage;

@ -16,7 +16,7 @@ const Table = ({ specifications }) => {
return ( return (
<ul className={`w-full`} > <ul className={`w-full`} >
{Object.keys(specifications).map((specification, index) => ( {Object.keys(specifications).map((specification, index) => (
<li className={`flex my-3 cursor-pointer group`}> <li className={`flex my-3 cursor-pointer group`} key={index}>
<div <div
className={` bg-grayF9 rounded px-3 py-4 ml-2 text-greenBA text-sm group-hover:bg-blueC0 group-hover:bg-opacity-10`} className={` bg-grayF9 rounded px-3 py-4 ml-2 text-greenBA text-sm group-hover:bg-blueC0 group-hover:bg-opacity-10`}
style={{ flex: 2 }} style={{ flex: 2 }}

@ -56,8 +56,8 @@ const QandA = ({ comments }) => {
</div> </div>
{comment.answers.length > 0 ? ( {comment.answers.length > 0 ? (
comment.answers.slice(0, numberOfAnswers).map((e) => ( comment.answers.slice(0, numberOfAnswers).map((item, index) => (
<div className="flex flex-row py-1"> <div className="flex flex-row py-1" key={index}>
<div style={{ width: 60 }} className="min-h-full"></div> <div style={{ width: 60 }} className="min-h-full"></div>
<div className="flex flex-1 flex-col px-3"> <div className="flex flex-1 flex-col px-3">
<header className="w-full flex flex-row justify-between items-center"> <header className="w-full flex flex-row justify-between items-center">
@ -68,7 +68,7 @@ const QandA = ({ comments }) => {
</div> </div>
</header> </header>
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<p className="text-gray-500 m-4">{e.text}</p> <p className="text-gray-500 m-4">{item.text}</p>
<div> <div>
<Counter value={456} /> <Counter value={456} />
</div> </div>

@ -75,7 +75,7 @@ export default class Timer extends Component {
render() { render() {
return ( return (
<> <>
<div className="timer text-greenBA text-sm inline"> <div className="timer text-greenBA text-sm lg:text-tiny inline">
{this.state.time ? this.state.time.m : ''}:{this.state.time ? this.state.time.s : ''} {this.state.time ? this.state.time.m : ''}:{this.state.time ? this.state.time.s : ''}
</div> </div>
</> </>

@ -62,7 +62,6 @@ export default function VerticalExpandableProductFilter(props) {
key={i} key={i}
className="hover:bg-gray-100 px-3 flex flex-row items-center justify-between py-2" className="hover:bg-gray-100 px-3 flex flex-row items-center justify-between py-2"
> >
{/* {console.log(i)} */}
<div className="flex flex-row items-center"> <div className="flex flex-row items-center">
<Checkbox <Checkbox
name={`ch${name}_${i}`} name={`ch${name}_${i}`}

@ -56,27 +56,23 @@ const VodProduct = ({
// minHeight, // minHeight,
}) => { }) => {
const [progressFlag, setProgressFlag] = useState(false); const [progressFlag, setProgressFlag] = useState(false);
// const [openModal, setOpenModal] = useState(false);
useEffect(() => { useEffect(() => {
setTimeout(() => { setTimeout(() => {
setProgressFlag(true); setProgressFlag(true);
}, 1000); }, 1000);
}); });
// console.log(index);
return ( return (
<> <>
{/* product UI Design */}
<Link <Link
to={"/videos/" + video?.id} to={"/videos/" + video?.id}
className="flex flex-wrap sm:flex-nowrap justify-around" className="flex flex-wrap sm:flex-nowrap justify-around"
style={{ direction: "rtl" }} style={{ direction: "rtl" }}
draggable={false}
> >
<div className="w-full flex flex-wrap items-center justify-around my-3 px-1 sm:px-4"> <div className="w-full flex flex-wrap items-center justify-around my-3 px-1 sm:px-4">
<div <div
className={`w-full mx-1 sm:w-60 md:w-96 rounded-lg shadow-sm p-2 my-3 border border-grayBorderColor`} className={`w-full mx-1 sm:w-60 md:w-96 rounded-lg shadow-sm p-2 my-3 border border-gray-200 border-solid hover:border-greenB9 hover:border-2 transform hover:-translate-y-5 transition-all duration-500`}
> >
{/* product image */}
<div <div
className="group transition ease-in-out delay-150 duration-300 w-full relative flex items-center justify-center cursor-pointer" className="group transition ease-in-out delay-150 duration-300 w-full relative flex items-center justify-center cursor-pointer"
style={{ style={{
@ -84,11 +80,9 @@ const VodProduct = ({
backgroundSize: "100% 100%", backgroundSize: "100% 100%",
backgroundRepeat: "no-repeat", backgroundRepeat: "no-repeat",
height: height, height: height,
// minHeight: minHeight,
}} }}
data-modal-toggle="large-modal" data-modal-toggle="large-modal"
> >
{/* icons on image */}
<div className="absolute left-2 top-1"> <div className="absolute left-2 top-1">
{discountPricePercent && ( {discountPricePercent && (
<div className="bg-discountPriceBg rounded-md px-2 py-2 mt-2 transition ease-in-out duration-300 transform hover:-translate-y-1 hover:scale-110 cursor-pointer bg-white bg-opacity-70"> <div className="bg-discountPriceBg rounded-md px-2 py-2 mt-2 transition ease-in-out duration-300 transform hover:-translate-y-1 hover:scale-110 cursor-pointer bg-white bg-opacity-70">
@ -102,28 +96,14 @@ const VodProduct = ({
<img src={heart} alt="" className="w-5" /> <img src={heart} alt="" className="w-5" />
</div> </div>
)} )}
{/* {discount && (
<div className="rounded-md mt-2 transition ease-in-out duration-300 transform hover:-translate-y-1 hover:scale-110 cursor-pointer">
<img src={discountImg} alt="" className="w-full" />
</div>
)} */}
</div> </div>
{/* play button */}
<div <div
className={` rounded-full p-4 group-hover:scale-125 transform transition-transform duration-300 bg-playButtonIcon bg-black bg-opacity-20 backdrop-filter backdrop-blur-md`} className={` rounded-full p-4 group-hover:scale-125 transform transition-transform duration-300 bg-playButtonIcon bg-black bg-opacity-20 backdrop-filter backdrop-blur-md`}
// onClick={() => setOpenModal(true)}
> >
<img <img src={whitePlayIcon} alt="" className="w-5 h-5" />
src={whitePlayIcon}
alt=""
className="w-5 h-5"
// onClick={() => setOpenModal(true)}
/>
</div> </div>
{/* select Color */}
{productColor && ( {productColor && (
<div className="flex items-center absolute right-2 bottom-3"> <div className="flex items-center absolute right-2 bottom-3">
{/* {colors.map((color,index))} */}
<img <img
src={YellowDotIcon} src={YellowDotIcon}
alt="" alt=""
@ -134,18 +114,14 @@ const VodProduct = ({
</div> </div>
)} )}
</div> </div>
{/* product content */}
<div className="px-2"> <div className="px-2">
{/* content */}
<div className="mt-4 flex flex-col"> <div className="mt-4 flex flex-col">
<div className={`flex justify-between `}> <div className={`flex justify-between `}>
<h2 className={`leading-4 font-semibold text-base mb-4`}> <h2 className={`leading-4 font-semibold text-base mb-4`}>
{"دوره ویدیویی" + " " + video?.name} {"دوره ویدیویی" + " " + video?.name}
</h2> </h2>
{console.log(video?.gradeId)}
<span className={`text-tiny font-light text-green7B`}> <span className={`text-tiny font-light text-green7B`}>
{"پایه" + " " + grades[video?.gradeId]} {"پایه" + " " + grades[video?.gradeId]}
{/* {video.grade} */}
</span> </span>
</div> </div>
{productContent && ( {productContent && (
@ -165,7 +141,6 @@ const VodProduct = ({
<div <div
className={`flex items-center justify-between ${priceDirection}`} className={`flex items-center justify-between ${priceDirection}`}
> >
{/* price */}
<div className=""> <div className="">
<div <div
className={`${ className={`${
@ -175,22 +150,14 @@ const VodProduct = ({
}`} }`}
> >
<span className="text-xs text-borderColor ml-2"></span> <span className="text-xs text-borderColor ml-2"></span>
{/* {discountPrice && (
<p className="line-through text-xs text-borderColor">
<span> قیمت</span> 140<span>تومان</span>
</p>
)} */}
</div> </div>
<p <p
className={`text-lg text-productPrice font-semibold inline text-blue5F`} className={`text-lg text-productPrice font-semibold inline text-blue5F`}
> >
{separate(video?.product[2]?.price) + ' '} {separate(video?.product[2]?.price) + " "}
{/* {video.price} */}
<span>تومان</span> <span>تومان</span>
</p> </p>
</div> </div>
{/* add to cart */}
{addToCartHolder && ( {addToCartHolder && (
<button <button
className={`rounded-md px-2 py-3 border text-xs text-productPrice mt-2 hover:bg-darkCrimsonBgColor hover:text-white active:bg-rangeFillBgColor transition duration-500 ${ className={`rounded-md px-2 py-3 border text-xs text-productPrice mt-2 hover:bg-darkCrimsonBgColor hover:text-white active:bg-rangeFillBgColor transition duration-500 ${
@ -202,14 +169,6 @@ const VodProduct = ({
)} )}
</div> </div>
)} )}
{/* {star && (
<div className="flex items-center">
<StarRating />
<span className="text-xs text-productContent font-bold mr-2">
39
</span>
</div>
)} */}
</div> </div>
{productTags && ( {productTags && (
<div className="mt-2 flex flex-wrap"> <div className="mt-2 flex flex-wrap">
@ -238,64 +197,11 @@ const VodProduct = ({
</div> </div>
</div> </div>
</Link> </Link>
{/* <div
class="hidden overflow-y-auto overflow-x-hidden fixed right-0 left-0 top-4 z-50 justify-center items-center md:inset-0 h-modal sm:h-full"
id="large-modal"
>
<div class="relative px-4 w-full max-w-4xl h-full md:h-auto">
<div class="relative bg-white rounded-lg shadow dark:bg-gray-700">
<div class="flex justify-between items-center p-5 rounded-t border-b border-gray-200 dark:border-gray-600">
<button
type="button"
class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white"
data-modal-toggle="large-modal"
>
<svg
class="w-5 h-5"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clip-rule="evenodd"
></path>
</svg>
</button>
</div>
<div class="p-6 space-y-6">
<video
controls
className={`border transition-all duration-1000
`}
src={video}
type="video/mp4"
></video>
</div>
</div>
</div>
</div> */}
</> </>
); );
}; };
// hover:-translate-y-2
export default VodProduct; export default VodProduct;
// text colors i used for product title:
// text-darkCrimsonTextColor
// text-productTitle
// text color i used for product excerpt:
// text-productContent
// text color i used for product cat:
// text-darkCrimsonTextColor
// bg color i used for play button icon:
// bg-playButtonIcon
// bg-playButtonIcon2
VodProduct.defaultProps = { VodProduct.defaultProps = {
colors: [ colors: [
{ {
@ -345,17 +251,7 @@ VodProduct.defaultProps = {
productTitleCategoryHolder: "flex-row", productTitleCategoryHolder: "flex-row",
productTitleCategoryHolderAlignment: "items-center", productTitleCategoryHolderAlignment: "items-center",
// برای اینکه بتونیم ستاره هارو بالا قیمت بزاریم و دیزاین را مثل کتاب ها در بیاریم
// یادمون باشه که حتما رویه
// flex-col-reverse
// بزاریم
// دیفالتش باید این باشه:
// priceStarHolder: flex-row
priceStarHolder: "flex-row", priceStarHolder: "flex-row",
// دیفالتش باید این باشه:
// priceStarHolder: items-center
priceStarAlignment: "items-center", priceStarAlignment: "items-center",
poster: watermelon, poster: watermelon,
}; };

@ -10,25 +10,25 @@ const initialState = {
filterResult: [], filterResult: [],
subjects: [], subjects: [],
levels: [], levels: [],
sortMethods: [رتب سازی", حبوب ترین", "جدیدترین"], sortMethods: ["محبوب ترین", "جدیدترین"],
selectedVideo: null, selectedVideo: null,
gradeFilterBooks: null, gradeFilterBooks: null,
sortFilterCourse: null, sortFilterCourse: null,
selectedGrade: null, selectedGrade: null,
selectedSort: "پربازدید ترین ها", selectedSort: "پربازدید ترین ها",
productTypes : [ productTypes: [
"کتاب فیزیکی", "کتاب فیزیکی",
"کتاب دیجیتال", "کتاب دیجیتال",
"دوره ویدئویی", "دوره ویدئویی",
"بسته های آموزشی", "بسته های آموزشی",
], ],
filterOptions : { filterOptions: {
grade: '', grade: "",
subject: '', subject: "",
productType: null, productType: null,
available : false, available: false,
sort: null, sort: null,
} },
}; };
const grades = [ const grades = [
@ -119,7 +119,7 @@ export default function book(state = initialState, action) {
// case "book/search": // case "book/search":
// return { ...state }; // return { ...state };
case "book/setFilterOptions": case "book/setFilterOptions":
return { ...state, loading: false, error: null, filterOptions : data}; return { ...state, loading: false, error: null, filterOptions: data };
case "book/loading": case "book/loading":
return { ...state, loading: true }; return { ...state, loading: true };
case "book/error": case "book/error":

@ -189,7 +189,7 @@ export default function publicApi(state = initialState, action) {
...state, ...state,
loading: false, loading: false,
error: null, error: null,
city: [...state.city, ...data.map((item) => item.name)], city: [...data.map((item) => item.name)],
cities : data, cities : data,
}; };
case "public/selectMenu": case "public/selectMenu":

@ -37,7 +37,6 @@ export default function userFactor(state = initialState, action) {
case "userFactor/myList": case "userFactor/myList":
return { ...state, loading: false, list: data, error: null }; return { ...state, loading: false, list: data, error: null };
case "userFactor/update": case "userFactor/update":
toast.success("درخواست شما با موفقیت انجام شد.");
return { ...state, loading: false, error: null }; return { ...state, loading: false, error: null };
case "userFactor/deleteUserOffCode": case "userFactor/deleteUserOffCode":
return { ...state, loading: false, error: null }; return { ...state, loading: false, error: null };

@ -371,7 +371,7 @@ function Router({
} }
/> />
</Routes> </Routes>
{/* {headerOptions?.shown && !isMobile && <FooterDesign1 hasHeader />} */} {!isMobile && <FooterDesign1 hasHeader />}
</BrowserRouter> </BrowserRouter>
</div> </div>
</div> </div>

@ -19,6 +19,4 @@ export const connectToParent = (list) => {
} }
} }
// comments = comments.filter((comment) => comment.pid === null);
// console.log(comments);
}; };

@ -157,7 +157,6 @@ class scroll {
initializeBoxPosition = (currentScroll) => { initializeBoxPosition = (currentScroll) => {
const height= window.innerHeight; const height= window.innerHeight;
if(currentScroll < height){ if(currentScroll < height){
// console.log(currentScroll);
return { return {
translateX: -5, translateX: -5,
translateY: -5, translateY: -5,

@ -7,6 +7,7 @@ import Select from "../../components/Select";
import Button from "../../components/Button"; import Button from "../../components/Button";
import ReverseMap from "../../components/ReverseMap"; import ReverseMap from "../../components/ReverseMap";
import Dialog from "../../components/Dialog"; import Dialog from "../../components/Dialog";
import Loading from "../../components/Loading";
//assets //assets
import dropdownIcon from "../../assets/icons/dropdown-blue.svg"; import dropdownIcon from "../../assets/icons/dropdown-blue.svg";
@ -21,6 +22,7 @@ export const Address = ({
createAddress, createAddress,
loading, loading,
setPhase, setPhase,
cityLoading,
}) => { }) => {
const [addressFields, setAddressFields] = useState({}); const [addressFields, setAddressFields] = useState({});
const [mapAddress, setMapAddress] = useState(null); const [mapAddress, setMapAddress] = useState(null);
@ -50,7 +52,6 @@ export const Address = ({
}, [addressFields]); }, [addressFields]);
const onChange = (name, value) => { const onChange = (name, value) => {
console.log("1");
setAddressFields({ ...addressFields, [name]: value }); setAddressFields({ ...addressFields, [name]: value });
}; };
@ -216,7 +217,7 @@ export const Address = ({
loading={loading} loading={loading}
title="ثبت آدرس" title="ثبت آدرس"
backgroundColor="bg-blueC0" backgroundColor="bg-blueC0"
border={{ color: "#196EC055", width: "1px" }} border={{ color: "#196EC055", width: "0px" }}
width="100%" width="100%"
color="text-white" color="text-white"
onClick={() => submit()} onClick={() => submit()}
@ -306,11 +307,24 @@ export const Address = ({
name="provinceId" name="provinceId"
onChange={(name, value) => onChange(name, value)} onChange={(name, value) => onChange(name, value)}
/> />
{!cityLoading ? (
<Select <Select
options={city} options={city}
name="cityId" name="cityId"
onChange={(name, value) => onChange(name, value)} onChange={(name, value) => onChange(name, value)}
/> />
) : (
<div className="flex justify-between border-gray-300 border border-solid rounded-md w-1/2 py-3.5 px-2">
<Loading size={3.5} color="bg-gray-500" />
<svg
className={`'bg-gray-400 h-5 w-5`}
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z" />
</svg>
</div>
)}
</div> </div>
<br /> <br />
<Input <Input
@ -336,6 +350,7 @@ const mapStateToProps = (state) => ({
provinces: state.publicApi.provinces, provinces: state.publicApi.provinces,
cities: state.publicApi.cities, cities: state.publicApi.cities,
loading: state.userAddress.loading, loading: state.userAddress.loading,
cityLoading: state.publicApi.loading,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {

@ -336,7 +336,6 @@ function Profile({
/> />
</div> </div>
) : null} ) : null}
{/* {console.log(province)} */}
<div className="mb-2" style={{ minWidth: "100%" }}> <div className="mb-2" style={{ minWidth: "100%" }}>
<Select <Select
options={provinceList} options={provinceList}

@ -130,7 +130,7 @@ function SignUp({
useEffect(() => { useEffect(() => {
if (loginFlag) { if (loginFlag) {
// navigate("/"); navigate("/");
} }
}, [loginFlag]); }, [loginFlag]);
const light = theme === "light"; const light = theme === "light";
@ -178,11 +178,11 @@ function SignUp({
> >
<img src={logoIcon} alt="" className="" /> <img src={logoIcon} alt="" className="" />
{!resend && ( {!resend && (
<div className="w-full leading-6 dark:text-white mt-10 text-xs text-gray1"> <div className="w-full leading-6 dark:text-white mt-10 text-xs lg:text-sm text-gray1">
یک کد چهار رقمی تا &nbsp;{" "} یک کد چهار رقمی تا &nbsp;{" "}
<Timer seconds={120} refresh={setResend} /> &nbsp; دیگر برای شماره <Timer seconds={120} refresh={setResend} /> &nbsp; دیگر برای شماره
&nbsp;{" "} &nbsp;{" "}
<span className="text-greenBA text-sm"> <span className="text-greenBA text-sm lg:text-tiny">
{signUpFields?.cellphone} {signUpFields?.cellphone}
</span>{" "} </span>{" "}
&nbsp; ارسال خواهد شد. &nbsp; ارسال خواهد شد.
@ -195,7 +195,7 @@ function SignUp({
inputMode="numeric" inputMode="numeric"
style={{ direction: "ltr" }} style={{ direction: "ltr" }}
name="otp1" name="otp1"
className="bg-grayF9 outline-none rounded-md p-4 w-16 text-md text-center text-blueC0 mx-1" className="bg-grayF9 outline-none rounded-md p-4 w-16 text-sm lg:text-lg text-center text-blueC0 mx-1"
onChange={(e) => onChange={(e) =>
onChange( onChange(
e.target.name, e.target.name,
@ -209,7 +209,7 @@ function SignUp({
inputMode="numeric" inputMode="numeric"
style={{ direction: "ltr" }} style={{ direction: "ltr" }}
name="otp2" name="otp2"
className="bg-grayF9 outline-none rounded-md p-4 w-16 text-md text-center text-blueC0 mx-1" className="bg-grayF9 outline-none rounded-md p-4 w-16 text-sm lg:text-lg text-center text-blueC0 mx-1"
onChange={(e) => onChange={(e) =>
onChange( onChange(
e.target.name, e.target.name,
@ -223,7 +223,7 @@ function SignUp({
inputMode="numeric" inputMode="numeric"
style={{ direction: "ltr" }} style={{ direction: "ltr" }}
name="otp3" name="otp3"
className="bg-grayF9 outline-none rounded-md p-4 w-16 text-md text-center text-blueC0 mx-1" className="bg-grayF9 outline-none rounded-md p-4 w-16 text-sm lg:text-lg text-center text-blueC0 mx-1"
onChange={(e) => onChange={(e) =>
onChange( onChange(
e.target.name, e.target.name,
@ -237,7 +237,7 @@ function SignUp({
inputMode="numeric" inputMode="numeric"
style={{ direction: "ltr" }} style={{ direction: "ltr" }}
name="otp4" name="otp4"
className="bg-grayF9 outline-none rounded-md p-4 w-16 text-md text-center text-blueC0 mx-1" className="bg-grayF9 outline-none rounded-md p-4 w-16 text-sm lg:text-lg text-center text-blueC0 mx-1"
onChange={(e) => onChange={(e) =>
onChange( onChange(
e.target.name, e.target.name,
@ -260,7 +260,7 @@ function SignUp({
} }
/> />
<div className="mt-10 flex flex-row text-center w-full justify-center"> <div className="mt-10 flex flex-row text-center w-full justify-center">
<div className="text-xs text-gray1"> <div className="text-xs text-gray1 lg:text-sm">
شماره خود را اشتباه وارد کردید؟{" "} شماره خود را اشتباه وارد کردید؟{" "}
<button <button
className="bg-transparent border-none text-greenBA font-medium" className="bg-transparent border-none text-greenBA font-medium"

@ -30,6 +30,7 @@ function Bugs({}) {
> >
{list.map((bug, index) => ( {list.map((bug, index) => (
<tr <tr
key={index}
className={`whitespace-nowrap p-2 w-full border border-solid border-gray-300 ${ className={`whitespace-nowrap p-2 w-full border border-solid border-gray-300 ${
colors[bug.status] colors[bug.status]
}`} }`}

@ -1,9 +1,19 @@
import React, {useState} from "react"; import React, { useState } from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import Sidebar from "./layouts/SidebarMenu"; import Sidebar from "./layouts/SidebarMenu";
import Main from "./layouts/Main"; import Main from "./layouts/Main";
import Dialog from "../../components/Dialog";
export const Dashboard = ({ isMobile }) => { export const Dashboard = ({ isMobile }) => {
const [dialog, setDialog] = useState({
text: null,
type: null,
setOpen: null,
accept: null,
color: null,
open: null,
});
const [page, setPage] = useState("userItems"); const [page, setPage] = useState("userItems");
return isMobile ? ( return isMobile ? (
@ -11,8 +21,9 @@ export const Dashboard = ({ isMobile }) => {
) : ( ) : (
<div className="w-full"> <div className="w-full">
<div className="gap-5 w-full h-screen pt-20 mx-auto flex flex-row bg-transparent justify-end"> <div className="gap-5 w-full h-screen pt-20 mx-auto flex flex-row bg-transparent justify-end">
<Sidebar page={page} setPage={setPage} /> <Sidebar page={page} setPage={setPage} setDialog={setDialog} dialog={dialog} />
<Main page={page} /> <Main page={page} />
{dialog.open && <Dialog dialog={dialog} />}
</div> </div>
</div> </div>
); );

@ -7,7 +7,7 @@ export const MyBooks = ({ books, grades, isMobile }) => {
return ( return (
<div className="flex flex-1 flex-col"> <div className="flex flex-1 flex-col">
<div className="flex flex-wrap gap-4 mb-5"> <div className="flex flex-wrap gap-4 mb-5">
{books.slice(0,5).map((product, index) => ( {books.slice(0,1).map((product, index) => (
<Product key={index} product={product} imageSize={5} /> <Product key={index} product={product} imageSize={5} />
))} ))}
</div> </div>

@ -6,7 +6,7 @@ import arrow from "../../../../../../assets/icons/dropdown-blue.svg";
function Suggestion({ products, grades, isMobile }) { function Suggestion({ products, grades, isMobile }) {
return ( return (
<div className="flex flex-col pl-7 pr-8 pt-4 border border-solid border-gray-200 shadow-all rounded-md"> <div className="flex flex-col pl-7 pr-8 pt-4 border border-solid border-gray-200 bg-blueC0 bg-opacity-5 shadow-all rounded-md w-full">
<strong className="text-green7B dark:text-white font-bold text-2xl lg:text-base my-4"> <strong className="text-green7B dark:text-white font-bold text-2xl lg:text-base my-4">
پیشنهادات ما به شما پیشنهادات ما به شما
</strong> </strong>

@ -7,11 +7,12 @@ import UserItems from "../Main/UserItems";
import MyBooks from './MyBooks'; import MyBooks from './MyBooks';
export const Main = ({ setHeaderOptions, page }) => { export const Main = ({ setHeaderOptions, page }) => {
useEffect(() => { useEffect(() => {
setHeaderOptions({ shown: true }); setHeaderOptions({ shown: true });
}, []); }, []);
const views = { const views = {
// orders: <Orders />, orders: <Orders />,
mybooks : <MyBooks />, mybooks : <MyBooks />,
userItems: <UserItems />, userItems: <UserItems />,
}; };

@ -1,13 +1,14 @@
import React, { useState } from "react"; import React, { useState, useEffect } from "react";
import Avatar from "../../../../components/Avatar"; import Avatar from "../../../../components/Avatar";
import { connect } from "react-redux"; import { connect } from "react-redux";
import {useNavigate} from "react-router-dom";
import { publicApi, user } from "../../../../redux/actions"; import { publicApi, user } from "../../../../redux/actions";
import "./index.scss"; import "./index.scss";
//assets //assets
import profilePic from "./profile-pic.svg"; import profilePic from "./profile-pic.svg";
import logout from "./logout.svg"; import logoutIcon from "./logout.svg";
import moon from "./moon.svg"; import moon from "./moon.svg";
import sms from "./sms.svg"; import sms from "./sms.svg";
import userEdit from "./user-edit.svg"; import userEdit from "./user-edit.svg";
@ -21,8 +22,12 @@ const SidebarMenu = ({
setDashboardOptions, setDashboardOptions,
page, page,
setPage, setPage,
logout logout,
setDialog,
dialog,
isLogin
}) => { }) => {
const navigate = useNavigate();
const [toggleList, setToggleList] = useState({ const [toggleList, setToggleList] = useState({
profile: false, profile: false,
support: false, support: false,
@ -39,7 +44,7 @@ const SidebarMenu = ({
> >
<div className="flex items-center"> <div className="flex items-center">
<img src={icon} alt="" className="ml-2 w-6 mb-1" /> <img src={icon} alt="" className="ml-2 w-6 mb-1" />
<strong className="font-semibold text-base text-green7B"> <strong className="font-semibold text-tiny text-green7B">
{title} {title}
</strong> </strong>
</div> </div>
@ -66,7 +71,9 @@ const SidebarMenu = ({
> >
<span <span
className={`text-tiny font-medium py-2 my-1 px-4 rounded-full ${ className={`text-tiny font-medium py-2 my-1 px-4 rounded-full ${
page === item.value ? "text-white bg-green-600" : "text-gray70" page === item.value
? "text-white bg-green-600"
: "text-gray70"
}`} }`}
> >
{item.title} {item.title}
@ -91,18 +98,39 @@ const SidebarMenu = ({
onClick: () => setPage("myvideos"), onClick: () => setPage("myvideos"),
name: "myvideos", name: "myvideos",
}, },
{
icon: null,
title: "سفارشات",
onClick: () => setPage("orders"),
name: "orders",
},
{ icon: moon, title: "حالت شب", onClick: () => {}, name: "dark" }, { icon: moon, title: "حالت شب", onClick: () => {}, name: "dark" },
{ {
icon: logout, icon: logoutIcon,
title: "خروج از حساب کاربری", title: "خروج از حساب کاربری",
onClick: () => logout(), // onClick: () => logout(),
onClick: () =>
setDialog({
text: "میخوای تنهامون بذاری؟",
type: "confirm",
setOpen: (val) => setDialog({ ...dialog, open: val }),
accept: () => logout(),
bg: "bg-white bg-opacity-10",
color: "text-green4F",
open: true,
}),
name: "logout", name: "logout",
}, },
]; ];
useEffect(() => {
if(!isLogin){
navigate('/');
}
},[isLogin]);
return ( return (
<div <div
className="bg-grayF9 py-5 pl-4 pr-8 shadow-sm border border-gray-300 rounded overflow-y-scroll no-scrollbar divide-y divide-solid divide-gray-200" className="bg-gray-50 py-5 border-l-2 pl-4 pr-8 shadow-sm border-gray-300 border-solid overflow-y-scroll no-scrollbar divide-y divide-solid divide-gray-200"
style={{ style={{
height: "calc(100vh - 80px)", height: "calc(100vh - 80px)",
minWidth: 400, minWidth: 400,
@ -135,10 +163,10 @@ const SidebarMenu = ({
<div <div
className="flex flex-col item-center mb-0" className="flex flex-col item-center mb-0"
onClick={() => button.onClick()} onClick={() => button.onClick()}
key={i}
> >
<div <div
key={i} className={`flex flex-row items-center cursor-pointer rounded-md py-0 my-3 px-1`}
className={`flex flex-row items-center cursor-pointer rounded-md py-2 my-3 px-1`}
> >
<img src={button.icon} alt="" /> <img src={button.icon} alt="" />
<strong <strong
@ -146,7 +174,7 @@ const SidebarMenu = ({
page === button.name page === button.name
? "text-white bg-green-600" ? "text-white bg-green-600"
: "text-green7B hover:bg-blueC0 hover:bg-opacity-10" : "text-green7B hover:bg-blueC0 hover:bg-opacity-10"
} text-base mx-2 p-2 rounded-full`} } text-tiny mx-2 p-2 rounded-full`}
> >
{button.title} {button.title}
</strong> </strong>
@ -160,11 +188,12 @@ const SidebarMenu = ({
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
user: state.user.status, user: state.user.status,
dashboardOptions: state.publicApi.dashboardOptions, dashboardOptions: state.publicApi.dashboardOptions,
isLogin: state.user.status,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {
setDashboardOptions: publicApi.setDashboardOptions, setDashboardOptions: publicApi.setDashboardOptions,
logout : user.logout logout: user.logout,
}; };
export default connect(mapStateToProps, mapDispatchToProps)(SidebarMenu); export default connect(mapStateToProps, mapDispatchToProps)(SidebarMenu);
@ -184,7 +213,6 @@ SidebarMenu.defaultProps = {
notification: null, notification: null,
list: [ list: [
{ title: "تیکت ها", value: "tickets" }, { title: "تیکت ها", value: "tickets" },
{ title: "ارسال تیکت جدید", value: "send" },
], ],
}, },
}; };

@ -1,23 +1,25 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { userFactor } from "../../../redux/actions";
import Button from "../../../components/Button"; import Button from "../../../components/Button";
import Radio from "../../../components/Radio"; import Radio from "../../../components/Radio";
import Loading from "../../../components/Loading";
function Address({ addresses, isDark, isMobile, setPhase }) { function Address({
const [activeAddress, setActiveAddress] = useState([]); addresses,
isDark,
useEffect(() => { isMobile,
if(addresses?.length > 0){ setPhase,
setActiveAddress(addresses[0]); update,
} userId,
userAddressId,
},[addresses]); loading,
}) {
const Location = ({ address, active }) => { const Location = ({ address, active }) => {
return isMobile ? ( return isMobile ? (
<button <button
className={`flex flex-row border-2 border-solid items-center w-full px-3 py-4 rounded-md mt-4 transition-all duration-500 dark:bg-opacity-5 ${ className={`flex flex-row border-2 border-solid items-center w-full px-3 py-4 rounded-md mt-4 transition-all duration-500 dark:bg-opacity-5 ${
activeAddress === address userAddressId === address?.id
? "bg-blueFD border-blueC0" ? "bg-blueFD border-blueC0"
: "bg-grayF9 border-gray45" : "bg-grayF9 border-gray45"
}`} }`}
@ -40,15 +42,23 @@ function Address({ addresses, isDark, isMobile, setPhase }) {
</button> </button>
) : ( ) : (
<button <button
className={`flex flex-row border border-solid items-center w-full px-3 py-6 rounded-md mt-4 transition-all duration-500 gap-10 dark:bg-opacity-5 ${ className={`flex flex-row border border-solid items-center w-full px-3 py-6 rounded-md mt-4 transition-all duration-500 gap-10 border-opacity-30 dark:bg-opacity-5 ${
activeAddress === address userAddressId === address?.id
? "bg-blueC0 bg-opacity-5 border-blueC0" ? "bg-blueC0 bg-opacity-5 border-blueC0"
: "bg-grayF9 border-gray45" : "bg-grayF9 border-gray45"
}`} }`}
onClick={() => setActiveAddress(address)} onClick={() =>
userAddressId === address?.id
? {}
: update({ userAddressId: address.id, userId })
}
> >
<div className="flex flex-row flex-8 gap-4"> <div className="flex flex-row flex-8 gap-4">
{loading && userAddressId !== address?.id ? (
<Loading size={2} color="bg-gray-400" />
) : (
<Radio active={active} /> <Radio active={active} />
)}
<div className="flex flex-col"> <div className="flex flex-col">
<li className="text-right text-tiny leading-6 text-blue52 dark:text-white"> <li className="text-right text-tiny leading-6 text-blue52 dark:text-white">
آدرس:&nbsp;{address.address} آدرس:&nbsp;{address.address}
@ -61,7 +71,7 @@ function Address({ addresses, isDark, isMobile, setPhase }) {
</div> </div>
<div className="flex flex-col flex-5"> <div className="flex flex-col flex-5">
<li className="text-right text-tiny leading-6 text-blue52 dark:text-white"> <li className="text-right text-tiny leading-6 text-blue52 dark:text-white">
نام تحویل گیرنده:&nbsp;{address.firstName + ' ' + address.lastName} نام تحویل گیرنده:&nbsp;{address.firstName + " " + address.lastName}
</li> </li>
<li className="text-right text-tiny leading-6 text-blue52 dark:text-white mt-3"> <li className="text-right text-tiny leading-6 text-blue52 dark:text-white mt-3">
شماره تماس:&nbsp;{address.cellphone} شماره تماس:&nbsp;{address.cellphone}
@ -100,7 +110,7 @@ function Address({ addresses, isDark, isMobile, setPhase }) {
<Location <Location
address={address} address={address}
key={index} key={index}
active={activeAddress === address} active={userAddressId === address?.id}
/> />
))} ))}
</ul> </ul>
@ -122,6 +132,13 @@ function Address({ addresses, isDark, isMobile, setPhase }) {
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
isDark: state.publicApi.isDark, isDark: state.publicApi.isDark,
isMobile: state.publicApi.isMobile, isMobile: state.publicApi.isMobile,
userId: state.user.status?.id,
userAddressId: state.userFactor.info?.userAddressId,
loading: state.userFactor.loading,
}); });
export default connect(mapStateToProps)(Address); const mapDispatchToProps = {
update: userFactor.update,
};
export default connect(mapStateToProps, mapDispatchToProps)(Address);

@ -6,12 +6,12 @@ function PaymentMethods({ paymentMethods, isDark }) {
const Method = ({ method }) => { const Method = ({ method }) => {
return ( return (
<button <button
className={`flex flex-col border border-solid items-center w-full px-2.5 py-3.5 rounded-md mt-4 relative transition-all duration-500 dark:text-white text-tiny ${ className={`flex flex-col border border-solid cursor-not-allowed items-center w-full px-2.5 py-3.5 rounded-md mt-4 relative transition-all duration-500 dark:text-white text-tiny ${
activeMethod === method activeMethod === method
? "bg-blueFD border-blueC0 text-blueC0 bg-opacity-5" ? "bg-blueFD border-blueC0 text-blueC0 bg-opacity-5"
: "bg-grayF9 border-grayDB text-gray70 bg-opacity-5" : "bg-grayF9 border-grayDB text-gray70 bg-opacity-5"
}`} }`}
onClick={() => setActiveMactiveMethod(method)} onClick={() => {}}
> >
{method.name} {method.name}
</button> </button>

@ -73,7 +73,7 @@ function TransportMethod({
: {} : {}
} }
> >
{loading ? ( {loading && factorInfo?.transportId !== method?.id ? (
<Loading <Loading
size={4} size={4}
color={ color={

@ -6,10 +6,8 @@ import arrow from "../../../../assets/icons/dropdown-blue.svg";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import Product from "../../../../components/Product"; import Product from "../../../../components/Product";
import Button from "../../../../components/Button"; import Button from "../../../../components/Button";
// import ScrollContainer from "react-indiana-drag-scroll";
const Part2 = ({ books, grades }) => { const Part2 = ({ books, grades }) => {
// console.log({ books });
const [filter, setFilter] = useState({ const [filter, setFilter] = useState({
search: "", search: "",
grade: "", grade: "",

@ -34,7 +34,7 @@ function MyBooks({ books, getList, grades, isMobile }) {
return ( return (
<div className="px-4 mb-5 lg:mb-0" style={{maxWidth: '100%'}}> <div className="px-4 mb-5 lg:mb-0" style={{maxWidth: '100%'}}>
<div className="w-full flex flex-col rounded-md pt-4 lg:py-5 px-2 lg:px-4 bg-blueC0 bg-opacity-10 border border-green-200 border-solid dark:bg-gray2077 overflow-hidden"> <div className="w-full flex flex-col rounded-md pt-4 lg:py-5 px-2 lg:px-4 bg-blueC0 bg-opacity-5 border border-green-200 border-solid dark:bg-gray2077 overflow-hidden">
<strong className="text-green7B dark:text-white font-bold text-sm lg:text-base"> <strong className="text-green7B dark:text-white font-bold text-sm lg:text-base">
کتابهای من کتابهای من
</strong> </strong>

@ -35,9 +35,9 @@ function Videos({ videos, grades, isDark, isMobile }) {
}; };
return ( return (
<div className="w-full px-4 lg:py-4"> <div className="w-full px-4 lg:py-4">
<div className="w-full flex flex-col py-4 lg:px-3 overflow-hidden lg:border lg:border-solid lg:border-gray-200 rounded-md lg:bg-blueC0 lg:bg-opacity-10"> <div className="w-full flex flex-col py-4 lg:px-3 overflow-hidden lg:border lg:border-solid lg:border-gray-200 rounded-md lg:bg-blueC0 lg:bg-opacity-5">
<header className="w-full flex flex-row justify-between items-center"> <header className="w-full flex flex-row justify-between items-center">
<strong className="text-green7B dark:text-white font-bold text-sm lg:text-base"> <strong className="text-green7B dark:text-white font-bold text-sm lg:text-base mt-2">
دورههای ویدئویی شما دورههای ویدئویی شما
</strong> </strong>
<img <img

@ -20,7 +20,7 @@ const status = {
function Order({ order, isMobile }) { function Order({ order, isMobile }) {
return ( return (
<div className="w-full flex flex-col rounded-md overflow-hidden my-3 border border-solid border-blueC0 border-opacity-10 dark:border-blueC0 dark:border-opacity-10 lg:w-3/5 mx-auto"> <div className="w-full flex flex-col rounded-md overflow-hidden my-3 border border-solid border-blueC0 border-opacity-50 dark:border-blueC0 dark:border-opacity-10 lg:w-4/5 mx-auto">
<div className="flex flex-row w-full justify-between items-center p-3 bg-blueC0 bg-opacity-10 dark:bg-blueC0 dark:bg-opacity-10"> <div className="flex flex-row w-full justify-between items-center p-3 bg-blueC0 bg-opacity-10 dark:bg-blueC0 dark:bg-opacity-10">
<strong className="font-medium text-sm lg:text-tiny text-green4F dark:text-white"> <strong className="font-medium text-sm lg:text-tiny text-green4F dark:text-white">
{_.join(["شماره سفارش:", order.number], " ")} {_.join(["شماره سفارش:", order.number], " ")}
@ -39,8 +39,9 @@ function Order({ order, isMobile }) {
<div className="flex flex-col"> <div className="flex flex-col">
<div className="flex flex-row mb-2"> <div className="flex flex-row mb-2">
{order.items.length < 2 {order.items.length < 2
? order?.items?.map((item) => ( ? order?.items?.map((item, index) => (
<img <img
key={index}
src={item} src={item}
className="rounded-md ml-1.5" className="rounded-md ml-1.5"
style={{ style={{
@ -49,8 +50,9 @@ function Order({ order, isMobile }) {
}} }}
/> />
)) ))
: order.items?.slice(0, 1)?.map((item) => ( : order.items?.slice(0, 1)?.map((item, index) => (
<img <img
key={index}
src={item} src={item}
className="rounded-md ml-1.5" className="rounded-md ml-1.5"
style={{ style={{

@ -5,12 +5,9 @@ import { publicApi } from "../../redux/actions";
//assets //assets
import bookImage from "../../assets/images/book-mini.svg"; import bookImage from "../../assets/images/book-mini.svg";
function Orders({ orders, headerOptions, setHeaderOptions }) { function Orders({ orders }) {
useEffect(() => {
setHeaderOptions(headerOptions);
}, []);
return ( return (
<div className="flex flex-col px-4 lg:pb-20 lg:pt-24"> <div className="flex flex-col px-4">
{orders.map((order, index) => ( {orders.map((order, index) => (
<Order order={order} key={index} /> <Order order={order} key={index} />
))} ))}
@ -21,7 +18,6 @@ function Orders({ orders, headerOptions, setHeaderOptions }) {
const mapStateToProps = (state) => ({}); const mapStateToProps = (state) => ({});
const mapDispatchToProps = { const mapDispatchToProps = {
setHeaderOptions: publicApi.setHeaderOptions,
}; };
export default connect(mapStateToProps, mapDispatchToProps)(Orders); export default connect(mapStateToProps, mapDispatchToProps)(Orders);

@ -1,23 +1,23 @@
import React, { useState, useEffect, useCallback } from "react"; import React, { useEffect, useState } from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import { Carousel } from "@trendyol-js/react-carousel"; import { ScrollingCarousel } from "@trendyol-js/react-carousel";
import filterIcon from "../../../assets/images/vuesax-linear-filter-tick.svg";
import Product from "../../../components/Product"; import Product from "../../../components/Product";
import VodProduct from "../../../components/VodProduct"; import VodProduct from "../../../components/VodProduct";
import { book, publicApi, product } from "../../../redux/actions"; import Loading from "../../../components/Loading";
import posterImage from "../../../assets/images/poster.svg"; import { book, publicApi } from "../../../redux/actions";
import arrow from "../../../assets/icons/dropdown-blue.svg";
export const Main = ({ books, grades, sortMethods, filterOptions }) => {
const [filterLoading, setFilterLoading] = useState(false);
useEffect(() => {
setFilterLoading(() => true);
setTimeout(() => {
setFilterLoading(() => false);
}, 500);
}, [filterOptions]);
export const Main = ({
books,
grades,
selectedGrade,
gradeFilterBooks,
sortMethods,
filterOptions,
}) => {
useEffect(() => { useEffect(() => {
window.scrollTo(0, 0); window.scrollTo(0, 0);
}, []); }, []);
@ -34,7 +34,9 @@ export const Main = ({
} }
if (subject) { if (subject) {
bySubjectFilter = byGradeFilter?.filter( bySubjectFilter = byGradeFilter?.filter(
(book) => book?.product[type]?.name?.indexOf(subject) !== -1 (book) =>
book?.product[type]?.name?.indexOf(subject) !== -1 ||
book?.name.indexOf(subject) !== -1
); );
} else { } else {
bySubjectFilter = byGradeFilter; bySubjectFilter = byGradeFilter;
@ -93,7 +95,7 @@ export const Main = ({
}; };
return ( return (
<div className="flex flex-col w-3/4 p-4 pb-20 min-h-screen"> <div className="flex flex-col w-3/4 p-4 pb-20 min-h-screen relative">
<div className="flex w-full bg-blue rounded-lg border border-solid border-gray-200 p-2 items-center my-1.5 justify-center text-blue52"> <div className="flex w-full bg-blue rounded-lg border border-solid border-gray-200 p-2 items-center my-1.5 justify-center text-blue52">
<div className="flex text-sm items-center mx-2"> <div className="flex text-sm items-center mx-2">
<svg <svg
@ -159,52 +161,33 @@ export const Main = ({
</span> </span>
</div> </div>
<ul className="flex py-0 flex-1 gap-4"> <ul className="flex py-0 flex-1 gap-4">
{sortMethods.map((item) => ( {sortMethods.map((item, index) => (
<li <li
key={index}
className="text-sm rounded py-2 px-3 transition-all duration-700 hover:bg-greenBA hover:bg-opacity-5 hover:text-greenBA cursor-pointer" className="text-sm rounded py-2 px-3 transition-all duration-700 hover:bg-greenBA hover:bg-opacity-5 hover:text-greenBA cursor-pointer"
onClick={() => console.log("a")}
> >
{item} {item}
</li> </li>
))} ))}
</ul> </ul>
</div> </div>
{books?.length > 0 && {(filterOptions?.productType
(filterOptions?.productType
? filterOptions.productType === "دوره ویدئویی" ? filterOptions.productType === "دوره ویدئویی"
: true) && ( : true) && (
<div className="relative " style={{ direction: "ltr" }}> <ScrollingCarousel className="py-3">{Items(2)}</ScrollingCarousel>
<Carousel
show={Math.round(window.innerWidth / 500)}
slide={2}
swiping={true}
useArrowKeys={true}
infinite={true}
transition={0.5}
className="flex flex-row"
rightArrow={
<img
className="absolute top-1/2 transform -rotate-90 -translate-y-1/2 cursor-pointer p-0"
src={arrow}
alt=""
/>
}
leftArrow={
<img
className="absolute top-1/2 transform -translate-y-1/2 -translate-x-5 cursor-pointer rotate-90 p-2 -left-3"
src={arrow}
alt=""
/>
}
>
{Items(2)}
</Carousel>
</div>
)} )}
<div className="w-full flex flex-row flex-wrap mt-0 border-t-2 border-solid border-gray-100 overflow-y-hidden gap-4 justify-evenly pt-3"> <div className="w-full flex flex-row flex-wrap mt-0 border-t-2 border-solid border-gray-100 overflow-y-hidden gap-4 justify-evenly pt-3">
{Items(1)} {Items(1)}
</div> </div>
{filterLoading && (
<div
className="w-full flex justify-center items-center bg-white bg-opacity-20 backdrop-filter backdrop-blur-xl absolute left-0 top-0"
style={{ height: "calc(100vh - 80px)" }}
>
<Loading size={4} color="bg-green-400" />
</div>
)}
</div> </div>
); );
}; };

@ -84,6 +84,12 @@ export const Sidebar = ({
); );
}; };
const filterLength =
(Object.values(filterOptions)[0] ? 1 : 0) +
(Object.values(filterOptions)[1] ? 1 : 0) +
(Object.values(filterOptions)[2] ? 1 : 0) +
(Object.values(filterOptions)[3] ? 1 : 0);
return ( return (
<div <div
className="flex flex-col w-1/4 px-4 pt-5 pb-2 bg-gray-50 transform translate-y-5 border border-solid border-gray-200 rounded-md" className="flex flex-col w-1/4 px-4 pt-5 pb-2 bg-gray-50 transform translate-y-5 border border-solid border-gray-200 rounded-md"
@ -91,7 +97,25 @@ export const Sidebar = ({
height: "fit-content", height: "fit-content",
}} }}
> >
<strong className="text-lg text-green4F mb-10">فیلترها</strong> <div className="flex justify-between items-center mb-10">
<strong className="text-lg text-green4F">فیلترها</strong>
{filterLength > 0 && (
<span
className="text-tiny text-greenBA bg-greenBA bg-opacity-20 rounded-full px-3 py-2"
onClick={() =>
setFilterOptions({
available: false,
subject: null,
grade: null,
productType: null,
sort: null,
})
}
>
{filterLength + " " + "فیلتر"}
</span>
)}
</div>
<div className="flex flex-col divide-y divide-solid divide-gray-200"> <div className="flex flex-col divide-y divide-solid divide-gray-200">
<Dropdown <Dropdown
list={productTypes} list={productTypes}

@ -12,14 +12,12 @@ export const Content = ({
}) => { }) => {
useEffect(() => { useEffect(() => {
const path = window.location.pathname; const path = window.location.pathname;
// console.log(path.slice(path.lastIndexOf("/") + 1, path.length));
setHeaderOptions(headerOptions); setHeaderOptions(headerOptions);
getQrData({ tail: path.slice(path.lastIndexOf("/") + 1, path.length) }); getQrData({ tail: path.slice(path.lastIndexOf("/") + 1, path.length) });
}, []); }, []);
useEffect(() => { useEffect(() => {
if (data) { if (data) {
// console.log(data?.book?.name);
} }
}, [data]); }, [data]);

@ -18,7 +18,6 @@ export const Scan = ({
}; };
const handleError = (err) => { const handleError = (err) => {
// console.error(err);
}; };
useEffect(() => { useEffect(() => {

@ -1,4 +1,4 @@
import React, { useState } from "react"; import React, { useState, useEffect } from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { userProduct } from "../../../redux/actions"; import { userProduct } from "../../../redux/actions";
import separate from "../../../utils/separate"; import separate from "../../../utils/separate";
@ -10,7 +10,6 @@ import exitIcon from "../../../assets/icons/exit.svg";
import deleteIcon from "../../../assets/icons/delete.svg"; import deleteIcon from "../../../assets/icons/delete.svg";
function Product({ product, grades, pushToCart, isMobile, loading }) { function Product({ product, grades, pushToCart, isMobile, loading }) {
let id;
return isMobile ? ( return isMobile ? (
<div className="flex flex-row justify-between py-5 border-b border-solid border-grayDB dark:border-gray45"> <div className="flex flex-row justify-between py-5 border-b border-solid border-grayDB dark:border-gray45">
<div className="flex flex-row"> <div className="flex flex-row">
@ -92,9 +91,7 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
) : ( ) : (
<div <div
className="flex flex-row w-full gap-10 py-4 border-b border-solid border-gray-200" className="flex flex-row w-full gap-10 py-4 border-b border-solid border-gray-200"
onClick={() => { onClick={() => localStorage.setItem("cartItem", product?.id)}
id = product?.id;
}}
> >
<div className="w-3/4 flex flex-row"> <div className="w-3/4 flex flex-row">
<img <img

@ -1,6 +1,6 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { userProduct, userFactor, publicApi } from "../../redux/actions"; import { userProduct, userFactor, publicApi } from "../../redux/actions";
import separate from '../../utils/separate'; import separate from "../../utils/separate";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import DeliveryForm from "../DeliveryForm"; import DeliveryForm from "../DeliveryForm";
import Product from "./Product"; import Product from "./Product";
@ -68,7 +68,9 @@ function ShoppingCart({
</strong> </strong>
</header> </header>
<ul className="w-full mt-2 list-none p-0"> <ul className="w-full mt-2 list-none p-0">
{list.map( {list
.sort((a, b) => a?.id - b?.id)
.map(
(product, index) => (product, index) =>
product.condition < 2 && ( product.condition < 2 && (
<Product loading={loading} key={index} product={product} /> <Product loading={loading} key={index} product={product} />
@ -103,7 +105,11 @@ function ShoppingCart({
<span <span
className="font-medium text-lg dark:text-white" className="font-medium text-lg dark:text-white"
style={{ style={{
color: !isDark ? (type === "error" ? "#F1420D" : "rgb(6, 186, 206)") : "", color: !isDark
? type === "error"
? "#F1420D"
: "rgb(6, 186, 206)"
: "",
}} }}
> >
{separate(value)} {separate(value)}
@ -181,7 +187,7 @@ function ShoppingCart({
</div> </div>
) : ( ) : (
<div <div
className={`w-11/12 mx-auto flex flex-row relative gap-10 px-5 mt-10 pb-20 pt-24 ${ className={`w-11/12 mx-auto flex flex-row relative gap-10 px-5 mt-10 pb-20 pt-16 ${
desktopContentTransform ? "top-24" : "" desktopContentTransform ? "top-24" : ""
}`} }`}
> >
@ -189,23 +195,23 @@ function ShoppingCart({
{phase !== "address" && ( {phase !== "address" && (
<div <div
className="flex flex-col w-1/4 p-10 bg-white shadow-all rounded-md px-4 py-4" className="flex flex-col w-1/4 p-10 bg-white shadow-all rounded-md px-4 py-4"
style={{ height: "fit-content", minWidth: 350}} style={{ height: "fit-content", minWidth: 350 }}
> >
<div className="flex flex-col w-full border-t py-2 border-gray-300 border-b"> <div className="flex flex-col w-full border-t py-2 border-gray-300 border-b">
<PriceStatus <PriceStatus
name="مبلغ سبد خرید" name="مبلغ سبد خرید"
value={productsLength ? factorInfo?.sumPrice : ''} value={productsLength ? factorInfo?.sumPrice : ""}
type="normal" type="normal"
/> />
<PriceStatus <PriceStatus
name="میزان تخفیف" name="میزان تخفیف"
value={productsLength ? factorInfo?.offPrice : ''} value={productsLength ? factorInfo?.offPrice : ""}
type="error" type="error"
/> />
<PriceStatus <PriceStatus
name="مالیات بر ارزش افزوده" name="مالیات بر ارزش افزوده"
value={ value={
productsLength ? Math.floor(factorInfo?.sumPrice * 0.009) : '' productsLength ? Math.floor(factorInfo?.sumPrice * 0.009) : ""
} }
type="error" type="error"
/> />
@ -215,7 +221,7 @@ function ShoppingCart({
جمع کل سبد خرید جمع کل سبد خرید
</strong> </strong>
<p className="font-medium text-greenBA text-lg dark:text-white"> <p className="font-medium text-greenBA text-lg dark:text-white">
{separate(productsLength ? factorInfo?.payPrice : '')} {separate(productsLength ? factorInfo?.payPrice : "")}
<span className="font-medium text-greenBA text-sm mr-2"> <span className="font-medium text-greenBA text-sm mr-2">
تومان تومان
</span> </span>
@ -296,7 +302,7 @@ const mapStateToProps = (state) => ({
hasPhysical: state.userProduct.hasPhysical, hasPhysical: state.userProduct.hasPhysical,
desktopContentTransform: state.publicApi.desktopContentTransform, desktopContentTransform: state.publicApi.desktopContentTransform,
userProducts: state.userProduct.list, userProducts: state.userProduct.list,
loading: state.userProduct.loading loading: state.userProduct.loading,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {

@ -15,7 +15,7 @@ const Table = ({ specifications }) => {
return ( return (
<ul className="w-full"> <ul className="w-full">
{Object.keys(specifications).map((specification, index) => ( {Object.keys(specifications).map((specification, index) => (
<li className="flex my-3 cursor-pointer group"> <li className="flex my-3 cursor-pointer group" key={index}>
<div <div
className=" bg-grayF9 rounded px-3 py-4 ml-2 text-greenBA text-sm group-hover:bg-blueC0 group-hover:bg-opacity-10" className=" bg-grayF9 rounded px-3 py-4 ml-2 text-greenBA text-sm group-hover:bg-blueC0 group-hover:bg-opacity-10"
style={{ flex: 2 }} style={{ flex: 2 }}

@ -1,4 +1,4 @@
import React, {useState, useEffect} from "react"; import React, { useState, useEffect } from "react";
import "../../../../components/ProductImage/index.scss"; import "../../../../components/ProductImage/index.scss";
@ -13,25 +13,16 @@ const Videos = ({ videos }) => {
let mylist = videos?.split(","); let mylist = videos?.split(",");
setList(() => mylist); setList(() => mylist);
setActiveVideo(() => mylist[0]); setActiveVideo(() => mylist[0]);
console.log(videos);
} }
}, [videos]); }, [videos]);
return ( return (
<div className="flex flex-row w-full bg-gray-300" style={{height : 'calc(100vh / 1.5)'}}> <div
className="flex flex-row w-full bg-gray-300"
{/* <img style={{ height: "calc(100vh / 1.5)" }}
src={productImg} >
alt=""
style={{ height: "calc(100vh)", width: "w-full" }}
className="rounded-md"
/> */}
</div> </div>
); );
}; };
// {[0, 1, 2, 3, 4].map((item, index) => (
// ))}
export default Videos; export default Videos;

Loading…
Cancel
Save