<iman> update fix kontak person

1 files changed, 127 insertions, 46 deletions

diff --git a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
index a7d170e9..c0f9bd4a 100644
--- a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
+++ b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
@@ -7,7 +7,7 @@ import cityApi from '@/lib/address/api/cityApi';
 import { Radio, RadioGroup, Stack, Checkbox } from '@chakra-ui/react';
 import { usePengajuanTempoStore } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore';
 const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
-  const { control, watch } = useForm();
+  const { control, watch, setValue, getValues } = useForm();
   const { form, errors, validate, updateForm } = usePengajuanTempoStore();
   const [industries, setIndustries] = useState([]);
   const [selectedCategory, setSelectedCategory] = useState('');
@@ -28,6 +28,15 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
     { id: 11, name: 'Komponen & Aksesoris' },
     { id: 12, name: 'Peralatan Horeca & Food Service' },
   ];
+  const radioOptions = [
+    { label: '5.000.000', value: '5000000' },
+    { label: '10.000.000', value: '10000000' },
+    { label: '15.000.000', value: '15000000' },
+    { label: '20.000.000', value: '20000000' },
+    { label: '25.000.000', value: '25000000' },
+    { label: '30.000.000', value: '30000000' },
+    { label: '35.000.000', value: '35000000' },
+  ];
 
   useEffect(() => {
     const loadState = async () => {
@@ -107,7 +116,6 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
   const handleChange = (e) => {
     const value = e.target.value;
     const formattedValue = formatRupiah(value);
-    console.log('formattedValue', formattedValue);
     updateForm('estimasi', formattedValue.replace(/^Rp\s*/, ''));
     validate();
   };
@@ -120,27 +128,41 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
     updateForm('tempoLimit', `${e}`);
     validate();
   };
+  const [isCustom, setIsCustom] = React.useState(false);
+  const [tempoLimitValueEx, setTempoLimitValueEx] = React.useState('');
   const handleCheckboxBersediaChange = (value) => {
-    if (value === 'bersedia') {
-      setBersedia(true);
-    } else if (value === 'tidakBersedia') {
-      setBersedia(false);
-    }
-    updateForm('bersedia', `${value === 'bersedia'}`);
+    // if (value === 'bersedia') {
+    //   setBersedia(true);
+    // } else if (value === 'tidakBersedia') {
+    //   setBersedia(false);
+    // }
+    // updateForm('bersedia', `${value === 'bersedia'}`);
+    updateForm('bersedia', `${value}`);
     validate();
   };
-  const [selectedIds, setSelectedIds] = useState([]);
+  const [selectedIds, setSelectedIds] = useState(
+    form.categoryProduk ? form.categoryProduk.split(',').map(Number) : [] // Parse string menjadi array angka
+  );
 
   const handleCheckboxChange = (id) => {
-    setSelectedIds((prevSelected) =>
-      prevSelected.includes(id)
-        ? prevSelected.filter((selectedId) => selectedId !== id)
-        : [...prevSelected, id]
-    );
-    updateForm('categoryProduk', `${selectedIds}`);
+    const updatedSelected = selectedIds.includes(id)
+      ? selectedIds.filter((selectedId) => selectedId !== id)
+      : [...selectedIds, id];
+
+    setSelectedIds(updatedSelected);
+
+    // Mengubah array kembali menjadi string yang dipisahkan oleh koma
+    updateForm('categoryProduk', updatedSelected.join(','));
     validate();
   };
 
+  useEffect(() => {
+    if (form.categoryProduk) {
+      setSelectedIds(form.categoryProduk.split(',').map(Number)); // Parse string menjadi array angka
+    }
+  }, [form.categoryProduk]);
+  const isChecked = (id) => selectedIds.includes(id);
+
   const handleInputChange = (event) => {
     const { name, value } = event.target;
     updateForm(name, value);
@@ -238,6 +260,37 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
     };
     loadIndustries();
   }, [buttonSubmitClick, chekValid]);
+  useEffect(() => {
+    if (form.industry_id) {
+      setValue('industry_id', parseInt(form.industry_id));
+    }
+    if (form.state) {
+      setValue('state', parseInt(form.state));
+    }
+    if (form.city) {
+      setValue('city', parseInt(form.city));
+    }
+    if (form.tempoDuration) {
+      setValue('tempoDuration', form.tempoDuration);
+    }
+    if (form.tempoLimit) {
+      setValue('tempoLimit', form.tempoLimit);
+    }
+    if (form.tempoLimit) {
+      const isValueInOptions = radioOptions.some(
+        (option) => option.value === form.tempoLimit
+      );
+
+      if (isValueInOptions) {
+        setValue('tempoLimit', form.tempoLimit); // Set value dari radio options
+        setIsCustom(false); // Pastikan custom tidak aktif
+      } else {
+        setValue('tempoLimit', 'custom'); // Set value ke custom jika tidak termasuk dalam options
+        setIsCustom(true); // Aktifkan custom input
+        setTempoLimitValueEx(form.tempoLimit); // Set nilai input custom ke form.tempoLimit
+      }
+    }
+  }, [form]);
   return (
     <>
       <div className='flex justify-start'>
@@ -551,7 +604,7 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
               <div className='w-1/5' ref={tempoDurationRef}>
                 <RadioGroup
                   onChange={onChangeTempoDuration}
-                  // value={selectedValue}
+                  value={form.tempoDuration}
                 >
                   <Stack direction='column' className=''>
                     <Radio colorScheme='red' value='7'>
@@ -571,7 +624,7 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
                   </div>
                 )}
               </div>
