From b47626f95047aa0e07535d29a86ec5134435faa5 Mon Sep 17 00:00:00 2001
From: Moaz Dawalibi <moaazaldwalibi@gmail.com>
Date: Wed, 25 Sep 2024 00:04:57 +0300
Subject: [PATCH] sale api

---
 src/Pages/ReSeller/Sales/Model/AddModel.tsx   |  9 +++-
 .../ReSeller/Sales/Model/LayoutModel.tsx      | 11 ++---
 .../ReSeller/Sales/Model/SalesModelForm.tsx   | 34 +++++++++++---
 .../ReSeller/Sales/Model/SubmitModelForm.tsx  | 29 +++++++++---
 .../Sales/Model/ValidationModelForm.tsx       | 44 +++++++++++++++----
 src/Pages/ReSeller/Sales/Model/formUtil.ts    | 11 ++++-
 src/Styles/Pages/sales.scss                   | 24 ++++++++++
 src/api/sales.ts                              |  7 +--
 src/translate/ar.json                         |  6 ++-
 9 files changed, 140 insertions(+), 35 deletions(-)

diff --git a/src/Pages/ReSeller/Sales/Model/AddModel.tsx b/src/Pages/ReSeller/Sales/Model/AddModel.tsx
index e210318..10eeea0 100644
--- a/src/Pages/ReSeller/Sales/Model/AddModel.tsx
+++ b/src/Pages/ReSeller/Sales/Model/AddModel.tsx
@@ -8,6 +8,7 @@ import SubmitModelForm from "./SubmitModelForm";
 
 import { useAddSales } from "../../../../api/sales";
 import LayoutModel from "./LayoutModel";
+import { useObjectToEdit } from "../../../../zustand/ObjectToEditState";
 
 const AddModel: React.FC = () => {
   const { mutate, status } = useAddSales();
@@ -29,7 +30,9 @@ const AddModel: React.FC = () => {
     [modal.Sure]:  <SubmitModelForm /> 
   }
   // const modelTitle = Forms.[modal.Number] ? "sale" : Forms.Package ? "adcs" : "Ascas";  
-  
+  const { objectToEdit,setObjectToEdit } = useObjectToEdit();
+console.log(objectToEdit);
+
   
   return (
     <>
@@ -45,7 +48,9 @@ const AddModel: React.FC = () => {
       >
         {/* {Forms["Number"]} */}
         <>
-        <SalesModelForm/>
+          <ValidationModelForm/>
+          <SalesModelForm/>
+          <SubmitModelForm/>
         </>
 
       </LayoutModel>
diff --git a/src/Pages/ReSeller/Sales/Model/LayoutModel.tsx b/src/Pages/ReSeller/Sales/Model/LayoutModel.tsx
index 1e05b87..cf8f36e 100644
--- a/src/Pages/ReSeller/Sales/Model/LayoutModel.tsx
+++ b/src/Pages/ReSeller/Sales/Model/LayoutModel.tsx
@@ -86,16 +86,13 @@ const LayoutModel = ({
         }, [isOpen]);
         
         return <Form className="w-100 reseller_modal_form">
-
-          <Divider />
           <main className="main_modal">
             {isLoading ? <SpinContainer /> : children}
           </main>
-
-        </Form>;
-      }}
-    </Formik>
-      </Modal>
+        </Form>
+        }}
+      </Formik>
+    </Modal>
     </>
   );
 };
