summaryrefslogtreecommitdiff
path: root/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx')
-rw-r--r--src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx771
1 files changed, 595 insertions, 176 deletions
diff --git a/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx b/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
index 19b7fed2..ca571167 100644
--- a/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
@@ -178,16 +178,116 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
<h1 className={`font-bold ${isKonfirmasi ? 'text-xl' : ''}`}>
Dokumen
</h1>
- <form className='flex flex-col w-full gap-5'>
- <div className='w-full flex flex-row items-center '>
- <div className='w-2/5'>
+ <form className='flex flex-col w-full gap-5 '>
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5 flex'>
<label className='form-label text-nowrap'>
- NIB (SIUP/TDP/SKDP)
+ NPWP Perusahaan
</label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenNpwp?.name}
+ </span>
+ <div className='w-2/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenNpwp'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenNpwp?.name ? 'Ubah' : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenNpwp'
+ name='dokumenNpwp'
+ type='file'
+ title=' '
+ ref={dokumenNpwpRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenNpwp}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenNpwp.format,
+ formDokumen.dokumenNpwp.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenNpwp}
+ </div>
+ )}
+ </div>
+ </div>
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
+ <label className='form-label text-nowrap'>SPPKP</label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenSppkp?.name}
+ </span>
+ <div className='w-2/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenSppkp'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenSppkp?.name.length > 0
+ ? 'Ubah'
+ : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenSppkp'
+ name='dokumenSppkp'
+ type='file'
+ title=' '
+ ref={dokumenSppkpRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenSppkp}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenSppkp.format,
+ formDokumen.dokumenSppkp.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenSppkp}
+ </div>
+ )}
+ </div>
+ </div>
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
+ <label className='form-label text-nowrap'>NIB</label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
{formDokumen?.dokumenNib?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
@@ -230,33 +330,33 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
)}
</div>
</div>
+
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
<label className='form-label text-nowrap'>
- NPWP Perusahaan
+ SIUP <span className=' opacity-60'>(Opsional)</span>
</label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
- {formDokumen?.dokumenNpwp?.name}
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenSiup?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
<label
- htmlFor='dokumenNpwp'
+ htmlFor='dokumenSiup'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
>
- {formDokumen?.dokumenNpwp?.name ? 'Ubah' : 'Upload'}
+ {formDokumen.dokumenSiup.name ? 'Ubah' : 'Upload'}
</label>
<input
// value={formDokumen?.dokumenNib?.name}
- id='dokumenNpwp'
- name='dokumenNpwp'
+ id='dokumenSiup'
+ name='dokumenSiup'
type='file'
title=' '
- ref={dokumenNpwpRef}
className='hidden'
- aria-invalid={errorsDokumen.dokumenNpwp}
+ aria-invalid={errorsDokumen.dokumenSiup}
onChange={handleInputChange}
accept='.pdf,.png,.jpg,.jpeg'
/>
@@ -265,8 +365,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
type='button'
onClick={() =>
handleConfirmSubmit(
- formDokumen.dokumenNpwp.format,
- formDokumen.dokumenNpwp.base64
+ formDokumen.dokumenSiup.format,
+ formDokumen.dokumenSiup.base64
)
}
>
@@ -276,38 +376,38 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
{chekValid && (
<div className='text-caption-2 text-danger-500 mt-1'>
- {errorsDokumen.dokumenNpwp}
+ {errorsDokumen.dokumenSiup}
</div>
)}
</div>
</div>
+
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
- <label className='form-label text-nowrap'>SPPKP</label>
+ <label className='form-label text-nowrap'>
+ TDP <span className=' opacity-60'>(Opsional)</span>
+ </label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
- {formDokumen?.dokumenSppkp?.name}
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenTdp?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
<label
- htmlFor='dokumenSppkp'
+ htmlFor='dokumenTdp'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
>
- {formDokumen?.dokumenSppkp?.name.length > 0
- ? 'Ubah'
- : 'Upload'}
+ {formDokumen.dokumenTdp.name ? 'Ubah' : 'Upload'}
</label>
<input
// value={formDokumen?.dokumenNib?.name}
- id='dokumenSppkp'
- name='dokumenSppkp'
+ id='dokumenTdp'
+ name='dokumenTdp'
type='file'
title=' '
- ref={dokumenSppkpRef}
className='hidden'
- aria-invalid={errorsDokumen.dokumenSppkp}
+ aria-invalid={errorsDokumen.dokumenTdp}
onChange={handleInputChange}
accept='.pdf,.png,.jpg,.jpeg'
/>
@@ -316,8 +416,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
type='button'
onClick={() =>
handleConfirmSubmit(
- formDokumen.dokumenSppkp.format,
- formDokumen.dokumenSppkp.base64
+ formDokumen.dokumenTdp.format,
+ formDokumen.dokumenTdp.base64
)
}
>
@@ -327,7 +427,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
{chekValid && (
<div className='text-caption-2 text-danger-500 mt-1'>
- {errorsDokumen.dokumenSppkp}
+ {errorsDokumen.dokumenTdp}
</div>
)}
</div>
@@ -336,33 +436,29 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
<label className='form-label text-nowrap'>
- {' '}
- Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
+ SKDP <span className=' opacity-60'>(Opsional)</span>
</label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
- {formDokumen?.dokumenAktaPerubahan?.name}
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenSkdp?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
<label
- htmlFor='dokumenAktaPerubahan'
+ htmlFor='dokumenSkdp'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
>
- {formDokumen.dokumenAktaPerubahan.name
- ? 'Ubah'
- : 'Upload'}
+ {formDokumen.dokumenSkdp.name ? 'Ubah' : 'Upload'}
</label>
<input
// value={formDokumen?.dokumenNib?.name}
- id='dokumenAktaPerubahan'
- name='dokumendokumenAktaPerubahanSppkp'
+ id='dokumenSkdp'
+ name='dokumenSkdp'
type='file'
title=' '
- ref={dokumenAktaPerubahanRef}
className='hidden'
- aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+ aria-invalid={errorsDokumen.dokumenSkdp}
onChange={handleInputChange}
accept='.pdf,.png,.jpg,.jpeg'
/>
@@ -371,8 +467,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
type='button'
onClick={() =>
handleConfirmSubmit(
- formDokumen.dokumenAktaPerubahan.format,
- formDokumen.dokumenAktaPerubahan.base64
+ formDokumen.dokumenSkdp.format,
+ formDokumen.dokumenSkdp.base64
)
}
>
@@ -382,7 +478,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
{chekValid && (
<div className='text-caption-2 text-danger-500 mt-1'>
- {errorsDokumen.dokumenAktaPerubahan}
+ {errorsDokumen.dokumenSkdp}
</div>
)}
</div>
@@ -391,31 +487,29 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
<label className='form-label text-nowrap'>
- KTP Dirut/Direktur{' '}
- <span className=' opacity-60'>(Opsional)</span>
+ SKT <span className=' opacity-60'>(Opsional)</span>
</label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
- {formDokumen?.dokumenKtpDirut?.name}
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenSkt?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
<label
- htmlFor='dokumenKtpDirut'
+ htmlFor='dokumenSkt'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
>
- {formDokumen?.dokumenKtpDirut?.name ? 'Ubah' : 'Upload'}
+ {formDokumen.dokumenSkt.name ? 'Ubah' : 'Upload'}
</label>
<input
// value={formDokumen?.dokumenNib?.name}
- id='dokumenKtpDirut'
- name='dokumenKtpDirut'
+ id='dokumenSkt'
+ name='dokumenSkt'
type='file'
title=' '
- ref={dokumenKtpDirutRef}
className='hidden'
- aria-invalid={errorsDokumen.dokumenKtpDirut}
+ aria-invalid={errorsDokumen.dokumenSkt}
onChange={handleInputChange}
accept='.pdf,.png,.jpg,.jpeg'
/>
@@ -424,8 +518,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
type='button'
onClick={() =>
handleConfirmSubmit(
- formDokumen.dokumenKtpDirut.format,
- formDokumen.dokumenKtpDirut.base64
+ formDokumen.dokumenSkt.format,
+ formDokumen.dokumenSkt.base64
)
}
>
@@ -435,7 +529,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
{chekValid && (
<div className='text-caption-2 text-danger-500 mt-1'>
- {errorsDokumen.dokumenKtpDirut}
+ {errorsDokumen.dokumenSkt}
</div>
)}
</div>
@@ -449,7 +543,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
{formDokumen?.dokumenAktaPendirian?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
@@ -498,33 +592,33 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
<label className='form-label text-nowrap'>
- Laporan Keuangan
- <span className=' opacity-60'>(Opsional)</span>
+ {' '}
+ Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
</label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
- {formDokumen?.dokumenLaporanKeuangan?.name}
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenAktaPerubahan?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
<label
- htmlFor='dokumenLaporanKeuangan'
+ htmlFor='dokumenAktaPerubahan'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
>
- {formDokumen?.dokumenLaporanKeuangan?.name
+ {formDokumen.dokumenAktaPerubahan.name
? 'Ubah'
: 'Upload'}
</label>
<input
// value={formDokumen?.dokumenNib?.name}
- id='dokumenLaporanKeuangan'
- name='dokumenLaporanKeuangan'
+ id='dokumenAktaPerubahan'
+ name='dokumenAktaPerubahan'
type='file'
title=' '
- ref={dokumenLaporanKeuanganRef}
+ ref={dokumenAktaPerubahanRef}
className='hidden'
- aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
+ aria-invalid={errorsDokumen.dokumenAktaPerubahan}
onChange={handleInputChange}
accept='.pdf,.png,.jpg,.jpeg'
/>
@@ -533,8 +627,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
type='button'
onClick={() =>
handleConfirmSubmit(
- formDokumen.dokumenLaporanKeuangan.format,
- formDokumen.dokumenLaporanKeuangan.base64
+ formDokumen.dokumenAktaPerubahan.format,
+ formDokumen.dokumenAktaPerubahan.base64
)
}
>
@@ -544,7 +638,61 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
{chekValid && (
<div className='text-caption-2 text-danger-500 mt-1'>
- {errorsDokumen.dokumenLaporanKeuangan}
+ {errorsDokumen.dokumenAktaPerubahan}
+ </div>
+ )}
+ </div>
+ </div>
+
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
+ <label className='form-label text-nowrap'>
+ Foto tempat kerja
+ </label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenTempatBekerja?.name}
+ </span>
+ <div className='w-2/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenTempatBekerja'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenTempatBekerja?.name
+ ? 'Ubah'
+ : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenTempatBekerja'
+ name='dokumenTempatBekerja'
+ type='file'
+ title=' '
+ ref={dokumenTempatBekerjaRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenTempatBekerja}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenTempatBekerja.format,
+ formDokumen.dokumenTempatBekerja.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenTempatBekerja}
</div>
)}
</div>
@@ -558,7 +706,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
{formDokumen?.dokumenFotoKantor?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
@@ -605,32 +753,31 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
<label className='form-label text-nowrap'>
- Foto tempat kerja
+ KTP Dirut/Direktur{' '}
+ <span className=' opacity-60'>(Opsional)</span>
</label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
- {formDokumen?.dokumenTempatBekerja?.name}
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenKtpDirut?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
<label
- htmlFor='dokumenTempatBekerja'
+ htmlFor='dokumenKtpDirut'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
>
- {formDokumen?.dokumenTempatBekerja?.name
- ? 'Ubah'
- : 'Upload'}
+ {formDokumen?.dokumenKtpDirut?.name ? 'Ubah' : 'Upload'}
</label>
<input
// value={formDokumen?.dokumenNib?.name}
- id='dokumenTempatBekerja'
- name='dokumenTempatBekerja'
+ id='dokumenKtpDirut'
+ name='dokumenKtpDirut'
type='file'
title=' '
- ref={dokumenTempatBekerjaRef}
+ ref={dokumenKtpDirutRef}
className='hidden'
- aria-invalid={errorsDokumen.dokumenTempatBekerja}
+ aria-invalid={errorsDokumen.dokumenKtpDirut}
onChange={handleInputChange}
accept='.pdf,.png,.jpg,.jpeg'
/>
@@ -639,66 +786,53 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
type='button'
onClick={() =>
handleConfirmSubmit(
- formDokumen.dokumenTempatBekerja.format,
- formDokumen.dokumenTempatBekerja.base64
+ formDokumen.dokumenKtpDirut.format,
+ formDokumen.dokumenKtpDirut.base64
)
}
>
<EyeIcon className={`w-4 ${isDesktop && ''}`} />
</button>
</div>
- {/* <Image
- src={`data:image/png;base64, ${formDokumen.dokumenNib.base64}`}
- alt='Contoh SPPKP'
- className='w-full h-full '
- width={800}
- height={800}
- quality={85}
- /> */}
</div>
{chekValid && (
<div className='text-caption-2 text-danger-500 mt-1'>
- {errorsDokumen.dokumenTempatBekerja}
+ {errorsDokumen.dokumenKtpDirut}
</div>
)}
</div>
</div>
- </form>
- </div>
- )}
- {isMobile && (
- <div>
- <h1 className={`font-bold ${isKonfirmasi ? 'hidden' : 'text-xl'}`}>
- Dokumen
- </h1>
- <form className='flex flex-col w-full gap-5 text-sm'>
+
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
- <label className='form-label text-wrap'>
- NIB (SIUP/TDP/SKDP)
+ <label className='form-label text-nowrap'>
+ Laporan Keuangan
+ <span className=' opacity-60'>(Opsional)</span>
</label>
</div>
<div className='w-3/5'>
- <div className='flex flex-row items-center justify-start'>
- <span className='w-3/5 text-gray-600 truncate'>
- {formDokumen?.dokumenNib?.name}
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-3/5 text-gray-600 truncate max-w-48'>
+ {formDokumen?.dokumenLaporanKeuangan?.name}
</span>
<div className='w-2/5 flex flex-row gap-2'>
<label
- htmlFor='dokumenNib'
+ htmlFor='dokumenLaporanKeuangan'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
>
- {formDokumen?.dokumenNib?.name ? 'Ubah' : 'Upload'}
+ {formDokumen?.dokumenLaporanKeuangan?.name
+ ? 'Ubah'
+ : 'Upload'}
</label>
<input
// value={formDokumen?.dokumenNib?.name}
- id='dokumenNib'
- name='dokumenNib'
+ id='dokumenLaporanKeuangan'
+ name='dokumenLaporanKeuangan'
type='file'
title=' '
- ref={dokumenNibRef}
+ ref={dokumenLaporanKeuanganRef}
className='hidden'
- aria-invalid={errorsDokumen.dokumenNib}
+ aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
onChange={handleInputChange}
accept='.pdf,.png,.jpg,.jpeg'
/>
@@ -707,8 +841,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
type='button'
onClick={() =>
handleConfirmSubmit(
- formDokumen.dokumenNib.format,
- formDokumen.dokumenNib.base64
+ formDokumen.dokumenLaporanKeuangan.format,
+ formDokumen.dokumenLaporanKeuangan.base64
)
}
>
@@ -718,21 +852,30 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
{chekValid && (
<div className='text-caption-2 text-danger-500 mt-1'>
- {errorsDokumen.dokumenNib}
+ {errorsDokumen.dokumenLaporanKeuangan}
</div>
)}
</div>
</div>
+ </form>
+ </div>
+ )}
+ {isMobile && (
+ <div className=''>
+ <h1 className={`font-bold ${isKonfirmasi ? 'hidden' : 'text-xl'}`}>
+ Dokumen
+ </h1>
+ <form className='flex flex-col w-full gap-5 text-sm'>
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
<label className='form-label text-wrap'>NPWP Perusahaan</label>
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate '>
{formDokumen?.dokumenNpwp?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenNpwp'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -778,10 +921,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate '>
{formDokumen?.dokumenSppkp?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenSppkp'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -824,6 +967,262 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
<div className='w-full flex flex-row items-center '>
<div className='w-2/5'>
+ <label className='form-label text-wrap'>NIB</label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-center justify-start'>
+ <span className='w-2/5 text-gray-600 truncate '>
+ {formDokumen?.dokumenNib?.name}
+ </span>
+ <div className='w-3/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenNib'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenNib?.name ? 'Ubah' : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenNib'
+ name='dokumenNib'
+ type='file'
+ title=' '
+ ref={dokumenNibRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenNib}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenNib.format,
+ formDokumen.dokumenNib.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenNib}
+ </div>
+ )}
+ </div>
+ </div>
+
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
+ <label className='form-label text-wrap'>
+ SIUP <span className=' opacity-60'>(Opsional)</span>
+ </label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-2/5 text-gray-600 truncate '>
+ {formDokumen?.dokumenSiup?.name}
+ </span>
+ <div className='w-3/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenSiup'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenSiup?.name ? 'Ubah' : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenSiup'
+ name='dokumenSiup'
+ type='file'
+ title=' '
+ ref={dokumenAktaPerubahanRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenSiup}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenSiup.format,
+ formDokumen.dokumenSiup.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenSiup}
+ </div>
+ )}
+ </div>
+ </div>
+
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
+ <label className='form-label text-wrap'>
+ TDP <span className=' opacity-60'>(Opsional)</span>
+ </label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-2/5 text-gray-600 truncate '>
+ {formDokumen?.dokumenTdp?.name}
+ </span>
+ <div className='w-3/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenTdp'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenTdp?.name ? 'Ubah' : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenTdp'
+ name='dokumenTdp'
+ type='file'
+ title=' '
+ ref={dokumenAktaPerubahanRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenTdp}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenTdp.format,
+ formDokumen.dokumenTdp.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenTdp}
+ </div>
+ )}
+ </div>
+ </div>
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
+ <label className='form-label text-wrap'>
+ SKDP <span className=' opacity-60'>(Opsional)</span>
+ </label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-2/5 text-gray-600 truncate '>
+ {formDokumen?.dokumenSkdp?.name}
+ </span>
+ <div className='w-3/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenSkdp'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenSkdp?.name ? 'Ubah' : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenSkdp'
+ name='dokumenSkdp'
+ type='file'
+ title=' '
+ ref={dokumenAktaPerubahanRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenSkdp}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenSkdp.format,
+ formDokumen.dokumenSkdp.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenSkdp}
+ </div>
+ )}
+ </div>
+ </div>
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
+ <label className='form-label text-wrap'>
+ SKT <span className=' opacity-60'>(Opsional)</span>
+ </label>
+ </div>
+ <div className='w-3/5'>
+ <div className='flex flex-row items-start justify-between'>
+ <span className='w-2/5 text-gray-600 truncate '>
+ {formDokumen?.dokumenSkt?.name}
+ </span>
+ <div className='w-3/5 flex flex-row gap-2'>
+ <label
+ htmlFor='dokumenSkt'
+ className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+ >
+ {formDokumen?.dokumenSkt?.name ? 'Ubah' : 'Upload'}
+ </label>
+ <input
+ // value={formDokumen?.dokumenNib?.name}
+ id='dokumenSkt'
+ name='dokumenSkt'
+ type='file'
+ title=' '
+ ref={dokumenAktaPerubahanRef}
+ className='hidden'
+ aria-invalid={errorsDokumen.dokumenSkt}
+ onChange={handleInputChange}
+ accept='.pdf,.png,.jpg,.jpeg'
+ />
+ <button
+ className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ type='button'
+ onClick={() =>
+ handleConfirmSubmit(
+ formDokumen.dokumenSkt.format,
+ formDokumen.dokumenSkt.base64
+ )
+ }
+ >
+ <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+ </button>
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errorsDokumen.dokumenSkt}
+ </div>
+ )}
+ </div>
+ </div>
+
+ <div className='w-full flex flex-row items-center '>
+ <div className='w-2/5'>
<label className='form-label text-wrap'>
{' '}
Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
@@ -831,10 +1230,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate '>
{formDokumen?.dokumenAktaPerubahan?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenAktaPerubahan'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -846,7 +1245,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
<input
// value={formDokumen?.dokumenNib?.name}
id='dokumenAktaPerubahan'
- name='dokumendokumenAktaPerubahanSppkp'
+ name='dokumenAktaPerubahan'
type='file'
title=' '
ref={dokumenAktaPerubahanRef}
@@ -886,10 +1285,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate '>
{formDokumen?.dokumenKtpDirut?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenKtpDirut'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -938,10 +1337,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate '>
{formDokumen?.dokumenAktaPendirian?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenAktaPendirian'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -993,10 +1392,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate '>
{formDokumen?.dokumenLaporanKeuangan?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenLaporanKeuangan'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -1047,10 +1446,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate '>
{formDokumen?.dokumenFotoKantor?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenFotoKantor'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -1099,10 +1498,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
</div>
<div className='w-3/5'>
<div className='flex flex-row items-start justify-between'>
- <span className='w-3/5 text-gray-600 truncate'>
+ <span className='w-2/5 text-gray-600 truncate'>
{formDokumen?.dokumenTempatBekerja?.name}
</span>
- <div className='w-2/5 flex flex-row gap-2'>
+ <div className='w-3/5 flex flex-row gap-2'>
<label
htmlFor='dokumenTempatBekerja'
className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20'
@@ -1184,46 +1583,23 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
close={() => setIsExample(false)}
>
<div className='flex justify-center items-center p-2'>
- {!format.includes('undifined') ? (
- <object
- data={`data:${format};base64,${base64}`}
- type={format}
- width='100%'
- height='100%'
- onError={(e) => {
- // Jika <object> gagal menampilkan PDF, unduh otomatis
- const link = document.createElement('a');
- link.href = `data:${format};base64,${base64}`;
- link.download = 'document.pdf';
- link.click();
- }}
- >
- PDF tidak dapat ditampilkan.
- <a
- href={`data:${format};base64,${base64}`}
- download='document.pdf'
- >
- {' '}
- Klik <span className='text-red-500'>di sini</span> untuk
- mengunduh PDF
- </a>
- </object>
- ) : (
- <embed
- src={
- '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
- }
- width='100%'
- height='600px'
- />
- )}
- {/* <embed
- src={
- '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
- }
+ {/* <iframe
+ src={`${
+ format == null ? url : `data:${format};base64,${base64}`
+ }`}
+ // src={`http://192.168.23.244:8069` + `${format}`}
+ // src={format}
+ width='800px'
+ height='600px'
+ title='Document'
+ ></iframe> */}
+ <embed
+ src={`${
+ format == null ? url : `data:${format};base64,${base64}`
+ }`}
width='100%'
height='600px'
- /> */}
+ />
</div>
</BottomPopup>
)}
@@ -1242,7 +1618,7 @@ export default KonfirmasiDokumen;
title='NPWP File'
frameBorder='0'
sandbox
-></iframe> */
+ ></iframe> */
}
{
/* <Image
@@ -1252,5 +1628,48 @@ export default KonfirmasiDokumen;
width={1200}
height={1200}
quality={85}
-/> */
+ /> */
}
+
+// <div className='flex justify-center items-center p-2'>
+// {!format.includes('undifined') ? (
+// <object
+// data={`data:${format};base64,${base64}`}
+// type={format}
+// width='100%'
+// height='100%'
+// onError={(e) => {
+// // Jika <object> gagal menampilkan PDF, unduh otomatis
+// const link = document.createElement('a');
+// link.href = `data:${format};base64,${base64}`;
+// link.download = 'document.pdf';
+// link.click();
+// }}
+// >
+// PDF tidak dapat ditampilkan.
+// <a
+// href={`data:${format};base64,${base64}`}
+// download='document.pdf'
+// >
+// {' '}
+// Klik <span className='text-red-500'>di sini</span> untuk
+// mengunduh PDF
+// </a>
+// </object>
+// ) : (
+// <embed
+// src={
+// '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
+// }
+// width='100%'
+// height='600px'
+// />
+// )}
+// {/* <embed
+// src={
+// '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
+// }
+// width='100%'
+// height='600px'
+// /> */}
+// </div>