diff options
6 files changed, 175 insertions, 158 deletions
diff --git a/src-migrate/modules/register/stores/usePengajuanTempoStore.ts b/src-migrate/modules/register/stores/usePengajuanTempoStore.ts index be5a3e45..47168a2a 100644 --- a/src-migrate/modules/register/stores/usePengajuanTempoStore.ts +++ b/src-migrate/modules/register/stores/usePengajuanTempoStore.ts @@ -355,6 +355,7 @@ export const usePengajuanTempoStoreDokumen = create< })); type StateSupplier = { + hasSavedata: boolean; formSupplier: TempoPropsSupplier[]; errorsSupplier: { [key in keyof TempoPropsSupplier]?: string; @@ -362,33 +363,24 @@ type StateSupplier = { }; type ActionSupplier = { updateFormSupplier: (data: TempoPropsSupplier[]) => void; - + updateHasSave: (data: boolean) => void; validateSupplier: () => void; }; export const usePengajuanTempoStoreSupplier = create< StateSupplier & ActionSupplier >((set, get) => ({ formSupplier: [], + hasSavedata: false, updateFormSupplier: (data) => { set(() => ({ - formSupplier: data, // Menyimpan data baru ke dalam formSupplier + formSupplier: data, })); }, - - errorsSupplier: {}, - validateSupplier: () => { - // try { - // TempoSchemaSupplier.parse(get().formSupplier); - // set({ errorsSupplier: {} }); - // } catch (error) { - // if (error instanceof ZodError) { - // const errorsSupplier: StateSupplier['errorsSupplier'] = {}; - // error.errors.forEach( - // (e) => - // (errorsSupplier[e.path[0] as keyof TempoPropsSupplier] = e.message) - // ); - // set({ errorsSupplier }); - // } - // } + updateHasSave: (data) => { + set(() => ({ + hasSavedata: data, + })); }, + errorsSupplier: {}, + validateSupplier: () => {}, })); diff --git a/src/lib/pengajuan-tempo/api/createPengajuanTempoApi.js b/src/lib/pengajuan-tempo/api/createPengajuanTempoApi.js index 2d3a7357..af1d6c3a 100644 --- a/src/lib/pengajuan-tempo/api/createPengajuanTempoApi.js +++ b/src/lib/pengajuan-tempo/api/createPengajuanTempoApi.js @@ -1,15 +1,13 @@ import odooApi from '@/core/api/odooApi'; import { getAuth } from '@/core/utils/auth'; -const createPengajuanTempoApi = async ({ data }) => { +const createPengajuanTempoApi = async (data) => { const auth = getAuth(); - console.log('data', data); const dataPengajuanTempo = await odooApi( 'POST', `/api/v1/partner/pengajuan_tempo`, data ); - console.log('dataPengajuanTempo', dataPengajuanTempo); return dataPengajuanTempo; }; diff --git a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx index 0efea807..11079328 100644 --- a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx +++ b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx @@ -19,6 +19,9 @@ import { } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore'; import { ChevronRightIcon, ChevronLeftIcon } from '@heroicons/react/24/outline'; import createPengajuanTempoApi from '../api/createPengajuanTempoApi'; +import { Button, Checkbox, Spinner, Tooltip } from '@chakra-ui/react'; +import clsxm from '~/libs/clsxm'; +import { toast } from 'react-hot-toast'; const PengajuanTempo = () => { const [currentStep, setCurrentStep] = React.useState(0); const NUMBER_OF_STEPS = 6; @@ -34,8 +37,14 @@ const PengajuanTempo = () => { validateKontakPerson, updateFormKontakPerson, } = usePengajuanTempoStoreKontakPerson(); - const { formSupplier, errorsSupplier, validateSupplier, updateFormSupplier } = - usePengajuanTempoStoreSupplier(); + const { + formSupplier, + errorsSupplier, + validateSupplier, + updateFormSupplier, + hasSavedata, + updateHasSave, + } = usePengajuanTempoStoreSupplier(); const { formPengiriman, errorsPengiriman, @@ -90,31 +99,6 @@ const PengajuanTempo = () => { 'Dokumen', 'Konfirmasi', ]; - const combineForms = () => { - return stepDivsForm.reduce((accumulator, currentForm, index) => { - if (currentForm && typeof currentForm === 'object') { - if (index === 3) { - if (!accumulator.formSupplier) { - accumulator.formSupplier = []; - } - accumulator.formSupplier.push(...currentForm); - } else { - return { ...accumulator, ...currentForm }; - } - } - return accumulator; - }, {}); - }; - - // const stepLabels = [ - // `${auth.partnerId}_informasi_perusahaan`, - // `${auth.partnerId}_kontak_person`, - // `${auth.partnerId}_Pengiriman`, - // `${auth.partnerId}_Referensi`, - // `${auth.partnerId}_Dokumen`, - // `${auth.partnerId}_Konfirmasi`, - // ]; - const isFormValid = useMemo( () => Object.keys(stepDivsError[currentStep]).length === 0, [stepDivsError[currentStep]] @@ -124,6 +108,7 @@ const PengajuanTempo = () => { validateKontakPerson(); validatePengiriman(); validateDokumen(); + updateHasSave(false); window.scrollTo({ top: 0, @@ -134,11 +119,9 @@ const PengajuanTempo = () => { useEffect(() => { const cachedData = getFromLocalStorage(stepLabels[currentStep]); if (cachedData) { - // const formData = JSON.parse(cachedData); if (currentStep == 3) { stepDivsUpdateForm[currentStep](cachedData); } else if (currentStep == 4) { - // Memanggil updateFormDokumen dengan parameter yang benar Object.keys(cachedData).forEach((key) => { const { name, format, base64 } = cachedData[key]; stepDivsUpdateForm[currentStep](key, name, format, base64); @@ -149,8 +132,6 @@ const PengajuanTempo = () => { }); } } - if (formSupplier) { - } }, [currentStep]); const goToNextStep = () => { if (!isFormValid) { @@ -167,43 +148,39 @@ const PengajuanTempo = () => { const handleDaftarTempo = async () => { for (const error of stepDivsError) { if (error.length > 0) { - console.log('ada yang salah'); - return; // Keluar dari fungsi jika ada error + return; } } - const combinedData = combineForms(); - console.log('combinedData', combinedData); - const data = { - ...combinedData, - parent_id: auth.partnerId, - }; - const productOrder = formSupplier.map((product) => ({ supplier: product.supplier, pic: product.pic, telepon: product.telepon, - quantitydurasiTempo: product.durasiTempo, + durasiTempo: product.durasiTempo, creditLimit: product.creditLimit, })); + + const formattedDokumen = Object.entries(formDokumen).map(([key, doc]) => ({ + documentName: key, + details: { + name: doc.name, + format: doc.format, + base64: doc.base64, + }, + })); const data2 = { - form: JSON.stringify(productOrder), - parent_id: auth.partnerId, + ...form, + ...formKontakPerson, + ...formPengiriman, + formDocs: JSON.stringify(formattedDokumen), + formSupplier: JSON.stringify(productOrder), + user_id: auth.id, }; - const address = await createPengajuanTempoApi({ combinedData }); - - console.log('Sukses Daftar'); - // router.push('/pengajuan-tempo/finish?tempo_id=SO-2023-06480'); - - // if (!isFormValid) { - // setNotValid(true); - // setButtonSubmitClick(!buttonSubmitClick); - // return; - // } else { - // saveToLocalStorage(stepLabels[currentStep], stepDivsForm[currentStep]); - // setButtonSubmitClick(!buttonSubmitClick); - // setNotValid(false); - // } - // setCurrentStep((prev) => (prev === NUMBER_OF_STEPS - 1 ? prev : prev + 1)); + const address = await createPengajuanTempoApi(data2); + if (address) { + removeFromLocalStorage(); + toast.success('Pengajuan tempo berhasil dilakukan', { duration: 4000 }); + router.push('/pengajuan-tempo/finish?tempo_id=SO-2023-06480'); + } }; const goToPreviousStep = () => { @@ -221,6 +198,11 @@ const PengajuanTempo = () => { const item = JSON.parse(itemStr); return item; }; + const removeFromLocalStorage = () => { + for (const key of stepLabels) { + localStorage.removeItem(key); + } + }; return ( <> @@ -241,43 +223,35 @@ const PengajuanTempo = () => { <Stepper currentStep={currentStep} numberOfSteps={NUMBER_OF_STEPS} /> </div> <div>{stepDivs[currentStep]}</div> - <section className='flex gap-10 mt-10'> - {/* <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> */} - </section> + <section className='flex gap-10 mt-10'></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={goToPreviousStep} - 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' - disabled={currentStep === 0} // Disable if on the first step - > - {<ChevronLeftIcon className='w-5' />} - Langkah Sebelumnya - </button> */} {currentStep < 5 && ( - <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' + <Tooltip + label={clsxm({ + 'Klik simpan data terlebih dahulu': + currentStep === 3 && !hasSavedata, + })} > - Langkah Selanjutnya {<ChevronRightIcon className='w-5' />} - </button> + <Button + colorScheme='red' + w='fit' + isDisabled={ + (currentStep === 3 && !hasSavedata) || + currentStep === NUMBER_OF_STEPS - 1 + } + onClick={goToNextStep} + > + Langkah Selanjutnya {<ChevronRightIcon className='w-5' />} + </Button> + </Tooltip> )} {currentStep == 5 && ( - <button - onClick={handleDaftarTempo} - 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' - > + <Button colorScheme='red' w='fit' onClick={handleDaftarTempo}> Daftar Tempo {<ChevronRightIcon className='w-5' />} - </button> + </Button> )} </div> </div> diff --git a/src/lib/pengajuan-tempo/component/Pengiriman.jsx b/src/lib/pengajuan-tempo/component/Pengiriman.jsx index 89d8ed44..c2308aed 100644 --- a/src/lib/pengajuan-tempo/component/Pengiriman.jsx +++ b/src/lib/pengajuan-tempo/component/Pengiriman.jsx @@ -122,34 +122,39 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { const handleEveryWeekday = () => { setEveryWeekday(!everyWeekday); - updateFormPengiriman('everyWeekday', everyWeekday); - validatePengiriman(); }; const handleEveryWeek = () => { setEveryWeek(!everyWeek); - updateFormPengiriman('everyWeek', everyWeek); - validatePengiriman(); }; const handleTukarInvoice = () => { setTukarInvoice(!tukarInvoice); - updateFormPengiriman('tukarInvoice', tukarInvoice); - validatePengiriman(); }; const handleEveryWeekdayPembayaran = () => { setEveryWeekdayPembayaran(!everyWeekdayPembayaran); - updateFormPengiriman('everyWeekdayPembayaran', everyWeekdayPembayaran); - validatePengiriman(); }; const handleEveryWeekPembayaran = () => { setEveryWeekPembayaran(!everyWeekPembayaran); - updateFormPengiriman('everyWeekPembayaran', everyWeekPembayaran); - validatePengiriman(); }; const handleTukarInvoicePembayaran = () => { setTukarInvoicePembayaran(!tukarInvoicePembayaran); + }; + + useEffect(() => { + updateFormPengiriman('everyWeekday', everyWeekday); + updateFormPengiriman('everyWeek', everyWeek); + updateFormPengiriman('tukarInvoice', tukarInvoice); + updateFormPengiriman('everyWeekdayPembayaran', everyWeekdayPembayaran); + updateFormPengiriman('everyWeekPembayaran', everyWeekPembayaran); updateFormPengiriman('tukarInvoicePembayaran', tukarInvoicePembayaran); validatePengiriman(); - }; + }, [ + everyWeekday, + everyWeek, + tukarInvoice, + everyWeekdayPembayaran, + everyWeekPembayaran, + tukarInvoicePembayaran, + ]); const isFormValid = useMemo( () => Object.keys(errorsPengiriman).length === 0, @@ -288,6 +293,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { const item = JSON.parse(itemStr); return item; }; + const cachedData = getFromLocalStorage('Pengiriman'); useEffect(() => { if (cachedData) { @@ -307,6 +313,48 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { updateFormPengiriman('isSameAddrees', `${cachedData.isSameAddrees}`); } }, [cachedData.cityPengiriman]); + useEffect(() => { + if (cachedData.everyWeek) { + updateFormPengiriman('everyWeek', cachedData.everyWeek); + setEveryWeek(cachedData.everyWeek); + } + if (cachedData.everyWeekday) { + updateFormPengiriman('everyWeekday', cachedData.everyWeekday); + setEveryWeekday(cachedData.everyWeekday); + } + if (cachedData.tukarInvoice) { + updateFormPengiriman('tukarInvoice', cachedData.tukarInvoice); + setTukarInvoice(cachedData.tukarInvoice); + } + if (cachedData.everyWeekPembayaran) { + updateFormPengiriman( + 'everyWeekPembayaran', + cachedData.everyWeekPembayaran + ); + setEveryWeekPembayaran(cachedData.everyWeekPembayaran); + } + if (cachedData.everyWeekdayPembayaran) { + updateFormPengiriman( + 'everyWeekdayPembayaran', + cachedData.everyWeekdayPembayaran + ); + setEveryWeekdayPembayaran(cachedData.everyWeekdayPembayaran); + } + if (cachedData.tukarInvoicePembayaran) { + updateFormPengiriman( + 'tukarInvoicePembayaran', + cachedData.tukarInvoicePembayaran + ); + setTukarInvoicePembayaran(cachedData.tukarInvoicePembayaran); + } + }, [ + cachedData.everyWeek, + cachedData.everyWeekday, + cachedData.tukarInvoice, + cachedData.everyWeekdayPembayaran, + cachedData.everyWeekPembayaran, + cachedData.tukarInvoicePembayaran, + ]); const handleChangeSameAddress = () => { setSameAddress(!sameAddress); }; @@ -706,33 +754,33 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { > <Checkbox colorScheme='red' - key='1' - isChecked={isChecked(1)} - onChange={() => handleCheckboxChange(1)} + key='0' + isChecked={isChecked(0)} + onChange={() => handleCheckboxChange(0)} > Surat Tanda Terima Barang (STTB) </Checkbox> <Checkbox colorScheme='red' - key='2' + key='1' isChecked={isChecked(2)} - onChange={() => handleCheckboxChange(2)} + onChange={() => handleCheckboxChange(1)} > Good Receipt (GR) </Checkbox> <Checkbox colorScheme='red' - key='3' - isChecked={isChecked(3)} - onChange={() => handleCheckboxChange(3)} + key='2' + isChecked={isChecked(2)} + onChange={() => handleCheckboxChange(2)} > Surat Terima Barang (STB) </Checkbox> <Checkbox colorScheme='red' - key='4' - isChecked={isChecked(4)} - onChange={() => handleCheckboxChange(4)} + key='3' + isChecked={isChecked(3)} + onChange={() => handleCheckboxChange(3)} > Lembar Penerimaan Barang (LPB) </Checkbox> @@ -741,8 +789,8 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { <Checkbox colorScheme='red' key='4' - isChecked={isChecked(5)} - onChange={() => handleCheckboxChange(5)} + isChecked={isChecked(4)} + onChange={() => handleCheckboxChange(4)} > Lainnya </Checkbox> @@ -782,11 +830,19 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { > <Checkbox colorScheme='red' + key='0' + isChecked={isCheckedInvoice(0)} + onChange={() => handleCheckboxChangeDokumenPengirimanInvoice(0)} + > + Invoice Pembelian + </Checkbox> + <Checkbox + colorScheme='red' key='1' isChecked={isCheckedInvoice(1)} onChange={() => handleCheckboxChangeDokumenPengirimanInvoice(1)} > - Invoice Pembelian + Surat Jalan </Checkbox> <Checkbox colorScheme='red' @@ -794,7 +850,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { isChecked={isCheckedInvoice(2)} onChange={() => handleCheckboxChangeDokumenPengirimanInvoice(2)} > - Surat Jalan + Berita Acara Serah Terima (BAST) </Checkbox> <Checkbox colorScheme='red' @@ -802,7 +858,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { isChecked={isCheckedInvoice(3)} onChange={() => handleCheckboxChangeDokumenPengirimanInvoice(3)} > - Berita Acara Serah Terima (BAST) + Faktur Pajak </Checkbox> <Checkbox colorScheme='red' @@ -810,24 +866,16 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => { isChecked={isCheckedInvoice(4)} onChange={() => handleCheckboxChangeDokumenPengirimanInvoice(4)} > - Faktur Pajak - </Checkbox> - <Checkbox - colorScheme='red' - key='4' - isChecked={isCheckedInvoice(5)} - onChange={() => handleCheckboxChangeDokumenPengirimanInvoice(5)} - > Good Receipt (GR) </Checkbox> <div className='flex gap-3 flex-col'> <Checkbox colorScheme='red' - key='4' - isChecked={isCheckedInvoice(6)} + key='5' + isChecked={isCheckedInvoice(5)} onChange={() => - handleCheckboxChangeDokumenPengirimanInvoice(6) + handleCheckboxChangeDokumenPengirimanInvoice(5) } > Lainnya diff --git a/src/lib/pengajuan-tempo/component/Referensi.jsx b/src/lib/pengajuan-tempo/component/Referensi.jsx index b7c112a6..8732c60f 100644 --- a/src/lib/pengajuan-tempo/component/Referensi.jsx +++ b/src/lib/pengajuan-tempo/component/Referensi.jsx @@ -18,7 +18,8 @@ const Referensi = ({ chekValid, buttonSubmitClick }) => { resolver: yupResolver(validationSchema), defaultValues, }); - const { formSupplier, updateFormSupplier } = usePengajuanTempoStoreSupplier(); + const { formSupplier, updateFormSupplier, updateHasSave } = + usePengajuanTempoStoreSupplier(); const [formData, setFormData] = useState([ { supplier: '', @@ -54,6 +55,7 @@ const Referensi = ({ chekValid, buttonSubmitClick }) => { ); setSupplierData(editData); + updateHasSave(false); }; const handleNewSupplierChange = (e) => { @@ -84,6 +86,7 @@ const Referensi = ({ chekValid, buttonSubmitClick }) => { // creditLimit: '', // }); // } + updateHasSave(false); }; const handleAddNewSupplier = () => { @@ -103,6 +106,7 @@ const Referensi = ({ chekValid, buttonSubmitClick }) => { creditLimit: '', }); } + updateHasSave(false); }; useEffect(() => { @@ -127,6 +131,7 @@ const Referensi = ({ chekValid, buttonSubmitClick }) => { creditLimit: '', }); } + updateHasSave(true); }; const formatRupiah = (value) => { if (!value) return ''; diff --git a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx index 53181027..95379fc2 100644 --- a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx +++ b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx @@ -19,18 +19,18 @@ const informasiPerusahaan = ({ const [cities, setCities] = useState([]); const [bersedia, setBersedia] = useState(null); const category_produk = [ - { id: 1, name: 'Pengaman, Kesehatan & Keamanan' }, - { id: 2, name: 'Perkakas Tangan, Listrik & Pneumatic' }, - { id: 3, name: 'Mesin Industrial' }, - { id: 4, name: 'Mesin Pertanian & Perkebunan' }, - { id: 5, name: 'Mesin Pembersih & Janitorial' }, - { id: 6, name: 'Cairan Berbahan Kimia' }, - { id: 7, name: 'Perlengkapan Pengukuran & Pengujian' }, - { id: 8, name: 'Peralatan Listrik & Elektronik' }, - { id: 9, name: 'Perlengkapan Logistik & Gudang' }, - { id: 10, name: 'Peralatan Kantor & Stationery' }, - { id: 11, name: 'Komponen & Aksesoris' }, - { id: 12, name: 'Peralatan Horeca & Food Service' }, + { id: 2040, name: 'Pengaman, Kesehatan & Keamanan' }, + { id: 2097, name: 'Perkakas Tangan, Listrik & Pneumatic' }, + { id: 2161, name: 'Mesin Industrial' }, + { id: 2222, name: 'Mesin Pertanian & Perkebunan' }, + { id: 2246, name: 'Mesin Pembersih & Janitorial' }, + { id: 2273, name: 'Cairan Berbahan Kimia' }, + { id: 2315, name: 'Perlengkapan Pengukuran & Pengujian' }, + { id: 2354, name: 'Peralatan Listrik & Elektronik' }, + { id: 2394, name: 'Perlengkapan Logistik & Gudang' }, + { id: 2420, name: 'Peralatan Kantor & Stationery' }, + { id: 2445, name: 'Komponen & Aksesoris' }, + { id: 2477, name: 'Peralatan Horeca & Food Service' }, ]; const radioOptions = [ { label: '5.000.000', value: '5000000' }, |
