From e38efeaf6f8fb3e3c3d2e1807af79236db9f22ed Mon Sep 17 00:00:00 2001
From: Alireza khaji <alireza.khaji11@gmail.com>
Date: Mon, 13 Jun 2022 16:57:43 +0430
Subject: [PATCH] some  api setting

---
 src/App.js                                |   2 +-
 src/assets/img/Group 1862.svg             |   9 +
 src/components/Checkbox/index.js          |   2 +-
 src/components/Product/index.js           |  76 ++++++--
 src/components/header/Header.js           |   4 -
 src/components/nav/Nav.js                 |   1 -
 src/redux/actions/exam.js                 |  10 +
 src/redux/actions/index.js                |   1 +
 src/redux/reducers/exam.js                |   4 -
 src/redux/reducers/exam2.js               |  18 ++
 src/redux/reducers/index.js               |   1 +
 src/view/Exam/EnterExam/desktop/index.css |   6 +-
 src/view/Exam/EnterExam/desktop/index.js  | 222 +++++++++++++---------
 src/view/services/Budget.js               |  42 ++++
 src/view/services/index.js                |  54 +++++-
 src/view/services/service/index.js        |  79 ++++++--
 16 files changed, 384 insertions(+), 147 deletions(-)
 create mode 100644 src/assets/img/Group 1862.svg
 create mode 100644 src/redux/actions/exam.js
 create mode 100644 src/redux/reducers/exam2.js
 create mode 100644 src/view/services/Budget.js

