<iman> update merchant

1 files changed, 77 insertions, 175 deletions

diff --git a/src/lib/merchant/components/Konfirmasi.jsx b/src/lib/merchant/components/Konfirmasi.jsx
index 6372f156..45db7388 100644
--- a/src/lib/merchant/components/Konfirmasi.jsx
+++ b/src/lib/merchant/components/Konfirmasi.jsx
@@ -1,207 +1,109 @@
 import React, { useState, useEffect, useMemo, useRef } from 'react';
 import { Controller, set, useForm } from 'react-hook-form';
 import HookFormSelect from '@/core/components/elements/Select/HookFormSelect';
+// import ProgressBar from '@ramonak/react-progress-bar';
 import {
-  usePengajuanTempoStoreDokumen,
-  usePengajuanTempoStore,
-} from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore';
-import KontakPerusahaan from './KontakPerusahaan';
-import ProgressBar from '@ramonak/react-progress-bar';
-import { UseToastOptions } from '@chakra-ui/react';
+  Button,
+  Checkbox,
+  Spinner,
+  Tooltip,
+  UseToastOptions,
+} from '@chakra-ui/react';
 import odooApi from '~/libs/odooApi';
 import { toast } from 'react-hot-toast';
 import getFileBase64 from '@/core/utils/getFileBase64';
 import { CheckCircleIcon } from '@heroicons/react/24/outline';
 import InformasiPerusahaan from './InformasiPerusahaan';
