<iman> update pengajuan tempo

1 files changed, 45 insertions, 11 deletions

diff --git a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
index 5ef5374e..bc7dcb69 100644
--- a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
+++ b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
@@ -1,14 +1,22 @@
 import React from 'react';
+import { useMemo, useState, useEffect, useRef } from 'react';
 import Stepper from './Stepper';
-import InformasiPerusahaan from './informasiPerusahaan'; // Make sure this component exists
-
+import InformasiPerusahaan from './informasiPerusahaan';
+import { Controller, useForm } from 'react-hook-form';
+import { usePengajuanTempoStore } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore';
+import { ChevronRightIcon } from '@heroicons/react/24/outline';
 const PengajuanTempo = () => {
   const [currentStep, setCurrentStep] = React.useState(0);
   const NUMBER_OF_STEPS = 6;
-
-  // Use the component directly in the array
+  const { form, errors, validate, updateForm } = usePengajuanTempoStore();
+  const [notValid, setNotValid] = useState(false);
+  const isFormValid = useMemo(() => Object.keys(errors).length === 0, [errors]);
+  const [buttonSubmitClick, setButtonSubmitClick] = useState(false);
   const stepDivs = [
-    <InformasiPerusahaan />, // Call the component correctly
+    <InformasiPerusahaan
+      chekValid={notValid}
+      buttonSubmitClick={buttonSubmitClick}
+    />,
     <div>Kontak Person</div>,
     <div>Pengiriman</div>,
     <div>Referensi</div>,
@@ -16,8 +24,22 @@ const PengajuanTempo = () => {
     <div>Konfirmasi</div>,
   ];
 
-  const goToNextStep = () =>
+  useEffect(() => {
+    validate();
+  }, []);
+
+  const goToNextStep = () => {
+    if (!isFormValid) {
+      setNotValid(true);
+      setButtonSubmitClick(!buttonSubmitClick);
+      console.log('form', form);
+      return;
+    } else {
+      setButtonSubmitClick(!buttonSubmitClick);
+      setNotValid(false);
+    }
     setCurrentStep((prev) => (prev === NUMBER_OF_STEPS - 1 ? prev : prev + 1));
+  };
 
   const goToPreviousStep = () =>
     setCurrentStep((prev) => (prev <= 0 ? prev : prev - 1));
@@ -42,21 +64,33 @@ const PengajuanTempo = () => {
         </div>
         <div>{stepDivs[currentStep]}</div>
         <section className='flex gap-10 mt-10'>
-          <button
+          {/* <button
             onClick={goToPreviousStep}
             className='bg-blue-600 text-white p-2 rounded-md'
             disabled={currentStep === 0} // Disable if on the first step
           >
             Previous step
-          </button>
-          <button
+          </button> */}
+          {/* <button
             onClick={goToNextStep}
             className='bg-blue-600 text-white p-2 rounded-md'
             disabled={currentStep === NUMBER_OF_STEPS - 1} // Disable if on the last step
-          >
+            >
             Next step
-          </button>
+            </button> */}
         </section>
+        <div className='flex flex-row justify-end items-center gap-4 mb-8'>
+          <span className='text-xs opacity-60'>
+            *Pastikan data yang anda masukan sudah benar dan sesuai
+          </span>
+          <button
+            onClick={goToNextStep}
+            disabled={currentStep === NUMBER_OF_STEPS - 1}
+            className='bg-red-600 border border-red-600 rounded-md text-sm text-white p-2 h-11 mb-1 content-center flex flex-row justify-center items-center'
+          >
+            Langkah Selanjutnya {<ChevronRightIcon className='w-5' />}
+          </button>
+        </div>
       </div>
     </>
   );