From e9cd13307f0095dc4edc5048752675d80c551564 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 6 Dec 2024 17:06:26 +0700 Subject: pengajuan tempo --- src/lib/pengajuan-tempo/component/Pengiriman.jsx | 1310 ++++++++++------------ 1 file changed, 601 insertions(+), 709 deletions(-) (limited to 'src/lib/pengajuan-tempo/component/Pengiriman.jsx') diff --git a/src/lib/pengajuan-tempo/component/Pengiriman.jsx b/src/lib/pengajuan-tempo/component/Pengiriman.jsx index 8b8961c5..0352b54f 100644 --- a/src/lib/pengajuan-tempo/component/Pengiriman.jsx +++ b/src/lib/pengajuan-tempo/component/Pengiriman.jsx @@ -9,7 +9,7 @@ import { usePengajuanTempoStorePengiriman, usePengajuanTempoStore, } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore'; - +import { toast } from 'react-hot-toast'; import useDevice from '@/core/hooks/useDevice'; const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { const { control, watch, setValue } = useForm(); @@ -102,7 +102,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { const watchState = watch('statePengiriman'); useEffect(() => { - updateFormPengiriman('cityPengiriman', ''); + // updateFormPengiriman('cityPengiriman', ''); if (watchState) { updateFormPengiriman('statePengiriman', `${watchState}`); validatePengiriman(); @@ -352,35 +352,63 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { if (sameAddress) { updateFormPengiriman('streetInvoice', formPengiriman.streetPengiriman); updateFormPengiriman('stateInvoice', formPengiriman.statePengiriman); + setValue('stateInvoice', parseInt(formPengiriman.statePengiriman)); updateFormPengiriman('cityInvoice', formPengiriman.cityPengiriman); + setValue('cityInvoice', parseInt(formPengiriman.cityPengiriman)); + updateFormPengiriman('isSameAddrees', `${sameAddress}`); } else { - updateFormPengiriman('streetInvoice', ''); - updateFormPengiriman('stateInvoice', ''); - updateFormPengiriman('cityInvoice', ''); - setValue('streetInvoice', ''); - setValue('stateInvoice', ''); - setValue('cityInvoice', ''); + // updateFormPengiriman('streetInvoice', ''); + // updateFormPengiriman('stateInvoice', ''); + // updateFormPengiriman('cityInvoice', ''); + // setValue('streetInvoice', ''); + // setValue('stateInvoice', ''); + // setValue('cityInvoice', ''); } - updateFormPengiriman('isSameAddrees', `${sameAddress}`); validatePengiriman(); - }, [sameAddress]); + }, [ + sameAddress, + formPengiriman.streetPengiriman, + formPengiriman.statePengiriman, + formPengiriman.cityPengiriman, + ]); + useEffect(() => { + if (formPengiriman.sameAddressStreet?.toLowerCase().includes('true')) { + setSameAddressStreet(true); + } else { + setSameAddressStreet(false); + } + }, [formPengiriman.sameAddressStreet]); + useEffect(() => { + if (formPengiriman.statePengiriman) { + setValue('statePengiriman', parseInt(formPengiriman.statePengiriman)); + } + }, [formPengiriman.statePengiriman]); + useEffect(() => { + if (formPengiriman.cityPengiriman) { + setValue('cityPengiriman', parseInt(formPengiriman.cityPengiriman)); + } + }, [formPengiriman.cityPengiriman]); useEffect(() => { if (sameAddressStreet) { + console.log('form.state', form); updateFormPengiriman('streetPengiriman', form.street); updateFormPengiriman('statePengiriman', form.state); + setValue('statePengiriman', parseInt(form.state)); updateFormPengiriman('cityPengiriman', form.city); + setValue('cityPengiriman', parseInt(form.city)); updateFormPengiriman('zipPengiriman', form.zip); - } else { - updateFormPengiriman('streetPengiriman', ''); - updateFormPengiriman('statePengiriman', ''); - updateFormPengiriman('cityPengiriman', ''); - updateFormPengiriman('zipPengiriman', ''); - setValue('streetPengiriman', ''); - setValue('statePengiriman', ''); - setValue('cityPengiriman', ''); + updateFormPengiriman('isSameAddreesStreet', `${sameAddressStreet}`); } - updateFormPengiriman('isSameAddreesStreet', `${sameAddressStreet}`); + // else { + // updateFormPengiriman('streetPengiriman', ''); + // updateFormPengiriman('statePengiriman', ''); + // updateFormPengiriman('cityPengiriman', ''); + // updateFormPengiriman('zipPengiriman', ''); + // setValue('streetPengiriman', ''); + // setValue('statePengiriman', ''); + // setValue('cityPengiriman', ''); + // } validatePengiriman(); }, [sameAddressStreet]); @@ -459,8 +487,70 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { setSameAddress(!sameAddress); }; const handleChangeSameAddressStreet = () => { + // updateFormPengiriman('sameAddressStreet', `${!sameAddressStreet}`); setSameAddressStreet(!sameAddressStreet); + if (sameAddressStreet == false) { + updateFormPengiriman('streetPengiriman', ''); + updateFormPengiriman('statePengiriman', ''); + updateFormPengiriman('cityPengiriman', ''); + updateFormPengiriman('zipPengiriman', ''); + setValue('streetPengiriman', ''); + setValue('statePengiriman', ''); + setValue('cityPengiriman', ''); + updateFormPengiriman('isSameAddreesStreet', `${sameAddressStreet}`); + validate(); + } }; + + useEffect(() => { + const options = { + behavior: 'smooth', + block: 'center', + }; + + const loadIndustries = async () => { + const watchZip = formPengiriman.zipPengiriman?.trim(); // Menghapus spasi berlebih + + // Validasi: hanya eksekusi jika watchZip valid (contoh: minimal 5 karakter) + if (watchZip && watchZip.length >= 5) { + const loadZip = async () => { + try { + const response = await fetch( + `https://alamat.thecloudalert.com/api/cari/index/?keyword=${watchZip}` + ); + + const result = await response.json(); + + if (!result.result.length > 0) { + toast.error('Alamat pos salah'); + updateFormPengiriman('zipPengiriman', ''); // Reset form.zip jika salah + validate(); // Memanggil validasi formulir + return false; + } else { + updateFormPengiriman('zipPengiriman', watchZip); + validate(); + return true; // Jika valid + } + } catch (error) { + toast.error('Terjadi kesalahan saat memeriksa alamat pos.'); + console.error('Error:', error); + return false; + } + }; + + const isValidZip = await loadZip(); + if (!isValidZip) { + zipRef.current.scrollIntoView(options); + } + } + }; + + loadIndustries(); + }, [formPengiriman.zipPengiriman]); + + console.log('formPengiriman', formPengiriman); + console.log('errorsPengiriman', errorsPengiriman); + return ( <> {isDesktop && ( @@ -477,18 +567,33 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
- +
+ + +
{chekValid && (
{errorsPengiriman.PICName} @@ -515,92 +620,95 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { isChecked={sameAddressStreet} onChange={handleChangeSameAddressStreet} > - Alamat Pengiriman sama dengan alamat pengiriman + Alamat Pengiriman sama dengan alamat bisnis - {!sameAddressStreet && ( - <> -
+ + <> +
+ + {chekValid && ( +
+ {errorsPengiriman.streetPengiriman} +
+ )} +
+
+
+ ( + + )} + /> + {chekValid && ( +
+ {errorsPengiriman.statePengiriman} +
+ )} +
+
+ ( + + )} + /> + {chekValid && ( +
+ {errorsPengiriman.cityPengiriman} +
+ )} +
+
{chekValid && (
- {errorsPengiriman.streetPengiriman} + {errorsPengiriman.zipPengiriman}
)}
-
-
- ( - - )} - /> - {chekValid && ( -
- {errorsPengiriman.statePengiriman} -
- )} -
-
- ( - - )} - /> - {chekValid && ( -
- {errorsPengiriman.cityPengiriman} -
- )} -
-
- - {chekValid && ( -
- {errorsPengiriman.zipPengiriman} -
- )} -
-
- - )} +
+
@@ -611,18 +719,33 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
- +
+ + +
{chekValid && (
{errorsPengiriman.invoicePic} @@ -653,75 +776,76 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { Alamat invoice sama dengan alamat pengiriman
- {!sameAddress && ( - <> -
- +
+ + {chekValid && ( +
+ {errorsPengiriman.streetInvoice} +
+ )} +
+
+
+ ( + + )} /> {chekValid && (
- {errorsPengiriman.streetInvoice} + {errorsPengiriman.stateInvoice}
)}
-
-
- ( - - )} - /> - {chekValid && ( -
- {errorsPengiriman.stateInvoice} -
- )} -
-
- ( - - )} - /> - {chekValid && ( -
- {errorsPengiriman.cityInvoice} -
+
+ ( + )} -
+ /> + {chekValid && ( +
+ {errorsPengiriman.cityInvoice} +
+ )}
- - )} +
+
@@ -738,59 +862,17 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { )}
- -
- - Setiap Minggu di hari - - -
-
- - Setiap Bulan di minggu ke - - -
-
- - Lainnya - -