some update and change

main
alireza khaji 2 years ago
parent 666fa19f38
commit 6f6092ed27
  1. 4
      src/App.js
  2. BIN
      src/assets/img/photo-placeholder.png
  3. 8
      src/assets/img/vuesax-linear-arrow-left.svg
  4. 12
      src/assets/img/vuesax-linear-element-equal.svg
  5. 12
      src/assets/img/vuesax-linear-element-equal2.svg
  6. 12
      src/assets/img/vuesax-linear-map.svg
  7. 12
      src/assets/img/vuesax-linear-map2.svg
  8. 18
      src/assets/img/vuesax-linear-myService.svg
  9. 18
      src/assets/img/vuesax-linear-myService2.svg
  10. 7
      src/assets/img/vuesax-linear-sms1.svg
  11. 8
      src/assets/img/vuesax-linear-sms2.svg
  12. 495
      src/components/Product/index.js
  13. 7
      src/components/ShoppingCart/index.js
  14. 300
      src/components/header/Header.js
  15. 236
      src/components/nav/Nav.js
  16. 7
      src/redux/reducers/user.js
  17. 224
      src/view/LoginSignUp/SignUpBox.js
  18. 1119
      src/view/LoginSignUp/index.js
  19. 40
      src/view/dashboard2/Games.js
  20. 2353
      src/view/register/index.js
  21. 748
      src/view/services/index.js
  22. 1
      tailwind.config.js
  23. 16172
      yarn.lock

@ -651,6 +651,10 @@ function App() {
localStorage.setItem('login', false) localStorage.setItem('login', false)
}; };
if(location==="/"){
window.location.replace("/services");
}
// useEffect(() => { // useEffect(() => {
// setLOGIN(true); // setLOGIN(true);
// }, [loginStorage]) // }, [loginStorage])

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

@ -0,0 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<g id="vuesax_linear_arrow-left" data-name="vuesax/linear/arrow-left" transform="translate(-364 -252)">
<g id="arrow-left">
<path id="Vector" d="M7.1,15.84.577,9.32a1.986,1.986,0,0,1,0-2.8L7.1,0" transform="translate(371.902 256.08)" fill="none" stroke="#521326" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0H24V24H0Z" transform="translate(388 276) rotate(180)" fill="none" opacity="0"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 582 B

@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" width="52" height="52" viewBox="0 0 52 52">
<g id="vuesax_linear_element-equal" data-name="vuesax/linear/element-equal" transform="translate(-108 -316)">
<g id="element-equal" transform="translate(108 316)">
<path id="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(29.25 4.333)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M18.417,14.127V4.29C18.417,1.235,17.03,0,13.585,0H4.832C1.387,0,0,1.235,0,4.29v9.815c0,3.077,1.387,4.29,4.832,4.29h8.753C17.03,18.417,18.417,17.182,18.417,14.127Z" transform="translate(4.333 4.333)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(4.333 29.25)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M0,0H13" transform="translate(32.5 33.583)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-5" data-name="Vector" d="M0,0H13" transform="translate(32.5 42.25)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-6" data-name="Vector" d="M0,0H52V52H0Z" fill="none" opacity="0"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" width="52" height="52" viewBox="0 0 52 52">
<g id="vuesax_linear_element-equal2" data-name="vuesax/linear/element-equal2" transform="translate(-108 -316)">
<g id="element-equal" transform="translate(108 316)">
<path id="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(29.25 4.333)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M18.417,14.127V4.29C18.417,1.235,17.03,0,13.585,0H4.832C1.387,0,0,1.235,0,4.29v9.815c0,3.077,1.387,4.29,4.832,4.29h8.753C17.03,18.417,18.417,17.182,18.417,14.127Z" transform="translate(4.333 4.333)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(4.333 29.25)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M0,0H13" transform="translate(32.5 33.583)" fill="none" stroke="#fff" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-5" data-name="Vector" d="M0,0H13" transform="translate(32.5 42.25)" fill="none" stroke="#fff" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-6" data-name="Vector" d="M0,0H52V52H0Z" fill="none" opacity="0"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" width="49.637" height="49.637" viewBox="0 0 49.637 49.637">
<g id="vuesax_linear_map" data-name="vuesax/linear/map" transform="translate(-492 -252)">
<g id="map" transform="translate(492 252)">
<path id="Vector" d="M16.546,5.646V18.056c0,5.171-1.034,8.79-3.351,11.127L0,15.987,15.987,0A25.444,25.444,0,0,1,16.546,5.646Z" transform="translate(28.955 12.968)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M40.806,8.831,8.831,40.806C2.606,39.379,0,35.077,0,26.887V14.478C0,4.136,4.136,0,14.478,0H26.887C35.077,0,39.379,2.606,40.806,8.831Z" transform="translate(4.136 4.136)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M29.183,13.2c-2.337,2.316-5.956,3.351-11.127,3.351H5.646A25.445,25.445,0,0,1,0,15.987L15.987,0Z" transform="translate(12.968 28.955)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M.176,4.545c1.406-6.06,10.507-6.06,11.913,0C12.9,8.1,10.662,11.122,8.7,12.983a3.724,3.724,0,0,1-5.129,0C1.6,11.122-.652,8.1.176,4.545Z" transform="translate(12.73 11.959)" fill="none" stroke="#a5a8ab" stroke-width="2"/>
<path id="Vector-5" data-name="Vector" d="M0,0H49.637V49.637H0Z" fill="none" opacity="0"/>
<path id="Vector-6" data-name="Vector" d="M.495.5H.513" transform="translate(18.315 17.494)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" width="49.637" height="49.637" viewBox="0 0 49.637 49.637">
<g id="vuesax_linear_map2" data-name="vuesax/linear/map2" transform="translate(-492 -252)">
<g id="map" transform="translate(492 252)">
<path id="Vector" d="M16.546,5.646V18.056c0,5.171-1.034,8.79-3.351,11.127L0,15.987,15.987,0A25.444,25.444,0,0,1,16.546,5.646Z" transform="translate(28.955 12.968)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M40.806,8.831,8.831,40.806C2.606,39.379,0,35.077,0,26.887V14.478C0,4.136,4.136,0,14.478,0H26.887C35.077,0,39.379,2.606,40.806,8.831Z" transform="translate(4.136 4.136)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M29.183,13.2c-2.337,2.316-5.956,3.351-11.127,3.351H5.646A25.445,25.445,0,0,1,0,15.987L15.987,0Z" transform="translate(12.968 28.955)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M.176,4.545c1.406-6.06,10.507-6.06,11.913,0C12.9,8.1,10.662,11.122,8.7,12.983a3.724,3.724,0,0,1-5.129,0C1.6,11.122-.652,8.1.176,4.545Z" transform="translate(12.73 11.959)" fill="none" stroke="#fff" stroke-width="2"/>
<path id="Vector-5" data-name="Vector" d="M0,0H49.637V49.637H0Z" fill="none" opacity="0"/>
<path id="Vector-6" data-name="Vector" d="M.495.5H.513" transform="translate(18.315 17.494)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" width="52" height="52" viewBox="0 0 52 52">
<g id="vuesax_linear_myService" data-name="vuesax/linear/myService" transform="translate(-108 -316)">
<g id="element-equal" transform="translate(108 316)">
<path id="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(29.25 4.333)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(4.333 29.25)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M0,0H13" transform="translate(32.5 33.583)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M0,0H13" transform="translate(32.5 42.25)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-5" data-name="Vector" d="M0,0H52V52H0Z" fill="none" opacity="0"/>
<g id="vuesax_linear_user" data-name="vuesax/linear/user" transform="translate(-106.243 -186.635)">
<g id="user" transform="translate(108 188)">
<path id="Vector-6" data-name="Vector" d="M9.475,4.737A4.737,4.737,0,1,1,4.737,0,4.737,4.737,0,0,1,9.475,4.737Z" transform="translate(6.632 0.895)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-7" data-name="Vector" d="M16.278,6.632C16.278,2.966,12.63,0,8.139,0S0,2.966,0,6.632" transform="translate(3.231 14.212)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-8" data-name="Vector" d="M0,0H22.739V22.739H0Z" fill="none" opacity="0"/>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" width="52" height="52" viewBox="0 0 52 52">
<g id="vuesax_linear_myService2" data-name="vuesax/linear/myService2" transform="translate(-108 -316)">
<g id="element-equal" transform="translate(108 316)">
<path id="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(29.25 4.333)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M18.417,13.585V4.832C18.417,1.387,17.03,0,13.585,0H4.832C1.387,0,0,1.387,0,4.832v8.753c0,3.445,1.387,4.832,4.832,4.832h8.753C17.03,18.417,18.417,17.03,18.417,13.585Z" transform="translate(4.333 29.25)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M0,0H13" transform="translate(32.5 33.583)" fill="none" stroke="#fff" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M0,0H13" transform="translate(32.5 42.25)" fill="none" stroke="#fff" stroke-linecap="round" stroke-width="2"/>
<path id="Vector-5" data-name="Vector" d="M0,0H52V52H0Z" fill="none" opacity="0"/>
<g id="vuesax_linear_user" data-name="vuesax/linear/user" transform="translate(-106.243 -186.635)">
<g id="user" transform="translate(108 188)">
<path id="Vector-6" data-name="Vector" d="M9.475,4.737A4.737,4.737,0,1,1,4.737,0,4.737,4.737,0,0,1,9.475,4.737Z" transform="translate(6.632 0.895)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-7" data-name="Vector" d="M16.278,6.632C16.278,2.966,12.63,0,8.139,0S0,2.966,0,6.632" transform="translate(3.231 14.212)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-8" data-name="Vector" d="M0,0H22.739V22.739H0Z" fill="none" opacity="0"/>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

@ -0,0 +1,7 @@
<svg id="vuesax_linear_sms1" data-name="vuesax/linear/sms1" xmlns="http://www.w3.org/2000/svg" width="49.637" height="49.637" viewBox="0 0 49.637 49.637">
<g id="sms">
<path id="Vector" d="M31.023,35.16H10.341C4.136,35.16,0,32.057,0,24.819V10.341C0,3.1,4.136,0,10.341,0H31.023c6.2,0,10.341,3.1,10.341,10.341V24.819C41.364,32.057,37.228,35.16,31.023,35.16Z" transform="translate(4.136 7.239)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M20.682,0,14.209,5.171a6.547,6.547,0,0,1-7.756,0L0,0" transform="translate(14.477 18.614)" fill="none" stroke="#a5a8ab" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M0,0H49.637V49.637H0Z" fill="none" opacity="0"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 834 B

@ -1,7 +1,7 @@
<svg id="vuesax_linear_sms2" data-name="vuesax/linear/sms2" xmlns="http://www.w3.org/2000/svg" width="46.091" height="46.091" viewBox="0 0 46.091 46.091"> <svg id="vuesax_linear_sms2" data-name="vuesax/linear/sms2" xmlns="http://www.w3.org/2000/svg" width="49.637" height="49.637" viewBox="0 0 49.637 49.637">
<g id="sms"> <g id="sms">
<path id="Vector" d="M28.807,32.648H9.6c-5.761,0-9.6-2.881-9.6-9.6V9.6C0,2.881,3.841,0,9.6,0h19.2c5.761,0,9.6,2.881,9.6,9.6V23.046C38.409,29.767,34.568,32.648,28.807,32.648Z" transform="translate(3.841 6.722)" fill="none" stroke="#fff" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2"/> <path id="Vector" d="M31.023,35.16H10.341C4.136,35.16,0,32.057,0,24.819V10.341C0,3.1,4.136,0,10.341,0H31.023c6.2,0,10.341,3.1,10.341,10.341V24.819C41.364,32.057,37.228,35.16,31.023,35.16Z" transform="translate(4.136 7.239)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M19.2,0,13.194,4.8a6.08,6.08,0,0,1-7.2,0L0,0" transform="translate(13.443 17.284)" fill="none" stroke="#fff" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2"/> <path id="Vector-2" data-name="Vector" d="M20.682,0,14.209,5.171a6.547,6.547,0,0,1-7.756,0L0,0" transform="translate(14.477 18.614)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-3" data-name="Vector" d="M0,0H46.091V46.091H0Z" fill="none" opacity="0"/> <path id="Vector-3" data-name="Vector" d="M0,0H49.637V49.637H0Z" fill="none" opacity="0"/>
</g> </g>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 800 B

After

Width:  |  Height:  |  Size: 828 B