diff --git a/src/Pages/ReSeller/Sales/Model/SalesModelForm.tsx b/src/Pages/ReSeller/Sales/Model/SalesModelForm.tsx
index 90b826d..828c055 100644
--- a/src/Pages/ReSeller/Sales/Model/SalesModelForm.tsx
+++ b/src/Pages/ReSeller/Sales/Model/SalesModelForm.tsx
@@ -14,7 +14,7 @@ const Form = ({status}:{status?:any}) => {
   const {values,setFieldValue} = useFormikContext<any>()
   console.log(values?.currentModalIndex);
   const { isOpen, setIsOpen } = useModalState((state) => state);
-  const { setObjectToEdit } = useObjectToEdit();
+  const { objectToEdit,setObjectToEdit } = useObjectToEdit();
   const {t} = useTranslation();
   const formik = useFormikContext();
   const handleNext = ()=>{
@@ -25,8 +25,17 @@ const Form = ({status}:{status?:any}) => {
     setObjectToEdit({});
   };
 
+console.log(objectToEdit);
+  const student_info = objectToEdit?.data?.data
+  const PackagesInfo = student_info?.packages.map((info:any) => ({
+    id: info?.id,
+    name: info.name + " " + `( ${info?.original_price} )`
+  }));
+
+console.log(PackagesInfo);
+
   return (
-    values?.currentModalIndex == 0 &&      
+    values?.currentModalIndex == 1 &&      
 
     <div className="w-100">
     <header className="modal_title">
@@ -36,8 +45,23 @@ const Form = ({status}:{status?:any}) => {
       <MdCancel onClick={handleCancel} />
     </header>
     <Divider />
-sac
-      {values?.currentModalIndex}
+      <div className="sales_info_modal">
+        <div className="info">
+          <img src="/Image/faker_user.png" alt="" />
+          <span>
+            <h5>{student_info?.first_name +" " + student_info?.last_name}</h5>
+            <h5>الصف: <p> {student_info?.grade_name}</p></h5>
+          </span>
+        </div>
+        <ValidationField
+          placeholder="choose"
+          label="package"
+          name="package_id"
+          type="Select"
+          option={PackagesInfo}
+        />
+      </div>
+      {/* {values?.currentModalIndex} */}
       <div className="buttons">
         <div className="back_button pointer" onClick={handleCancel}>
           {t("practical.cancel")}
@@ -47,7 +71,7 @@ sac
           disabled={status === QueryStatusEnum.LOADING || !formik.dirty}
           onClick={handleNext}
           >
-          {t(`practical.search`)}
+          {t(`practical.sale`)}
           {status === QueryStatusEnum.LOADING && (
             <span className="Spinier_Div">
               <Spin />
diff --git a/src/Pages/ReSeller/Sales/Model/SubmitModelForm.tsx b/src/Pages/ReSeller/Sales/Model/SubmitModelForm.tsx
index e037a5c..69b78e6 100644
--- a/src/Pages/ReSeller/Sales/Model/SubmitModelForm.tsx
+++ b/src/Pages/ReSeller/Sales/Model/SubmitModelForm.tsx
@@ -18,7 +18,9 @@ const Form = ({status}:{status?:any}) => {
   const {t} = useTranslation();
   const formik = useFormikContext();
   const handleNext = ()=>{
-    setFieldValue( "currentModalIndex" , values?.currentModalIndex + 1 )
+    setFieldValue( "currentModalIndex" , values?.currentModalIndex - 2 )
+    setIsOpen("");
+
   }
   const handleCancel = () => {
     setIsOpen("");
@@ -26,7 +28,7 @@ const Form = ({status}:{status?:any}) => {
   };
 
   return (
-    values?.currentModalIndex == 1 &&      
+    values?.currentModalIndex == 2 &&      
 
     <div className="w-100">
     <header className="modal_title">
@@ -36,18 +38,33 @@ const Form = ({status}:{status?:any}) => {
       <MdCancel onClick={handleCancel} />
     </header>
     <Divider />
-
-    {values?.currentModalIndex}
+      <div className="sales_info_modal">
+        <div className="info">
+          <img src="/Image/faker_user.png" alt="" />
+          <span>
+            <h5>أنس محمد ياسر القلعجي</h5>
+            <h5>الصف: <p> بكالوريا / علمي</p></h5>
+          </span>
+        </div>
+        <ValidationField
+          placeholder="choose"
+          label="package"
+          name="package"
+          type="Select"
+          option={[]}
+        />
+      </div>
+      {/* {values?.currentModalIndex} */}
       <div className="buttons">
         <div className="back_button pointer" onClick={handleCancel}>
           {t("practical.cancel")}
         </div>
         <button
           className="add_button"
-          disabled={status === QueryStatusEnum.LOADING || !formik.dirty}
+          disabled={status === QueryStatusEnum.LOADING}
           onClick={handleNext}
           >
-          {t(`practical.search`)}
+          {t(`practical.yes`)}
           {status === QueryStatusEnum.LOADING && (
             <span className="Spinier_Div">
               <Spin />
diff --git a/src/Pages/ReSeller/Sales/Model/ValidationModelForm.tsx b/src/Pages/ReSeller/Sales/Model/ValidationModelForm.tsx
index 1e5de1c..b1c7175 100644
--- a/src/Pages/ReSeller/Sales/Model/ValidationModelForm.tsx
+++ b/src/Pages/ReSeller/Sales/Model/ValidationModelForm.tsx
@@ -8,30 +8,59 @@ import { useTranslation } from "react-i18next";
 import { QueryStatusEnum } from "../../../../enums/QueryStatus";
 import { Divider, Spin } from "antd";
 import { MdCancel } from "react-icons/md";
+import { useEffect, useState } from "react";
+import { useGetStudentByPhone } from "../../../../api/sales";
 
-const Form = ({status}:{status?:any}) => {
-  
+const Form = () => {
   const {values,setFieldValue} = useFormikContext<any>()
-  console.log(values?.currentModalIndex);
+  const [triggerApi, setTriggerApi] = useState(false)
+  const  phoneNumber : number =  values?.phone_number 
   const { isOpen, setIsOpen } = useModalState((state) => state);
-  const { setObjectToEdit } = useObjectToEdit();
+  const { objectToEdit,setObjectToEdit } = useObjectToEdit();
   const {t} = useTranslation();
   const formik = useFormikContext();
+
+  const {data,isError,isSuccess,status} = useGetStudentByPhone({
+    phone_number:phoneNumber
+  },{
+    enabled: triggerApi
+  });
+
   const handleNext = ()=>{
-    setFieldValue( "currentModalIndex" , values?.currentModalIndex + 1 )
+    if(values?.phone_number && phoneNumber.toString().length === 10){
+      setTriggerApi(true)
+    }
   }
+  console.log(status);
+  console.log(isSuccess);
+
   const handleCancel = () => {
     setIsOpen("");
     setObjectToEdit({});
   };
 
+  useEffect(() => {
+    if(isSuccess == true){
+      setFieldValue( "currentModalIndex" , values?.currentModalIndex + 1 )
+      setObjectToEdit({data})
+      setTriggerApi(false)
+
+    }
+    else {
+      setTriggerApi(false)
+      
+    }
+    
+  }, [isSuccess])
+  
+
   return (
-    values?.currentModalIndex == 1 &&      
+    values?.currentModalIndex == 0 &&      
 
     <div className="w-100">
     <header className="modal_title">
       <span>
-        {t(`models.`)}{" "}
+        {t(`models.add_sales`)}{" "}
       </span>
       <MdCancel onClick={handleCancel} />
     </header>
@@ -46,7 +75,6 @@ const Form = ({status}:{status?:any}) => {
         />
           <Divider className="margin_auto"/>
       </Col>
-          {values?.currentModalIndex}
           <div className="buttons">
             <div className="back_button pointer" onClick={handleCancel}>
               {t("practical.cancel")}
diff --git a/src/Pages/ReSeller/Sales/Model/formUtil.ts b/src/Pages/ReSeller/Sales/Model/formUtil.ts
index 154cb77..23cec28 100644
--- a/src/Pages/ReSeller/Sales/Model/formUtil.ts
+++ b/src/Pages/ReSeller/Sales/Model/formUtil.ts
@@ -4,7 +4,8 @@ export const getInitialValues = (objectToEdit: any): any => {
   return {
     id: objectToEdit?.id ?? null,
     phone_number: objectToEdit?.phone_number ?? null,
-    currentModalIndex: 0
+    currentModalIndex: 0,
+    package_id:objectToEdit?.package_id ?? null
   };
 };
 
@@ -16,4 +17,10 @@ export const getValidationSchema = () => {
       .matches(/^\d{10}$/, "Phone number must be a valid 10-number number"),
     currentModalIndex: Yup.number().max(2)
   });
-};
\ No newline at end of file
+};
+
+export const getValidationSchemaForSale = () => {
+  return Yup.object().shape({
+    package_id: Yup.string().required("package_id is required")
+  });
+};
diff --git a/src/Styles/Pages/sales.scss b/src/Styles/Pages/sales.scss
index 7544b3f..513259e 100644
--- a/src/Styles/Pages/sales.scss
+++ b/src/Styles/Pages/sales.scss
@@ -3,4 +3,28 @@
     .modal_title{
         height: 5vh;
     }
+    .sales_info_modal{
+        margin-block: 30px 10px;
+        display: flex; flex-direction: column;
+        gap: 20px;
+    }
+    .info{
+        width: 100%;
+        display: flex;align-items: center;
+        gap: 10px;
+        img{
+            width: 60px;
+            border-radius: 50%;
+        }
+        span{
+            h5{
+                color: var(--value);
+                display: flex;align-items: center;
+                gap: 10px;
+                p{
+                    color: var(--primary);
+                }
+            }
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/api/sales.ts b/src/api/sales.ts
index c99c15d..d1559c5 100644
--- a/src/api/sales.ts
+++ b/src/api/sales.ts
@@ -11,6 +11,7 @@ const API = {
 
 const KEY = "sales";
 
-export const useGetAllSales = (params?: any, options?: any) =>
-  useGetQuery(KEY, API.GET, params, options);
-export const useAddSales = () => useAddMutation(KEY, API.ADD);
\ No newline at end of file
+export const useGetAllSales = (params?: any, options?: any) =>useGetQuery(KEY, API.GET, params, options);
+export const useAddSales = () => useAddMutation(KEY, API.ADD);
+export const useGetStudentByPhone = (params?: any, options?: any) => useGetQuery(KEY, API.GET_BY_PHONE, params, options);
+export const useGetSummery = () => useGetQuery(KEY, API.GET_SUMMERY);
\ No newline at end of file
diff --git a/src/translate/ar.json b/src/translate/ar.json
index ad55c2a..3c52173 100644
--- a/src/translate/ar.json
+++ b/src/translate/ar.json
@@ -309,7 +309,8 @@
     "account_activities":"أنشطة الحساب",
     "This will close your account. Your account will be interactive when you log in again":"سيؤدي هذا إلى إغلاق حسابك. سيكون حسابك تفاعليا عند تسجيل الدخول مرة أخرى",
     "Your account will be permanently deleted":"سيتم حذف حسابك نهائيا",
-    "search":"بحث"
+    "search":"بحث",
+    "sale":"بيع"
   },
   "Table": {
     "header": "",
@@ -525,7 +526,8 @@
     "contact_number1":"رقم الهاتف",
     "contact_number2":"رقم الهاتف الإضافي",
     "lat":"الطول",
-    "lng":"العرض"
+    "lng":"العرض",
+    "choose":"حدد"
   },
   "select": {
     "enums": {