From 3550c262e5eeb1b861ae100cd26ae853c7f153fe Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 4 Nov 2024 14:25:02 +0700
Subject: <iman> update pengajuan tempo mobile 80%

---
 .../component/informasiPerusahaan.jsx              | 176 +++++++++++++--------
 1 file changed, 112 insertions(+), 64 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx')

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>
-- 
cgit v1.2.3