@ -2,7 +2,8 @@ import React, { useState } from "react";
import { BsExclamationSquareFill } from "react-icons/bs"; import { BsExclamationSquareFill } from "react-icons/bs";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { Link } from "react-router-dom";
import imgPlaceHolder from "../../assets/img/photo-placeholder.png";
const ProductDesign = ({ const ProductDesign = ({
colors, colors,
@ -38,265 +39,397 @@ const ProductDesign = ({
btnOnClick, btnOnClick,
catId, catId,
isMobile, isMobile,
onClick onClick,
product,
}) => { }) => {
const [isHovering, setIsHovering] = useState(false); const [isHovering, setIsHovering] = useState(false);
// alert(catId);
let rulesAccepted = JSON.parse(
localStorage.getItem("userData")
).rulesAccepted;
const emkanat = [ const emkanat = [
{ {
title: 'دستشویی', title: "دستشویی",
isActive: true, isActive: true,
}, },
{ {
title: 'آب خوری', title: "آب خوری",
isActive: true, isActive: true,
}, },
{ {
title: 'تخته هوشمند', title: "تخته هوشمند",
isActive: true, isActive: true,
}, },
{ {
title: 'کامپیوتر', title: "کامپیوتر",
isActive: true, isActive: true,
}, },
{ {
title: 'کتابخانه', title: "کتابخانه",
isActive: true, isActive: true,
}, },
{ {
title: 'مشاوره تحصیلی', title: "مشاوره تحصیلی",
isActive: true, isActive: true,
}, },
{ {
title: 'آزمایشگاه', title: "آزمایشگاه",
isActive: false, isActive: false,
}, },
] ];
let description = "دستشویی,کتابخانه,آزمایشگاه";
if (catId == 3) { if (catId == 3) {
return ( return (
<div className={`flex flex-col cursor-pointer pt-4 text-right rounded-xl justify-start w-full m-4 border border-red82OP ${isMobile && 'w-11/12'}`} <div
style={{ width: !isMobile && '375px' , direction: 'rtl' }} className={`flex flex-col pt-4 text-right rounded-xl justify-start w-full m-4 border border-red82OP${
isMobile && "w-11/12"
}`}
style={{ width: !isMobile && "100%", direction: "rtl" }}
> >
<div className="border-b border-red82OP pb-2 px-4 ">
<div className="border-b border-red82OP pb-2 px-4" onClick={onClick}>
<h1 className="text-red52 text-lg font-bold">{productName}</h1> <h1 className="text-red52 text-lg font-bold">{productName}</h1>
<p className="text-red26 text-sm my-2"> <p
در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد className="text-red26 text-sm my-2 h-10 w-full overflow-hidden text-ellipsis"
style={{
WebkitLineClamp: "2",
WebkitBoxOrient: "vertical",
display: "-webkit-box",
}}
>
{product?.description}
</p> </p>
</div> </div>
<div className="flex border-b border-red82OP px-4 py-2"> <div className="flex border-b border-red82OP px-4 py-2">
<div> <div>
<h1 className="font-bold text-red26"> <h1 className="font-bold text-red26">استاد : {teacher}</h1>
استاد : {teacher}
</h1>
</div> </div>
</div> </div>
<div className="flex border-b border-red82OP px-4 py-2 text-red26" onClick={onClick}> <div
className="flex border-b border-red82OP px-4 py-2 text-red26"
// onClick={onClick}
>
<h1>نوع گروه : A</h1> <h1>نوع گروه : A</h1>
</div> </div>
<div className="flex p-4 justify-between items-center"> <div className="flex p-4 justify-between items-center">
<h1 className="font-black text-xl text-red52">{productPrice} تومان</h1> <h1 className="font-black text-xl text-red52">
<div {productPrice} تومان
className={`bg-pinkF5 text-red26 rounded-md w-32 border-2 border-red52 px-1 py-2 text-xs flex justify-center hover:bg-red52 hover:text-white </h1>
<div className="flex flex-col items-center justify-center">
{!rulesAccepted && (
<Link
to="/register"
className="w-36 py-2 px-1 rounded-md text-white bg-[#F2F9FF] text-[#4C7FE3] flex items-center justify-center cursor-pointer text-xs text-center border-2 border-[#4C7FE3]"
>
تکمیل اطلاعات کاربری و افزودن به سبد خرید
</Link>
)}
{rulesAccepted && (
<div
className={`bg-pinkF5 text-red26 rounded-md w-36 border-2 border-red52 px-1 py-2 text-xs flex justify-center hover:bg-red52 hover:text-white
`} `}
> >
<button className="" onClick={btnOnClick}>افزودن به سبد خرید</button> <button className="" onClick={btnOnClick}>
افزودن به سبد خرید
</button>
</div>
)}
<div
className="w-36 py-2 px-1 rounded-md text-white bg-[#DF1452] text-white flex items-center justify-center cursor-pointer text-xs text-center border-2 border-pinkF5 mt-2"
onClick={onClick}
>
اطلاعات بیشتر
</div>
</div> </div>
</div> </div>
</div> </div>
);
)
} }
if (catId == 5) { if (catId == 5) {
return ( return (
<div className="w-full flex justify-center"> <div className="w-full flex justify-center px-6">
<div className={`flex ${isMobile ? 'flex-col w-11/12 border-red52' : 'border-red82OP pt-4'} border my-4 rounded-lg `} style={{width: !isMobile && '90%' }}> <div
<div className={` ${isMobile ? 'w-full h-24 ' : 'w-60 p-4 flex items-center justify-center' }`}> className={`flex ${
{/* image */} isMobile ? "flex-col w-11/12 border-red52" : "border-red82OP pt-4"
<img src="https://fa.tripyar.com/uploads/picture/2977/2.jpg" className={` rounded-md ${isMobile ? 'rounded-b-none w-full h-full object-none' : ' bg-green-500'} `} /> } border my-4 rounded-lg `}
</div> style={{ width: !isMobile && "100%" }}
<div className="flex flex-col text-right"> >
<h1 className="font-bold text-red52 border-b border-red82OP p-2 ">دبیرستان غیر انتفاعی مدرسان هوشمند</h1> <div
<p className={`font-bold ${isMobile ? 'text-xs text-center' : 'text-sm '} text-red26 border-b border-red82OP py-2`}>تهران خیابان انقلاب اسلامی حدفاصل ابوریحان و فلسطین پلاک2 </p> className={` ${
<div className="flex justify-between border-b border-red82OP "> isMobile
<div className={`border-l font-bold text-red26 ${isMobile ? 'flex justify-center items-center w-1/2 text-xs' : ' w-1/4 p-2 pr-0 text-sm'} border-red82OP `}> ? "w-full h-24 "
شماره تلفن: ۰۲۱۶۶۴۵۶۷۳۸ : "w-60 p-4 flex items-center justify-center"
</div> }`}
<div className={`${isMobile ? 'text-xs ' : 'border-l text-sm'} font-bold flex justify-center w-1/2 text-red26 border-red82OP p-2 `}> >
<p> {/* image */}
{!isMobile && ' آدرس وبسایت : '} <img
src={
www.google.com</p> product?.fileId
</div> ? `https://new.andishmand.ir/api/v1/file/${product?.fileId}`
{!isMobile && <div className="text-sm font-bold text-red26 p-2 w-1/4 text-center"> : imgPlaceHolder
آدرس بروی نقشه }
</div>} className={` rounded-md w-full ${
isMobile
? "rounded-b-none w-full h-full object-none"
: " bg-green-500"
} `}
/>
</div> </div>
<div className={`flex ${isMobile && 'flex-col'}`}> <div className="flex flex-col text-right" style={!isMobile?{width:"calc(100% - 15rem)"}:null}>
{isMobile && <h1 className="text-red52 text-sm font-bold p-2 pb-0">امکانات </h1>} <h1 className="font-bold text-red52 border-b border-red82OP p-2 ">
<div className={`w-${isMobile? 'full' : '3/5 pb-6'} flex flex-wrap border-l border-red82OP`}> {product?.name}
{!isMobile && 'امکانات :'} </h1>
<p
className={`font-bold ${
{ isMobile ? "text-xs text-center" : "text-sm "
emkanat.map((item, index) => ( } text-red26 border-b border-red82OP py-2`}
<div className={`flex ${isMobile ? 'w-1/2 justify-start text-xs font-bold' : 'justify-center text-sm'} items-center p-1 px-2`} key={`SCHOOL_SPE__${index}`}> >
<div className={`${isMobile ? 'w-4 h-4' : 'w-6 h-6'} text-white ml-1 rounded-full flex justify-center items-center ${item.isActive ? 'bg-green17' : 'bg-gray-200'}`}> آدرس: {product?.address}
</p>
<svg width="37" height="37" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <div className="flex justify-between border-b border-red82OP ">
<path d="M7.75 12L10.58 14.83L16.25 9.17004" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" /> <div
className={`border-l font-bold text-red26 ${
isMobile
? "flex justify-center items-center w-1/2 text-xs"
: " w-1/4 p-2 pr-0 text-sm"
} border-red82OP `}
>
شماره تلفن: {product?.phone}
</div>
<div
className={`${
isMobile ? "text-xs " : "border-l text-sm"
} font-bold flex justify-center w-1/2 text-red26 border-red82OP p-2 `}
>
<p>
{!isMobile && " آدرس وبسایت : "}
{product?.url}
</p>
</div>
{!isMobile && (
<div className="text-sm font-bold text-red26 p-2 w-1/4 text-center">
آدرس بروی نقشه
</div>
)}
</div>
<div className={`flex w-full ${isMobile && "flex-col"}`}>
{isMobile && (
<h1 className="text-red52 text-sm font-bold p-2 pb-0">
امکانات{" "}
</h1>
)}
<div
className={`w-3/5 pb-6"
flex flex-wrap border-l border-red82OP`}
style={
isMobile ? { width: "100%", paddingBottom: "0px" } : null
}
>
{!isMobile && "امکانات :"}
{product?.description?.split(",").map((item, index) => (
<div
className={`flex ${
isMobile
? "w-1/2 justify-start text-xs font-bold"
: "justify-center text-sm"
} items-center p-1 px-2`}
key={`SCHOOL_SPE__${index}`}
>
<div
className={`${
isMobile ? "w-4 h-4" : "w-6 h-6"
} text-white ml-1 rounded-full flex justify-center items-center ${"bg-green17"}`}
>
<svg
width="37"
height="37"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7.75 12L10.58 14.83L16.25 9.17004"
stroke="#fff"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg> </svg>
</div> </div>
<p>{item.title}</p> <p>{item}</p>
</div> </div>
)) ))}
} {isMobile && (
{isMobile && <div className="w-full border-t border-red82OP flex items-center justify-center h-16">
<div className="w-full border-t border-red82OP flex items-center justify-center h-16"> <h1 className="font-black text-sm text-red26 ">
<h1 className="font-black text-sm text-red26 ">مشاهده آدرس بروی نقشه</h1> مشاهده آدرس بروی نقشه
</div>} </h1>
</div> </div>
<div className={`flex px-4 ${isMobile ? 'w-full border-red82OP border-t' : 'w-2/5 py-4'} justify-between items-center`}> )}
<h1 className={`${isMobile && 'w-1/2 h-full flex items-center py-4 border-l border-red82OP'} font-black text-xl text-red52`}>{productPrice} تومان</h1> </div>
<div <div
className={`bg-pinkF5 rounded-md text-red26 w-32 border-2 border-red52 px-1 py-2 text-xs flex justify-center hover:bg-red52 hover:text-white className={`flex px-4 ${
isMobile ? "w-full border-red82OP border-t" : "w-2/5 py-4"
} justify-between items-center`}
>
<h1
className={`${
isMobile &&
"w-1/2 h-full flex items-center py-4 border-l border-red82OP"
} font-black text-xl text-red52`}
>
{productPrice} تومان
</h1>
<div>
{!rulesAccepted && (
<Link
to="/register"
className="w-36 py-2 px-1 rounded-md text-white bg-[#F2F9FF] text-[#4C7FE3] flex items-center justify-center cursor-pointer text-xs text-center border-2 border-[#4C7FE3]"
>
تکمیل اطلاعات کاربری و رزرو پیش ثبت نام
</Link>
)}
{rulesAccepted && (
<div
className={`bg-pinkF5 rounded-md text-red26 w-32 border-2 border-red52 px-1 py-2 text-xs flex justify-center hover:bg-red52 hover:text-white
`} `}
> >
<button onClick={btnOnClick}> رزرو پیش ثبت نام </button> <button onClick={btnOnClick}> رزرو پیش ثبت نام </button>
</div> </div>
)}
</div> </div>
</div>
</div>
</div> </div>
</div> </div>
</div>
</div> </div>
) );
} }
if(catId == 2){ if (catId == 2) {
return( return (
<div className={`flex cursor-pointer flex-col pt-4 text-right rounded-xl justify-start w-full m-4 border border-red82OP ${isMobile && 'w-11/12'}`} <div
style={{ width: !isMobile && '375px', direction: 'rtl' }} className={`flex cursor-pointer flex-col pt-4 text-right rounded-xl justify-start w-full m-4 border border-red82OP ${
isMobile && "w-11/12"
> }`}
style={{ width: !isMobile && "375px", direction: "rtl" }}
<div className="border-b border-red82OP pb-2 px-4" onClick={onClick}> >
<h1 className="text-red52 text-lg font-bold">آزمون {productName}</h1> <div className="border-b border-red82OP pb-2 px-4" onClick={onClick}>
<p className="text-red26 text-sm my-2"> <h1 className="text-red52 text-lg font-bold">آزمون {productName}</h1>
در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد <p className="text-red26 text-sm my-2">
</p> در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط
</div> در این قسمت قرار میگیرد
</p>
<div className="flex border-b border-red82OP text-center" onClick={onClick}>
<div className="w-1/2 border-l border-red82OP py-2 ">
<h1 className="font-bold text-red26">
نوع آزمون : آنلاین
</h1>
</div>
<div className="w-1/2 py-2 " onClick={onClick}>
<h1 className="font-bold text-red26">
بودجه بندی آزمون
</h1>
</div> </div>
</div> <div
<div className="flex border-b border-red82OP text-center text-xs" onClick={onClick}> className="flex border-b border-red82OP text-center"
<div className="w-1/2 border-l border-red82OP py-2 " onClick={onClick}> onClick={onClick}
<h1 className="font-bold text-red26"> >
تاریخ برگزاری : 1400/02/13 <div className="w-1/2 border-l border-red82OP py-2 ">
</h1> <h1 className="font-bold text-red26">نوع آزمون : آنلاین</h1>
</div> </div>
<div className="w-1/2 py-2 " onClick={onClick}> <div className="w-1/2 py-2 " onClick={onClick}>
<h1 className="font-bold text-red26"> <h1 className="font-bold text-red26">بودجه بندی آزمون</h1>
تعداد آزمون : 18 </div>
</h1>
</div> </div>
</div>
<div className="flex p-4 justify-between items-center">
<h1 className="font-black text-xl text-red52">{productPrice} تومان</h1>
<div <div
className={`bg-pinkF5 text-red26 w-32 border-2 rounded-md border-red52 px-1 py-2 text-xs flex justify-center hover:bg-red52 hover:text-white className="flex border-b border-red82OP text-center text-xs"
`} onClick={onClick}
> >
<button onClick={btnOnClick}>افزودن به سبد خرید</button> <div
className="w-1/2 border-l border-red82OP py-2 "
onClick={onClick}
>
<h1 className="font-bold text-red26">تاریخ برگزاری : 1400/02/13</h1>
</div>
<div className="w-1/2 py-2 " onClick={onClick}>
<h1 className="font-bold text-red26">تعداد آزمون : 18</h1>
</div>
</div> </div>
<div className="flex p-4 justify-between items-center">
<h1 className="font-black text-xl text-red52">
{productPrice} تومان
</h1>
<div
className={`bg-pinkF5 text-red26 w-32 border-2 rounded-md border-red52 px-1 py-2 text-xs flex justify-center hover:bg-red52 hover:text-white
`}
>
<button onClick={btnOnClick}>افزودن به سبد خرید</button>
</div>
</div>
</div> </div>
);
</div>
)
} }
if(catId == 1){ if (catId == 1) {
return ( return (
<div className={`flex flex-col cursor-pointer text-right rounded-xl justify-start w-full m-4 border border-red82OP ${isMobile && 'w-11/12'}`} <div
style={{ width: !isMobile && '375px', direction: 'rtl' }} className={`flex flex-col cursor-pointer text-right rounded-xl justify-start w-full m-4 border border-red82OP ${
isMobile && "w-11/12"
> }`}
style={{ width: !isMobile && "375px", direction: "rtl" }}
<img src="https://narafella.ir/wp-content/uploads/2021/08/books-min.jpg" className="rounded-t-xl" onClick={onClick}/> >
<img
src="https://narafella.ir/wp-content/uploads/2021/08/books-min.jpg"
<div className={`border-b border-red82OP py-2 px-4 ${isMobile ? 'bg-blueFF text-right' : 'text-center '}`} onClick={onClick}> className="rounded-t-xl"
<h1 className={`text-${isMobile ? 'blueE3' : 'blue-5F'} text-lg font-bold`}>کتاب {productName}</h1> onClick={onClick}
<p className="text-blue7E text-sm mb-2"> />
در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد
</p>
</div>
<div className="flex justify-between px-4 items-center">
<h1 className={`font-black text-xl py-4 text-red52 ${isMobile && 'w-1/2 border-l border-red82OP text-center'}`}>{productPrice} تومان</h1>
<div <div
className={`bg-${isMobile ? 'blueFF border-blueDF rounded-lg py-3 hover:bg-blueDF' : 'pinkF5 border-red52 py-2 hover:bg-red52'} rounded-md text-red26 w-32 border-2 px-1 text-xs flex justify-center hover:text-white className={`border-b border-red82OP py-2 px-4 ${
`} isMobile ? "bg-blueFF text-right" : "text-center "
}`}
onClick={onClick}
> >
<button onClick={btnOnClick}>افزودن به سبد خرید</button> <h1
className={`text-${
isMobile ? "blueE3" : "blue-5F"
} text-lg font-bold`}
>
کتاب {productName}
</h1>
<p className="text-blue7E text-sm mb-2">
در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط
در این قسمت قرار میگیرد
</p>
</div> </div>
</div> <div className="flex justify-between px-4 items-center">
<h1
className={`font-black text-xl py-4 text-red52 ${
isMobile && "w-1/2 border-l border-red82OP text-center"
}`}
>
{productPrice} تومان
</h1>
</div> <div
) className={`bg-${
} isMobile
else{ ? "blueFF border-blueDF rounded-lg py-3 hover:bg-blueDF"
return <div></div> : "pinkF5 border-red52 py-2 hover:bg-red52"
} rounded-md text-red26 w-32 border-2 px-1 text-xs flex justify-center hover:text-white
`}
>
<button onClick={btnOnClick}>افزودن به سبد خرید</button>
</div>
</div>
</div>
);
} else {
return <div></div>;
} }
}; };
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
isMobile: state.publicApi.isMobile, isMobile: state.publicApi.isMobile,
}); });
const mapDispatchToProps = ({}); const mapDispatchToProps = {};
export default connect(mapStateToProps, mapDispatchToProps)(ProductDesign); export default connect(mapStateToProps, mapDispatchToProps)(ProductDesign);
ProductDesign.defaultProps = { ProductDesign.defaultProps = {
// icons on product image // icons on product image
colors: false, colors: false,
@ -334,5 +467,5 @@ ProductDesign.defaultProps = {
//میتونیم تعیین کنیم که قیمت و دکمه اضاف به سبد خرید کنار یکدیگر باشند یا زیر هم //میتونیم تعیین کنیم که قیمت و دکمه اضاف به سبد خرید کنار یکدیگر باشند یا زیر هم
priceDirection: "flex-row", priceDirection: "flex-row",
// productImg: book, // productImg: book,
writeGHEIMAT: false writeGHEIMAT: false,
}; };

@ -39,11 +39,12 @@ function ShoppingCart({
getFactorInfo({userId}); getFactorInfo({userId});
setHeaderOptions(headerOptions); setHeaderOptions(headerOptions);
}, []); }, []);
console.log("Cart----------======================-------------------");
console.log(schoolList);
return(isMobile ? return(isMobile ?
<div className="w-full flex flex-col justify-between items-center bg-gray-200 rtl left-0 pt-24" style={{height: '100vh'}}> <div className="w-full flex flex-col justify-between items-center bg-gray-200 rtl left-0 pt-[3.5%]" style={{height: '100vh'}}>
<div className={`w-full flex items-center flex-col ${list?.length > 3 && 'overflow-x-hidden overflow-scroll'}`} style={{height: '35%'}}> <div className={`w-full flex items-center flex-col ${list?.length > 3 && 'overflow-x-hidden overflow-scroll'}`} style={{height: '35%'}}>
{ {
schoolList.map((school, index) => ( schoolList.map((school, index) => (
@ -135,7 +136,7 @@ function ShoppingCart({
: :
<div className="flex flex-col justify-between items-center bg-gray-100 left-0 pt-24" style={{height: '100vh'}}> <div className="flex flex-col justify-between items-center bg-gray-100 left-0 pt-14" style={{height: '100vh'}}>
<div className={`w-full flex items-center flex-col ${list?.length > 1 && 'overflow-x-hidden overflow-scroll'}`} style={{height: '60%'}}> <div className={`w-full flex items-center flex-col ${list?.length > 1 && 'overflow-x-hidden overflow-scroll'}`} style={{height: '60%'}}>
{ {
schoolList.map((school, index) => ( schoolList.map((school, index) => (

@ -36,107 +36,206 @@ const Header = ({
setUserStatus() setUserStatus()
}, []) }, [])
let UserData =JSON.parse(localStorage.getItem("userData"));
return ( return (
<> <>
<div
<div className={`header w-full h-[6.5%] bg-white fixed top-0 left-0 flex items-center ${!isMobile ? 'shadow-md z-10' : 'z-40'}`}> className={`header w-full h-[6.5%] bg-white fixed top-0 left-0 flex items-center ${
{ !isMobile ? "shadow-md z-10" : "z-40"
subMenu && <div className={`w-1/6 p-4 flex flex-col text-right bg-white shadow-xl absolute top-[108.5%] rounded-lg left-5 transition duration-700 ease-in-out ${subMenu && 'subMenu'}`} }`}
>
{subMenu && (
<div
className={`w-1/6 p-4 flex flex-col text-right bg-white shadow-xl absolute top-[108.5%] rounded-lg left-5 transition duration-700 ease-in-out ${
subMenu && "subMenu"
}`}
> >
<div className='flex items-center rtl text-right w-full py-2'> <div className="flex items-center rtl text-right w-full py-2">
<img src={profileIcon} /> <img
کوروش زراندوز ( معلم شیمی ) src={
</div> UserData.picFileId
<Link to='/adminpanel' onClick={() => setSubMenu(false)} className='w-full text-right border-b border-gray-200 py-2'> ? `https://new.andishmand.ir/api/v1/file/${UserData.picFileId}`
: profileIcon
}
/>
{UserData?.displayName || "نامشخص"} ({" "}
{UserData?.job || "دانش آموز"} )
</div>
<Link
to="/adminpanel"
onClick={() => setSubMenu(false)}
className="w-full text-right border-b border-gray-200 py-2"
>
ورود به پنل ادمین ورود به پنل ادمین
</Link> </Link>
{/* <Link to='/adminpanel/add-exam' onClick={() => setSubMenu(false)} className='w-full text-right border-b border-gray-200 py-2'> {/* <Link to='/adminpanel/add-exam' onClick={() => setSubMenu(false)} className='w-full text-right border-b border-gray-200 py-2'>
ورود به صفحه افزودن آزمون ورود به صفحه افزودن آزمون
</Link> */} </Link> */}
<Link to='/register' onClick={() => setSubMenu(false)} className='w-full text-right border-b border-gray-200 py-2'> <Link
to="/register"
onClick={() => setSubMenu(false)}
className="w-full text-right border-b border-gray-200 py-2"
>
ویرایش حساب کاربری ویرایش حساب کاربری
</Link> </Link>
</div> </div>
} )}
{ {isMobile ? (
isMobile ? <div className="flex w-full items-center justify-between rtl px-4">
<div className='flex w-full items-center justify-between rtl px-4'> <div onClick={() => setMenuPopup(!menuPopup)}>
<div onClick={() => setMenuPopup(!menuPopup)}> <svg
<svg width="35" height="35" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> width="35"
<path d="M3 5H21" stroke="#df1452" strokeWidth="1.5" strokeLinecap="round" /> height="35"
<path d="M3 10H21" stroke="#df1452" strokeWidth="1.5" strokeLinecap="round" /> viewBox="0 0 24 24"
<path d="M3 15H21" stroke="#df1452" strokeWidth="1.5" strokeLinecap="round" /> fill="none"
<path d="M3 20H21" stroke="#df1452" strokeWidth="1.5" strokeLinecap="round" /> xmlns="http://www.w3.org/2000/svg"
</svg> >
<path
d="M3 5H21"
stroke="#df1452"
strokeWidth="1.5"
strokeLinecap="round"
/>
<path
d="M3 10H21"
stroke="#df1452"
strokeWidth="1.5"
strokeLinecap="round"
/>
<path
d="M3 15H21"
stroke="#df1452"
strokeWidth="1.5"
strokeLinecap="round"
/>
<path
d="M3 20H21"
stroke="#df1452"
strokeWidth="1.5"
strokeLinecap="round"
/>
</svg>
</div>
<Link to="/">
{" "}
<img src={logoIcon} className="h-10" />{" "}
</Link>
{location.pathname.includes("messages") ? (
<div
onClick={() => navigate(-1)}
className="w-8 h-8 bg-red-100 rounded-md flex items-center justify-center"
>
<img src={backIcon} className="h-4/5" />
</div> </div>
<Link to='/'> <img src={logoIcon} className="h-10" /> </Link> ) : (
{ <Link to="/shoppingCart">
location.pathname.includes('messages') ? ( <div className="flex flex-col">
<div onClick={() => navigate(-1)} className="w-8 h-8 bg-red-100 rounded-md flex items-center justify-center"> <div className="absolute left-8 top-3 bg-red52 w-4 h-4 rounded-full text-xs flex items-center justify-center text-white">
<img src={backIcon} className="h-4/5" /> {cart?.length}
</div> </div>
) : ( <svg
<Link to='/shoppingCart'> width="35"
<div className='flex flex-col'> height="35"
<div className='absolute left-8 top-3 bg-red52 w-4 h-4 rounded-full text-xs flex items-center justify-center text-white'>{cart?.length}</div> viewBox="0 0 24 24"
<svg width="35" height="35" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> fill="none"
<path d="M7.5 7.67001V6.70001C7.5 4.45001 9.31 2.24001 11.56 2.03001C14.24 1.77001 16.5 3.88001 16.5 6.51001V7.89001" stroke="#df1452" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" /> xmlns="http://www.w3.org/2000/svg"
<path d="M8.99999 22H15C19.02 22 19.74 20.39 19.95 18.43L20.7 12.43C20.97 9.99 20.27 8 16 8H7.99999C3.72999 8 3.02999 9.99 3.29999 12.43L4.04999 18.43C4.25999 20.39 4.97999 22 8.99999 22Z" stroke="#df1452" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" /> >
<path d="M15.4955 12H15.5045" stroke="#df1452" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" /> <path
<path d="M8.49451 12H8.50349" stroke="#df1452" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" /> d="M7.5 7.67001V6.70001C7.5 4.45001 9.31 2.24001 11.56 2.03001C14.24 1.77001 16.5 3.88001 16.5 6.51001V7.89001"
</svg> stroke="#df1452"
strokeWidth="1.5"
</div> strokeMiterlimit="10"
</Link> strokeLinecap="round"
) strokeLinejoin="round"
} />
</div> : <path
<> d="M8.99999 22H15C19.02 22 19.74 20.39 19.95 18.43L20.7 12.43C20.97 9.99 20.27 8 16 8H7.99999C3.72999 8 3.02999 9.99 3.29999 12.43L4.04999 18.43C4.25999 20.39 4.97999 22 8.99999 22Z"
{location.pathname.includes('adminpanel') ? <div></div> : stroke="#df1452"
<> strokeWidth="1.5"
<div className="header-profile h-full flex items-center"> strokeMiterlimit="10"
<img src={arrowIcon} className={`cursor-pointer ml-4 w-6 ${subMenu && 'transform rotate-180 duration-900 transition'}`} onClick={() => setSubMenu(!subMenu)} /> strokeLinecap="round"
<div className="header-profile-img-container w-10 h-10 bg-color2 ml-2 rounded-full overflow-hidden"> strokeLinejoin="round"
<img src={avatar1} alt="avatar1" className='w-full' /> />
<path
d="M15.4955 12H15.5045"
stroke="#df1452"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M8.49451 12H8.50349"
stroke="#df1452"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
</div>
</Link>
)}
</div>
) : (
<>
{location.pathname.includes("adminpanel") ? (
<div></div>
) : (
<>
<div className="header-profile h-full flex items-center">
<img
src={arrowIcon}
className={`cursor-pointer ml-4 w-6 ${
subMenu && "transform rotate-180 duration-900 transition"
}`}
onClick={() => setSubMenu(!subMenu)}
/>
<div className="header-profile-img-container w-10 h-10 bg-white ml-2 rounded-full overflow-hidden">
<img
src={
UserData.picFileId
? `https://new.andishmand.ir/api/v1/file/${UserData.picFileId}`
: profileIcon
}
alt="avatar1"
className="w-full"
/>
</div>
<div className="header-profile-text-container w-fit text-right ml-4">
<div className="header-profile-text-container-name text-sm">
{user.displayName
? user.displayName
: user?.firstName + " " + user?.lastName}
</div> </div>
<div className="header-profile-text-container w-fit text-right ml-4"> <div className="header-profile-text-container-role text-xs">
<div className="header-profile-text-container-name text-sm"> {grades[user.gradeIds]}
{user.displayName ? user.displayName : user?.firstName + ' ' + user?.lastName}
</div>
<div className="header-profile-text-container-role text-xs">
{grades[user.gradeIds]}
</div>
</div> </div>
</div> </div>
</div>
<div className="header-line w-px h-[90%] bg-color1 ml-6"></div> <div className="header-line w-px h-[90%] bg-color1 ml-6"></div>
<div className="header-date-and-time text-right ml-6"> <div className="header-date-and-time text-right ml-6">
<Clock />
<Clock /> <div className="header-date-and-date text-sm">
<div className="header-date-and-date text-sm"> <span className="header-date-and-date-text1 text-color3 ml-2">
<span className="header-date-and-date-text1 text-color3 ml-2"> {weekdayList[weekday]}
{weekdayList[weekday]} </span>
</span> <span
<span className="header-date-and-date-text2 text-color2 ml-2"
className="header-date-and-date-text2 text-color2 ml-2" style={{ fontFamily: "IRANSansXFaNum-Regular" }}
style={{ fontFamily: "IRANSansXFaNum-Regular" }} >
> {today}
{today} </span>
</span> <span className="header-date-and-date-text3 text-color4 text-xs">
<span className="header-date-and-date-text3 text-color4 text-xs"> {/* روز ملی صنعت نفت */}
{/* روز ملی صنعت نفت */} </span>
</span>
</div>
</div> </div>
<div className="header-line w-px h-[90%] bg-color1 ml-6"></div> </div>
</> <div className="header-line w-px h-[90%] bg-color1 ml-6"></div>
} </>
</> )}
} </>
)}
{/* <div className="header-search w-[51.5%] h-full ml-6 flex items-center"> {/* <div className="header-search w-[51.5%] h-full ml-6 flex items-center">
<img src={searchIcon} alt="searchIcon" className="header-search-icon" /> <img src={searchIcon} alt="searchIcon" className="header-search-icon" />
@ -148,34 +247,33 @@ const Header = ({
/> />
</div> */} </div> */}
</div> </div>
{ {isMobile && menuPopup && (
isMobile && menuPopup &&
<> <>
<div className='h-screen top-0 w-full z-30 backdrop-blur bg-black bg-opacity-20 fixed'></div> <div className="h-screen top-0 w-full z-30 backdrop-blur bg-black bg-opacity-20 fixed"></div>
<div className='w-full flex'> <div className="w-full flex">
<MobileSideMenu profilePic={avatar1} users={[ <MobileSideMenu
{ profilePic={avatar1}
name: user?.displayName, users={[
title: grades[user.gradeIds] {
}, name: user?.displayName,
{ title: grades[user.gradeIds],
name: 'کوروش زراندوز', },
title: 'پادشاه کوروش توپیا' {
}, name: "کوروش زراندوز",
title: "پادشاه کوروش توپیا",
]} },
]}
close={() => setMenuPopup(false)} close={() => setMenuPopup(false)}
/> />
<button className='flex items-center justify-center fixed z-40 top-10 left-3 text-xl font-bold text-red52 w-12 h-12 rounded-xl ' <button
className="flex items-center justify-center fixed z-40 top-10 left-3 text-xl font-bold text-red52 w-12 h-12 rounded-xl "
onClick={() => setMenuPopup(false)} onClick={() => setMenuPopup(false)}
> >
<img src={exitIcon} className="w-full" /> <img src={exitIcon} className="w-full" />
</button> </button>
</div> </div>
</> </>
} )}
</> </>
); );
} }

@ -10,6 +10,14 @@ import { Link, useLocation } from "react-router-dom";
import MinimalNav from "./minimalNav"; import MinimalNav from "./minimalNav";
import { user } from "../../redux/actions"; import { user } from "../../redux/actions";
import navIcon1 from "../../assets/img/vuesax-linear-element-equal.svg";
import navIcon1_w from "../../assets/img/vuesax-linear-element-equal2.svg";
import navIcon2 from "../../assets/img/vuesax-linear-myService.svg";
import navIcon2_w from "../../assets/img/vuesax-linear-myService2.svg";
import navIcon3 from "../../assets/img/vuesax-linear-sms1.svg";
import navIcon3_w from "../../assets/img/vuesax-linear-sms2.svg";
import navIcon4 from "../../assets/img/vuesax-linear-map.svg";
import navIcon4_w from "../../assets/img/vuesax-linear-map2.svg";
// defineLordIconElement(loadAnimation); // defineLordIconElement(loadAnimation);
// let oldNavItemId = 1; // let oldNavItemId = 1;
@ -165,12 +173,10 @@ useEffect(() => {
</div> </div>
) )
} else { } else {
return ( return type === "default" ? (
type === "default" ?
<div className="nav h-full w-[6.5%] fixed top-0 right-0 z-20 overflow-hidden bg-grayEC border-l border-l-color1"> <div className="nav h-full w-[6.5%] fixed top-0 right-0 z-20 overflow-hidden bg-grayEC border-l border-l-color1">
<div className="h-1/6 flex items-center"> <div className="h-1/6 flex items-center">
<img src={logo} alt="logo" className="logo w-full" /> <img src={logo} alt="logo" className="logo w-full" />
</div> </div>
<div <div
className="back-item-img w-full h-[12.5%] bg-red52 absolute right-0 z-20 transition-all duration-300" className="back-item-img w-full h-[12.5%] bg-red52 absolute right-0 z-20 transition-all duration-300"
@ -186,7 +192,7 @@ useEffect(() => {
{/* ------------ */} {/* ------------ */}
<div className="nav-menu-container w-full h-3/4 flex-col items-center absolute z-30 right-0"> <div className="nav-menu-container w-full h-3/4 flex-col items-center absolute z-30 right-0">
<Link {/* <Link
to="/" to="/"
className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer" className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer"
onClick={() => chaneNav(1)} onClick={() => chaneNav(1)}
@ -248,167 +254,93 @@ useEffect(() => {
className="nav-menu-container-item-title px-2" className="nav-menu-container-item-title px-2"
style={1 === navId ? { color: "#fff", fontSize: '0.7vw' } : { color: "#A5A8AB", fontSize: '0.7vw' }} style={1 === navId ? { color: "#fff", fontSize: '0.7vw' } : { color: "#A5A8AB", fontSize: '0.7vw' }}
> >
منوی اصلی پیشخوان
</div> </div>
</Link> </Link> */}
{/* ---------- */} {/* ---------- */}
<Link <Link
to="/services" to="/services"
className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer" className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer"
onClick={() => chaneNav(2)} onClick={() => chaneNav(1)}
> >
<div className="flex items-center justify-center" style={{width: '7vw'}}> <div
<svg className="flex items-center justify-center"
id="empty-wallet" style={{ width: "7vw" }}
xmlns="http://www.w3.org/2000/svg"
width="46.091"
height="46.091"
viewBox="0 0 46.091 46.091"
className="nav-menu-container-item-img w-2/6"
> >
<g id="Group" transform="translate(4.801 3.929)"> {navId !== 1 && (
<path <img src={navIcon1} alt="navIcon1" className="w-[30px]" />
id="Vector" )}
d="M29.844,11.139a3.857,3.857,0,0,0-1.152,3.13A4.1,4.1,0,0,0,32.84,17.86h3.649v2.285a7.237,7.237,0,0,1-7.221,7.221H7.221A7.237,7.237,0,0,1,0,20.146V7.221A7.237,7.237,0,0,1,7.221,0H29.268a7.237,7.237,0,0,1,7.221,7.221V9.986H32.61A3.827,3.827,0,0,0,29.844,11.139Z" {navId === 1 && (
transform="translate(0 10.955)" <img src={navIcon1_w} alt="navIcon1" className="w-[30px]" />
fill="none" )}
stroke={navId === 2 ? "#fff" : "#a5a8ab"} </div>
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
id="Vector-2"
data-name="Vector"
d="M0,19.9V11.128A5.469,5.469,0,0,1,3.534,6L18.782.239a3.649,3.649,0,0,1,4.936,3.418v7.3"
transform="translate(0 0)"
fill="none"
stroke={navId === 2 ? "#fff" : "#a5a8ab"}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
</g>
<path
id="Vector-3"
data-name="Vector"
d="M9.85,1.959V5.915A1.972,1.972,0,0,1,7.93,7.874H4.166A4.1,4.1,0,0,1,.018,4.283,3.857,3.857,0,0,1,1.17,1.152,3.827,3.827,0,0,1,3.935,0H7.93A1.972,1.972,0,0,1,9.85,1.959Z"
transform="translate(33.473 24.87)"
fill="none"
stroke={navId === 2 ? "#fff" : "#a5a8ab"}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
id="Vector-4"
data-name="Vector"
d="M0,0H13.443"
transform="translate(13.443 23.046)"
fill="none"
stroke={navId === 2 ? "#fff" : "#a5a8ab"}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
id="Vector-5"
data-name="Vector"
d="M0,0H46.091V46.091H0Z"
fill="none"
opacity="0"
/>
</svg>
</div>
<div <div
className="nav-menu-container-item-title px-2 " className="nav-menu-container-item-title px-2 "
style={2 === navId ? { color: "#fff", fontSize: '0.7vw' } : { color: "#A5A8AB", fontSize: '0.7vw' }} style={
1 === navId
? { color: "#fff", fontSize: "0.7vw" }
: { color: "#A5A8AB", fontSize: "0.7vw" }
}
> >
انتخاب خدمات انتخاب خدمات
</div> </div>
</Link> </Link>
{/* ---------- */} {/* ---------- */}
<Link <Link
to="/myServices" to="/myServices"
className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer" className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer"
onClick={() => chaneNav(3)} onClick={() => chaneNav(2)}
> >
<div className="w-20 flex items-center justify-center" style={{width: '7vw'}}> <div
<svg id="vuesax_linear_setting-2" data-name="vuesax/linear/setting-2" xmlns="http://www.w3.org/2000/svg" width="37.091" height="37.091" viewBox="0 0 46.091 46.091"> className="w-20 flex items-center justify-center"
<g id="setting-2"> style={{ width: "7vw" }}
<path id="Vector" d="M11.523,5.761A5.761,5.761,0,1,1,5.761,0,5.761,5.761,0,0,1,11.523,5.761Z" transform="translate(17.284 17.284)" fill="none" stroke={navId === 3 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> >
<path id="Vector-2" data-name="Vector" d="M0,19.817v-3.38a3.66,3.66,0,0,1,3.649-3.649c3.476,0,4.9-2.458,3.15-5.473A3.647,3.647,0,0,1,8.143,2.341L11.465.44a3.205,3.205,0,0,1,4.379,1.152l.211.365c1.728,3.015,4.571,3.015,6.318,0l.211-.365A3.205,3.205,0,0,1,26.963.44l3.322,1.9A3.647,3.647,0,0,1,31.63,7.315c-1.748,3.015-.326,5.473,3.15,5.473a3.66,3.66,0,0,1,3.649,3.649v3.38a3.66,3.66,0,0,1-3.649,3.649c-3.476,0-4.9,2.458-3.15,5.473a3.643,3.643,0,0,1-1.344,4.974l-3.322,1.9a3.205,3.205,0,0,1-4.379-1.152l-.211-.365c-1.728-3.015-4.571-3.015-6.318,0l-.211.365a3.205,3.205,0,0,1-4.379,1.152l-3.322-1.9A3.647,3.647,0,0,1,6.8,28.939c1.748-3.015.326-5.473-3.15-5.473A3.66,3.66,0,0,1,0,19.817Z" transform="translate(3.841 4.919)" fill="none" stroke={navId === 3 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> {navId !== 2 && (
<path id="Vector-3" data-name="Vector" d="M0,0H46.091V46.091H0Z" fill="none" opacity="0" /> <img src={navIcon2} alt="navIcon1" className="w-[30px]" />
</g> )}
</svg> {navId === 2 && (
<img src={navIcon2_w} alt="navIcon1" className="w-[30px]" />
)}
</div> </div>
<div <div
className="nav-menu-container-item-title text-sm" className="nav-menu-container-item-title text-sm"
style={3 === navId ? { color: "#fff", fontSize: '0.7vw' } : { color: "#A5A8AB", fontSize: '0.7vw' }} style={
2 === navId
? { color: "#fff", fontSize: "0.7vw" }
: { color: "#A5A8AB", fontSize: "0.7vw" }
}
> >
خدمات من خدمات من
</div> </div>
</Link> </Link>
{/* ---------- */} {/* ---------- */}
<Link <Link
to="/messages" to="/messages"
className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer" className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer"
onClick={() => chaneNav(4)} onClick={() => chaneNav(3)}
> >
<div className="flex items-center justify-center" style={{width: '7vw'}}> <div
<svg className="flex items-center justify-center"
id="vuesax_linear_sms" style={{ width: "7vw" }}
data-name="vuesax/linear/sms"
xmlns="http://www.w3.org/2000/svg"
width="46.091"
height="46.091"
viewBox="0 0 46.091 46.091"
className="nav-menu-container-item-img w-2/6"
> >
<g id="sms"> {navId !== 3 && (
<path <img src={navIcon3} alt="navIcon1" className="w-[30px]" />
id="Vector" )}
d="M28.807,32.648H9.6c-5.761,0-9.6-2.881-9.6-9.6V9.6C0,2.881,3.841,0,9.6,0h19.2c5.761,0,9.6,2.881,9.6,9.6V23.046C38.409,29.767,34.568,32.648,28.807,32.648Z" {navId === 3 && (
transform="translate(3.841 6.722)" <img src={navIcon3_w} alt="navIcon1" className="w-[30px]" />
fill="none" )}
stroke={navId === 4 ? "#fff" : "#a5a8ab"}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
id="Vector-2"
data-name="Vector"
d="M19.2,0,13.194,4.8a6.08,6.08,0,0,1-7.2,0L0,0"
transform="translate(13.443 17.284)"
fill="none"
stroke={navId === 4 ? "#fff" : "#a5a8ab"}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
id="Vector-3"
data-name="Vector"
d="M0,0H46.091V46.091H0Z"
fill="none"
opacity="0"
/>
</g>
</svg>
</div> </div>
<div <div
className="nav-menu-container-item-title text-sm" className="nav-menu-container-item-title text-sm"
style={4 === navId ? { color: "#fff", fontSize: '0.7vw' } : { color: "#A5A8AB", fontSize: '0.7vw' }} style={
3 === navId
? { color: "#fff", fontSize: "0.7vw" }
: { color: "#A5A8AB", fontSize: "0.7vw" }
}
> >
چت با اساتید چت با اساتید
</div> </div>
@ -418,32 +350,27 @@ useEffect(() => {
<Link <Link
to="/contacts" to="/contacts"
className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer" className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer"
onClick={() => chaneNav(5)} onClick={() => chaneNav(4)}
> >
<svg id="vuesax_linear_calculator" data-name="vuesax/linear/calculator" xmlns="http://www.w3.org/2000/svg" width="36.091" height="36.091" viewBox="0 0 46.091 46.091"> {navId !== 4 && (
<g id="calculator" transform="translate(0)"> <img src={navIcon4} alt="navIcon1" className="w-[30px]" />
<path id="Vector" d="M13.443,38.409h7.682c9.6,0,13.443-3.841,13.443-13.443V13.443C34.568,3.841,30.727,0,21.125,0H13.443C3.841,0,0,3.841,0,13.443V24.966C0,34.568,3.841,38.409,13.443,38.409Z" transform="translate(5.761 3.841)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> )}
<path id="Vector-2" data-name="Vector" d="M17.284,2.881V4.8A2.889,2.889,0,0,1,14.4,7.682H2.881A2.889,2.889,0,0,1,0,4.8V2.881A2.889,2.889,0,0,1,2.881,0H14.4A2.877,2.877,0,0,1,17.284,2.881Z" transform="translate(14.403 11.676)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> {navId === 4 && (
<path id="Vector-3" data-name="Vector" d="M.636.5H.658" transform="translate(14.989 26.387)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> <img src={navIcon4_w} alt="navIcon1" className="w-[30px]" />
<path id="Vector-4" data-name="Vector" d="M.636.5H.658" transform="translate(22.4 26.387)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> )}
<path id="Vector-5" data-name="Vector" d="M.636.5H.658" transform="translate(29.812 26.387)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" />
<path id="Vector-6" data-name="Vector" d="M.636.5H.658" transform="translate(14.989 33.108)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" />
<path id="Vector-7" data-name="Vector" d="M.636.5H.658" transform="translate(22.4 33.108)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" />
<path id="Vector-8" data-name="Vector" d="M.636.5H.658" transform="translate(29.812 33.108)" fill="none" stroke={navId === 5 ? "#fff" : "#a5a8ab"} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" />
<path id="Vector-9" data-name="Vector" d="M0,0H46.091V46.091H0Z" transform="translate(46.091 46.091) rotate(180)" fill="none" opacity="0" />
</g>
</svg>
<div <div
className="nav-menu-container-item-title text-sm" className="nav-menu-container-item-title text-sm"
style={5 === navId ? { color: "#fff" , fontSize: '0.7vw' } : { color: "#A5A8AB", fontSize: '0.7vw' }} style={
4 === navId
? { color: "#fff", fontSize: "0.7vw" }
: { color: "#A5A8AB", fontSize: "0.7vw" }
}
> >
پشتیبانی تماس با ما
</div> </div>
</Link> </Link>
<Link <Link
to="/" to="/"
className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer" className="nav-menu-container-item w-full h-1/6 flex flex-col items-center justify-center hover:bg-color2_5 cursor-pointer"
@ -503,20 +430,23 @@ useEffect(() => {
</svg> </svg>
<div <div
className="nav-menu-container-item-title text-sm translate-y-[-10%]" className="nav-menu-container-item-title text-sm translate-y-[-10%]"
style={6 === navId ? { color: "#fff", fontSize: '0.7vw' } : { color: "#A5A8AB", fontSize: '0.7vw' }} style={
6 === navId
? { color: "#fff", fontSize: "0.7vw" }
: { color: "#A5A8AB", fontSize: "0.7vw" }
}
> >
خروج خروج
</div> </div>
</Link> </Link>
</div> </div>
</div> : type === 'minimal' ? </div>
) : type === "minimal" ? (
//MINIMAL //MINIMAL
<MinimalNav logOut={logOut}/> <MinimalNav logOut={logOut} />
) : (
: <div></div> <div></div>
); );
} }
}; };

@ -41,9 +41,10 @@ export default function user(state = initialState, action) {
return { ...state, loading: false, status: data.profile, error: null }; return { ...state, loading: false, status: data.profile, error: null };
case "user/login": case "user/login":
case "user/otp/login": case "user/otp/login":
if (data.profile.username == null) { window.location.replace("/services");
window.location.replace('/register') // if (data.profile.username == null) {
} // window.location.replace("/services");
// }
return { return {
...state, ...state,
loading: false, loading: false,

@ -0,0 +1,224 @@
import { useState } from "react";
import { toast } from "react-toastify";
import logo from "../../assets/img/logo.png";
import backIcon from "../../assets/img/vuesax-linear-arrow-left.svg";
const SignUpBox = ({ setSignUp }) => {
const [step, setStep] = useState(0);
const [data, setData] = useState(null);
const submitHandler = () => {
let input = document.querySelectorAll("input");
let firstName = input[0].value;
let lastName = input[1].value;
let nationalId = input[2].value;
let cellphone = input[3].value;
if (firstName.length < 1) {
toast.error("لطفاً نام دانشاموز را وارد کنید");
} else if (lastName.length < 1) {
toast.error("لطفاً نام خانوادگی دانشاموز را وارد کنید");
} else if (nationalId.length < 10) {
toast.error("لطفاً کد ملی دانشاموز را وارد کنید");
} else if (cellphone.length < 11) {
toast.error("لطفاً شماره موبایل را به درستی وارد کنید");
} else {
setData({
firstName,
lastName,
nationalId,
cellphone,
});
setStep(1);
}
};
//backHandler---------------------
const backHandler = () => {
if (step === 1) {
setStep(0);
} else {
setSignUp(false);
}
};
//codeFocuseHandler--------------
const codeFocuseHandler=(index)=>{
let box = document.querySelectorAll(".codeInput");
if(index!==3){
box[index+1].focus()
}else{
if(box[0].value!=="" && box[1].value!=="" && box[2].value!=="" && box[3].value!==""){
let code = Number(
box[0].value + box[1].value + box[2].value + box[3].value
);
alert(code);
}
//api send
}
}
return (
<div className="SignUpBox w-full h-full flex flex-col items-center justify-center bg-white absolute top-0 left-0 rounded-lg ">
{/* ---------back-btn-------------- */}
<div
className="w-12 h-12 rounded-lg bg-[#F1F1F1] flex items-center justify-center absolute top-5 left-5 cursor-pointer"
onClick={backHandler}
>
<img src={backIcon} alt="backIcon" className="w-2/4" />
</div>
{/* ---logo----- */}
<img src={logo} alt="logo" className="w-1/3" />
{/* -----title--- */}
<div
className="w-[85%] text-[#521326] text-lg font-bold mt-5 text-right"
style={{ direction: "rtl" }}
>
{step === 0 ? "ثبت نام" : "تائیدیه ثبتنام"}
</div>
{/* -----form--- */}
{step === 0 && (
<div className="w-[85%]">
<Input label="نام دانشآموز" index={0} />
<Input label="نام خانوادگی دانشآموز" index={1} />
<Input label="کد ملی دانشآموز" index={2} />
<Input label="شماره موبایل" index={3} />
</div>
)}
{/* -------SendCodeText----------- */}
{step === 1 && <SendCodeAgain cellphone={data.cellphone} />}
{/* ----------code----------------- */}
{step === 1 && (
<div className="w-[85%] flex items-center justify-between mt-5" style={{direction:"ltr"}}>
<input
type="text"
name="codeInput"
className="codeInput w-[20%] aspect-square rounded-lg bg-[#FFF6F6] flex items-center justify-center outline-0 text-center text-[#DF1452] text-xl"
maxLength={1}
onChange={() => codeFocuseHandler(0)}
/>
<input
type="text"
name="codeInput"
className="codeInput w-[20%] aspect-square rounded-lg bg-[#FFF6F6] flex items-center justify-center outline-0 text-center text-[#DF1452] text-xl"
maxLength={1}
onChange={() => codeFocuseHandler(1)}
/>
<input
type="text"
name="codeInput"
className="codeInput w-[20%] aspect-square rounded-lg bg-[#FFF6F6] flex items-center justify-center outline-0 text-center text-[#DF1452] text-xl"
maxLength={1}
onChange={() => codeFocuseHandler(2)}
/>
<input
type="text"
name="codeInput"
className="codeInput w-[20%] aspect-square rounded-lg bg-[#FFF6F6] flex items-center justify-center outline-0 text-center text-[#DF1452] text-xl"
maxLength={1}
onChange={() => codeFocuseHandler(3)}
/>
</div>
)}
{/* -----btn--- */}
{step === 0 && (
<div
className="w-[85%] h-[50px] rounded-lg bg-[#DF1452] flex items-center justify-center text-lg text-white mt-5 cursor-pointer"
onClick={submitHandler}
>
ثبت اطلاعات و دریافت کد
</div>
)}
{step === 1 && (
<div
className="w-[85%] h-[50px] rounded-lg bg-[#DF1452] flex items-center justify-center text-lg text-white mt-5 cursor-pointer"
// onClick={submitHandler}
>
تایید
</div>
)}
</div>
);
};
export default SignUpBox;
//----------------------------------
const Input = ({ label,index }) => {
const onFocushandler=(i)=>{
let box = document.querySelectorAll(".Input");
let label = document.querySelectorAll(".Input-label");
let line = document.querySelectorAll(".line");
box[i].style.borderColor = "#DF1452";
label[i].style.color = "#DF1452";
label[i].style.fontSize = "12px";
if(window.innerWidth>1270){
label[i].style.transform = "translate(-15px,-25px)";
}else{
label[i].style.transform = "translate(-15px,-20px)";
}
line[i].style.display="block";
}
const onBlurHandler = (e,i) => {
if(e.target.value.length===0){
let box = document.querySelectorAll(".Input");
let label = document.querySelectorAll(".Input-label");
let line = document.querySelectorAll(".line");
box[i].style.borderColor = "#ECECEC";
label[i].style.color = "#8A8A8A";
label[i].style.fontSize = "16px";
label[i].style.transform = "translate(0px,0px)";
line[i].style.display = "none";
}
};
return (
<div className="Input w-full h-[40px] res1_2:h-[50px] relative border border-[#ECECEC] rounded-lg mt-5 flex items-center box-border">
<div
className="line h-[2px] absolute top-[-1.5px] rigth-[5%] bg-white right-[20px] hidden"
style={{ width: `${label.length * 6}px` }}
></div>
<input
type="text"
className="w-full h-full absolute top-0 right-0 outline-0 outline-transparent rounded-lg bg-transparent px-5 text-lg text-[#DF1452]"
onFocus={() => onFocushandler(index)}
onBlur={(e) => onBlurHandler(e, index)}
/>
<div className="Input-label text-[#8A8A8A] absolute right-[10px] pointer-events-none transition-all duration-300 ease-out">
{label}
</div>
</div>
);
};
//--------------------------------------
const SendCodeAgain = ({cellphone}) => {
const [min, setMin] = useState(2);
const [sec, setSec] = useState(30);
const [showBtn, setShowbtn] = useState(false);
setTimeout(() => {
if (sec === 0 && min === 0) {
setShowbtn(true);
}
if (sec === 0 && !showBtn) {
setSec(59);
setMin(min - 1);
} else {
setSec(sec - 1);
}
}, 1000);
return (
<>
{!showBtn && (
<div className="Code-container-send-code-again mt-6 text-sm w-[85%] text-right">
تا {min}:{sec} دیگر یک کد 4 رقمی به شماره {cellphone} ارسال خواهد شد. لطفا کد
را در کادر زیر وارد کنید
</div>
)}
{showBtn && (
<div className="Code-container-send-code-again mt-6 text-sm w-[85%] text-right cursor-pointer hover:text-red1">
ارسال مجدد کد
</div>
)}
</>
);
};

File diff suppressed because it is too large Load Diff

@ -13,40 +13,40 @@ import ScrollContainer from 'react-indiana-drag-scroll'
const Games = ({ gameId, chooseGame, selectedGames, isMobile, setTypes }) => { const Games = ({ gameId, chooseGame, selectedGames, isMobile, setTypes }) => {
const [data, setData] = useState([ const [data, setData] = useState([
{ {
id: 1, id: 5,
img: img4, img: img2,
title: 'کتاب های آموزشی', title: "پیش ثبت نام مدارس",
includedProductTypes: [1] includedProductTypes: [7],
},
{
id: 2,
img: img3,
title: 'بسته های آزمون',
includedProductTypes: [2, 3]
}, },
{ {
id: 3, id: 3,
img: img1, img: img1,
title: 'کلاس های آموزشی', title: "کلاس های آموزشی",
includedProductTypes: [4, 5] includedProductTypes: [4, 5],
}, },
{ {
id: 4, id: 4,
img: img5, img: img5,
title: 'دوره های مجازی', title: "دوره های مجازی",
includedProductTypes: [6] includedProductTypes: [6],
}, },
{ {
id: 5, id: 1,
img: img2, img: img4,
title: 'پیش ثبت نام مدارس', title: "کتاب های آموزشی",
includedProductTypes: [7] includedProductTypes: [1],
},
{
id: 2,
img: img3,
title: "بسته های آزمون",
includedProductTypes: [2, 3],
}, },
{ {
id: 6, id: 6,
img: img6, img: img6,
title: 'سایر خدمات', title: "سایر خدمات",
includedProductTypes: [8] includedProductTypes: [8],
}, },
]); ]);
return ( return (

File diff suppressed because it is too large Load Diff

@ -3,6 +3,7 @@ import { book, publicApi, userProduct } from "../../redux/actions";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import Product from "../../components/Product"; import Product from "../../components/Product";
import { CgDanger } from "react-icons/cg";
// import ScrollContainer from 'react-indiana-drag-scroll' // import ScrollContainer from 'react-indiana-drag-scroll'
@ -66,7 +67,7 @@ const Services = ({
classMinute: "", classMinute: "",
}); });
const [sharzhVal, setSharzhVal] = useState(''); const [sharzhVal, setSharzhVal] = useState('');
const [selectedProductTypes, setSelectedProductTypes] = useState([1]); const [selectedProductTypes, setSelectedProductTypes] = useState([7]);
// const onChange = (name, value) => { // const onChange = (name, value) => {
// setFilter({ ...filter, [name]: value }); // setFilter({ ...filter, [name]: value });
// }; // };
@ -112,9 +113,10 @@ const Services = ({
role: "", role: "",
}, },
]; ];
console.log("book---------)))))))))))))))))))))-------------------");
console.log(books);
const [selectedGames, setSelectedGames] = useState([]); const [selectedGames, setSelectedGames] = useState([]);
const [gameId, setGameId] = useState(1); const [gameId, setGameId] = useState(5);
const chooseGame = (id) => { const chooseGame = (id) => {
setGameId(id); setGameId(id);
console.log(selectedProductTypes) console.log(selectedProductTypes)
@ -124,166 +126,142 @@ const Services = ({
return ( return (
<div <div
className="flex items-start justify-between" className="flex items-start justify-between"
style={{ width: "93.5%", direction: "rtl", height: '100vh' }} style={{ width: "93.5%", direction: "rtl", height: "100vh" }}
> >
{popup ? ( {popup ? (
<ServicePopUp <ServicePopUp
content={popUpContent} content={popUpContent}
closeOnClick={() => setPopUp(false)} closeOnClick={() => setPopUp(false)}
sendPrice={val => setPopUpContent({...popUpContent, price: popUpContent.price + val})} sendPrice={(val) =>
setPopUpContent({
...popUpContent,
price: popUpContent.price + val,
})
}
/> />
) : null} ) : null}
<div <div
className="w-3/4 flex flex-col justify-center " className="w-[76.5%] h-[100vh] flex flex-col justify-center pt-[3.5%]"
style={{ paddingTop:'5.5%', height: '100vh' }} // style={{ paddingTop:'5.5%', height: '100vh' }}
> >
<div <div
className="h-48 w-full border-b border-red82OP my-4 px-10" className="h-48 w-full border-b border-red82OP my-4 px-6"
style={{ direction: "ltr" }} style={{ direction: "ltr" }}
> >
{/* {
services.map((item, index) => (
<div
className="flex flex-col justify-center items-center transition-all duration-200 m-4 rounded-xl border-2 border-red82OP hover:cursor-pointer hover:bg-pinkF5"
style={{ minWidth: '175px', height: '175px' }}
onClick={() => setChecked(prevState => [...prevState, checked[index] = !checked[index]])}
>
{
checked[index] ? <div className="flex w-full px-4 " style={{ direction: 'ltr' }}>
<div className="w-6 h-6 text-white text-sm rounded-full flex justify-center items-center bg-red52">
<svg width="37" height="37" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.75 12L10.58 14.83L16.25 9.17004" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
</svg>
</div>
</div> : <div className="h-6"></div>
}
<img src={item.image} className=" h-20 mb-4" />
<h2 className="w-full text-md text-gray-400 font-bold">{item.title}</h2>
</div>
))
} */}
<Games <Games
selectedGames={selectedGames} selectedGames={selectedGames}
gameId={gameId} gameId={gameId}
chooseGame={chooseGame} chooseGame={chooseGame}
setTypes={val => setSelectedProductTypes(val)} setTypes={(val) => setSelectedProductTypes(val)}
/> />
</div> </div>
{/* filters */} {/* filters */}
{gameId != 6 && <div className="flex mx-10 my-4 justify-start"> {gameId != 6 && (
<div className="flex items-center "> <div className="flex mx-6 justify-start">
<svg <div className="flex items-center ">
xmlns="http://www.w3.org/2000/svg" <svg
width="40" xmlns="http://www.w3.org/2000/svg"
height="40" width="40"
viewBox="0 0 14.378 14.378" height="40"
> viewBox="0 0 14.378 14.378"
<g
id="vuesax_linear_filter-tick"
data-name="vuesax/linear/filter-tick"
transform="translate(-620 -700)"
> >
<g id="filter-tick" transform="translate(620 700)"> <g
<path id="vuesax_linear_filter-tick"
id="Vector" data-name="vuesax/linear/filter-tick"
d="M5.691,2.846a2.8,2.8,0,0,1-.407,1.468A2.836,2.836,0,0,1,2.846,5.691,2.768,2.768,0,0,1,1.312,5.23a2.685,2.685,0,0,1-.9-.917A2.807,2.807,0,0,1,0,2.846,2.848,2.848,0,0,1,2.846,0a2.648,2.648,0,0,1,.623.072A2.84,2.84,0,0,1,5.691,2.846Z" transform="translate(-620 -700)"
transform="translate(7.267 5.991)" >
fill="none" <g id="filter-tick" transform="translate(620 700)">
stroke="#696969" <path
strokeLinecap="round" id="Vector"
strokeLinejoin="round" d="M5.691,2.846a2.8,2.8,0,0,1-.407,1.468A2.836,2.836,0,0,1,2.846,5.691,2.768,2.768,0,0,1,1.312,5.23a2.685,2.685,0,0,1-.9-.917A2.807,2.807,0,0,1,0,2.846,2.848,2.848,0,0,1,2.846,0a2.648,2.648,0,0,1,.623.072A2.84,2.84,0,0,1,5.691,2.846Z"
strokeWidth="0.6" transform="translate(7.267 5.991)"
/> fill="none"
<path stroke="#696969"
id="Vector-2" strokeLinecap="round"
data-name="Vector" strokeLinejoin="round"
d="M0,.7l.7.7L2.217,0" strokeWidth="0.6"
transform="translate(9.004 8.136)" />
fill="none"
stroke="#696969"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="0.6"
/>
<path
id="Vector-3"
data-name="Vector"
d="M0,0H14.378V14.378H0Z"
transform="translate(14.378 14.378) rotate(180)"
fill="none"
opacity="0"
/>
<g id="Group" transform="translate(1.983 1.198)">
<path <path
id="Vector-4" id="Vector-2"
data-name="Vector" data-name="Vector"
d="M10.412,1.21V2.54a2.292,2.292,0,0,1-.605,1.4l-1.054.929a2.648,2.648,0,0,0-.623-.072A2.848,2.848,0,0,0,5.284,7.638,2.807,2.807,0,0,0,5.7,9.106a2.685,2.685,0,0,0,.9.917v.2a1.336,1.336,0,0,1-.545,1.03l-.845.545a1.233,1.233,0,0,1-1.875-1.03V7.567A2.342,2.342,0,0,0,2.846,6.3l-2.3-2.42A2.041,2.041,0,0,1,0,2.666V1.27A1.229,1.229,0,0,1,1.21,0H9.2A1.215,1.215,0,0,1,10.412,1.21Z" d="M0,.7l.7.7L2.217,0"
transform="translate(9.004 8.136)"
fill="none" fill="none"
stroke="#696969" stroke="#696969"
strokeLinecap="round" strokeLinecap="round"
strokeLinejoin="round" strokeLinejoin="round"
strokeWidth="0.6" strokeWidth="0.6"
/> />
</g> <path
</g> id="Vector-3"
</g> data-name="Vector"
</svg> d="M0,0H14.378V14.378H0Z"
</div> transform="translate(14.378 14.378) rotate(180)"
<div className="flex items-center mx-6 pl-6 border-l-2 border-gray-300">
{
filterCheck.map((filter) => (
<div
key={`FILTER_${filter.id}`}
className={`flex w-32 border-2 p-2 px-4 mx-2 justify-center items-center rounded-md cursor-pointer
hover:border-red52 hover:text-red52 hover:bg-pinkF5
${selectedFilters.includes(filter.id)
? "border-red52 text-red52 bg-pinkF5"
: "border-gray200 text-gray-400"
}`}
onClick={(prevState) =>{
if(selectedFilters.includes(filter.id)){
setSelectedFilters(selectedFilters.filter(itm => itm !== filter.id))
}else{
setSelectedFilters([...selectedFilters, filter.id])
}
}}
>
<h3>{filter.title}</h3>
{selectedFilters.includes(filter.id) && (
<div className="flex w-full" style={{ direction: "ltr" }}>
<div className="w-4 h-4 text-white text-sm rounded-full flex justify-center items-center bg-red52">
<svg
width="37"
height="37"
viewBox="0 0 24 24"
fill="none" fill="none"
xmlns="http://www.w3.org/2000/svg" opacity="0"
> />
<g id="Group" transform="translate(1.983 1.198)">
<path <path
d="M7.75 12L10.58 14.83L16.25 9.17004" id="Vector-4"
stroke="#fff" data-name="Vector"
strokeWidth="1.5" d="M10.412,1.21V2.54a2.292,2.292,0,0,1-.605,1.4l-1.054.929a2.648,2.648,0,0,0-.623-.072A2.848,2.848,0,0,0,5.284,7.638,2.807,2.807,0,0,0,5.7,9.106a2.685,2.685,0,0,0,.9.917v.2a1.336,1.336,0,0,1-.545,1.03l-.845.545a1.233,1.233,0,0,1-1.875-1.03V7.567A2.342,2.342,0,0,0,2.846,6.3l-2.3-2.42A2.041,2.041,0,0,1,0,2.666V1.27A1.229,1.229,0,0,1,1.21,0H9.2A1.215,1.215,0,0,1,10.412,1.21Z"
fill="none"
stroke="#696969"
strokeLinecap="round" strokeLinecap="round"
strokeLinejoin="round" strokeLinejoin="round"
strokeWidth="0.6"
/> />
</svg> </g>
</div> </g>
</div> </g>
</svg>
)}
</div> </div>
)) <div className="flex items-center mx-6 pl-6 border-l-2 border-gray-300">
} {filterCheck.map((filter) => (
{/* <div <div
key={`FILTER_${filter.id}`}
className={`flex w-32 border-2 p-2 px-4 mx-2 justify-center items-center rounded-md cursor-pointer
hover:border-red52 hover:text-red52 hover:bg-pinkF5
${
selectedFilters.includes(filter.id)
? "border-red52 text-red52 bg-pinkF5"
: "border-gray200 text-gray-400"
}`}
onClick={(prevState) => {
if (selectedFilters.includes(filter.id)) {
setSelectedFilters(
selectedFilters.filter((itm) => itm !== filter.id)
);
} else {
setSelectedFilters([...selectedFilters, filter.id]);
}
}}
>
<h3>{filter.title}</h3>
{selectedFilters.includes(filter.id) && (
<div className="flex w-full" style={{ direction: "ltr" }}>
<div className="w-4 h-4 text-white text-sm rounded-full flex justify-center items-center bg-red52">
<svg
width="37"
height="37"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7.75 12L10.58 14.83L16.25 9.17004"
stroke="#fff"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
</div>
</div>
)}
</div>
))}
{/* <div
className={`flex w-32 border-2 p-2 mx-2 px-4 justify-center items-center rounded-md cursor-pointer className={`flex w-32 border-2 p-2 mx-2 px-4 justify-center items-center rounded-md cursor-pointer
hover:border-red52 hover:text-red52 hover:bg-pinkF5 hover:border-red52 hover:text-red52 hover:bg-pinkF5
${filterCheck == 'Physical' ${filterCheck == 'Physical'
@ -319,144 +297,160 @@ const Services = ({
)} )}
</div> */} </div> */}
</div> </div>
<div className="flex items-center mx-4 pl-6"> <div className="flex items-center mx-4 pl-6">
<select className="bg-white border-2 border-solid border-gray-300 w-72 p-3 rounded-lg text-gray-400 outline-red52"> <select className="bg-white border-2 border-solid border-gray-300 w-72 p-3 rounded-lg text-gray-400 outline-red52">
{services.map((item, index) => ( {services.map((item, index) => (
<option key={`Grade__${index}`}>{item.title}</option> <option key={`Grade__${index}`}>{item.title}</option>
))} ))}
</select> </select>
</div>
</div> </div>
</div>} )}
<div <div className="flex w-full overflow-x-hidden overflow-scroll flex-wrap h-full gap-x-[5%] px-6">
className={`flex {books
} w-full justify-center overflow-x-hidden overflow-scroll flex-wrap h-full `} ?.filter((itm) => selectedProductTypes.includes(itm.productType))
> .map((product, index) => (
{ books?.filter(itm => selectedProductTypes.includes(itm.productType)).map((product, index) => ( <div
<div // to={"/class/" + product?.id}
// to={"/class/" + product?.id} className="w-[30%]"
key={`PRODUCT__${gameId}__${index}`}
key={`PRODUCT__${gameId}__${index}`} style={gameId===5?{width:"100%"}:null}
>
{/* {console.log(product)} */}
> {(selectedProductTypes.includes(4) ||
{/* {console.log(product)} */} selectedProductTypes.includes(7)) && (
<Product <Product
key={index} key={index}
productsType={filter.productsType} productsType={filter.productsType}
product={product} product={product}
index={Number(index)} index={Number(index)}
productName={`${product?.name}`} productName={`${product?.name}`}
productCat={`پایه ${grades[product?.gradeId]}`} productCat={`پایه ${grades[product?.gradeId]}`}
productPrice={separate(product?.price)} productPrice={separate(product?.price)}
// productImg={"https://dnvn.ir/api/v1/file/" + product?.fileIds} // productImg={"https://dnvn.ir/api/v1/file/" + product?.fileIds}
numberOfRegards={160} numberOfRegards={160}
productHolderBorder="" productHolderBorder=""
productHolderHoverBorder="shadow-md" productHolderHoverBorder="shadow-md"
teacher={product.vodTeacher} teacher={product.vodTeacher}
catId={gameId} catId={gameId}
onClick={() => { onClick={() => {
setPopUpContent({ setPopUpContent({
id: gameId, id: gameId,
title: product?.name, title: product?.name,
video: "", video: "",
teacher: product?.vodTeacher, teacher: product?.vodTeacher,
description: description:
"در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت", "در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت",
price: gameId == 2 ? 0 : product?.price, price: gameId == 2 ? 0 : product?.price,
classHour: 21, classHour: 21,
classMinute: 56, classMinute: 56,
image: 'https://narafella.ir/wp-content/uploads/2021/08/books-min.jpg', image:
examCont: [ "https://narafella.ir/wp-content/uploads/2021/08/books-min.jpg",
{ examCont: [
title: 'بخش اول آزمون ' + product.name, {
date: '۱۴۰۰/۱۲/۱۳', title: "بخش اول آزمون " + product.name,
time: '۱۴:۴۶', date: "۱۴۰۰/۱۲/۱۳",
numberOfQ: '۱۸', time: "۱۴:۴۶",
price: 10000 numberOfQ: "۱۸",
}, price: 10000,
{ },
title: 'بخش دوم آزمون ' + product.name, {
date: '۱۴۰۰/۱۲/۱۴', title: "بخش دوم آزمون " + product.name,
time: '۱۴:۴۶', date: "۱۴۰۰/۱۲/۱۴",
numberOfQ: '۱۸', time: "۱۴:۴۶",
price: 10000 numberOfQ: "۱۸",
}, price: 10000,
{ },
title: 'بخش سوم آزمون ' + product.name, {
date: '۱۴۰۰/۱۲/۱۵', title: "بخش سوم آزمون " + product.name,
time: '۱۴:۴۶', date: "۱۴۰۰/۱۲/۱۵",
numberOfQ: '۳۲', time: "۱۴:۴۶",
price: 250000 numberOfQ: "۳۲",
}, price: 250000,
] },
}); ],
if (gameId !== 5) { });
setPopUp(true) if (gameId !== 5) {
} setPopUp(true);
console.log(gameId) }
}} console.log(gameId);
btnOnClick={() => { }}
btnOnClick={() => {
if(selectedProductTypes.includes(7)){ if (selectedProductTypes.includes(7)) {
pushSchoolToCart({ pushSchoolToCart({
productId: product?.id, productId: product?.id,
count: 1, count: 1,
}) });
} } else {
else{ pushToCart({
pushToCart({ productId: product?.id,
productId: product?.id,
count: 1,
count: 1, });
}); }
} // console.log(gameId)
// console.log(gameId) setTimeout(() => setPopUp(false), 0);
setTimeout(() => setPopUp(false), 0) // console.log(popup)
// console.log(popup) // console.log(product.id)
// console.log(product.id) }}
} />
} )}
/> </div>
))}
{(!selectedProductTypes.includes(4) &&
!selectedProductTypes.includes(7) && gameId !== 6) && (
<div className="w-full h-28 flex flex-col items-center justify-center mx-auto rounded">
<CgDanger className="text-4xl" />
<div className="text-xl mt-4" style={{ direction: "rtl" }}>
این بخش هنوز فعال نشده است.
</div>
</div> </div>
))} )}
{ {gameId == 6 && (
gameId == 6 && <div className="w-4/5 mx-auto h-48 flex justify-between text-right items-center border-2 rounded-xl border-red52 ">
<div className="w-4/5 px-8 h-48 flex justify-between text-right items-center border-2 rounded-xl border-red52 " >
<div className="w-1/5 mx-1"> <div className="w-1/5 mx-1">
<h1 className="text-red26 font-bold">افزایش مبلغ دلخواه</h1> <h1 className="text-red26 font-bold">افزایش مبلغ دلخواه</h1>
<p className="text-red26 text-sm">لطفا مبلغ دلخواه خود را در کادر روبرو وارد کنید</p> <p className="text-red26 text-sm">
لطفا مبلغ دلخواه خود را در کادر روبرو وارد کنید
</p>
</div> </div>
<div className="flex mx-1"> <div className="flex mx-1">
<input <input
placeholder="12,000,000" placeholder="12,000,000"
className="border border-red52 rounded-lg h-12 w-36 text-center rounded-l-none border-l-0 px-4 outline-none" className="border border-red52 rounded-lg h-12 w-36 text-center rounded-l-none border-l-0 px-4 outline-none"
value={(separate(sharzhVal))} value={separate(sharzhVal)}
onChange={e => setSharzhVal(e.target.value)} onChange={(e) => setSharzhVal(e.target.value)}
/><p className="border flex justify-center items-center border-red52 rounded-lg h-12 w-12 text-center rounded-r-none border-r-0 px-4">ریال</p> />
<p className="border flex justify-center items-center border-red52 rounded-lg h-12 w-12 text-center rounded-r-none border-r-0 px-4">
ریال
</p>
</div> </div>
<div className="flex mx-1"> <div className="flex mx-1">
<p className="border flex justify-center items-center border-red52 rounded-lg h-12 w-12 text-center rounded-l-none border-l-0 px-6 pl-2 ">بابت</p> <p className="border flex justify-center items-center border-red52 rounded-lg h-12 w-12 text-center rounded-l-none border-l-0 px-6 pl-2 ">
بابت
</p>
<input <input
placeholder="شارژ حساب" placeholder="شارژ حساب"
className="border border-red52 rounded-lg h-12 w-60 text-right rounded-r-none border-r-0 px-4 outline-none" className="border border-red52 rounded-lg h-12 w-60 text-right rounded-r-none border-r-0 px-4 outline-none"
/> />
</div> </div>
<button className="cursor-pointer text-red26 border border-red52 rounded-lg bg-red82OP font-bold text-sm px-6 h-12 mx-2">افزودن به اعتبار</button> <button className="cursor-pointer text-red26 border border-red52 rounded-lg bg-red82OP font-bold text-sm px-6 h-12 mx-2">
افزودن به اعتبار
</button>
</div> </div>
} )}
</div> </div>
</div> </div>
{!isMobile && <div className="w-1/4 left-0" style={{ height: "100vh" }}> {/* --------------left-part------------------------------------- */}
<ShoppingCart /> {!isMobile && (
</div>} <div className="w-[23.5%] left-0" style={{ height: "100vh" }}>
<ShoppingCart />
</div>
)}
</div> </div>
); );
} }
@ -464,17 +458,16 @@ const Services = ({
else { else {
return ( return (
<div className="flex flex-col items-center mt-16 mb-40 rtl"> <div className="flex flex-col items-center mt-16 mb-40 rtl">
<Games
<Games selectedGames={selectedGames}
selectedGames={selectedGames} gameId={gameId}
gameId={gameId} chooseGame={chooseGame}
chooseGame={chooseGame} setTypes={(val) => setSelectedProductTypes(val)}
setTypes={val => setSelectedProductTypes(val)} />
/>
<div className="w-11/12 border-b border-gray-200"></div> <div className="w-11/12 border-b border-gray-200"></div>
{ {gameId !== 6 && (
gameId !== 6 && <div className="flex items-center mx-4 my-4"> <div className="flex items-center mx-4 my-4">
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
width="40" width="40"
@ -531,23 +524,25 @@ const Services = ({
</g> </g>
</g> </g>
</svg> </svg>
{ {filterCheck.map((filter) => (
filterCheck.map((filter) => (
<div <div
key={`FILTER_${filter.id}`} key={`FILTER_${filter.id}`}
className={`flex w-32 border-2 p-2 px-4 mx-2 justify-center items-center rounded-md cursor-pointer className={`flex w-32 border-2 p-2 px-4 mx-2 justify-center items-center rounded-md cursor-pointer
hover:border-red52 hover:text-red52 hover:bg-pinkF5 hover:border-red52 hover:text-red52 hover:bg-pinkF5
${selectedFilters.includes(filter.id) ${
? "border-red52 text-red52 bg-pinkF5" selectedFilters.includes(filter.id)
: "border-gray200 text-gray-400" ? "border-red52 text-red52 bg-pinkF5"
}`} : "border-gray200 text-gray-400"
onClick={(prevState) =>{ }`}
if(selectedFilters.includes(filter.id)){ onClick={(prevState) => {
setSelectedFilters(selectedFilters.filter(itm => itm !== filter.id)) if (selectedFilters.includes(filter.id)) {
}else{ setSelectedFilters(
setSelectedFilters([...selectedFilters, filter.id]) selectedFilters.filter((itm) => itm !== filter.id)
} );
}} } else {
setSelectedFilters([...selectedFilters, filter.id]);
}
}}
> >
<h3>{filter.title}</h3> <h3>{filter.title}</h3>
{selectedFilters.includes(filter.id) && ( {selectedFilters.includes(filter.id) && (
@ -570,143 +565,140 @@ const Services = ({
</svg> </svg>
</div> </div>
</div> </div>
)} )}
</div> </div>
)) ))}
}
</div> </div>
} )}
<div className="w-11/12 border-b border-gray-200"></div> <div className="w-11/12 border-b-4 border-gray-200"></div>
<div <div className={`flex items-center w-full justify-center flex-col`}>
className={`flex items-center w-full justify-center flex-col `} {books
> ?.filter((itm) => selectedProductTypes.includes(itm.productType))
{ books?.filter(itm => selectedProductTypes.includes(itm.productType)).map((product, index) => ( .map((product, index) => (
<div <div
// to={"/class/" + product?.id} className="bg-black"
key={`PRODUCT__${gameId}__${index}`} key={`PRODUCT__${gameId}__${index}`}
> >
{/* {console.log(product)} */} {selectedProductTypes.includes(4) && (
<Product <Product
key={index} key={index}
productsType={filter.productsType} productsType={filter.productsType}
product={product} product={product}
index={Number(index)} index={Number(index)}
productName={`${product?.name}`} productName={`${product?.name}`}
productCat={`پایه ${grades[product?.gradeId]}`} productCat={`پایه ${grades[product?.gradeId]}`}
productPrice={separate(product?.price)} productPrice={separate(product?.price)}
// productImg={"https://dnvn.ir/api/v1/file/" + product?.fileIds} // productImg={"https://dnvn.ir/api/v1/file/" + product?.fileIds}
numberOfRegards={160} numberOfRegards={160}
productHolderBorder="" productHolderBorder=""
productHolderHoverBorder="shadow-md" productHolderHoverBorder="shadow-md"
teacher={product.vodTeacher} teacher={product.vodTeacher}
catId={gameId} catId={gameId}
onClick={() => { onClick={() => {
setPopUpContent({ setPopUpContent({
id: gameId, id: gameId,
title: product?.name, title: product?.name,
video: "", video: "",
teacher: product?.vodTeacher, teacher: product?.vodTeacher,
description: description:
"در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت", "در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت",
price: gameId == 2 ? 0 : product?.price, price: gameId == 2 ? 0 : product?.price,
classHour: 21, classHour: 21,
classMinute: 56, classMinute: 56,
image: 'https://narafella.ir/wp-content/uploads/2021/08/books-min.jpg', image:
examCont: [ "https://narafella.ir/wp-content/uploads/2021/08/books-min.jpg",
{ examCont: [
title: 'بخش اول آزمون ' + product.name, {
date: '۱۴۰۰/۱۲/۱۳', title: "بخش اول آزمون " + product.name,
time: '۱۴:۴۶', date: "۱۴۰۰/۱۲/۱۳",
numberOfQ: '۱۸', time: "۱۴:۴۶",
price: 10000 numberOfQ: "۱۸",
}, price: 10000,
{ },
title: 'بخش دوم آزمون ' + product.name, {
date: '۱۴۰۰/۱۲/۱۴', title: "بخش دوم آزمون " + product.name,
time: '۱۴:۴۶', date: "۱۴۰۰/۱۲/۱۴",
numberOfQ: '۱۸', time: "۱۴:۴۶",
price: 10000 numberOfQ: "۱۸",
}, price: 10000,
{ },
title: 'بخش سوم آزمون ' + product.name, {
date: '۱۴۰۰/۱۲/۱۵', title: "بخش سوم آزمون " + product.name,
time: '۱۴:۴۶', date: "۱۴۰۰/۱۲/۱۵",
numberOfQ: '۳۲', time: "۱۴:۴۶",
price: 250000 numberOfQ: "۳۲",
}, price: 250000,
] },
}); ],
if (gameId !== 5) {
setPopUp(true)
}
console.log(gameId)
}}
btnOnClick={() => {
if(selectedProductTypes.includes(7)){
pushSchoolToCart({
productId: product?.id,
count: 1,
})
}
else{
pushToCart({
productId: product?.id,
count: 1,
}); });
} if (gameId !== 5) {
// console.log(gameId) setPopUp(true);
setTimeout(() => setPopUp(false), 0) }
// console.log(popup) console.log(gameId);
// console.log(product.id) }}
} btnOnClick={() => {
} if (selectedProductTypes.includes(7)) {
/> pushSchoolToCart({
productId: product?.id,
count: 1,
});
} else {
pushToCart({
productId: product?.id,
count: 1,
});
}
// console.log(gameId)
setTimeout(() => setPopUp(false), 0);
// console.log(popup)
// console.log(product.id)
}}
/>
)}
</div> </div>
))} ))}
{ {gameId == 6 && (
gameId == 6 && <div className="w-full p-8 py-10 flex flex-col justify-between items-center ">
<div className="w-full p-8 py-10 flex flex-col justify-between items-center " >
<div className="w-full text-right mb-4"> <div className="w-full text-right mb-4">
<h1 className="text-red26 font-bold">افزایش مبلغ دلخواه</h1> <h1 className="text-red26 font-bold">افزایش مبلغ دلخواه</h1>
<p className="text-red26 text-sm">لطفا مبلغ دلخواه خود را در کادر روبرو وارد کنید</p> <p className="text-red26 text-sm">
لطفا مبلغ دلخواه خود را در کادر روبرو وارد کنید
</p>
</div> </div>
<div className="flex w-full mb-4"> <div className="flex w-full mb-4">
<input <input
placeholder="12,000,000" placeholder="12,000,000"
className="border border-red5B rounded-lg h-14 w-3/4 text-center rounded-l-none border-l-0 px-4 outline-none" className="border border-red5B rounded-lg h-14 w-3/4 text-center rounded-l-none border-l-0 px-4 outline-none"
value={separate(sharzhVal)}
value={(separate(sharzhVal))} onChange={(e) => setSharzhVal(e.target.value)}
onChange={e => setSharzhVal(e.target.value)} />
/><p className="border flex justify-center items-center border-red5B rounded-lg h-14 w-1/4 text-center rounded-r-none border-r-0 px-4">ریال</p> <p className="border flex justify-center items-center border-red5B rounded-lg h-14 w-1/4 text-center rounded-r-none border-r-0 px-4">
ریال
</p>
</div> </div>
<div className="flex w-full mb-4"> <div className="flex w-full mb-4">
<p className="border flex justify-center items-center border-red52 rounded-lg h-14 w-1/5 text-center rounded-l-none border-l-0 px-10">بابت</p> <p className="border flex justify-center items-center border-red52 rounded-lg h-14 w-1/5 text-center rounded-l-none border-l-0 px-10">
بابت
</p>
<input <input
placeholder="شارژ حساب" placeholder="شارژ حساب"
className="border border-red52 rounded-lg h-14 w-4/5 text-center rounded-r-none border-r-0 px-4 outline-none" className="border border-red52 rounded-lg h-14 w-4/5 text-center rounded-r-none border-r-0 px-4 outline-none"
/> />
</div> </div>
<button className="cursor-pointer text-blue52 border border-blueDF w-full rounded-lg font-bold text-sm px-6 h-14" <button
style={{ background: 'rgba(211, 246, 255, 0.44)' }}> className="cursor-pointer text-blue52 border border-blueDF w-full rounded-lg font-bold text-sm px-6 h-14"
style={{ background: "rgba(211, 246, 255, 0.44)" }}
>
افزودن به سبد خرید افزودن به سبد خرید
</button> </button>
</div> </div>
} )}
</div> </div>
</div> </div>
) );
} }
}; };

@ -57,6 +57,7 @@ module.exports = {
}, },
screens: { screens: {
res1: "1410px", res1: "1410px",
res1_2:"1270px",
res2: "1230px", res2: "1230px",
}, },
}, },

16172
yarn.lock

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save