summaryrefslogtreecommitdiff
path: root/src/lib/form/components/Merchant.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/form/components/Merchant.jsx')
-rw-r--r--src/lib/form/components/Merchant.jsx620
1 files changed, 446 insertions, 174 deletions
diff --git a/src/lib/form/components/Merchant.jsx b/src/lib/form/components/Merchant.jsx
index 50ec1aba..adb34671 100644
--- a/src/lib/form/components/Merchant.jsx
+++ b/src/lib/form/components/Merchant.jsx
@@ -68,17 +68,22 @@ const CreateMerchant = () => {
const [cities, setCities] = useState([]);
const [districts, setDistricts] = useState([]);
const [fileNames, setFileNames] = useState({});
+ const [DeatailFile, setDetailFile] = useState({});
const [subDistricts, setSubDistricts] = useState([]);
const [zips, setZips] = useState([]);
const [isExample, setIsExample] = useState(false);
const [BannerMerchant, setBannerMerchant] = useState();
+ const [isPkp, setIsPkp] = useState(false);
const recaptchaRef = useRef(null);
const router = useRouter();
useEffect(() => {
const getBanner = async () => {
- const get = await odooApi('GET', '/api/v1/banner?type=banner-form-merchant');
+ const get = await odooApi(
+ 'GET',
+ '/api/v1/banner?type=banner-form-merchant'
+ );
// setBannerMerchant(get[0].image);
setBannerMerchant(
'https://erp.indoteknik.com/api/image/x_banner.banner/x_banner_image/431'
@@ -98,6 +103,9 @@ const CreateMerchant = () => {
const dataProfile = await addressApi({
id: auth.parentId ? auth.parentId : auth.partnerId,
});
+ if (dataProfile.companyType == 'pkp') {
+ setIsPkp(true);
+ }
setValue('company', dataProfile?.name);
setValue('address', dataProfile?.alamatBisnis);
setValue('state', parseInt(dataProfile.stateId.id));
@@ -233,28 +241,39 @@ const CreateMerchant = () => {
}
}, [watchsubDistrict, subDistricts]);
const onSubmitHandler = async (values) => {
- const dokumenKtpDirut = document.getElementById('dokumenKtpDirut').files[0];
- const kartuNama = document.getElementById('kartuNama').files[0];
- const sppkp = document.getElementById('sppkp').files[0];
- const npwp = document.getElementById('npwp').files[0];
- const suratPernyataan = document.getElementById('suratPernyataan').files[0];
- const fotoKantor = document.getElementById('fotoKantor').files[0];
- if (!npwp) {
+ const npwp = DeatailFile.npwp;
+ const sppkp = DeatailFile.sppkp;
+ const dokumenKtpDirut = DeatailFile.dokumenKtpDirut;
+ const kartuNama = DeatailFile.kartuNama;
+ const suratPernyataan = DeatailFile.suratPernyataan;
+ const fotoKantor = DeatailFile.fotoKantor;
+ const dataProduk = DeatailFile.dataProduk;
+ const pricelist = DeatailFile.pricelist;
+ if (!npwp && isPkp) {
toast.error('NPWP wajib di tambahkan');
return;
}
- if (!suratPernyataan) {
- toast.error('Surat Pernyataan Nomor Rekening wajib di tambahkan');
+ if (!sppkp && isPkp) {
+ toast.error('SPPKP wajib di tambahkan');
+ return;
+ }
+ if (!dokumenKtpDirut && !isPkp) {
+ toast.error('KTP Dirut/Direktur wajib di tambahkan');
return;
}
if (!fotoKantor) {
toast.error('Foto Gudang / Kantor Bagian Depan wajib di tambahkan');
return;
}
+ if (!pricelist) {
+ toast.error('Pricelist wajib di tambahkan');
+ return;
+ }
const toastId = toast.loading('Mengirimkan formulir merchant...');
const data = {
...values,
name_merchant: 'Form Merchant - ' + values.company,
+ pic_merchant: values.PICName,
partner_id: auth.partnerId,
address: values.address,
state: values.state,
@@ -270,6 +289,7 @@ const CreateMerchant = () => {
email_finance: values.emailFinance,
phone: values.phone,
mobile: values.mobile,
+ harga_tayang: values.hargaTayang,
description:
'Nama Perusahaan : ' +
values.company +
@@ -285,16 +305,14 @@ const CreateMerchant = () => {
values.email +
' \r\n No Hp : ' +
values.mobile,
- file_dokumenKtpDirut: dokumenKtpDirut
- ? await getFileBase64(dokumenKtpDirut)
- : '',
- file_kartuNama: kartuNama ? await getFileBase64(kartuNama) : '',
- file_npwp: npwp ? await getFileBase64(npwp) : '',
- file_sppkp: sppkp ? await getFileBase64(sppkp) : '',
- file_suratPernyataan: suratPernyataan
- ? await getFileBase64(suratPernyataan)
- : '',
- file_fotoKantor: fotoKantor ? await getFileBase64(fotoKantor) : '',
+ file_dokumenKtpDirut: dokumenKtpDirut ? dokumenKtpDirut : '',
+ file_kartuNama: kartuNama ? kartuNama : '',
+ file_npwp: npwp ? npwp : '',
+ file_sppkp: sppkp ? sppkp : '',
+ file_suratPernyataan: suratPernyataan ? suratPernyataan : '',
+ file_fotoKantor: fotoKantor ? fotoKantor : '',
+ file_dataProduk: dataProduk ? dataProduk : '',
+ file_pricelist: pricelist ? pricelist : '',
};
// const formData = new FormData();
// formData.append('npwp', values.npwp[0]);
@@ -319,20 +337,40 @@ const CreateMerchant = () => {
}
// Tetap di bagian atas, tidak boleh ada kondisi sebelum hook
- const handleFileChange = (event) => {
+ const handleFileChange = async (event) => {
+ let fileBase64 = '';
const file = event.target.files[0];
- if (file.size > 1000000) {
- toast.error('Maksimal ukuran file adalah 1MB');
- event.target.value = '';
- return;
+
+ if (file.size > 500000) {
+ 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);
+ } catch (error) {
+ toast.error('Gagal mengompresi file', { duration: 4000 });
+ }
+ } else {
+ // Convert file to Base64
+ fileBase64 = await getFileBase64(file);
}
const fieldName = event.target.name; // Nama input file
+ setDetailFile((prev) => ({
+ ...prev,
+ [fieldName]: file ? fileBase64 : '', // Tambahkan atau perbarui file di state
+ }));
setFileNames((prev) => ({
...prev,
[fieldName]: file ? file.name : '', // Tambahkan atau perbarui file di state
}));
};
-
return (
<>
<BottomPopup
@@ -407,6 +445,25 @@ const CreateMerchant = () => {
</div>
<div className='w-full flex flex-row'>
<div className='w-2/5'>
+ <label className='form-label text-nowrap'>Nama PIC</label>
+ <span className='opacity-65 text-xs'>
+ isi detail perusahaan sesuai dengan nama yang terdaftar{' '}
+ </span>
+ </div>
+ <div className='w-3/5'>
+ <input
+ {...register('PICName')}
+ placeholder='Masukkan nama PIC'
+ type='text'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.PICName?.message}
+ </div>
+ </div>
+ </div>
+ <div className='w-full flex flex-row'>
+ <div className='w-2/5'>
<label className='form-label text-nowrap'>
Alamat Perusahaan
</label>
@@ -676,8 +733,31 @@ const CreateMerchant = () => {
<div className='w-full flex flex-row'>
<div className='w-2/5'>
<label className='form-label text-nowrap'>
- KTP Dirut/Direktur{' '}
- <span className=' opacity-60'>(Opsional)</span>{' '}
+ Harga Tayang (HET){' '}
+ <span className=' opacity-60'>(Opsional)</span>
+ </label>
+ <span className='opacity-65 text-xs'>
+ isi detail perusahaan sesuai dengan nama yang terdaftar{' '}
+ </span>
+ </div>
+ <div className='w-3/5'>
+ <input
+ {...register('hargaTayang')}
+ placeholder='Masukkan Harga Tayang (HET)'
+ type='text'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.hargaTayang?.message}
+ </div>
+ </div>
+ </div>
+
+ <div className='w-full flex flex-row'>
+ <div className='w-2/5'>
+ <label className='form-label text-nowrap'>
+ NPWP{' '}
+ {!isPkp && <span className=' opacity-60'>(Opsional)</span>}
</label>
<span className='opacity-65 text-xs'>
Pastikan dokumen yang anda upload sudah benar
@@ -686,79 +766,94 @@ const CreateMerchant = () => {
<div className='w-3/5 flex flex-col justify-start items-start'>
<div className='flex flex-row items-start justify-start gap-2'>
<label
- htmlFor='dokumenKtpDirut'
+ htmlFor='npwp'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.dokumenKtpDirut
- ? 'Ubah Dokumen'
- : 'Upload Dokumen'}
+ {fileNames.npwp ? 'Ubah Dokumen' : 'Upload Dokumen'}
</label>
<input
- {...register('dokumenKtpDirut')}
+ {...register('npwp')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='dokumenKtpDirut'
- onChange={handleFileChange}
- aria-invalid={errors.dokumenKtpDirut?.message}
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='npwp'
+ onChange={(e) => {
+ handleFileChange(e); // Untuk update UI (opsional)
+ }}
+ aria-invalid={errors.npwp?.message}
/>
<span className='mt-2 text-gray-600 line-clamp-2'>
- {fileNames.dokumenKtpDirut}
+ {fileNames.npwp}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.dokumenKtpDirut?.message}
+ {errors.npwp?.message}
</div>
</div>
</div>
+ <div className='w-full flex flex-row items-start'>
+ <div className='w-2/5 flex flex-row justify-between items-center'>
+ <div>
+ <label className='form-label text-nowrap'>
+ SPPKP{' '}
+ {!isPkp && (
+ <span className=' opacity-60'>(Opsional)</span>
+ )}
+ </label>
+ <span className='opacity-65 text-xs'>
+ Pastikan dokumen yang anda upload sudah benar
+ </span>
+ </div>
+ <div
+ onClick={() => setIsExample(!isExample)}
+ className='h-fit mr-8 rounded text-white p-2 flex flex-row items-center bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ >
+ <EyeIcon className={`w-4 mr-2 `} />
- <div className='w-full flex flex-row'>
- <div className='w-2/5'>
- <label className='form-label text-nowrap'>
- Kartu Nama <span className=' opacity-60'>(Opsional)</span>{' '}
- </label>
- <span className='opacity-65 text-xs'>
- Pastikan dokumen yang anda upload sudah benar
- </span>
+ <p className='font-light text-xs '>Lihat Contoh</p>
+ </div>
</div>
- <div className='w-3/5 flex flex-col justify-start items-start'>
+ <div className='w-3/5 flex flex-col justify-between items-start'>
<div className='flex flex-row items-start justify-start gap-2'>
<label
- htmlFor='kartuNama'
+ htmlFor='sppkp'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.kartuNama ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ {fileNames.sppkp ? 'Ubah Dokumen' : 'Upload Dokumen'}
</label>
<input
- {...register('kartuNama')}
+ {...register('sppkp')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='kartuNama'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='sppkp'
onChange={handleFileChange}
- aria-invalid={errors.kartuNama?.message}
+ aria-invalid={errors.sppkp?.message}
/>
<span className='mt-2 text-gray-600 line-clamp-2'>
- {fileNames.kartuNama}
+ {fileNames.sppkp}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.kartuNama?.message}
+ {errors.sppkp?.message}
</div>
</div>
</div>
<div className='w-full flex flex-row'>
<div className='w-2/5'>
- <label className='form-label text-nowrap'>NPWP</label>
+ <label className='form-label text-nowrap'>
+ KTP Dirut/Direktur{' '}
+ {isPkp && <span className=' opacity-60'>(Opsional)</span>}
+ </label>
<span className='opacity-65 text-xs'>
Pastikan dokumen yang anda upload sudah benar
</span>
@@ -766,92 +861,86 @@ const CreateMerchant = () => {
<div className='w-3/5 flex flex-col justify-start items-start'>
<div className='flex flex-row items-start justify-start gap-2'>
<label
- htmlFor='npwp'
+ htmlFor='dokumenKtpDirut'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.npwp ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ {fileNames.dokumenKtpDirut
+ ? 'Ubah Dokumen'
+ : 'Upload Dokumen'}
</label>
<input
- {...register('npwp')}
+ {...register('dokumenKtpDirut')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='npwp'
- onChange={(e) => {
- handleFileChange(e); // Untuk update UI (opsional)
- }}
- aria-invalid={errors.npwp?.message}
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='dokumenKtpDirut'
+ onChange={handleFileChange}
+ aria-invalid={errors.dokumenKtpDirut?.message}
/>
<span className='mt-2 text-gray-600 line-clamp-2'>
- {fileNames.npwp}
+ {fileNames.dokumenKtpDirut}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.npwp?.message}
+ {errors.dokumenKtpDirut?.message}
</div>
</div>
</div>
- <div className='w-full flex flex-row items-start'>
- <div className='w-2/5 flex flex-row justify-between items-center'>
- <div>
- <label className='form-label text-nowrap'>
- SPPKP<span className=' opacity-60'>(Opsional)</span>{' '}
- </label>
- <span className='opacity-65 text-xs'>
- Pastikan dokumen yang anda upload sudah benar
- </span>
- </div>
- <div
- onClick={() => setIsExample(!isExample)}
- className='h-fit mr-8 rounded text-white p-2 flex flex-row items-center bg-red-500 hover:cursor-pointer hover:bg-red-400'
- >
- <EyeIcon className={`w-4 mr-2 `} />
- <p className='font-light text-xs '>Lihat Contoh</p>
- </div>
+ <div className='w-full flex flex-row'>
+ <div className='w-2/5'>
+ <label className='form-label text-nowrap'>
+ Kartu Nama <span className=' opacity-60'>(Opsional)</span>{' '}
+ </label>
+ <span className='opacity-65 text-xs'>
+ Pastikan dokumen yang anda upload sudah benar
+ </span>
</div>
- <div className='w-3/5 flex flex-col justify-between items-start'>
+ <div className='w-3/5 flex flex-col justify-start items-start'>
<div className='flex flex-row items-start justify-start gap-2'>
<label
- htmlFor='sppkp'
+ htmlFor='kartuNama'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.sppkp ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ {fileNames.kartuNama ? 'Ubah Dokumen' : 'Upload Dokumen'}
</label>
<input
- {...register('sppkp')}
+ {...register('kartuNama')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='sppkp'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='kartuNama'
onChange={handleFileChange}
- aria-invalid={errors.sppkp?.message}
+ aria-invalid={errors.kartuNama?.message}
/>
<span className='mt-2 text-gray-600 line-clamp-2'>
- {fileNames.sppkp}
+ {fileNames.kartuNama}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.sppkp?.message}
+ {errors.kartuNama?.message}
</div>
</div>
</div>
+
<div className='w-full flex flex-row items-start '>
<div className='w-2/5 flex flex-row justify-between items-center '>
<div>
<label className='form-label text-nowrap'>
- Surat Pernyataan Nomor Rekening
+ Surat Pernyataan Nomor Rekening{' '}
+ <span className=' opacity-60'>(Opsional)</span>
</label>
<span className='opacity-65 text-xs'>
- Pastikan dokumen yang anda upload sudah benar
+ Wajib diisi jika nomor rekening berbeda dari nama
+ perusahaan
</span>
</div>
<a
@@ -876,7 +965,7 @@ const CreateMerchant = () => {
{...register('suratPernyataan')}
type='file'
className='form-input hidden'
- accept='application/pdf'
+ accept='.pdf,.png,.jpg,.jpeg'
id='suratPernyataan'
onChange={handleFileChange}
aria-invalid={errors.suratPernyataan?.message}
@@ -886,7 +975,7 @@ const CreateMerchant = () => {
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
@@ -915,7 +1004,7 @@ const CreateMerchant = () => {
{...register('fotoKantor')}
type='file'
className='form-input hidden'
- accept='.png,.jpg,.jpeg'
+ accept='.pdf,.png,.jpg,.jpeg'
id='fotoKantor'
onChange={handleFileChange}
aria-invalid={errors.fotoKantor?.message}
@@ -925,7 +1014,47 @@ const CreateMerchant = () => {
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: jpeg, jpg, png. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
+ </span>
+
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.fotoKantor?.message}
+ </div>
+ </div>
+ </div>
+ <div className='w-full flex flex-row items-start '>
+ <div className='w-2/5 flex flex-col justify-start items-start '>
+ <label className='form-label text-nowrap'>
+ Data Produk (Item Name, Gambar, Deskripsi){' '}
+ <span className=' opacity-60'>(Opsional)</span>{' '}
+ </label>
+ <span className='opacity-65 text-xs'>
+ Pastikan dokumen yang anda upload sudah benar
+ </span>
+ </div>
+ <div className='w-3/5 flex flex-col justify-between items-start'>
+ <div className='flex flex-row items-start justify-start gap-2'>
+ <label
+ htmlFor='dataProduk'
+ className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+ >
+ {fileNames.dataProduk ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ </label>
+ <input
+ {...register('dataProduk')}
+ type='file'
+ className='form-input hidden'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='dataProduk'
+ onChange={handleFileChange}
+ aria-invalid={errors.dataProduk?.message}
+ />
+ <span className='mt-2 text-gray-600 line-clamp-2'>
+ {fileNames.dataProduk}
+ </span>
+ </div>
+ <span className='text-xs opacity-60 text-red-500'>
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
@@ -933,6 +1062,43 @@ const CreateMerchant = () => {
</div>
</div>
</div>
+ <div className='w-full flex flex-row items-start '>
+ <div className='w-2/5 flex flex-col justify-start items-start '>
+ <label className='form-label text-nowrap'>Pricelist</label>
+ <span className='opacity-65 text-xs'>
+ Pastikan dokumen yang anda upload sudah benar
+ </span>
+ </div>
+ <div className='w-3/5 flex flex-col justify-between items-start'>
+ <div className='flex flex-row items-start justify-start gap-2'>
+ <label
+ htmlFor='pricelist'
+ className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+ >
+ {fileNames.pricelist ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ </label>
+ <input
+ {...register('pricelist')}
+ type='file'
+ className='form-input hidden'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='pricelist'
+ onChange={handleFileChange}
+ aria-invalid={errors.pricelist?.message}
+ />
+ <span className='mt-2 text-gray-600 line-clamp-2'>
+ {fileNames.pricelist}
+ </span>
+ </div>
+ <span className='text-xs opacity-60 text-red-500'>
+ Format: pdf, jpeg, jpg, png. max file size 2MB
+ </span>
+
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.pricelist?.message}
+ </div>
+ </div>
+ </div>
<div className=''>
{/* <div>
<ReCAPTCHA
@@ -1012,6 +1178,23 @@ const CreateMerchant = () => {
</div>
<div className='w-full flex flex-col'>
<div className='w-full'>
+ <label className='form-label text-nowrap'>Nama PIC</label>
+ <input
+ {...register('PICName')}
+ placeholder='Masukkan Nama PIC '
+ type='text'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.PICName?.message}
+ </div>
+ <span className='opacity-65 text-xs'>
+ isi detail perusahaan sesuai dengan nama yang terdaftar{' '}
+ </span>
+ </div>
+ </div>
+ <div className='w-full flex flex-col'>
+ <div className='w-full'>
<label className='form-label text-nowrap'>
Alamat Perusahaan
</label>
@@ -1249,154 +1432,178 @@ const CreateMerchant = () => {
isi detail perusahaan sesuai dengan data yang terdaftar
</span>
</div>
+ <div className='w-full flex flex-col'>
+ <label className='form-label text-nowrap'>
+ Harga Tayang (HET){' '}
+ <span className=' opacity-60'>(Opsional)</span>
+ </label>
+ <input
+ {...register('hargaTayang')}
+ placeholder='Masukkan Harga Tayang (HET)'
+ type='text'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.hargaTayang?.message}
+ </div>
+ <span className='opacity-65 text-xs'>
+ isi detail perusahaan sesuai dengan data yang terdaftar
+ </span>
+ </div>
<div className='w-full flex flex-col gap-2'>
<label className='form-label text-nowrap'>
- KTP Dirut/Direktur{' '}
- <span className=' opacity-60'>(Opsional)</span>{' '}
+ NPWP{' '}
+ {!isPkp && <span className=' opacity-60'>(Opsional)</span>}
</label>
- <div className='flex flex-row items-start justify-start gap-2 '>
+ <div className='flex flex-row items-start justify-start gap-2'>
<label
- htmlFor='dokumenKtpDirut'
+ htmlFor='npwp'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.dokumenKtpDirut
- ? 'Ubah Dokumen'
- : 'Upload Dokumen'}
+ {fileNames.npwp ? 'Ubah Dokumen' : 'Upload Dokumen'}
</label>
<input
- {...register('dokumenKtpDirut')}
+ {...register('npwp')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='dokumenKtpDirut'
- onChange={handleFileChange}
- aria-invalid={errors.dokumenKtpDirut?.message}
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='npwp'
+ onChange={(e) => {
+ handleFileChange(e); // Untuk update UI (opsional)
+ }}
+ aria-invalid={errors.npwp?.message}
/>
<span className=' text-gray-600 line-clamp-2'>
- {fileNames.dokumenKtpDirut}
+ {fileNames.npwp}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.dokumenKtpDirut?.message}
+ {errors.npwp?.message}
</div>
</div>
+ <div className='w-full flex flex-col gap-2 items-start '>
+ <div className='flex flex-row w-full justify-between items-center bg-red-400'>
+ <label className='form-label text-nowrap'>
+ SPPKP{' '}
+ {!isPkp && <span className=' opacity-60'>(Opsional)</span>}
+ </label>
+ <div
+ onClick={() => setIsExample(!isExample)}
+ className='h-fit rounded text-white p-2 flex flex-row items-center bg-red-500 hover:cursor-pointer hover:bg-red-400'
+ >
+ <EyeIcon className={`w-4 mr-2 `} />
- <div className='w-full flex flex-col gap-2'>
- <label className='form-label text-nowrap'>
- Kartu Nama <span className=' opacity-60'>(Opsional)</span>{' '}
- </label>
+ <p className='font-light text-xs '>Lihat Contoh</p>
+ </div>
+ </div>
<div className='flex flex-row items-start justify-start gap-2'>
<label
- htmlFor='kartuNama'
+ htmlFor='sppkp'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.kartuNama ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ {fileNames.sppkp ? 'Ubah Dokumen' : 'Upload Dokumen'}
</label>
<input
- {...register('kartuNama')}
+ {...register('sppkp')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='kartuNama'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='sppkp'
onChange={handleFileChange}
- aria-invalid={errors.kartuNama?.message}
+ aria-invalid={errors.sppkp?.message}
/>
<span className=' text-gray-600 line-clamp-2'>
- {fileNames.kartuNama}
+ {fileNames.sppkp}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.kartuNama?.message}
+ {errors.sppkp?.message}
</div>
</div>
<div className='w-full flex flex-col gap-2'>
- <label className='form-label text-nowrap'>NPWP</label>
- <div className='flex flex-row items-start justify-start gap-2'>
+ <label className='form-label text-nowrap'>
+ KTP Dirut/Direktur{' '}
+ {isPkp && <span className=' opacity-60'>(Opsional)</span>}
+ </label>
+ <div className='flex flex-row items-start justify-start gap-2 '>
<label
- htmlFor='npwp'
+ htmlFor='dokumenKtpDirut'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.npwp ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ {fileNames.dokumenKtpDirut
+ ? 'Ubah Dokumen'
+ : 'Upload Dokumen'}
</label>
<input
- {...register('npwp')}
+ {...register('dokumenKtpDirut')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='npwp'
- onChange={(e) => {
- handleFileChange(e); // Untuk update UI (opsional)
- }}
- aria-invalid={errors.npwp?.message}
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='dokumenKtpDirut'
+ onChange={handleFileChange}
+ aria-invalid={errors.dokumenKtpDirut?.message}
/>
<span className=' text-gray-600 line-clamp-2'>
- {fileNames.npwp}
+ {fileNames.dokumenKtpDirut}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.npwp?.message}
+ {errors.dokumenKtpDirut?.message}
</div>
</div>
- <div className='w-full flex flex-col gap-2 items-start '>
- <div className='flex flex-row w-full justify-between items-center'>
- <label className='form-label text-nowrap'>
- SPPKP<span className=' opacity-60'>(Opsional)</span>{' '}
- </label>
- <div
- onClick={() => setIsExample(!isExample)}
- className='h-fit rounded text-white p-2 flex flex-row items-center bg-red-500 hover:cursor-pointer hover:bg-red-400'
- >
- <EyeIcon className={`w-4 mr-2 `} />
- <p className='font-light text-xs '>Lihat Contoh</p>
- </div>
- </div>
+ <div className='w-full flex flex-col gap-2'>
+ <label className='form-label text-nowrap'>
+ Kartu Nama <span className=' opacity-60'>(Opsional)</span>{' '}
+ </label>
<div className='flex flex-row items-start justify-start gap-2'>
<label
- htmlFor='sppkp'
+ htmlFor='kartuNama'
className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
>
- {fileNames.sppkp ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ {fileNames.kartuNama ? 'Ubah Dokumen' : 'Upload Dokumen'}
</label>
<input
- {...register('sppkp')}
+ {...register('kartuNama')}
type='file'
className='form-input hidden'
- accept='application/pdf'
- id='sppkp'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='kartuNama'
onChange={handleFileChange}
- aria-invalid={errors.sppkp?.message}
+ aria-invalid={errors.kartuNama?.message}
/>
<span className=' text-gray-600 line-clamp-2'>
- {fileNames.sppkp}
+ {fileNames.kartuNama}
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
- {errors.sppkp?.message}
+ {errors.kartuNama?.message}
</div>
</div>
+
<div className='w-full flex flex-col gap-2 items-start '>
<div className='flex flex-row w-full justify-between items-center'>
<label className='form-label text-wrap'>
- Surat Pernyataan Nomor Rekening
+ Surat Pernyataan Nomor Rekening{' '}
+ <span className=' opacity-60'>(Opsional)</span>
</label>
<a
href='/file/Surat Pernyataan Nomor Rekening.docx'
@@ -1421,7 +1628,7 @@ const CreateMerchant = () => {
{...register('suratPernyataan')}
type='file'
className='form-input hidden'
- accept='application/pdf'
+ accept='.pdf,.png,.jpg,.jpeg'
id='suratPernyataan'
onChange={handleFileChange}
aria-invalid={errors.suratPernyataan?.message}
@@ -1431,7 +1638,7 @@ const CreateMerchant = () => {
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: pdf. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
@@ -1453,7 +1660,7 @@ const CreateMerchant = () => {
{...register('fotoKantor')}
type='file'
className='form-input hidden'
- accept='.png,.jpg,.jpeg'
+ accept='.pdf,.png,.jpg,.jpeg'
id='fotoKantor'
onChange={handleFileChange}
aria-invalid={errors.fotoKantor?.message}
@@ -1463,13 +1670,76 @@ const CreateMerchant = () => {
</span>
</div>
<span className='text-xs opacity-60 text-red-500'>
- Format: jpeg, jpg, png. max file size 1MB
+ Format: pdf, jpeg, jpg, png. max file size 2MB
</span>
<div className='text-caption-2 text-danger-500 mt-1'>
{errors.fotoKantor?.message}
</div>
</div>
+ <div className='w-full flex flex-col gap-2 items-start '>
+ <label className='form-label text-nowrap'>
+ Data Produk (Item Name, Gambar, Deskripsi){' '}
+ <span className=' opacity-60'>(Opsional)</span>{' '}
+ </label>
+ <div className='flex flex-row items-start justify-start gap-2'>
+ <label
+ htmlFor='dataProduk'
+ className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+ >
+ {fileNames.dataProduk ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ </label>
+ <input
+ {...register('dataProduk')}
+ type='file'
+ className='form-input hidden'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='dataProduk'
+ onChange={handleFileChange}
+ aria-invalid={errors.dataProduk?.message}
+ />
+ <span className='mt-2 text-gray-600 line-clamp-2'>
+ {fileNames.dataProduk}
+ </span>
+ </div>
+ <span className='text-xs opacity-60 text-red-500'>
+ Format: pdf, jpeg, jpg, png. max file size 2MB
+ </span>
+
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.fotoKantor?.message}
+ </div>
+ </div>
+ <div className='w-full flex flex-col gap-2 items-start '>
+ <label className='form-label text-nowrap'>Pricelist</label>
+ <div className='flex flex-row items-start justify-start gap-2'>
+ <label
+ htmlFor='pricelist'
+ className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+ >
+ {fileNames.pricelist ? 'Ubah Dokumen' : 'Upload Dokumen'}
+ </label>
+ <input
+ {...register('pricelist')}
+ type='file'
+ className='form-input hidden'
+ accept='.pdf,.png,.jpg,.jpeg'
+ id='pricelist'
+ onChange={handleFileChange}
+ aria-invalid={errors.pricelist?.message}
+ />
+ <span className='mt-2 text-gray-600 line-clamp-2'>
+ {fileNames.pricelist}
+ </span>
+ </div>
+ <span className='text-xs opacity-60 text-red-500'>
+ Format: pdf, jpeg, jpg, png. max file size 2MB
+ </span>
+
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.pricelist?.message}
+ </div>
+ </div>
<div className=''>
{/* <div>
<ReCAPTCHA
@@ -1506,6 +1776,7 @@ const CreateMerchant = () => {
};
const validationSchema = Yup.object().shape({
company: Yup.string().required('Harus di-isi'),
+ PICName: Yup.string().required('Harus di-isi'),
email: Yup.string()
.email('Format harus seperti contoh@email.com')
.required('Harus di-isi'),
@@ -1527,10 +1798,11 @@ const validationSchema = Yup.object().shape({
address: Yup.string().required('Harus di-isi'),
mobile: Yup.string().required('Harus di-isi'),
npwp: Yup.mixed().required('File is required'),
- suratPernyataan: Yup.mixed().required('File is required'),
+ pricelist: Yup.mixed().required('File is required'),
});
const defaultValues = {
company: '',
+ PICName: '',
email: '',
emailSales: '',
emailFinance: '',
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-17 22:11:00 +0000