summaryrefslogtreecommitdiff
path: root/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx')
-rw-r--r--src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx176
1 files changed, 112 insertions, 64 deletions
diff --git a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
index 90454083..08dbbc8a 100644
--- a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
+++ b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
@@ -941,7 +941,7 @@ const InformasiPerusahaan = ({
</div>
)}
{isMobile && (
- <div className=''>
+ <div className='text-sm'>
<h1
className={`font-bold py-4 mt-8 ${
isKonfirmasi ? 'text-xl' : 'text-xl'
@@ -1151,7 +1151,7 @@ const InformasiPerusahaan = ({
id='accountNumber'
name='accountNumber'
ref={accountNumberRef}
- placeholder='Nomor Rekening Bank'
+ placeholder='Nomor Rekening'
type='text'
value={form.accountNumber}
className='form-input'
@@ -1214,11 +1214,12 @@ const InformasiPerusahaan = ({
</div>
)}
</div>
- <div className='h-1 bg-gray-300 w-[120%] inset-0 relative transform -translate-x-5'></div>
+ <div className='h-[2px] bg-gray-300 w-[120%] inset-0 relative transform -translate-x-5'></div>
<div className='flex flex-col gap-2 justify-start items-start'>
<label className='form-label text-nowrap'>Durasi Tempo</label>
<div className='' ref={tempoDurationRef}>
<RadioGroup
+ size='sm'
onChange={onChangeTempoDuration}
value={form.tempoDuration}
>
@@ -1239,40 +1240,61 @@ const InformasiPerusahaan = ({
{errors.tempoDuration}
</div>
)}
- <label className='form-label '>Limit Tempo</label>
- <div
- className='flex flex-col justify-start items-start'
- ref={tempoLimitRef}
+ </div>
+ </div>
+ <div className='flex flex-col gap-2 justify-start items-start'>
+ <label className='form-label '>Limit Tempo</label>
+ <div
+ className='flex justify-between items-center '
+ ref={tempoLimitRef}
+ >
+ <RadioGroup
+ size='sm'
+ onChange={(value) => {
+ if (value === 'custom') {
+ setIsCustom(true);
+ updateForm('tempoLimit', tempoLimitValue); // Update dengan nilai input custom jika dipilih
+ } else {
+ setIsCustom(false);
+ onChangeTempoLimit(value); // Update dengan nilai radio button yang dipilih
+ }
+ }}
+ className='flex items-center justify-between'
+ value={isCustom ? 'custom' : form.tempoLimit}
>
- <RadioGroup
- onChange={(value) => {
- if (value === 'custom') {
- setIsCustom(true);
- updateForm('tempoLimit', tempoLimitValue); // Update dengan nilai input custom jika dipilih
- } else {
- setIsCustom(false);
- onChangeTempoLimit(value); // Update dengan nilai radio button yang dipilih
- }
- }}
- className='flex items-center justify-between'
- value={isCustom ? 'custom' : form.tempoLimit}
- >
- <Stack direction='row'>
- {/* Kolom 1 */}
- <Stack direction='column' spacing={2} className='mr-4'>
- {radioOptions.slice(0, 4).map((option) => (
- <Radio
- key={option.value}
- colorScheme='red'
- value={option.value}
- >
- {option.label}
- </Radio>
- ))}
- </Stack>
+ <Stack direction='row'>
+ {/* Kolom 1 */}
+ <Stack direction='row' spacing={2} className='mr-4'>
+ {radioOptions.slice(0, 3).map((option) => (
+ <Radio
+ key={option.value}
+ colorScheme='red'
+ value={option.value}
+ >
+ {option.label}
+ </Radio>
+ ))}
+ <Radio colorScheme='red' value='custom'></Radio>
- {/* Kolom 2 */}
- <Stack direction='column' className='ml-8' spacing={2}>
+ <input
+ placeholder='Isi limit'
+ type='text'
+ className='border ml-1 p-1 w-full ' // padding untuk memberi ruang untuk "RP"
+ value={formatRupiah(tempoLimitValueEx)} // Menampilkan nilai terformat
+ onChange={(e) => {
+ const value = e.target.value;
+ const formattedValue = formatRupiah(value);
+ setTempoLimitValueEx(formattedValue);
+ updateForm(
+ 'tempoLimit',
+ formattedValue.replace(/^Rp\s*/, '')
+ ); // Mengupdate nilai di react-hook-form
+ }}
+ />
+ </Stack>
+
+ {/* Kolom 2 */}
+ {/* <Stack direction='column' className='ml-8' spacing={2}>
{radioOptions.slice(4).map((option) => (
<Radio
key={option.value}
@@ -1282,47 +1304,29 @@ const InformasiPerusahaan = ({
{option.label}
</Radio>
))}
- <div className='flex flex-row items-center'>
- <Radio colorScheme='red' value='custom'></Radio>
-
- <input
- placeholder='Isi limit yang anda inginkan'
- type='text'
- className='border ml-2 p-1' // padding untuk memberi ruang untuk "RP"
- value={formatRupiah(tempoLimitValueEx)} // Menampilkan nilai terformat
- onChange={(e) => {
- const value = e.target.value;
- const formattedValue = formatRupiah(value);
- setTempoLimitValueEx(formattedValue);
- updateForm(
- 'tempoLimit',
- formattedValue.replace(/^Rp\s*/, '')
- ); // Mengupdate nilai di react-hook-form
- }}
- />
- </div>
- </Stack>
- </Stack>
- </RadioGroup>
- {chekValid && (
- <div className='text-caption-2 text-danger-500 mt-1'>
- {errors.tempoLimit}
- </div>
- )}
- </div>
+ <div className='flex flex-row items-center'></div>
+ </Stack> */}
+ </Stack>
+ </RadioGroup>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.tempoLimit}
+ </div>
+ )}
</div>
</div>
<div className='text-red-500 text-xs'>
**Durasi & Limit dapat berbeda dengan verifikasi oleh tim
indoteknik.com
</div>
- <div className='h-1 bg-gray-300 w-[120%] inset-0 relative transform -translate-x-5'></div>
+ <div className='h-[2px] bg-gray-300 w-[120%] inset-0 relative transform -translate-x-5'></div>
<div className='flex flex-col gap justify-between items-start'>
<label className='form-label text-wrap '>
Apakah bersedia transaksi via website?
</label>
<div className='flex gap-x-4' ref={bersediaRef}>
<RadioGroup
+ size='sm'
onChange={handleCheckboxBersediaChange}
value={form.bersedia}
>
@@ -1342,6 +1346,50 @@ const InformasiPerusahaan = ({
</div>
)}
</div>
+ <div className='h-[2px] bg-gray-300 w-[120%] inset-0 relative transform -translate-x-5'></div>
+
+ <div
+ className={`flex flex-col gap-2 justify-between ${
+ isKonfirmasi ? 'items-center' : 'items-start'
+ }`}
+ >
+ <label className='form-label '>
+ Kategori Produk yang Digunakan
+ </label>
+ <div className='flex flex-col justify-between gap-2 '>
+ <div className='flex flex-col gap-2' ref={categoryProdukRef}>
+ {firstColumn.map((item) => (
+ <Checkbox
+ size='sm'
+ colorScheme='red'
+ key={item.id}
+ onChange={() => handleCheckboxChange(item.id)}
+ isChecked={isChecked(item.id)}
+ >
+ {item.name}
+ </Checkbox>
+ ))}
+ </div>
+ <div className='flex flex-col gap-2'>
+ {secondColumn.map((item) => (
+ <Checkbox
+ size='sm'
+ colorScheme='red'
+ key={item.id}
+ isChecked={isChecked(item.id)}
+ onChange={() => handleCheckboxChange(item.id)}
+ >
+ {item.name}
+ </Checkbox>
+ ))}
+ </div>
+ </div>
+ {chekValid && (
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.categoryProduk}
+ </div>
+ )}
+ </div>
</div>
</form>
</div>