diff options
| author | it-fixcomart <it@fixcomart.co.id> | 2024-11-23 11:55:59 +0700 |
|---|---|---|
| committer | it-fixcomart <it@fixcomart.co.id> | 2024-11-23 11:55:59 +0700 |
| commit | 6bbf1dbd94355f34f58f4b72f134f3dbeac776aa (patch) | |
| tree | ff3cbc95e5c5f5cb6d2806bfeefd7112f934a761 /src/lib/pengajuan-tempo | |
| parent | 87e70c5ddc13b47ed4a9101d23174a65f52a0336 (diff) | |
<iman> update tempo
Diffstat (limited to 'src/lib/pengajuan-tempo')
| -rw-r--r-- | src/lib/pengajuan-tempo/component/Dokumen.jsx | 110 | ||||
| -rw-r--r-- | src/lib/pengajuan-tempo/component/FinishTempo.jsx | 23 | ||||
| -rw-r--r-- | src/lib/pengajuan-tempo/component/PengajuanTempo.jsx | 228 | ||||
| -rw-r--r-- | src/lib/pengajuan-tempo/component/Pengiriman.jsx | 438 | ||||
| -rw-r--r-- | src/lib/pengajuan-tempo/component/Referensi.jsx | 2 | ||||
| -rw-r--r-- | src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx | 324 |
6 files changed, 760 insertions, 365 deletions
diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx index 0873df66..8391de4a 100644 --- a/src/lib/pengajuan-tempo/component/Dokumen.jsx +++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx @@ -43,8 +43,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { } // Check for file size - if (file.size > 2000000) { - toast.error('Maksimal ukuran file adalah 2MB', { duration: 4000 }); + if (file.size > 500000) { + toast.error('Maksimal ukuran file adalah 500Kb', { duration: 4000 }); event.target.value = ''; return; @@ -72,6 +72,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { const dokumenTempatBekerjaRef = useRef(null); useEffect(() => { + // window.scrollTo({ + // top: 0, + // behavior: 'smooth', + // }); const loadIndustries = async () => { if (!isFormValid) { const options = { @@ -79,6 +83,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { block: 'center', }; if (errorsDokumen.dokumenNib && dokumenNibRef.current) { + console.log('errorsDokumen', errorsDokumen); dokumenNibRef.current.scrollIntoView(options); return; } @@ -144,7 +149,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { <form className='flex mt-4 flex-col w-full '> <div className='w-full grid grid-cols-[1fr_auto_1fr] gap-5'> <div className='kolom-kiri w-full grid grid-rows-2 gap-7 '> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenNibRef} + > <div> <label className='form-label text-nowrap'> NIB (SIUP/TDP/SKDP) @@ -167,7 +175,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { name='dokumenNib' type='file' title=' ' - ref={dokumenNibRef} className='hidden' aria-invalid={errorsDokumen.dokumenNib} onChange={handleInputChange} @@ -184,7 +191,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> </div> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenNpwpRef} + > <div> <label className='form-label text-nowrap'> NPWP Perusahaan @@ -206,7 +216,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenNpwp' name='dokumenNpwp' type='file' - ref={dokumenNpwpRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenNpwp} @@ -224,7 +233,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> </div> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenSppkpRef} + > <div> <label className='form-label text-nowrap'>SPPKP</label> <span className='text-xs opacity-60'> @@ -244,7 +256,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenSppkp' name='dokumenSppkp' type='file' - ref={dokumenSppkpRef} className='hidden' aria-invalid={errorsDokumen.dokumenSppkp} onChange={handleInputChange} @@ -262,7 +273,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> </div> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenAktaPerubahanRef} + > <div> <label className='form-label text-nowrap'> Akta Perubahan{' '} @@ -285,7 +299,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenAktaPerubahan' name='dokumenAktaPerubahan' type='file' - ref={dokumenAktaPerubahanRef} className='hidden' aria-invalid={errorsDokumen.dokumenAktaPerubahan} onChange={handleInputChange} @@ -302,7 +315,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> </div> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenKtpDirutRef} + > <div> <label className='form-label text-nowrap'> KTP Dirut/Direktur{' '} @@ -325,7 +341,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenKtpDirut' name='dokumenKtpDirut' type='file' - ref={dokumenKtpDirutRef} className='hidden' aria-invalid={errorsDokumen.dokumenKtpDirut} onChange={handleInputChange} @@ -345,7 +360,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { </div> </div> <div className='w-px bg-gray-300'></div> - <div className='kolom kanan w-full grid grid-rows-2 gap-10 '> + <div + className='kolom kanan w-full grid grid-rows-2 gap-10 ' + ref={dokumenAktaPendirianRef} + > <div className='w-full grid grid-cols-2 gap-5'> <div> <label className='form-label text-nowrap'> @@ -369,7 +387,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenAktaPendirian' name='dokumenAktaPendirian' type='file' - ref={dokumenAktaPendirianRef} className='hidden' aria-invalid={errorsDokumen.dokumenAktaPendirian} onChange={handleInputChange} @@ -387,7 +404,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> </div> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenLaporanKeuanganRef} + > <div> <label className='form-label text-nowrap'> Laporan Keuangan @@ -410,7 +430,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenLaporanKeuangan' name='dokumenLaporanKeuangan' type='file' - ref={dokumenLaporanKeuanganRef} className='hidden' aria-invalid={errorsDokumen.dokumenLaporanKeuangan} onChange={handleInputChange} @@ -428,7 +447,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> </div> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenFotoKantorRef} + > <div> <label className='form-label text-nowrap'> Foto Kantor (Tampak Depan) @@ -450,7 +472,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenFotoKantor' name='dokumenFotoKantor' type='file' - ref={dokumenFotoKantorRef} className='hidden' aria-invalid={errorsDokumen.dokumenFotoKantor} onChange={handleInputChange} @@ -468,7 +489,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> </div> - <div className='w-full grid grid-cols-2 gap-5'> + <div + className='w-full grid grid-cols-2 gap-5' + ref={dokumenTempatBekerjaRef} + > <div> <label className='form-label text-nowrap'> Tempat Bekerja @@ -490,7 +514,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenTempatBekerja' name='dokumenTempatBekerja' type='file' - ref={dokumenTempatBekerjaRef} className='hidden' aria-invalid={errorsDokumen.dokumenTempatBekerja} onChange={handleInputChange} @@ -538,7 +561,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { labelColor='#e80909' labelSize='0' maxCompleted={9} - height='14 px' + height='14px' /> <span className='opacity-75'> Tingkatin sedikit lagi agar pengajuan tempo kamu dapat kami proses @@ -558,7 +581,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { </h1> <form className='flex mt-4 flex-col w-full '> <div className='w-full flex flex-col gap-4'> - <div className='w-full flex flex-col gap-2'> + <div className='w-full flex flex-col gap-2' ref={dokumenNibRef}> <label className='form-label text-nowrap'> NIB (SIUP/TDP/SKDP) </label> @@ -577,7 +600,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { name='dokumenNib' type='file' title=' ' - ref={dokumenNibRef} className='hidden' aria-invalid={errorsDokumen.dokumenNib} onChange={handleInputChange} @@ -597,7 +619,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div className='w-full flex flex-col gap-2' ref={dokumenNpwpRef}> <label className='form-label text-nowrap'> NPWP Perusahaan </label> @@ -615,7 +637,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenNpwp' name='dokumenNpwp' type='file' - ref={dokumenNpwpRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenNpwp} @@ -636,7 +657,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div className='w-full flex flex-col gap-2' ref={dokumenSppkpRef}> <label className='form-label text-nowrap'>SPPKP</label> <div className='flex flex-row gap-2'> <label @@ -652,7 +673,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenSppkp' name='dokumenSppkp' type='file' - ref={dokumenSppkpRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenSppkp} @@ -673,7 +693,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div + className='w-full flex flex-col gap-2' + ref={dokumenAktaPerubahanRef} + > <label className='form-label text-nowrap'> Akta Perubahan <span className=' opacity-60'>(Opsional)</span> </label> @@ -691,7 +714,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenAktaPerubahan' name='dokumenAktaPerubahan' type='file' - ref={dokumenAktaPerubahanRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenAktaPerubahan} @@ -712,7 +734,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div + className='w-full flex flex-col gap-2' + ref={dokumenKtpDirutRef} + > <label className='form-label text-nowrap'> KTP Dirut/Direktur{' '} <span className=' opacity-60'>(Opsional)</span> @@ -731,7 +756,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenKtpDirut' name='dokumenKtpDirut' type='file' - ref={dokumenKtpDirutRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenKtpDirut} @@ -752,7 +776,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div + className='w-full flex flex-col gap-2' + ref={dokumenAktaPendirianRef} + > <label className='form-label text-nowrap'> Akta Pendirian <span className=' opacity-60'>(Opsional)</span> </label> @@ -770,7 +797,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenAktaPendirian' name='dokumenAktaPendirian' type='file' - ref={dokumenAktaPendirianRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenAktaPendirian} @@ -791,7 +817,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div + className='w-full flex flex-col gap-2' + ref={dokumenLaporanKeuanganRef} + > <label className='form-label text-nowrap'> Laporan Keuangan{' '} <span className=' opacity-60'>(Opsional)</span> @@ -810,7 +839,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenLaporanKeuangan' name='dokumenLaporanKeuangan' type='file' - ref={dokumenLaporanKeuanganRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenLaporanKeuangan} @@ -831,7 +859,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div + className='w-full flex flex-col gap-2' + ref={dokumenFotoKantorRef} + > <label className='form-label text-nowrap'> Foto Kantor (Tampak Depan) </label> @@ -849,7 +880,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenFotoKantor' name='dokumenFotoKantor' type='file' - ref={dokumenFotoKantorRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenFotoKantor} @@ -870,7 +900,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> - <div className='w-full flex flex-col gap-2'> + <div + className='w-full flex flex-col gap-2' + ref={dokumenTempatBekerjaRef} + > <label className='form-label text-nowrap'> Tempat Bekerja </label> @@ -888,7 +921,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { id='dokumenTempatBekerja' name='dokumenTempatBekerja' type='file' - ref={dokumenTempatBekerjaRef} title=' ' className='hidden' aria-invalid={errorsDokumen.dokumenTempatBekerja} diff --git a/src/lib/pengajuan-tempo/component/FinishTempo.jsx b/src/lib/pengajuan-tempo/component/FinishTempo.jsx index f4336d8a..2b6f69d0 100644 --- a/src/lib/pengajuan-tempo/component/FinishTempo.jsx +++ b/src/lib/pengajuan-tempo/component/FinishTempo.jsx @@ -14,7 +14,6 @@ const FinishTempo = ({ query }) => { const [transactionData, setTransactionData] = useState(); const { isDesktop, isMobile } = useDevice(); const auth = useAuth(); - const so_order = query?.order_id?.replaceAll('-', '/'); useEffect(() => { const fetchData = async () => { @@ -57,8 +56,9 @@ const FinishTempo = ({ query }) => { isMobile ? 'text-lg' : 'text-3xl' }`} > - Form Pengajuan Tempo kamu Telah Berhasil Didaftarkan Mohon menunggu - hingga Proses Selesai + {query?.status == 'switch-account' + ? 'Form Pengajuan Tempo kamu gagal dilakukan' + : 'Form Pengajuan Tempo kamu Telah Berhasil Didaftarkan Mohon menunggu hingga Proses Selesai'} </h1> </div> <Image @@ -73,15 +73,22 @@ const FinishTempo = ({ query }) => { isMobile ? 'w-full text-sm' : 'w-4/5 text-base' }`} > - Mohon menunggu untuk verifikasi dokumen dan kelengkapan data yang telah - anda berikan. Proses approval pembayaran tempo kamu berhasil atau tidak - akan diinfokan melalui email perusahaan / email yang mendaftar + {query?.status == 'switch-account' + ? 'Terima kasih atas minat anda untuk mendaftar Tempo, namun sayangnya akun anda bukan merupakan akun bisnis. Segera ubah akun anda menjadi Bisnis untuk menggunakan fitur ini' + : 'Mohon menunggu untuk verifikasi dokumen dan kelengkapan data yang telah anda berikan. Proses approval pembayaran tempo kamu berhasil atau tidak akan diinfokan melalui email perusahaan / email yang mendaftar'} </div> <Link - href={`/my/quotations/${data?.id}`} + href={ + query?.status == 'switch-account' + ? `/profil` + : `/my/quotations/${data?.id}` + } className='btn-solid-red rounded-md text-base flex flex-row' > - Lihat Status Pendaftaran <ChevronRightIcon className='w-5' /> + {query?.status == 'switch-account' + ? 'Ubah Akun' + : 'Lihat Status Pendaftaran'}{' '} + <ChevronRightIcon className='w-5' /> </Link> </div> ); diff --git a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx index d0e1fcc6..fc558b01 100644 --- a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx +++ b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx @@ -7,7 +7,7 @@ import Pengiriman from './Pengiriman'; import Referensi from './Referensi'; import Dokumen from './Dokumen'; import Konfirmasi from './Konfirmasi'; -import useAuth from '@/core/hooks/useAuth'; +import { getAuth } from '~/libs/auth'; import { useRouter } from 'next/router'; import { Controller, useForm } from 'react-hook-form'; import { @@ -23,14 +23,17 @@ import { Button, Checkbox, Spinner, Tooltip } from '@chakra-ui/react'; import clsxm from '~/libs/clsxm'; import { toast } from 'react-hot-toast'; import useDevice from '@/core/hooks/useDevice'; +import odooApi from '~/libs/odooApi'; const PengajuanTempo = () => { const { isDesktop, isMobile } = useDevice(); const [currentStep, setCurrentStep] = React.useState(0); const NUMBER_OF_STEPS = 6; const [isLoading, setIsLoading] = useState(false); + const [bigData, setBigData] = useState(); + const [idTempo, setIdTempo] = useState(0); const { form, errors, validate, updateForm } = usePengajuanTempoStore(); const { control, watch, setValue } = useForm(); - const auth = useAuth(); + const auth = getAuth(); const router = useRouter(); const { formDokumen, errorsDokumen, validateDokumen, updateFormDokumen } = usePengajuanTempoStoreDokumen(); @@ -131,48 +134,230 @@ const PengajuanTempo = () => { validatePengiriman(); validateDokumen(); updateHasSave(false); - + if (isFormValid) { + window.scrollTo({ + top: 0, + behavior: 'smooth', + }); + } + }, [currentStep, buttonSubmitClick]); + useEffect(() => { window.scrollTo({ top: 0, behavior: 'smooth', }); - }, [currentStep, buttonSubmitClick]); + }, [currentStep]); useEffect(() => { - const cachedData = getFromLocalStorage(stepLabels[currentStep]); + const loadBigData = async () => { + const toCamelCase = (str) => + str.replace(/_([a-z])/g, (_, letter) => letter.toUpperCase()); + + const transformKeysToCamelCase = (data) => { + if (Array.isArray(data)) { + return data.map((item) => transformKeysToCamelCase(item)); + } else if (data && typeof data === 'object') { + return Object.keys(data).reduce((acc, key) => { + const camelKey = toCamelCase(key); // Ubah kunci menjadi camelCase + acc[camelKey] = transformKeysToCamelCase(data[key]); // Rekursif untuk nested object atau array + return acc; + }, {}); + } + return data; // Jika bukan object atau array, kembalikan nilai aslinya + }; + + try { + const dataPaymentTerm = await odooApi( + 'GET', + `/api/v1/partner/detail-tempo/${auth.parentId}` + ); + + console.log('Original dataPaymentTerm', dataPaymentTerm); + + const transformedData = transformKeysToCamelCase(dataPaymentTerm); + + console.log('Transformed dataPaymentTerm', transformedData); + + setBigData(transformedData); + } catch (error) { + console.error('Error loading dataPaymentTerm:', error); + } + }; + + loadBigData(); + }, []); + + console.log('bigData', bigData); + + useEffect(() => { + const cachedData = bigData; + console.log('data_lama', getFromLocalStorage(stepLabels[currentStep])); + console.log('cachedData', cachedData); + if (cachedData) { - if (currentStep == 3) { + // Ambil kunci-kunci yang relevan berdasarkan currentStep dari stepDivsForm + const formKeys = stepDivsForm[currentStep] + ? Object.keys(stepDivsForm[currentStep]) + : []; + console.log('formKeys', formKeys); + if (currentStep === 3) { stepDivsUpdateForm[currentStep](cachedData); - } else if (currentStep == 4) { - Object.keys(cachedData).forEach((key) => { - const { name, format, base64 } = cachedData[key]; - stepDivsUpdateForm[currentStep](key, name, format, base64); + } else if (currentStep === 4) { + formKeys.forEach((key) => { + if (cachedData[key]) { + // Proses hanya kunci yang ada di cachedData + const { name, format, base64 } = cachedData[key]; + stepDivsUpdateForm[currentStep](key, name, format, base64); + } }); } else { - Object.keys(cachedData).forEach((key) => { - stepDivsUpdateForm[currentStep](key, cachedData[key]); + formKeys.forEach((key) => { + if (cachedData[key]) { + // Ubah data menjadi string + const stringData = + typeof cachedData[key] === 'object' + ? JSON.stringify(cachedData[key]) // Untuk objek atau array + : String(cachedData[key]); // Untuk tipe primitif + + // Kirim data yang sudah diubah ke string ke stepDivsUpdateForm + stepDivsUpdateForm[currentStep](key, stringData); + } }); } } + validate(); validateKontakPerson(); validatePengiriman(); validateDokumen(); updateHasSave(false); - }, [currentStep]); + }, [currentStep, bigData]); + const goToNextStep = () => { if (!isFormValid) { setNotValid(true); setButtonSubmitClick(!buttonSubmitClick); return; } else { - saveToLocalStorage(stepLabels[currentStep], stepDivsForm[currentStep]); + // saveToLocalStorage(stepLabels[currentStep], stepDivsForm[currentStep]); + if (currentStep == 3) { + handleDaftarTempoSupplier(); + } else if (currentStep == 4) { + handleDaftarTempoDokumen(); + } else { + handleDaftarTempoPerPage( + stepLabels[currentStep], + stepDivsForm[currentStep] + ); + } setButtonSubmitClick(!buttonSubmitClick); setNotValid(false); } setCurrentStep((prev) => (prev === NUMBER_OF_STEPS - 1 ? prev : prev + 1)); }; + const handleDaftarTempoPerPage = async ( + label, + formData, + tempoRequest = false + ) => { + for (const error of stepDivsError) { + if (error.length > 0) { + return; + } + } + const toastId = toast.loading('Mengirimkan formulir pengajuan tempo...'); + setIsLoading(true); + try { + const address = await createPengajuanTempoApi({ + id: idTempo, + user_id: auth.parentId, + section: label, + tempo_request: tempoRequest, + ...formData, + }); + if (address.id) { + setIdTempo(address.id); + } + toast.dismiss(toastId); + setIsLoading(false); + } catch (error) { + toast.dismiss(toastId); + setIsLoading(false); + + toast.error('Terjadi kesalahan dalam pengiriman formulir'); + console.error(error); + } + }; + const handleDaftarTempoDokumen = async () => { + for (const error of stepDivsError) { + if (error.length > 0) { + return; + } + } + const formattedDokumen = Object.entries(formDokumen).map(([key, doc]) => ({ + documentName: key, + details: { + name: doc.name, + format: doc.format, + base64: doc.base64, + }, + })); + const toastId = toast.loading('Mengirimkan formulir pengajuan tempo...'); + setIsLoading(true); + try { + const address = await createPengajuanTempoApi({ + id: idTempo, + user_id: auth.parentId, + formDocs: JSON.stringify(formattedDokumen), + }); + if (address.id) { + setIdTempo(address.id); + } + toast.dismiss(toastId); + setIsLoading(false); + } catch (error) { + toast.dismiss(toastId); + setIsLoading(false); + + toast.error('Terjadi kesalahan dalam pengiriman formulir'); + console.error(error); + } + }; + const handleDaftarTempoSupplier = async () => { + for (const error of stepDivsError) { + if (error.length > 0) { + return; + } + } + const productOrder = formSupplier.map((product) => ({ + supplier: product.supplier, + pic: product.pic, + telepon: product.telepon, + durasiTempo: product.durasiTempo, + creditLimit: product.creditLimit, + })); + const toastId = toast.loading('Mengirimkan formulir pengajuan tempo...'); + setIsLoading(true); + try { + const address = await createPengajuanTempoApi({ + id: idTempo, + user_id: auth.parentId, + formDocs: JSON.stringify(productOrder), + }); + if (address.id) { + setIdTempo(address.id); + } + toast.dismiss(toastId); + setIsLoading(false); + } catch (error) { + toast.dismiss(toastId); + setIsLoading(false); + + toast.error('Terjadi kesalahan dalam pengiriman formulir'); + console.error(error); + } + }; const handleDaftarTempo = async () => { for (const error of stepDivsError) { if (error.length > 0) { @@ -195,6 +380,11 @@ const PengajuanTempo = () => { base64: doc.base64, }, })); + if (currentStep == 3) { + formData = JSON.stringify(productOrder); + } else if (currentStep == 4) { + formData = JSON.stringify(formattedDokumen); + } const data2 = { user_id: auth.id, @@ -209,8 +399,10 @@ const PengajuanTempo = () => { try { let address5; const address = await createPengajuanTempoApi({ - id: '0', - user_id: auth.id, + id: 0, + user_id: auth.parentId, + section: label, + tempo_request: tempoRequest, ...form, }); if (address.id) { @@ -247,7 +439,7 @@ const PengajuanTempo = () => { if (address5.id) { toast.success('Pengajuan tempo berhasil dilakukan'); - // removeFromLocalStorage(); + removeFromLocalStorage(); router.push('/pengajuan-tempo/finish?tempo_id=SO-2023-06480'); } } catch (error) { @@ -338,7 +530,7 @@ const PengajuanTempo = () => { <Button colorScheme='red' w={`${isMobile ? 'full' : 'fit'}`} - onClick={handleDaftarTempo} + onClick={handleDaftarTempo()} > Daftar Tempo {<ChevronRightIcon className='w-5' />} </Button> diff --git a/src/lib/pengajuan-tempo/component/Pengiriman.jsx b/src/lib/pengajuan-tempo/component/Pengiriman.jsx index 842e43ef..adf2ee37 100644 --- a/src/lib/pengajuan-tempo/component/Pengiriman.jsx +++ b/src/lib/pengajuan-tempo/component/Pengiriman.jsx @@ -5,7 +5,11 @@ import odooApi from '~/libs/odooApi'; import stateApi from '@/lib/address/api/stateApi.js'; import cityApi from '@/lib/address/api/cityApi'; import { Radio, RadioGroup, Stack, Checkbox } from '@chakra-ui/react'; -import { usePengajuanTempoStorePengiriman } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore'; +import { + usePengajuanTempoStorePengiriman, + usePengajuanTempoStore, +} from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore'; + import useDevice from '@/core/hooks/useDevice'; const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { const { control, watch, setValue } = useForm(); @@ -16,15 +20,20 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { validatePengiriman, updateFormPengiriman, } = usePengajuanTempoStorePengiriman(); + const { form, errors, validate, updateForm } = usePengajuanTempoStore(); const [states, setState] = useState([]); const [cities, setCities] = useState([]); const [sameAddress, setSameAddress] = useState(false); + const [sameAddressStreet, setSameAddressStreet] = useState(false); const [everyWeekday, setEveryWeekday] = useState(false); const [everyWeek, setEveryWeek] = useState(false); const [tukarInvoice, setTukarInvoice] = useState(false); const [everyWeekdayPembayaran, setEveryWeekdayPembayaran] = useState(false); const [everyWeekPembayaran, setEveryWeekPembayaran] = useState(false); const [tukarInvoicePembayaran, setTukarInvoicePembayaran] = useState(false); + const [selectedRadio, setSelectedRadio] = useState(''); + const [selectedRadioInvoice, setSelectedRadioInvoice] = useState(''); + const [selectedIds, setSelectedIds] = useState( formPengiriman.dokumenPengiriman ? formPengiriman.dokumenPengiriman.split(',').map(Number) @@ -121,7 +130,29 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { updateFormPengiriman(name, value); validatePengiriman(); }; - + const handleRadioChange = (value) => { + console.log('value', value); + setSelectedRadio(value); + if (value == 'everyWeekday') { + setEveryWeekday(!everyWeekday); + } else if (value == 'everyWeek') { + setEveryWeek(!everyWeek); + } else { + setTukarInvoice(!tukarInvoice); + } + validatePengiriman(); + }; + const handleRadioChangeInvoice = (value) => { + setSelectedRadioInvoice(value); + if (value == 'everyWeekdayPembayaran') { + setEveryWeekdayPembayaran(!everyWeekdayPembayaran); + } else if (value == 'everyWeekPembayaran') { + setEveryWeekPembayaran(!everyWeekPembayaran); + } else { + setTukarInvoicePembayaran(!tukarInvoicePembayaran); + } + validatePengiriman(); + }; const handleEveryWeekday = () => { setEveryWeekday(!everyWeekday); }; @@ -278,6 +309,15 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { setSameAddress(false); } } + if (formPengiriman.isSameAddreesStreet) { + const isSame = formPengiriman.isSameAddreesStreet; + if (isSame == 'true') { + setSameAddressStreet(true); + } else { + setSameAddressStreet(false); + } + } + validatePengiriman(); }, [buttonSubmitClick]); useEffect(() => { if (formPengiriman.isSameAddrees) { @@ -288,7 +328,16 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { setSameAddress(false); } } - }, [formPengiriman.isSameAddrees]); + if (formPengiriman.isSameAddreesStreet) { + const isSame = formPengiriman.isSameAddreesStreet; + if (isSame == 'true') { + setSameAddressStreet(true); + } else { + setSameAddressStreet(false); + } + } + validatePengiriman(); + }, [formPengiriman.isSameAddrees, formPengiriman.isSameAddreesStreet]); useEffect(() => { if (sameAddress) { updateFormPengiriman('streetInvoice', formPengiriman.streetPengiriman); @@ -306,6 +355,25 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { validatePengiriman(); }, [sameAddress]); + useEffect(() => { + if (sameAddressStreet) { + updateFormPengiriman('streetPengiriman', form.street); + updateFormPengiriman('statePengiriman', form.state); + updateFormPengiriman('cityPengiriman', form.city); + updateFormPengiriman('zipPengiriman', form.zip); + } else { + updateFormPengiriman('streetPengiriman', ''); + updateFormPengiriman('statePengiriman', ''); + updateFormPengiriman('cityPengiriman', ''); + updateFormPengiriman('zipPengiriman', ''); + setValue('streetPengiriman', ''); + setValue('statePengiriman', ''); + setValue('cityPengiriman', ''); + } + updateFormPengiriman('isSameAddrees', `${sameAddress}`); + validatePengiriman(); + }, [sameAddressStreet]); + const getFromLocalStorage = (key) => { const itemStr = localStorage.getItem(key); if (!itemStr) return null; @@ -380,6 +448,11 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { const handleChangeSameAddress = () => { setSameAddress(!sameAddress); }; + const handleChangeSameAddressStreet = () => { + setSameAddressStreet(!sameAddressStreet); + }; + console.log('formPengiriman', formPengiriman); + console.log('errorsPengiriman', errorsPengiriman); return ( <> {isDesktop && ( @@ -428,79 +501,90 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> <div className='w-3/5 flex gap-3 flex-col'> - <div> - <input - id='streetPengiriman' - name='streetPengiriman' - ref={streetPengirimanRef} - placeholder='Masukkan alamat lengkap pengiriman barang' - type='text' - value={formPengiriman.streetPengiriman} - className='form-input' - onChange={handleInputChange} - /> - {chekValid && ( - <div className='text-caption-2 text-danger-500 mt-1'> - {errorsPengiriman.streetPengiriman} + <Checkbox + colorScheme='red' + isChecked={sameAddressStreet} + onChange={handleChangeSameAddressStreet} + > + Alamat Pengiriman sama dengan alamat pengiriman + </Checkbox> + {!sameAddressStreet && ( + <> + <div> + <input + id='streetPengiriman' + name='streetPengiriman' + ref={streetPengirimanRef} + placeholder='Masukkan alamat lengkap pengiriman barang' + type='text' + value={formPengiriman.streetPengiriman} + className='form-input' + onChange={handleInputChange} + /> + {chekValid && ( + <div className='text-caption-2 text-danger-500 mt-1'> + {errorsPengiriman.streetPengiriman} + </div> + )} </div> - )} - </div> - <div className='sub-alamat flex flex-row w-full gap-3'> - <div className='w-2/5' ref={statePengirimanRef}> - <Controller - name='statePengiriman' - control={control} - render={(props) => ( - <HookFormSelect - {...props} - options={states} - placeholder='Provinsi' + <div className='sub-alamat flex flex-row w-full gap-3'> + <div className='w-2/5' ref={statePengirimanRef}> + <Controller + name='statePengiriman' + control={control} + render={(props) => ( + <HookFormSelect + {...props} + options={states} + placeholder='Provinsi' + /> + )} /> - )} - /> - {chekValid && ( - <div className='text-caption-2 text-danger-500 mt-1'> - {errorsPengiriman.statePengiriman} + {chekValid && ( + <div className='text-caption-2 text-danger-500 mt-1'> + {errorsPengiriman.statePengiriman} + </div> + )} </div> - )} - </div> - <div className='w-1/3' ref={cityPengirimanRef}> - <Controller - name='cityPengiriman' - control={control} - render={(props) => ( - <HookFormSelect - {...props} - options={cities} - disabled={!watchState} - placeholder='Kota' + <div className='w-1/3' ref={cityPengirimanRef}> + <Controller + name='cityPengiriman' + control={control} + render={(props) => ( + <HookFormSelect + {...props} + options={cities} + disabled={!watchState} + placeholder='Kota' + /> + )} /> - )} - /> - {chekValid && ( - <div className='text-caption-2 text-danger-500 mt-1'> - {errorsPengiriman.cityPengiriman} + {chekValid && ( + <div className='text-caption-2 text-danger-500 mt-1'> + {errorsPengiriman.cityPengiriman} + </div> + )} </div> - )} - </div> - <div className='w-1/3'> - <input - id='zipPengiriman' - name='zipPengiriman' - ref={zipRef} - placeholder='Kode Pos' - type='number' - value={formPengiriman.zipPengiriman} - className='form-input' - onChange={handleInputChange} - /> - {chekValid && ( - <div className='text-caption-2 text-danger-500 mt-1'> - {errorsPengiriman.zipPengiriman} + <div className='w-1/3'> + <input + id='zipPengiriman' + name='zipPengiriman' + ref={zipRef} + placeholder='Kode Pos' + type='number' + value={formPengiriman.zipPengiriman} + className='form-input' + onChange={handleInputChange} + /> + {chekValid && ( + <div className='text-caption-2 text-danger-500 mt-1'> + {errorsPengiriman.zipPengiriman} + </div> + )} </div> - )} - </div> - </div> + </div> + </> + )} </div> </div> @@ -628,64 +712,56 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> <div className='w-3/5 flex gap-3 flex-col'> - <div className='flex gap-3 flex-col'> - <Checkbox - colorScheme='red' - isChecked={everyWeekday} - onChange={handleEveryWeekday} - > - Setiap Minggu dihari - </Checkbox> - <input - id='everyWeekdayInput' - name='everyWeekdayInput' - ref={everyWeekdayInputRef} - placeholder='Format: Senin, Selasa, Rabu, Kamis, Jumat, Sabtu, Minggu' - type='text' - value={formPengiriman.everyWeekdayInput} - className='form-input' - onChange={handleInputChange} - /> - </div> - <div className='flex gap-3 flex-col'> - <Checkbox - colorScheme='red' - isChecked={everyWeek} - onChange={handleEveryWeek} - > - Setiap Bulan di minggu ke - </Checkbox> - <input - id='everyWeekInput' - name='everyWeekInput' - ref={everyWeekInputRef} - placeholder='Format: Minggu 1 & Minggu 2' - type='text' - value={formPengiriman.everyWeekInput} - className='form-input' - onChange={handleInputChange} - /> - </div> - <div className='flex gap-3 flex-col'> - <Checkbox - colorScheme='red' - isChecked={tukarInvoice} - onChange={handleTukarInvoice} - > - Lainnya - </Checkbox> - <textarea - id='tukarInvoiceInput' - name='tukarInvoiceInput' - placeholder='isi manual dokumen yang anda mau' - type='textarea' - value={formPengiriman.tukarInvoiceInput} - className='form-input' - rows={4} - cols={40} - onChange={handleInputChange} - /> - </div> + <RadioGroup + onChange={handleRadioChange} + value={selectedRadio} + > + <div className='flex gap-3 flex-col'> + <Radio value='everyWeekday' colorScheme='red'> + Setiap Minggu di hari + </Radio> + <input + id='everyWeekdayInput' + name='everyWeekdayInput' + ref={everyWeekdayInputRef} + placeholder='Format: Senin, Selasa, Rabu, Kamis, Jumat, Sabtu, Minggu' + type='text' + value={formPengiriman.everyWeekdayInput} + className='form-input' + onChange={handleInputChange} + /> + </div> + <div className='flex gap-3 flex-col'> + <Radio value='everyWeek' colorScheme='red'> + Setiap Bulan di minggu ke + </Radio> + <input + id='everyWeekInput' + name='everyWeekInput' + ref={everyWeekInputRef} + placeholder='Format: Minggu 1 & Minggu 2' + type='text' + value={formPengiriman.everyWeekInput} + className='form-input' + onChange={handleInputChange} + /> + </div> + <div className='flex gap-3 flex-col'> + <Radio value='tukarInvoice' colorScheme='red'> + Lainnya + </Radio> + <textarea + id='tukarInvoiceInput' + name='tukarInvoiceInput' + placeholder='Isi manual dokumen yang anda mau' + value={formPengiriman.tukarInvoiceInput} + className='form-input' + rows={4} + cols={40} + onChange={handleInputChange} + /> + </div> + </RadioGroup> </div> </div> @@ -702,62 +778,54 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )} </div> <div className='w-3/5 flex gap-3 flex-col'> - <div className='flex gap-3 flex-col'> - <Checkbox - colorScheme='red' - isChecked={everyWeekdayPembayaran} - onChange={handleEveryWeekdayPembayaran} - > - Setiap Minggu dihari - </Checkbox> - <input - id='everyWeekdayInputPembayaran' - name='everyWeekdayInputPembayaran' - placeholder='Format: Senin, Selasa, Rabu, Kamis, Jumat, Sabtu, Minggu' - type='text' - value={formPengiriman.everyWeekdayInputPembayaran} - className='form-input' - onChange={handleInputChange} - /> - </div> - <div className='flex gap-3 flex-col'> - <Checkbox - colorScheme='red' - isChecked={everyWeekPembayaran} - onChange={handleEveryWeekPembayaran} - > - Setiap Bulan di minggu ke - </Checkbox> - <input - id='everyWeekInputPembayaran' - name='everyWeekInputPembayaran' - placeholder='Format: Minggu 1 & Minggu 2' - type='text' - value={formPengiriman.everyWeekInputPembayaran} - className='form-input' - onChange={handleInputChange} - /> - </div> - <div className='flex gap-3 flex-col'> - <Checkbox - colorScheme='red' - isChecked={tukarInvoicePembayaran} - onChange={handleTukarInvoicePembayaran} - > - Lainnya - </Checkbox> - <textarea - id='tukarInvoiceInputPembayaran' - name='tukarInvoiceInputPembayaran' - placeholder='isi manual dokumen yang anda mau' - type='textarea' - value={formPengiriman.tukarInvoiceInputPembayaran} - className='form-input' - rows={4} - cols={40} - onChange={handleInputChange} - /> - </div> + <RadioGroup + onChange={handleRadioChangeInvoice} + value={selectedRadioInvoice} + > + <div className='flex gap-3 flex-col'> + <Radio value='everyWeekdayPembayaran' colorScheme='red'> + Setiap Minggu di hari + </Radio> + <input + id='everyWeekdayInputPembayaran' + name='everyWeekdayInputPembayaran' + placeholder='Format: Senin, Selasa, Rabu, Kamis, Jumat, Sabtu, Minggu' + type='text' + value={formPengiriman.everyWeekdayInputPembayaran} + className='form-input' + onChange={handleInputChange} + /> + </div> + <div className='flex gap-3 flex-col'> + <Radio value='everyWeekPembayaran' colorScheme='red'> + Setiap Bulan di minggu ke + </Radio> + <input + id='everyWeekInputPembayaran' + name='everyWeekInputPembayaran' + placeholder='Format: Minggu 1 & Minggu 2' + type='text' + value={formPengiriman.everyWeekInputPembayaran} + className='form-input' + onChange={handleInputChange} + /> + </div> + <div className='flex gap-3 flex-col'> + <Radio value='tukarInvoicePembayaran' colorScheme='red'> + Lainnya + </Radio> + <textarea + id='tukarInvoiceInputPembayaran' + name='tukarInvoiceInputPembayaran' + placeholder='isi manual dokumen yang anda mau' + value={formPengiriman.tukarInvoiceInputPembayaran} + className='form-input' + rows={4} + cols={40} + onChange={handleInputChange} + /> + </div> + </RadioGroup> </div> </div> @@ -929,7 +997,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { </div> {chekValid && ( <div className='text-caption-2 text-danger-500 mt-1'> - {errorsPengiriman.dokumenInvoicePengiriman} + {errorsPengiriman.dokumenPengirimanInvoice} </div> )} </div> diff --git a/src/lib/pengajuan-tempo/component/Referensi.jsx b/src/lib/pengajuan-tempo/component/Referensi.jsx index 8cb3b0c3..5ec64611 100644 --- a/src/lib/pengajuan-tempo/component/Referensi.jsx +++ b/src/lib/pengajuan-tempo/component/Referensi.jsx @@ -309,7 +309,7 @@ const Referensi = ({ chekValid, buttonSubmitClick }) => { </button> <button onClick={simpanData} - className='bg-gray-200 border border-gray-500 rounded-md text-sm text-gray-500 p-2 h-11 mb-1 content-center flex flex-row justify-center items-center' + className='bg-red-500 border border-red-500 opacity-70 rounded-md text-sm text-white p-2 h-11 mb-1 content-center flex flex-row justify-center items-center' > simpan data </button> diff --git a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx index 8a1b3508..6a50b0c7 100644 --- a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx +++ b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx @@ -8,15 +8,19 @@ import { Radio, RadioGroup, Stack, Checkbox } from '@chakra-ui/react'; import { usePengajuanTempoStore } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore'; import useDevice from '@/core/hooks/useDevice'; import Divider from '@/core/components/elements/Divider/Divider'; +import { getAuth } from '~/libs/auth'; +import addressApi from '@/lib/address/api/addressApi'; const InformasiPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi, }) => { + const auth = getAuth(); const { isDesktop, isMobile } = useDevice(); const { control, watch, setValue, getValues } = useForm(); const { form, errors, validate, updateForm } = usePengajuanTempoStore(); const [industries, setIndustries] = useState([]); + const [paymentTerm, setPaymentTerm] = useState([]); const [selectedCategory, setSelectedCategory] = useState(''); const [states, setState] = useState([]); const [cities, setCities] = useState([]); @@ -59,7 +63,7 @@ const InformasiPerusahaan = ({ const watchState = watch('state'); useEffect(() => { - updateForm('city', ''); + // updateForm('city', ''); if (watchState) { updateForm('state', `${watchState}`); validate(); @@ -96,17 +100,42 @@ const InformasiPerusahaan = ({ }; loadIndustries(); }, []); - useEffect(() => { const selectedIndustryType = industries.find( - (industry) => industry.value === watch('industry_id') + (industry) => industry.value === watch('industryId') ); if (selectedIndustryType) { - updateForm('industry_id', `${selectedIndustryType?.value}`); + updateForm('industryId', `${selectedIndustryType?.value}`); validate(); setSelectedCategory(selectedIndustryType.category); } - }, [watch('industry_id'), industries]); + }, [watch('industryId'), industries]); + + useEffect(() => { + const loadPaymentTerm = async () => { + const dataPaymentTerm = await odooApi( + 'GET', + '/api/v1/partner/payment_term' + ); + console.log('dataPaymentTerm', dataPaymentTerm); + setPaymentTerm( + dataPaymentTerm?.map((o) => ({ + value: o.id, + label: o.name, + })) + ); + }; + loadPaymentTerm(); + }, []); + useEffect(() => { + const selectedPaymentTerm = paymentTerm.find( + (industry) => industry.value === watch('tempoDuration') + ); + if (selectedPaymentTerm) { + updateForm('tempoDuration', `${selectedPaymentTerm?.value}`); + validate(); + } + }, [watch('tempoDuration'), paymentTerm]); const estimasiValue = watch('estimasi'); const tempoLimitValue = watch('tempoLimit'); @@ -207,7 +236,7 @@ const InformasiPerusahaan = ({ nameRef.current.scrollIntoView(options); return; } - if (errors.industry_id && industry_idRef.current) { + if (errors.industryId && industry_idRef.current) { industry_idRef.current.scrollIntoView(options); return; } @@ -268,8 +297,8 @@ const InformasiPerusahaan = ({ loadIndustries(); }, [buttonSubmitClick, chekValid]); useEffect(() => { - if (form.industry_id) { - setValue('industry_id', parseInt(form.industry_id)); + if (form.industryId) { + setValue('industryId', parseInt(form.industryId)); } if (form.state) { setValue('state', parseInt(form.state)); @@ -278,7 +307,7 @@ const InformasiPerusahaan = ({ setValue('city', parseInt(form.city)); } if (form.tempoDuration) { - setValue('tempoDuration', form.tempoDuration); + setValue('tempoDuration', parseInt(form.tempoDuration)); } if (form.tempoLimit) { setValue('tempoLimit', form.tempoLimit); @@ -298,6 +327,52 @@ const InformasiPerusahaan = ({ } } }, [form]); + useEffect(() => { + const loadProfile = async () => { + try { + const dataProfile = await addressApi({ id: auth.parentId }); + console.log('dataProfile', dataProfile); + if (dataProfile.name) { + updateForm('name', dataProfile.name); + } + if (dataProfile.alamatBisnis) { + updateForm('street', dataProfile.alamatBisnis); + } + if (dataProfile.zip) { + updateForm('zip', dataProfile.zip); + } + if (dataProfile.phone) { + updateForm('mobile', dataProfile.phone.replace(/\D/g, '')); + } + } catch (error) { + console.error('Error loading profile:', error); + } finally { + validate(); + } + }; + + if (auth?.parentId) { + loadProfile(); + } + }, [auth?.parentId, updateForm]); + useEffect(() => { + const loadProfile = async () => { + try { + const dataProfile = await addressApi({ id: auth.parentId }); + + setValue('industryId', parseInt(dataProfile.industryId)); + setValue('state', parseInt(dataProfile.stateId.id)); + setValue('city', parseInt(dataProfile.city.id)); + } catch (error) { + console.error('Error loading profile:', error); + } + }; + + if (auth?.parentId) { + loadProfile(); + } + }, [auth?.parentId, setValue]); + console.log('form', form); return ( <> {isDesktop && ( @@ -325,16 +400,17 @@ const InformasiPerusahaan = ({ placeholder='Masukkan nama perusahaan' type='text' className='form-input' + disabled={true} aria-invalid={errors.name} value={form.name} ref={nameRef} onChange={handleInputChange} /> - {!isKonfirmasi && ( + {/* {!isKonfirmasi && ( <span className='text-xs opacity-60'> Format: PT. INDOTEKNIK DOTCOM GEMILANG </span> - )} + )} */} {chekValid && ( <div className='text-caption-2 text-danger-500 mt-1'> {errors.name} @@ -353,7 +429,7 @@ const InformasiPerusahaan = ({ </div> <div className='w-3/5'> <Controller - name='industry_id' + name='industryId' control={control} render={(props) => ( <HookFormSelect @@ -370,7 +446,7 @@ const InformasiPerusahaan = ({ )} {chekValid && ( <div className='text-caption-2 text-danger-500 mt-1'> - {errors.industry_id} + {errors.industryId} </div> )} </div> @@ -625,9 +701,13 @@ const InformasiPerusahaan = ({ Pilih durasi tempo yang anda inginkan </span> </div> - <div className='w-3/5 flex flex-row items-center'> - <div className='w-1/5' ref={tempoDurationRef}> - <RadioGroup + <div className='w-3/5 flex flex-col '> + <div className='flex flex-row items-center gap-3'> + <div + className={`${isKonfirmasi ? 'w-[75%]' : 'w-[25%]'}`} + ref={tempoDurationRef} + > + {/* <RadioGroup onChange={onChangeTempoDuration} value={form.tempoDuration} > @@ -642,101 +722,122 @@ const InformasiPerusahaan = ({ 30 Hari </Radio> </Stack> - </RadioGroup> - {chekValid && ( - <div className='text-caption-2 text-danger-500 mt-1'> - {errors.tempoDuration} - </div> - )} - </div> - {!isKonfirmasi && ( - <div className='w-4/5 flex flex-row justify-between items-center'> - <div className='w-2/5 text-nowrap'> - <label className='form-label '>Limit Tempo</label> - <span className='text-xs opacity-60'> - Ajukan nilai limit yang anda mau - </span> - </div> - <div - className='flex flex-col justify-start items-start' - ref={tempoLimitRef} - > - <RadioGroup - onChange={(value) => { - if (value === 'custom') { - setIsCustom(true); - updateForm('tempoLimit', tempoLimitValue); // Update dengan nilai input custom jika dipilih - } else { - setIsCustom(false); - onChangeTempoLimit(value); // Update dengan nilai radio button yang dipilih - } - }} - className='flex items-center justify-between' - value={isCustom ? 'custom' : form.tempoLimit} + </RadioGroup> */} + <Controller + name='tempoDuration' + control={control} + render={(props) => ( + <HookFormSelect + {...props} + options={paymentTerm} + placeholder={'Pilih Durasi Tempo'} + /> + )} + /> + + {chekValid && ( + <div className='text-caption-2 text-danger-500 mt-1'> + {errors.tempoDuration} + </div> + )} + </div> + {!isKonfirmasi && ( + <div className='w-[75%] flex flex-row justify-between items-center'> + <div className='w-2/5 text-nowrap flex justify-start items-start flex-col'> + <label className='form-label '>Limit Tempo</label> + <span className='text-xs opacity-60'> + Ajukan nilai limit yang anda mau + </span> + </div> + <div + className='flex flex-col justify-start items-start' + ref={tempoLimitRef} > - <Stack direction='row'> - {/* Kolom 1 */} - <Stack - direction='column' - spacing={2} - className='mr-4' - > - {radioOptions.slice(0, 4).map((option) => ( - <Radio - key={option.value} - colorScheme='red' - value={option.value} - > - {option.label} - </Radio> - ))} - </Stack> + <RadioGroup + onChange={(value) => { + if (value === 'custom') { + setIsCustom(true); + updateForm('tempoLimit', tempoLimitValue); // Update dengan nilai input custom jika dipilih + } else { + setIsCustom(false); + onChangeTempoLimit(value); // Update dengan nilai radio button yang dipilih + } + }} + className='flex items-center justify-between' + value={isCustom ? 'custom' : form.tempoLimit} + > + <Stack direction='row'> + {/* Kolom 1 */} + <Stack + direction='column' + spacing={2} + className='mr-4' + > + {radioOptions.slice(0, 4).map((option) => ( + <Radio + key={option.value} + colorScheme='red' + value={option.value} + > + {option.label} + </Radio> + ))} + </Stack> - {/* Kolom 2 */} - <Stack - direction='column' - className='ml-8' - spacing={2} - > - {radioOptions.slice(4).map((option) => ( - <Radio - key={option.value} - colorScheme='red' - value={option.value} - > - {option.label} - </Radio> - ))} - <div className='flex flex-row items-center'> - <Radio colorScheme='red' value='custom'></Radio> + {/* Kolom 2 */} + <Stack + direction='column' + className='ml-8' + spacing={2} + > + {radioOptions.slice(4).map((option) => ( + <Radio + key={option.value} + colorScheme='red' + value={option.value} + > + {option.label} + </Radio> + ))} + <div className='flex flex-row items-center'> + <Radio + colorScheme='red' + value='custom' + ></Radio> - <input - placeholder='Isi limit yang anda inginkan' - type='text' - className='border ml-2 p-1' // padding untuk memberi ruang untuk "RP" - value={formatRupiah(tempoLimitValueEx)} // Menampilkan nilai terformat - onChange={(e) => { - const value = e.target.value; - const formattedValue = formatRupiah(value); - setTempoLimitValueEx(formattedValue); - updateForm( - 'tempoLimit', - formattedValue.replace(/^Rp\s*/, '') - ); // Mengupdate nilai di react-hook-form - }} - /> - </div> + <input + placeholder='Isi limit yang anda inginkan' + type='text' + className='border ml-2 p-1' // padding untuk memberi ruang untuk "RP" + value={formatRupiah(tempoLimitValueEx)} // Menampilkan nilai terformat + onChange={(e) => { + const value = e.target.value; + const formattedValue = + formatRupiah(value); + setTempoLimitValueEx(formattedValue); + updateForm( + 'tempoLimit', + formattedValue.replace(/^Rp\s*/, '') + ); // Mengupdate nilai di react-hook-form + }} + /> + </div> + </Stack> </Stack> - </Stack> - </RadioGroup> - {chekValid && ( - <div className='text-caption-2 text-danger-500 mt-1'> - {errors.tempoLimit} - </div> - )} + </RadioGroup> + {chekValid && ( + <div className='text-caption-2 text-danger-500 mt-1'> + {errors.tempoLimit} + </div> + )} + </div> </div> - </div> - )} + )} + </div> + <div className='text-red-500'> + *Durasi dan limit dapat berbeda sesuai dengan verifikasi + oleh tim Indoteknik.com + </div> </div> </div> {isKonfirmasi && ( @@ -822,11 +923,6 @@ const InformasiPerusahaan = ({ </div> )} - <div className='text-red-500'> - *Durasi dan limit dapat berbeda sesuai dengan verifikasi oleh - tim Indoteknik.com - </div> - <div className='flex flex-row justify-between items-start'> <div className='w-2/5'> <label className='form-label text-wrap '> @@ -878,7 +974,7 @@ const InformasiPerusahaan = ({ </div> {chekValid && ( <div className='text-caption-2 text-danger-500 mt-1'> - {errors.estimasi} + {errors.bersedia} </div> )} </div> @@ -982,7 +1078,7 @@ const InformasiPerusahaan = ({ <label className='form-label text-nowrap'>Industri</label> <div className='w-full' ref={industry_idRef}> <Controller - name='industry_id' + name='industryId' control={control} render={(props) => ( <HookFormSelect @@ -1002,7 +1098,7 @@ const InformasiPerusahaan = ({ )} {chekValid && ( <div className='text-caption-2 text-danger-500 mt-1'> - {errors.industry_id} + {errors.industryId} </div> )} </div> |