-import Pengiriman from './Pengiriman';
-import KonfirmasiDokumen from './KonfirmasiDokumen';
+import InformasiVendor from './InformasiVendor';
+import SyaratDagang from './SyaratDagang';
+import Dokumen from './Dokumen';
 import useDevice from '@/core/hooks/useDevice';
 import { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/24/outline';
+import { useRouter } from 'next/router';
 const Konfirmasi = ({ chekValid, buttonSubmitClick }) => {
-  const { control, watch, setValue, getValues } = useForm();
+  const { control, watch, setValue, getValues, reset } = useForm();
   const { isDesktop, isMobile } = useDevice();
   const [isOpenInformasi, setIsOpenInformasi] = useState(true);
   const [isOpenKontak, setIsOpenKontak] = useState(false);
   const [isOpenPengiriman, setIsOpenPengiriman] = useState(false);
   const [isOpenKonfirmasi, setIsOpenKonfirmasi] = useState(false);
-  const [industries, setIndustries] = useState([]);
-  const {
-    formDokumen,
-    errorsDokumen,
-    validateDokumen,
-    updateFormDokumen,
-    getJumlahDokumenDiisi,
-  } = usePengajuanTempoStoreDokumen();
-  const { form, errors, validate, updateForm } = usePengajuanTempoStore();
-  const handleInputChange = async (event) => {
-    let fileBase64 = '';
-    const { name } = event.target;
-    const file = event.target.files?.[0];
-    // Allowed file extensions
-    const allowedExtensions = ['pdf', 'png', 'jpg', 'jpeg'];
-    let fileExtension = '';
-    if (file) {
-      fileExtension = file.name.split('.').pop()?.toLowerCase();
-
-      if (!fileExtension || !allowedExtensions.includes(fileExtension)) {
-        toast.error(
-          'Format file yang diijinkan adalah .pdf, .png, .jpg, atau .jpeg',
-          { duration: 4000 }
-        );
-
-        event.target.value = '';
-        return;
-      }
-      if (file.size > 2000000) {
-        toast.error('Maksimal ukuran file adalah 2MB', { duration: 4000 });
-
-        event.target.value = '';
-        return;
-      }
-
-      fileBase64 = await getFileBase64(file);
-      updateFormDokumen(name, file.name, fileExtension, fileBase64);
-      validateDokumen();
+  const formRef = useRef(null);
+  const router = useRouter();
+  const handleDaftarMerchant = () => {
+    if (formRef.current) {
+      formRef.current(); // Memicu submit form di InformasiPerusahaan
     }
   };
-
-  const isFormValid = useMemo(
-    () => Object.keys(errorsDokumen).length === 0,
-    [errorsDokumen]
-  );
-  const dokumenNibRef = useRef(null);
-  const dokumenNpwpRef = useRef(null);
-  const dokumenSppkpRef = useRef(null);
-  const dokumenAktaPerubahanRef = useRef(null);
-  const dokumenKtpDirutRef = useRef(null);
-  const dokumenAktaPendirianRef = useRef(null);
-  const dokumenLaporanKeuanganRef = useRef(null);
-  const dokumenFotoKantorRef = useRef(null);
-  const dokumenTempatBekerjaRef = useRef(null);
-
-  useEffect(() => {
-    const loadIndustries = async () => {
-      if (!isFormValid) {
-        const options = {
-          behavior: 'smooth',
-          block: 'center',
-        };
-        if (errorsDokumen.dokumenNib && dokumenNibRef.current) {
-          dokumenNibRef.current.scrollIntoView(options);
-          return;
-        }
-        if (errorsDokumen.dokumenNpwp && dokumenNpwpRef.current) {
-          dokumenNpwpRef.current.scrollIntoView(options);
-          return;
-        }
-        if (errorsDokumen.dokumenSppkp && dokumenSppkpRef.current) {
-          dokumenSppkpRef.current.scrollIntoView(options);
-          return;
-        }
-        if (
-          errorsDokumen.dokumenAktaPerubahan &&
-          dokumenAktaPerubahanRef.current
-        ) {
-          dokumenAktaPerubahanRef.current.scrollIntoView(options);
-          return;
-        }
-        if (errorsDokumen.dokumenKtpDirut && dokumenKtpDirutRef.current) {
-          dokumenKtpDirutRef.current.scrollIntoView(options);
-          return;
-        }
-        if (
-          errorsDokumen.dokumenAktaPendirian &&
-          dokumenAktaPendirianRef.current
-        ) {
-          dokumenAktaPendirianRef.current.scrollIntoView(options);
-          return;
-        }
-        if (
-          errorsDokumen.dokumenLaporanKeuangan &&
-          dokumenLaporanKeuanganRef.current
-        ) {
-          dokumenLaporanKeuanganRef.current.scrollIntoView(options);
-          return;
-        }
-        if (errorsDokumen.dokumenFotoKantor && dokumenFotoKantorRef.current) {
-          dokumenFotoKantorRef.current.scrollIntoView(options);
-          return;
-        }
-        if (
-          errorsDokumen.dokumenTempatBekerja &&
-          dokumenTempatBekerjaRef.current
-        ) {
-          dokumenTempatBekerjaRef.current.scrollIntoView(options);
-          return;
-        }
-      }
-    };
-    loadIndustries();
-  }, [buttonSubmitClick, chekValid]);
-
-  useEffect(() => {
-    validateDokumen();
-  }, [buttonSubmitClick]);
-
-  useEffect(() => {
-    const loadIndustries = async () => {
-      const dataIndustries = await odooApi('GET', '/api/v1/partner/industry');
-      setIndustries(
-        dataIndustries?.map((o) => ({
-          value: o.id,
-          label: o.name,
-          category: o.category,
-        }))
-      );
-    };
-    loadIndustries();
-  }, []);
-
-  useEffect(() => {
-    const selectedIndustryType = industries.find(
-      (industry) => industry.value === watch('industry_id')
-    );
-    if (selectedIndustryType) {
-      updateForm('industry_id', `${selectedIndustryType?.value}`);
-      validate();
+  const handleIsError = (value) => {
+    console.log('LAHKAH SELANJUTNYA', value);
+    if (!value) {
+      // goToNextStep();
+      toast.success('Berhasil medaftarkan merchant');
     }
-  }, [watch('industry_id'), industries]);
+    reset();
+    router.push('/');
+  };
 
-  useEffect(() => {
-    if (form.industry_id) {
-      setValue('industry_id', parseInt(form.industry_id));
-    }
-  }, [form]);
- 
   return (
     <>
       {isDesktop && (
-        <form className='flex mt-4 flex-col w-full '>
-          <div className='w-full grid grid-cols-[1fr_auto_1fr] gap-5'>
-            <div className='w-full flex flex-col gap-5 '>
-              <div className=''>
-                <InformasiPerusahaan isKonfirmasi={true} />
-              </div>
-              <div className='h-px bg-gray-300'></div>
-              <div className=''>
-                <KontakPerusahaan isKonfirmasi={true} />
+        <>
+          <form className='flex mt-4 flex-col w-full '>
+            <div className='w-full grid grid-cols-[1fr_auto_1fr] gap-5'>
+              <div className='w-full flex flex-col gap-5 '>
+                <div className=''>
+                  <InformasiPerusahaan
+                    isKonfirmasi={true}
+                    ref={formRef}
+                    handleIsError={handleIsError}
+                  />
+                </div>
+                <div className='h-px bg-gray-300'></div>
+                <div className=''>
+                  <SyaratDagang
+                    isKonfirmasi={true}
+                    ref={formRef}
+                    handleIsError={handleIsError}
+                  />
+                </div>
               </div>
-            </div>
 
-            <div className='w-px bg-gray-300'></div>
-            <div className='w-full grid grid-rows-[1fc_auto_1fc] gap-5'>
-              <div>
-                <Pengiriman isKonfirmasi={true} />
-              </div>
-              <div className='h-px bg-gray-300'></div>
-              <div>
-                <KonfirmasiDokumen isKonfirmasi={true} />
+              <div className='w-px bg-gray-300'></div>
+              <div className='w-full grid grid-rows-[1fc_auto_1fc] gap-5'>
+                <div className=''>
+                  <InformasiVendor
+                    isKonfirmasi={true}
+                    ref={formRef}
+                    handleIsError={handleIsError}
+                  />
+                </div>
+                <div className='h-px   bg-gray-300'></div>
+                <div>
+                  <Dokumen
+                    isKonfirmasi={true}
+                    ref={formRef}
+                    handleIsError={handleIsError}
+                  />
+                </div>
               </div>
             </div>
+          </form>
+
+          <div className='flex flex-col items-end justify-end gap-2'>
+            <span className='text-xs opacity-60'>
+              *Pastikan data yang anda masukan sudah benar dan sesuai
+            </span>
+            <Button
+              colorScheme='red'
+              w='36'
+              onClick={handleDaftarMerchant} // Memicu form submit
+            >
+              Daftar Merchant
+            </Button>
           </div>
-        </form>
+        </>
       )}
-      {isMobile && (
+      {/* {isMobile && (
         <form className='flex mt-8 py-4 flex-col w-full gap-4'>
           <div className='flex flex-col gap-4'>
             <div className='flex flex-row justify-between items-center'>
@@ -289,7 +191,7 @@ const Konfirmasi = ({ chekValid, buttonSubmitClick }) => {
             {isOpenKonfirmasi && <KonfirmasiDokumen isKonfirmasi={true} />}
           </div>
         </form>
-      )}
+      )} */}
     </>
   );
 };