<iman> pengajuan tempo

1 files changed, 59 insertions, 26 deletions

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index f05dc9ce..52217e56 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -6,6 +6,7 @@ import { UseToastOptions } from '@chakra-ui/react';
 import { toast } from 'react-hot-toast';
 import getFileBase64 from '@/core/utils/getFileBase64';
 import useDevice from '@/core/hooks/useDevice';
+import imageCompression from 'browser-image-compression';
 const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const { control, watch } = useForm();
   const {
@@ -44,15 +45,32 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
 
       // Check for file size
       if (file.size > 500000) {
-        toast.error('Maksimal ukuran file adalah 500Kb', { duration: 4000 });
-
-        event.target.value = '';
-        return;
+        try {
+          const toastId = toast.loading('mencoba mengompresi file...');
+          // Compress image file
+          const options = {
+            maxSizeMB: 0.5, // Target size in MB
+            maxWidthOrHeight: 1920, // Adjust as needed
+            useWebWorker: true,
+          };
+          const compressedFile = await imageCompression(file, options);
+          toast.success('berhasil mengompresi file', { duration: 4000 });
+          // Convert compressed file to Base64
+          fileBase64 = await getFileBase64(compressedFile);
+          updateFormDokumen(
+            name,
+            compressedFile.name,
+            fileExtension,
+            fileBase64
+          );
+        } catch (error) {
+          toast.error('Gagal mengompresi file', { duration: 4000 });
+        }
+      } else {
+        // Convert file to Base64
+        fileBase64 = await getFileBase64(file);
+        updateFormDokumen(name, file.name, fileExtension, fileBase64);
       }
-
-      // Convert file to Base64
-      fileBase64 = await getFileBase64(file);
-      updateFormDokumen(name, file.name, fileExtension, fileBase64);
       validateDokumen();
     }
   };
@@ -139,6 +157,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   useEffect(() => {
     validateDokumen();
   }, [buttonSubmitClick]);
+  console.log('formDokumen', formDokumen);
   return (
     <>
       {isDesktop && (
@@ -155,7 +174,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 >
                   <div>
                     <label className='form-label  text-nowrap'>
-                      NIB (SIUP/TDP/SKDP)
+                      NIB (SIUP/TDP/SKDP){' '}
+                      <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -286,7 +306,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div>
                     <label className='form-label  text-nowrap'>
                       Akta Perubahan{' '}
-                      <span className=' opacity-60'>(Opsional)</span>
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -330,7 +350,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div>
                     <label className='form-label  text-nowrap'>
                       KTP Dirut/Direktur{' '}
-                      <span className=' opacity-60'>(Opsional)</span>
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
+                      <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -378,7 +399,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div>
                     <label className='form-label  text-nowrap'>
                       Akta Pendirian{' '}
-                      <span className=' opacity-60'>(Opsional)</span>
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
+                      <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -511,7 +533,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 >
                   <div>
                     <label className='form-label  text-nowrap'>
-                      Tempat Bekerja
+                      Foto tempat kerja
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -554,6 +576,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             </div>
           </form>
           <div className='w-1/2 mt-8 flex gap-3 flex-col'>
+            <span className='opacity-75 text-danger-500 text-sm'>
+              *Jika anda ingin kredit limit lebih dari 25 Juta, harap lampirkan
+              dokumen yang diberi tanda bintang *)
+            </span>
             <div className='flex justify-between'>
               <p className='font-bold'>Upload Progress</p>
               <p>
@@ -601,7 +627,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             <div className='w-full flex flex-col gap-4'>
               <div className='w-full flex flex-col gap-2' ref={dokumenNibRef}>
                 <label className='form-label  text-nowrap'>
-                  NIB (SIUP/TDP/SKDP)
+                  NIB (SIUP/TDP/SKDP){' '}
+                  <span className='text-danger-500 text-xl'>*</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -609,7 +636,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer   bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenNib?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -647,7 +674,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer   bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenNpwp?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -683,7 +710,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenSppkp?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -724,7 +751,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenAktaPerubahan?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -758,7 +785,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               >
                 <label className='form-label  text-nowrap'>
                   KTP Dirut/Direktur{' '}
-                  <span className=' opacity-60'>(Opsional)</span>
+                  <span className=' opacity-60'>(Opsional)</span>{' '}
+                  <span className='text-danger-500 text-xl'>*</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -766,7 +794,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenKtpDirut?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -799,7 +827,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 ref={dokumenAktaPendirianRef}
               >
                 <label className='form-label  text-nowrap'>
-                  Akta Pendirian <span className=' opacity-60'>(Opsional)</span>
+                  Akta Pendirian <span className=' opacity-60'>(Opsional)</span>{' '}
+                  <span className='text-danger-500 text-xl'>*</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -807,7 +836,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenAktaPendirian?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -849,7 +878,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenLaporanKeuangan?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -890,7 +919,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenFotoKantor?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -923,7 +952,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 ref={dokumenTempatBekerjaRef}
               >
                 <label className='form-label  text-nowrap'>
-                  Tempat Bekerja
+                  Foto tempat kerja
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -931,7 +960,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
                     {formDokumen?.dokumenTempatBekerja?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -961,6 +990,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             </div>
           </form>
           <div className='w-full mt-8 flex gap-3 flex-col'>
+            <span className='opacity-75 text-danger-500 text-xs'>
+              *Jika anda ingin kredit limit lebih dari 25 Juta, harap lampirkan
+              dokumen yang diberi tanda bintang *)
+            </span>
             <div className='flex justify-between'>
               <p className='font-bold'>Upload Progress</p>
               <p>