diff --git a/src/App.js b/src/App.js
index af7185d..05491ab 100644
--- a/src/App.js
+++ b/src/App.js
@@ -763,7 +763,7 @@ function App() {
                   <Route path="/contacts" element={<ContactUs />} />
                   <Route
                     exact
-                    path="/azmoon_list/enter_exam/:id"
+                    path="/enter_exam/:id"
                     element={<ENTER_EXAM />}
                   />
                   <Route
diff --git a/src/assets/img/Group 1862.svg b/src/assets/img/Group 1862.svg
new file mode 100644
index 0000000..8ea289f
--- /dev/null
+++ b/src/assets/img/Group 1862.svg	
@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="43" height="43" viewBox="0 0 43 43">
+  <g id="Group_1862" data-name="Group 1862" transform="translate(-1418 -250)">
+    <circle id="Ellipse_108" data-name="Ellipse 108" cx="21.5" cy="21.5" r="21.5" transform="translate(1418 250)" fill="#df1452"/>
+    <g id="Group_1861" data-name="Group 1861" transform="translate(-7 12)">
+      <path id="Vector" d="M0,12.683,12.683,0" transform="translate(1440.078 253.159)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+      <path id="Vector-2" data-name="Vector" d="M12.683,12.683,0,0" transform="translate(1440.078 253.159)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    </g>
+  </g>
+</svg>
diff --git a/src/components/Checkbox/index.js b/src/components/Checkbox/index.js
index 7ca8ec8..8e25be3 100644
--- a/src/components/Checkbox/index.js
+++ b/src/components/Checkbox/index.js
@@ -18,7 +18,7 @@ export default function Checkbox(props) {
       </svg>
 
       <div className="checkbox-container">
-        <input className="checkbox-input" name={props.name} id={"ch"+props.name} type="checkbox"  onClick={props.onclick} onChange={props.onChange}/>
+        <input defaultChecked={props.defaultChecked} className="checkbox-input" name={props.name} id={"ch"+props.name} type="checkbox"  onClick={props.onclick} onChange={props.onChange}/>
         <label className="checkbox" htmlFor={"ch"+props.name}>
           <span>
             <svg width="12px" height="10px">
diff --git a/src/components/Product/index.js b/src/components/Product/index.js
index 267d4f5..bccfeed 100644
--- a/src/components/Product/index.js
+++ b/src/components/Product/index.js
@@ -44,6 +44,8 @@ const ProductDesign = ({
   onClick,
   product,
   userInfo,
+  setShowBudget,
+  setBudgetFileId,
 }) => {
   const [isHovering, setIsHovering] = useState(false);
   // alert(catId);
@@ -83,6 +85,12 @@ const ProductDesign = ({
     },
   ];
 
+  //budgetHandler-------------
+  const budgetHandler = (fileId) => {
+    setShowBudget(true);
+    setBudgetFileId(fileId);
+  };
+
   //completeProfule-----------
   const completeProfule = (id) => {
     localStorage.setItem("termId", id);
@@ -376,39 +384,50 @@ const ProductDesign = ({
   if (catId == 2) {
     return (
       <div
-        className={`flex  cursor-pointer flex-col pt-4 text-right rounded-xl justify-start w-full m-4 border border-red82OP ${
+        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 && "375px", direction: "rtl" }}
+        style={{ width: !isMobile && "100%", direction: "rtl" }}
       >
         <div className="border-b border-red82OP pb-2 px-4" onClick={onClick}>
-          <h1 className="text-red52 text-lg font-bold">آزمون {productName}</h1>
-          <p className="text-red26 text-sm my-2">
-            در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط
-            در این قسمت قرار می‌گیرد
-          </p>
+          <h1 className="text-red52 text-lg font-bold">{productName}</h1>
+          <p className="text-red26 text-sm my-2">{product?.description}</p>
         </div>
 
         <div
           className="flex border-b border-red82OP text-center"
-          onClick={onClick}
+          // onClick={onClick}
         >
           <div className="w-1/2 border-l border-red82OP py-2 ">
-            <h1 className="font-bold text-red26">نوع آزمون : آنلاین</h1>
+            <h1 className="font-bold text-red26">
+              نوع آزمون : {product?.productType === 2 ? "حضوری" : "آنلاین"}
+            </h1>
           </div>
-          <div className="w-1/2  py-2 " onClick={onClick}>
-            <h1 className="font-bold text-red26">بودجه بندی آزمون</h1>
+          <div className="w-1/2  py-2 ">
+            <h1
+              className="font-bold text-red26 cursor-pointer"
+              onClick={() => budgetHandler(product?.exam?.budgetFileId)}
+            >
+              بودجه بندی آزمون
+            </h1>
           </div>
         </div>
         <div
           className="flex border-b border-red82OP text-center text-xs"
-          onClick={onClick}
+          // onClick={onClick}
         >
           <div
             className="w-1/2 border-l border-red82OP py-2 "
-            onClick={onClick}
+            // onClick={onClick}
           >
-            <h1 className="font-bold text-red26">تاریخ برگزاری : 1400/02/13</h1>
+            <h1 className="font-bold text-red26">
+              تاریخ برگزاری :{" "}
+              {product?.exam?.startDate
+                ? moment(product?.exam?.startDate, "YYYY/MM/DD")
+                    .locale("fa")
+                    .format("YYYY/MM/DD")
+                : "نامشخص"}
+            </h1>
           </div>
           <div className="w-1/2  py-2 " onClick={onClick}>
             <h1 className="font-bold text-red26">تعداد آزمون : 18</h1>
@@ -419,11 +438,32 @@ const ProductDesign = ({
           <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
+          <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]"
+                onClick={() => {
+                  completeProfule(product?.termId);
+                }}
+              >
+                تکمیل اطلاعات کاربری و افزودن به سبد خرید
+              </Link>
+            )}
+            {rulesAccepted && (
+              <div
+                className={`bg-pinkF5 text-red26 w-36 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>
+              >
+                <button 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>
diff --git a/src/components/header/Header.js b/src/components/header/Header.js
index b05f778..fde0468 100644
--- a/src/components/header/Header.js
+++ b/src/components/header/Header.js
@@ -22,12 +22,8 @@ const Header = ({
   user
 }) => {
   let today = moment().locale("fa").format("YYYY/M/D");
-  console.log("today:");
-  console.log(today);
   let weekday = new Date().getDay();
   let weekdayList = ["یکشنبه", "دوشنبه", "سه‌شنبه", "چهارشنبه", 'پنج‌شنبه', 'جمعه', "شنبه"];
-  // console.log("weekday:");
-  // console.log(weekday);
   const [menuPopup, setMenuPopup] = useState(false);
   const [subMenu, setSubMenu] = useState(false);
   const location = useLocation();
diff --git a/src/components/nav/Nav.js b/src/components/nav/Nav.js
index d5eaee5..f455325 100644
--- a/src/components/nav/Nav.js
+++ b/src/components/nav/Nav.js
@@ -188,7 +188,6 @@ const Nav = ({ logOut, isMobile, isLogin, logout }) => {
   const chaneNav = (id) => {
     setNavId(id);
     let top = 100 / 6 + ((((id - 1) * 100) / 6) * 3) / 4;
-    console.log(top);
     document.querySelector(".back-item-img").style.top = `${top}%`;
   };
   if (isMobile) {
diff --git a/src/redux/actions/exam.js b/src/redux/actions/exam.js
new file mode 100644
index 0000000..8e90ec5
--- /dev/null
+++ b/src/redux/actions/exam.js
@@ -0,0 +1,10 @@
+
+import proxy from "../proxy";
+const exam = {
+  info:
+    (data = {}) =>
+    async (dispatch) =>
+      await proxy.get("exam/info", data, { dispatch }),
+};
+
+export default exam;
\ No newline at end of file
diff --git a/src/redux/actions/index.js b/src/redux/actions/index.js
index c20ce14..0950b45 100644
--- a/src/redux/actions/index.js
+++ b/src/redux/actions/index.js
@@ -13,6 +13,7 @@ export {default as scrollAction} from "./scroll";
 export {default as qr} from "./qr";
 export { default as userTransaction } from "./userTransaction";
 export { default as term } from "./term";
+export { default as exam } from "./exam";
 
 
 
diff --git a/src/redux/reducers/exam.js b/src/redux/reducers/exam.js
index 37cd15c..0cd6c2a 100644
--- a/src/redux/reducers/exam.js
+++ b/src/redux/reducers/exam.js
@@ -196,10 +196,6 @@ const initialState = {
 export const numOfinitQs = initialState.questionBank.length;
 
 export default function addExamReduser(state = initialState, { type, payload }) {
-    console.log(state.courses)
-
-
-
     switch (type) {
 
         case 'ADD_EXAM_GRADE_AND_GROUP':
diff --git a/src/redux/reducers/exam2.js b/src/redux/reducers/exam2.js
new file mode 100644
index 0000000..9512e53
--- /dev/null
+++ b/src/redux/reducers/exam2.js
@@ -0,0 +1,18 @@
+
+
+import { toast } from "react-toastify";
+
+const initialState = {
+  loading: false,
+  error: null,
+  info:null
+};
+export default function exam2(state = initialState, action) {
+  let { type, data } = action;
+  switch (type) {
+    case "exam/info":
+      return { ...state, loading: false, info: data, error: null };
+    default:
+      return state;
+  }
+}
\ No newline at end of file
diff --git a/src/redux/reducers/index.js b/src/redux/reducers/index.js
index f37336a..58f1dc1 100644
--- a/src/redux/reducers/index.js
+++ b/src/redux/reducers/index.js
@@ -13,3 +13,4 @@ export {default as qr} from "./qr";
 export {default as addExamReduser} from "./exam";
 export { default as userTransaction } from "./userTransaction";
 export { default as term } from "./term";
+export { default as exam2 } from "./exam2";
diff --git a/src/view/Exam/EnterExam/desktop/index.css b/src/view/Exam/EnterExam/desktop/index.css
index c1b2974..f2c492c 100644
--- a/src/view/Exam/EnterExam/desktop/index.css
+++ b/src/view/Exam/EnterExam/desktop/index.css
@@ -185,7 +185,7 @@
 
     .enter-exam-box{
       height: auto;
-      aspect-ratio: 0.7/1;
+      /* aspect-ratio: 0.7/1; */
       margin-top: 50px;
       padding: 25px;
       border: 0px solid #EBEBEB;
@@ -211,8 +211,8 @@
     .enter-exam-box{
       /* width: 466px; */
       /* height: 662px; */
-      height: 70vh;
-      aspect-ratio: 0.7/1;
+      /* height: 70vh;
+      aspect-ratio: 0.7/1; */
       margin-top: 110px;
       padding: 25px;
       border: 2px solid #EBEBEB;
diff --git a/src/view/Exam/EnterExam/desktop/index.js b/src/view/Exam/EnterExam/desktop/index.js
index fb3628b..a541e02 100644
--- a/src/view/Exam/EnterExam/desktop/index.js
+++ b/src/view/Exam/EnterExam/desktop/index.js
@@ -1,5 +1,5 @@
 import "./index.css";
-import { useSelector } from "react-redux";
+import { connect, useSelector } from "react-redux";
 import { useState } from "react";
 
 import img0 from "../../../../assets/azmoon-list/test.png";
@@ -17,150 +17,184 @@ import { Link } from "react-router-dom";
 import moment from "jalali-moment";
 import { useEffect } from "react";
 import { state } from "../../../../components/exam/Carousel/state";
+import { exam } from "../../../../redux/actions";
 
-
-const EnterExam = ({ ID }) => {
-//   const state = useSelector((state) => state.default);
+let gradeList = [
+  "اول",
+  "دوم",
+  "سوم",
+  "چهارم",
+  "پنجم",
+  "ششم",
+  "هفتم",
+  "هشتم",
+  "نهم",
+  "دهم",
+  "یازدهم",
+  "دوازدهم",
+];
+const EnterExam = ({ ID, getExamInfo, examInfo }) => {
+  //   const state = useSelector((state) => state.default);
+  console.log("Cheraaaaaaaaaaaaaa????????");
+  console.log(ID);
+  useEffect(() => {
+    getExamInfo({ id: ID });
+  }, []);
+  console.log(examInfo);
+  //------------------------------------------
   const [common_data] = useState(state);
-  console.log(common_data);
   let data;
   for (let i = 0; i < common_data.length; i++) {
     if (common_data[i].id === Number(ID)) {
       data = common_data[i];
     }
   }
-  console.log("cc:"+data);
+  console.log("cc:" + data);
   //--today date--and timer setting-----------------------------
-  let today = new Date();
-  let examDate = new Date(data.date)
-  console.log(today);
-  console.log(examDate);
-  let diff = (examDate-today)/1000;
-  let d = Math.floor(diff/86400);
-  console.log(d);
-  let h = Math.floor((diff-(86400*d))/3600);
-  console.log(h);
-  let m = Math.floor((diff-(86400*d)-(h*3600))/60);
-  console.log(m);
-  let s = Math.floor(diff-(86400*d)-(h*3600)-(m*60));
-  console.log(s);
-  const [timer,setTimer]=useState({
-    d,h,m,s
-  })
+  // let today = new Date();
+  // let examDate = new Date(data.date)
+  // let diff = (examDate-today)/1000;
+  // let d = Math.floor(diff/86400);
+  // let h = Math.floor((diff-(86400*d))/3600);
+  // let m = Math.floor((diff-(86400*d)-(h*3600))/60);
+  // let s = Math.floor(diff-(86400*d)-(h*3600)-(m*60));
+  // const [timer,setTimer]=useState({
+  //   d,h,m,s
+  // })
 
   useEffect(() => {
     // console.log(sec);
-    if (timer.s >= 0 && diff > 0) {
-      setTimeout(() => {
-        // console.log("okdkdokodkd");
-        setTimer({
-          d,
-          h,
-          m,
-          s:s-1
-        });
-        if (timer.s === 0) {
-          setTimer({
-            d,
-            h,
-            m:m-1,
-            s:59
-          });
-        }
-        if (timer.m === 0) {
-          setTimer({
-            d,
-            h:h-1,
-            m:59,
-            s:59
-          });
-        }
-        if (timer.h === 0) {
-          setTimer({
-            d:d-1,
-            h:23,
-            m:59,
-            s:59
-          });
-        }
-      }, 1000);
-    }
+    // if (timer.s >= 0 && diff > 0) {
+    //   setTimeout(() => {
+    //     // console.log("okdkdokodkd");
+    //     setTimer({
+    //       d,
+    //       h,
+    //       m,
+    //       s:s-1
+    //     });
+    //     if (timer.s === 0) {
+    //       setTimer({
+    //         d,
+    //         h,
+    //         m:m-1,
+    //         s:59
+    //       });
+    //     }
+    //     if (timer.m === 0) {
+    //       setTimer({
+    //         d,
+    //         h:h-1,
+    //         m:59,
+    //         s:59
+    //       });
+    //     }
+    //     if (timer.h === 0) {
+    //       setTimer({
+    //         d:d-1,
+    //         h:23,
+    //         m:59,
+    //         s:59
+    //       });
+    //     }
+    //   }, 1000);
+    // }
   });
   //-------------------------------------------
   moment.locale("en");
   return (
     <div className="enter-exam">
-      <div className="enter-exam-box">
+      <div
+        className="enter-exam-box"
+        style={window.innerWidth < 1000 ? { width: "95%" } : { width: "35%",height:"auto" }}
+      >
         <div className="eeb-title-box">
           <img className="eeb-title-box-img" src={img0} alt="title-box-img" />
-          <div className="eeb-title-box-title">به {data?.name}</div>
+          <div className="eeb-title-box-title">به {examInfo?.name}</div>
           <div className="eeb-title-box-subtitle">خوش آمدید</div>
         </div>
         <div className="eeb-name-box">
           <img className="eeb-name-box-icon" src={icon1} alt="name-icon" />
           <div className="eeb-name-box-label">نام آزمون:</div>
-          <div className="eeb-name-box-name">{data?.name.substr(6)}</div>
+          <div className="eeb-name-box-name">{examInfo?.name}</div>
         </div>
         <div className="eeb-level-box">
           <img className="eeb-level-box-icon" src={icon2} alt="name-icon" />
           <div className="eeb-level-box-label">پایه تحصیلی:</div>
-          <div className="eeb-level-box-level">{data?.level}</div>
+          <div className="eeb-level-box-level">
+            {gradeList[examInfo?.gradeId - 1]}
+          </div>
         </div>
         <div className="eeb-date-box">
           <img className="eeb-date-box-icon" src={icon3} alt="name-icon" />
           <div className="eeb-date-box-label">زمان آزمون:</div>
-          <div className="eeb-date-box-date">
-            {moment(data?.date, 'YYYY/MM/DD').format('jYYYY/jM/jD')}
-          </div>
-          <div className="eeb-date-box-time">ساعت 
-            {examDate.getHours()}:{examDate.getMinutes()}
+          {examInfo?.startDate && (
+            <div className="eeb-date-box-date">
+              از{" "}
+              {examInfo?.startDate &&
+                moment(examInfo?.startDate, "YYYY/MM/DD")
+                  .locale("fa")
+                  .format("YYYY/MM/DD")}{" "}
+              تا{" "}
+              {examInfo?.endDate &&
+                moment(examInfo?.endDate, "YYYY/MM/DD")
+                  .locale("fa")
+                  .format("YYYY/MM/DD")}
+            </div>
+          )}
+          {!examInfo?.startDate && (
+            <div className="eeb-date-box-date">نامشخص</div>
+          )}
+          {/* <div className="eeb-date-box-time">
+            ساعت
             
-          </div>
+          </div> */}
         </div>
-        <div className="eeb-negetive-point-and-question-type-box">
-          <div className="eeb-np-box">
+        <div
+          className="eeb-negetive-point-and-question-type-box"
+          style={{ display: "block" }}
+        >
+          <div className="eeb-np-box border-b border-[#F5F5F5]">
             <img className="eeb-np-box-icon" src={icon4} alt="name-icon" />
             <div className="eeb-np-box-label">نمره منفی:</div>
             <div className="eeb-np-box-have">
-              {data?.negattiveMode && "دارد"}
-              {!data?.negattiveMode && "ندارد"}
+              {examInfo?.negativePoint && "دارد"}
+              {!examInfo?.negativePoint && "ندارد"}
             </div>
           </div>
           <div className="eeb-qt-box">
             <img className="eeb-qt-box-icon" src={icon5} alt="name-icon" />
             <div className="eeb-qt-box-label">نوع سوالات:</div>
-            <div className="eeb-qt-box-type">{data?.types}</div>
+            <div className="eeb-qt-box-type">تستی</div>
           </div>
         </div>
         <div className="eeb-max-user-and-exam-type-box">
-          <div className="eeb-mu-box">
+          {/* <div className="eeb-mu-box">
             <img className="eeb-mu-box-icon" src={icon6} alt="name-icon" />
             <div className="eeb-mu-box-label">حدنصاب شرکت کنندگان: </div>
             <div className="eeb-mu-box-number">{data?.capacity} نفر</div>
-          </div>
+          </div> */}
           <div className="eeb-et-box">
             <img className="eeb-et-box-icon" src={icon7} alt="name-icon" />
             <div className="eeb-et-box-label">نوع شرکت در آزمون:</div>
             <div className="eeb-et-box-type">
-              {data?.type===1 && "انفرادی"}
-              {data?.type===2 && "گروهی"}
+              {data?.type === 1 && "انفرادی"}
+              {data?.type === 2 && "گروهی"}
             </div>
           </div>
         </div>
-        <div className="eeb-guide-box">
+        {/* <div className="eeb-guide-box">
           <img className="eeb-guide-box-icon" src={icon8} alt="name-icon" />
           <div className="eeb-guide-box-label">فایل راهنما:</div>
           <div className="eeb-guide-box-have">
             {data?.guideFileId && "دارد"}
-            {!data?.guideFileId && "ندارد"} -</div>
-          <Link
-            to={data?.guideFileId || "#"}
-            className="eeb-guide-box-link"
-          >
+            {!data?.guideFileId && "ندارد"} -
+          </div>
+          <Link to={data?.guideFileId || "#"} className="eeb-guide-box-link">
             دریافت فایل
           </Link>
-        </div>
-        <div className="eeb-created-box">
+        </div> */}
+        {/* <div className="eeb-created-box">
           <div className="eeb-created-box-img-container">
             <img
               className="eeb-created-box-icon"
@@ -170,14 +204,14 @@ const EnterExam = ({ ID }) => {
           </div>
           <div className="eeb-created-box-label">ایجاد شده توسط</div>
           <div className="eeb-created-box-file">موسسه فرهنگی مصباح نور</div>
-        </div>
-        {(new Date(data.date)<today) &&<Link
+        </div> */}
+        <Link
           to={`/dashboard/azmoon_list/exam/${data?.id}`}
           className="eeb-btn"
         >
           شروع آزمون
-        </Link>}
-        {(new Date(data.date)>today) && 
+        </Link>
+        {/* {(new Date(data.date)>today) && 
           <div className="eeb-timer">
             <div>{timer.d} روز و </div>
             <div>{timer.h} ساعت و </div>
@@ -185,10 +219,18 @@ const EnterExam = ({ ID }) => {
             <div>{timer.s} ثانیه </div>
             <div>تا شروع آزمون</div>
           </div>
-        }
+        } */}
       </div>
     </div>
   );
 };
 
-export default EnterExam;
+const mapStateToProps = (state) => ({
+  examInfo: state.exam2.info,
+});
+
+const mapDispatchToProps = {
+  getExamInfo: exam.info,
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(EnterExam);
diff --git a/src/view/services/Budget.js b/src/view/services/Budget.js
new file mode 100644
index 0000000..086c1ec
--- /dev/null
+++ b/src/view/services/Budget.js
@@ -0,0 +1,42 @@
+
+import closeBtn from "../../assets/img/Group 1862.svg";
+
+
+import React from 'react'
+
+const Budget = ({ setShowBudget, setBudgetFileId, budgetFileId }) => {
+  const closeHandler=()=>{
+    setShowBudget(false);
+    setBudgetFileId(false);
+  }
+  return (
+    <div
+      className="w-[93.5vw] h-[93.5vh] fixed top-[6.5%] left-0 flex justify-center  backdrop-blur bg-[#9999991A] overflow-y-auto z-[100]"
+      style={window.innerWidth < 1000 ? { width: "100%" } : null}
+    >
+      <img
+        src={closeBtn}
+        alt="closeBtn"
+        className="w-10 cursor-pointer absolute top-10 left-6"
+        onClick={closeHandler}
+        style={window.innerWidth < 1000 ? { top: "10px", left: "10px" } : null}
+      />
+      <div className="w-[70%] mt-16">
+        {budgetFileId && (
+          <img
+            src={`https://new.andishmand.ir/api/v1/file/${budgetFileId}`}
+            alt=""
+            className="w-full"
+          />
+        )}
+        {!budgetFileId && (
+          <div className="w-full text-xl text-cneter">
+            دیتایی برای نمایش وجود ندارد
+          </div>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default Budget
\ No newline at end of file
diff --git a/src/view/services/index.js b/src/view/services/index.js
index 68f9ecb..d21b5a8 100644
--- a/src/view/services/index.js
+++ b/src/view/services/index.js
@@ -24,6 +24,7 @@ import Games from "../dashboard2/Games";
 import "./index.css";
 import separate from "../../utils/separate";
 import { toast } from "react-toastify";
+import Budget from "./Budget";
 
 const Services = ({
   isMobile,
@@ -163,9 +164,7 @@ const Services = ({
   const [gameId, setGameId] = useState(5);
   const chooseGame = (id) => {
     setGameId(id);
-    console.log(selectedProductTypes);
   };
-  console.log(gameId);
 
   //productClickHandler------------------
   const productClickhandler = (product) => {
@@ -186,7 +185,6 @@ const Services = ({
     if (gameId !== 5) {
       setPopUp(true);
     }
-    console.log(gameId);
   };
 
   //AddToCartHandler--------------------
@@ -209,11 +207,13 @@ const Services = ({
 
   //-------------------------------------
   const [showPaymentBox, setShowPaymentBox] = useState(false);
+  const [showBudget,setShowBudget] = useState(false);
+  const [budgetFileId,setBudgetFileId] =useState(null);
   //-======================== Desktop ===========================================
   if (!isMobile) {
     return (
       <div
-        className="flex items-start justify-between"
+        className="flex items-start justify-between relative"
         style={{ width: "93.5%", direction: "rtl", height: "100vh" }}
       >
         {popup ? (
@@ -226,8 +226,17 @@ const Services = ({
                 price: popUpContent.price + val,
               })
             }
+            setShowBudget={setShowBudget}
+            setBudgetFileId={setBudgetFileId}
           />
         ) : null}
+        {showBudget && (
+          <Budget
+            setShowBudget={setShowBudget}
+            setBudgetFileId={setBudgetFileId}
+            budgetFileId={budgetFileId}
+          />
+        )}
         <div
           className="w-[76.5%] h-[100vh]  flex flex-col  justify-center pt-[3.5%]"
           // style={{  paddingTop:'5.5%', height: '100vh' }}
@@ -322,6 +331,8 @@ const Services = ({
                     >
                       {(selectedProductTypes.includes(4) ||
                         selectedProductTypes.includes(7) ||
+                        selectedProductTypes.includes(3) ||
+                        selectedProductTypes.includes(2) ||
                         selectedProductTypes.includes(1)) && (
                         <Product
                           key={index}
@@ -338,6 +349,8 @@ const Services = ({
                           teacher={product.vodTeacher}
                           catId={gameId}
                           userInfo={userInfo}
+                          setShowBudget={setShowBudget}
+                          setBudgetFileId={setBudgetFileId}
                           onClick={() => {
                             productClickhandler(product);
                           }}
@@ -352,7 +365,9 @@ const Services = ({
               ))}
             {!selectedProductTypes.includes(4) &&
               !selectedProductTypes.includes(7) &&
-              !selectedProductTypes.includes(1) && 
+              !selectedProductTypes.includes(2) &&
+              !selectedProductTypes.includes(3) &&
+              !selectedProductTypes.includes(1) &&
               gameId !== 6 && (
                 <div className="w-full h-28 flex flex-col items-center justify-center mx-auto rounded">
                   <CgDanger className="text-4xl" />
@@ -419,6 +434,27 @@ const Services = ({
   else {
     return (
       <div className="flex flex-col items-center mt-16 mb-40 rtl">
+        {popup ? (
+          <ServicePopUp
+            content={popUpContent}
+            closeOnClick={() => setPopUp(false)}
+            sendPrice={(val) =>
+              setPopUpContent({
+                ...popUpContent,
+                price: popUpContent.price + val,
+              })
+            }
+            setShowBudget={setShowBudget}
+            setBudgetFileId={setBudgetFileId}
+          />
+        ) : null}
+        {showBudget && (
+          <Budget
+            setShowBudget={setShowBudget}
+            setBudgetFileId={setBudgetFileId}
+            budgetFileId={budgetFileId}
+          />
+        )}
         <Games
           selectedGames={selectedGames}
           gameId={gameId}
@@ -485,6 +521,8 @@ const Services = ({
               <div className="w-[90%]" key={`PRODUCT__${gameId}__${index}`}>
                 {(selectedProductTypes.includes(4) ||
                   selectedProductTypes.includes(7) ||
+                  selectedProductTypes.includes(3) ||
+                  selectedProductTypes.includes(2) ||
                   selectedProductTypes.includes(1)) && (
                   <Product
                     key={index}
@@ -507,13 +545,17 @@ const Services = ({
                     btnOnClick={() => {
                       AddToCartHandler(product);
                     }}
+                    setShowBudget={setShowBudget}
+                    setBudgetFileId={setBudgetFileId}
                   />
                 )}
               </div>
             ))}
           {!selectedProductTypes.includes(4) &&
             !selectedProductTypes.includes(7) &&
-            !selectedProductTypes.includes(1) && 
+            !selectedProductTypes.includes(2) &&
+            !selectedProductTypes.includes(3) &&
+            !selectedProductTypes.includes(1) &&
             gameId !== 6 && (
               <div className="w-full h-28 flex flex-col items-center justify-center mx-auto rounded">
                 <CgDanger className="text-4xl" />
diff --git a/src/view/services/service/index.js b/src/view/services/service/index.js
index 4c0329d..2c73f24 100644
--- a/src/view/services/service/index.js
+++ b/src/view/services/service/index.js
@@ -1,3 +1,4 @@
+import moment from "jalali-moment";
 import React from "react";
 import Button from "../../../components/Button";
 import Checkbox from "../../../components/Checkbox";
@@ -7,17 +8,33 @@ const servicePopUp = ({
   closeOnClick,
   addToCartFunction,
   sendPrice,
+  setShowBudget,
+  setBudgetFileId,
 }) => {
+  console.log(")))))((((((((((");
+  console.log(content);
+
+  const budgetHandler = (fileId) => {
+    setBudgetFileId(fileId);
+    setShowBudget(true);
+  };
   return (
     <div
       className="flex justify-center w-full items-center fixed text-right z-30 backdrop-blur"
       style={{
         background: "rgba(0,0,0,0.1)",
         height: "calc(100vh - 6.5vh)",
-        top: "8.5vh",
+        top: "8vh",
       }}
     >
-      <div className="bg-white flex flex-col w-1/2 rounded-2xl py-6 px-10">
+      <div
+        className="bg-white flex flex-col w-1/2 rounded-2xl py-6 px-10"
+        style={
+          window.innerWidth < 1000
+            ? { width: "95%", marginInline: "auto", paddingInline: "10px" }
+            : null
+        }
+      >
         <div className="w-full">
           <div
             className="w-8 h-8 text-white text-sm rounded-full cursor-pointer flex justify-center items-center bg-red52 mb-2"
@@ -128,7 +145,7 @@ const servicePopUp = ({
                       {content.classHour} دقیقه
                     </div>
                   )}
-                  {(content?.product?.productType ===1) && (
+                  {content?.product?.productType === 1 && (
                     <div className="bg-gray-100 rounded w-full px-4 py-2 ml-2 text-red26">
                       {/* {content?.product.?} */}
                       رحلی کوچک
@@ -141,22 +158,33 @@ const servicePopUp = ({
           {content.id === 2 && (
             <div className="flex w-11/12 flex-col rounded-xl border border-red82OP">
               <h1 className="px-2 py-6 border-b border-red82OP bg-blueFF rounded-t-xl pr-10 text-blueE3 text-xl font-bold">
-                آزمون {content.title}
+                {content.title}
               </h1>
               <div
                 className="flex w-full border-b border-red82OP text-red26 text-sm font-bold"
                 style={{ direction: "rtl" }}
               >
                 <div className="w-1/4 flex justify-center py-4 border-l border-red82OP">
-                  نوع آزمون : آنلاین
+                  نوع آزمون :{" "}
+                  {content?.product?.exam?.productType === 2
+                    ? "حضوری"
+                    : "مجازی"}
                 </div>
                 <div className="w-1/4 flex justify-center py-4 border-l border-red82OP">
-                  تاریخ شروع : 1400/12/03
+                  تاریخ شروع :{" "}
+                  {moment(content?.product?.exam?.startDate, "YYYY/MM/DD")
+                    .locale("fa")
+                    .format("YYYY/MM/DD")}
                 </div>
                 <div className="w-1/4 flex justify-center py-4 border-l border-red82OP">
                   تعداد آزمون : ۱۸
                 </div>
-                <div className="w-1/4 flex items-center justify-center py-4 ">
+                <div
+                  className="w-1/4 flex items-center justify-center py-4 cursor-pointer"
+                  onClick={() =>
+                    budgetHandler(content?.product?.exam?.budgetFileId)
+                  }
+                >
                   {" "}
                   بودجه بندی آزمون{" "}
                 </div>
@@ -169,7 +197,7 @@ const servicePopUp = ({
                 به صورت معمول تمامی آزمون ها برای شما خریداری خواهند شد مگر
                 اینکه شما به صورت دلخواه یک یا چند آزمون را انتخاب نمایید
               </div>
-              {content.examCont?.map((item, index) => (
+              {content?.product?.exam?.childs?.map((item, index) => (
                 <div
                   className="flex w-full items-center justify-between border-b border-red82OP font-bold text-red26 text-xs py-3 px-6 "
                   style={{ direction: "rtl" }}
@@ -177,19 +205,32 @@ const servicePopUp = ({
                   <div className="flex items-center font-bold">
                     <Checkbox
                       name={`examPackage_${item.id}_${index}`}
-                      onclick={(e) =>
-                        e.target.checked
-                          ? sendPrice(item.price)
-                          : sendPrice(-item.price)
-                      }
+                      defaultChecked={true}
+                      // onclick={(e) =>
+                      //   e.target.checked
+                      //     ? sendPrice(item.price)
+                      //     : sendPrice(-item.price)
+                      // }
                     />
-                    <p>{item.title}</p>
+                    <p>{item?.name}</p>
                   </div>
-                  <p>تاریخ : {item.date}</p>
-                  <p>ساعت : {item.time}</p>
-                  <p>بودجه بندی !</p>
-                  <p>تعداد سوالات: {item.numberOfQ}</p>
-                  <p>{separate(item.price)} تومان</p>
+                  <p>
+                    تاریخ :{" "}
+                    {moment(item?.startDate, "YYYY/MM/DD")
+                      .locale("fa")
+                      .format("YYYY/MM/DD")}
+                  </p>
+                  {/* <p>ساعت : {item.time}</p> */}
+                  <p
+                  className="cursor-pointer"
+                    onClick={() =>
+                      budgetHandler(item?.budgetFileId)
+                    }
+                  >
+                    بودجه بندی !
+                  </p>
+                  <p>تعداد سوالات: {item?.questionCount}</p>
+                  <p>{separate(item?.price)} تومان</p>
                 </div>
               ))}
             </div>