-              <div className='w-4/5 flex flex-row justify-between items-center '>
+              <div className='w-4/5 flex flex-row justify-between items-center'>
                 <div>
                   <label className='form-label w-2/5 text-nowrap'>
                     Limit Tempo
@@ -585,48 +638,59 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
                   ref={tempoLimitRef}
                 >
                   <RadioGroup
-                    onChange={onChangeTempoLimit}
-                    className='flex items-center justify-between '
+                    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' className=''>
+                    <Stack direction='row'>
                       {/* Kolom 1 */}
                       <Stack direction='column' spacing={2} className='mr-4'>
-                        <Radio colorScheme='red' value='5.000.000'>
-                          5.000.000
-                        </Radio>
-                        <Radio colorScheme='red' value='10.000.000'>
-                          10.000.000
-                        </Radio>
-                        <Radio colorScheme='red' value='15.000.000'>
-                          15.000.000
-                        </Radio>
-                        <Radio colorScheme='red' value='20.000.000'>
-                          20.000.000
-                        </Radio>
+                        {radioOptions.slice(0, 4).map((option) => (
+                          <Radio
+                            key={option.value}
+                            colorScheme='red'
+                            value={option.value}
+                          >
+                            {option.label}
+                          </Radio>
+                        ))}
                       </Stack>
 
                       {/* Kolom 2 */}
                       <Stack direction='column' className='ml-8' spacing={2}>
-                        <Radio colorScheme='red' value='25.000.000'>
-                          25.000.000
-                        </Radio>
-                        <Radio colorScheme='red' value='30.000.000'>
-                          30.000.000
-                        </Radio>
-                        <Radio colorScheme='red' value='35.000.000'>
-                          35.000.000
-                        </Radio>
-                        <div className='flex flex-row'>
+                        {radioOptions.slice(4).map((option) => (
+                          <Radio
+                            key={option.value}
+                            colorScheme='red'
+                            value={option.value}
+                          >
+                            {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(tempoLimitValue)} // Menampilkan nilai terformat
+                            value={formatRupiah(tempoLimitValueEx)} // Menampilkan nilai terformat
                             onChange={(e) => {
                               const value = e.target.value;
                               const formattedValue = formatRupiah(value);
-                              updateForm('tempoLimit', formattedValue); // Mengupdate nilai di react-hook-form
+                              setTempoLimitValueEx(formattedValue);
+                              updateForm(
+                                'tempoLimit',
+                                formattedValue.replace(/^Rp\s*/, '')
+                              ); // Mengupdate nilai di react-hook-form
                             }}
                           />
                         </div>
@@ -659,7 +723,21 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
             </div>
             <div className='w-3/5 flex flex-col justify-start'>
               <div className='flex gap-x-4' ref={bersediaRef}>
-                <Checkbox
+                <RadioGroup
+                  onChange={handleCheckboxBersediaChange}
+                  value={form.bersedia}
+                >
+                  <Stack direction='row'>
+                    <Radio colorScheme='red' value='bersedia'>
+                      Saya bersedia
+                    </Radio>
+                    <Radio colorScheme='red' value='tidakBersedia'>
+                      Tidak bersedia
+                    </Radio>
+                  </Stack>
+                </RadioGroup>
+                {/* <Checkbox
+                  name='bersedia'
                   borderColor='gray.600'
                   colorScheme='red'
                   isChecked={bersedia === true} // Checked when bersedia is true
@@ -670,6 +748,7 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
                   Saya bersedia
                 </Checkbox>
                 <Checkbox
+                  name='bersedia'
                   borderColor='gray.600'
                   colorScheme='red'
                   isChecked={bersedia === false} // Checked when bersedia is false
@@ -678,7 +757,7 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
                   size='md'
                 >
                   Tidak bersedia
-                </Checkbox>
+                </Checkbox> */}
               </div>
               {chekValid && (
                 <div className='text-caption-2 text-danger-500 mt-1'>
@@ -704,6 +783,7 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
                     <Checkbox
                       key={item.id}
                       onChange={() => handleCheckboxChange(item.id)}
+                      isChecked={isChecked(item.id)}
                     >
                       {item.name}
                     </Checkbox>
@@ -713,6 +793,7 @@ const informasiPerusahaan = ({ chekValid, buttonSubmitClick }) => {
                   {secondColumn.map((item) => (
                     <Checkbox
                       key={item.id}
+                      isChecked={isChecked(item.id)}
                       onChange={() => handleCheckboxChange(item.id)}
                     >
                       {item.name}