<iman> update pengajuan tempo

3 files changed, 271 insertions, 225 deletions

diff --git a/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx b/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
index a6f25d5e..f8f1cc17 100644
--- a/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
@@ -30,11 +30,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const handleConfirmSubmit = (format, base64) => {
     if (format == 'pdf') {
       setFormat(`application/${format}`);
-    } else if (format == undefined) {
-      setFormat(null);
-      setUrl(`${process.env.NEXT_PUBLIC_ODOO_API_HOST}` + base64);
-    } else {
+    } else if (format == 'png' || format == 'jpg' || format == 'jpeg') {
       setFormat(`image/${format}`);
+    } else {
+      setFormat(format);
     }
     setBase64(
       base64.trim().replace(/^"+/, '').replace(/"+$/, '').replaceAll('\\', '')
@@ -171,6 +170,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   useEffect(() => {
     validateDokumen();
   }, [buttonSubmitClick]);
+  console.log('formDokumen', formDokumen);
+  console.log('format', format);
   return (
     <>
       {isDesktop && (
@@ -1562,23 +1563,21 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           close={() => setIsExample(false)}
         >
           <div className='flex  justify-center items-center p-2'>
-            {/* <iframe
-              src={`${
-                format == null ? url : `data:${format};base64,${base64}`
-              }`}
+            <iframe
+              // src={`${
+              //   format == null ? url : `data:${format};base64,${base64}`
+              // }`}
               // src={`http://192.168.23.244:8069` + `${format}`}
-              // src={format}
+              src={`data:${format};base64,${base64}`}
               width='800px'
               height='600px'
               title='Document'
-            ></iframe> */}
-            <embed
-              src={`${
-                format == null ? url : `data:${format};base64,${base64}`
-              }`}
+            ></iframe>
+            {/* <embed
+              src={`data:${format};base64,${base64}`}
               width='100%'
               height='600px'
-            />
+            /> */}
           </div>
         </BottomPopup>
       )}
@@ -1591,19 +1590,17 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
         >
           <div className='flex  justify-center items-center p-2'>
             {/* <iframe
-              src={`${
-                format == null ? url : `data:${format};base64,${base64}`
-              }`}
-              // src={`http://192.168.23.244:8069` + `${format}`}
+              // 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}`
-              }`}
+              src={`data:${format};base64,${base64}`}
               width='100%'
               height='600px'
             />
diff --git a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
index f5cad812..ccd63856 100644
--- a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
+++ b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
@@ -33,7 +33,7 @@ const PengajuanTempo = () => {
   const { isDesktop, isMobile } = useDevice();
   const [currentStep, setCurrentStep] = React.useState(0);
   const NUMBER_OF_STEPS = 6;
-  const [isLoading, setIsLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState(true);
   const [bigData, setBigData] = useState();
   const [idTempo, setIdTempo] = useState(0);
   const { form, errors, validate, updateForm } = usePengajuanTempoStore();
@@ -547,22 +547,31 @@ const PengajuanTempo = () => {
   const handleCheckChange = (checked) => {
     setIsCheckedTNC(checked);
   };
+  if (isLoading && !bigData) {
+    return;
+  }
+  console.log('bigData', bigData);
   return (
     <>
       <div className='container flex flex-col items-center '>
         <h1 className=' font-semibold text-center mb-6'>
           Form Pengajuan Tempo
         </h1>
-        <p className='text-center mb-4'>
-          Lorem ipsum dolor sit amet consectetur. Commodo suspendisse at enim
-          magnis ut quisque rhoncus. Felis volutpat fringilla sollicitudin
-          ultricies. Enim non eget in lorem netus. Nisl pharetra accumsan diam
-          suspendisse.
+        <p
+          className={`text-center  ${
+            isMobile ? 'w-full text-sm' : 'w-3/4 mb-4'
+          }`}
+        >
+          Pembayaran tempo adalah layanan pembayaran berjangka yang difasilitasi
+          indoteknik.com untuk konsumen akun bisnis yang terdaftar dengan waktu
+          pembayaran mulai dari 7, 14, 21 hingga 30 Hari.
         </p>
       </div>
-      <div className='h-[2px] w-full mb-20 bg-gray_r-3' />
+      <div
+        className={`h-[2px] w-full ${isMobile ? 'mt-4' : 'mb-20'}  bg-gray_r-3`}
+      />
 
-      <div className='container mt-10 flex flex-col'>
+      <div className={`container ${isMobile ? 'mt-4' : 'mt-10'} flex flex-col`}>
         <div className='flex items-center justify-center'>
           <Stepper currentStep={currentStep} numberOfSteps={NUMBER_OF_STEPS} />
         </div>
@@ -595,7 +604,7 @@ const PengajuanTempo = () => {
                 onClick={goPrevStep}
               >
                 {<ChevronLeftIcon className='w-5' />}
-                <span className={`${isMobile ? 'text-xs' : ''} `}>
+                <span className={`font-medium ${isMobile ? 'text-xs' : ''} `}>
                   Langkah Sebelumnya
                 </span>
               </Button>
@@ -674,7 +683,7 @@ const TempoTermCondition = ({ onCheckChange }) => {
           isChecked={isCheckedTNC}
           onChange={toggleCheckTNC}
         />
-        <div className={`text-center ${isMobile ? 'text-sm' : ''}`}>
+        <div className={`${isMobile ? 'text-xs' : ''}`}>
           <label htmlFor='tnc' className='cursor-pointer'>
             Dengan ini saya menyetujui
           </label>{' '}
diff --git a/src/lib/pengajuan-tempo/component/Pengiriman.jsx b/src/lib/pengajuan-tempo/component/Pengiriman.jsx
index 497c86a9..068cf73c 100644
--- a/src/lib/pengajuan-tempo/component/Pengiriman.jsx
+++ b/src/lib/pengajuan-tempo/component/Pengiriman.jsx
@@ -889,109 +889,129 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         </div>
                       )}
                     </div>
-                    <div className='sub-alamat flex flex-row w-full gap-3'>
+                    <div
+                      className={` sub-alamat flex ${
+                        isKonfirmasi ? 'flex-col' : 'flex-row'
+                      } w-full gap-3`}
+                    >
                       <div
-                        className='w-2/5'
-                        ref={statePengirimanRef}
-                        aria-label='statePengiriman'
+                        className={`flex  ${
+                          isKonfirmasi
+                            ? ' flex-row gap-3 w-full'
+                            : 'flex-row gap-3 w-2/5'
+                        }`}
                       >
-                        <Controller
-                          name='statePengiriman'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              disabled={sameAddressStreet}
-                              options={states}
-                              placeholder='Provinsi'
-                            />
+                        <div
+                          className='w-full'
+                          ref={statePengirimanRef}
+                          aria-label='statePengiriman'
+                        >
+                          <Controller
+                            name='statePengiriman'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                disabled={sameAddressStreet}
+                                options={states}
+                                placeholder='Provinsi'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errorsPengiriman.statePengiriman}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errorsPengiriman.statePengiriman}
-                          </div>
-                        )}
-                      </div>
-                      <div className='w-1/3' ref={cityPengirimanRef}>
-                        <Controller
-                          name='cityPengiriman'
-                          aria-label='cityPengiriman'
-                          disabled={sameAddressStreet}
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={cities}
-                              disabled={!watchState || sameAddressStreet}
-                              placeholder='Kota'
-                            />
+                        </div>
+                        <div className='w-full' ref={cityPengirimanRef}>
+                          <Controller
+                            name='cityPengiriman'
+                            aria-label='cityPengiriman'
+                            disabled={sameAddressStreet}
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={cities}
+                                disabled={!watchState || sameAddressStreet}
+                                placeholder='Kota'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errorsPengiriman.cityPengiriman}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errorsPengiriman.cityPengiriman}
-                          </div>
-                        )}
+                        </div>
                       </div>
-                      <div className='w-1/3' ref={districtPengirimanRef}>
-                        <Controller
-                          name='districtPengiriman'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={districts}
-                              disabled={
-                                !watchState || !watchCity || sameAddressStreet
-                              }
-                              placeholder='Kelurahan'
-                            />
+                      <div
+                        className={`flex-row flex gap-2 justify-between  ${
+                          isKonfirmasi ? 'w-full' : 'w-3/5'
+                        }`}
+                      >
+                        <div className='w-full' ref={districtPengirimanRef}>
+                          <Controller
+                            name='districtPengiriman'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={districts}
+                                disabled={
+                                  !watchState || !watchCity || sameAddressStreet
+                                }
+                                placeholder='Kelurahan'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errors.subDistrictPengiriman}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errors.subDistrictPengiriman}
-                          </div>
-                        )}
-                      </div>
-                      <div className='w-1/3' ref={subDistrictPengirimanRef}>
-                        <Controller
-                          name='subDistrictPengiriman'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={subDistricts}
-                              disabled={!watchDistrict || sameAddressStreet}
-                              placeholder='Kelurahan'
-                            />
+                        </div>
+                        <div className='w-full' ref={subDistrictPengirimanRef}>
+                          <Controller
+                            name='subDistrictPengiriman'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={subDistricts}
+                                disabled={!watchDistrict || sameAddressStreet}
+                                placeholder='Kelurahan'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errors.subDistrictPengiriman}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errors.subDistrictPengiriman}
-                          </div>
-                        )}
-                      </div>
-                      <div className='w-1/3' ref={zipRef}>
-                        <Controller
-                          name='zipPengiriman'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={zips}
-                              disabled={!watchsubDistrict || sameAddressStreet}
-                              placeholder='Zip'
-                            />
+                        </div>
+                        <div className='w-full' ref={zipRef}>
+                          <Controller
+                            name='zipPengiriman'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={zips}
+                                disabled={
+                                  !watchsubDistrict || sameAddressStreet
+                                }
+                                placeholder='Zip'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errors.zipPengiriman}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errors.zipPengiriman}
-                          </div>
-                        )}
+                        </div>
                       </div>
                     </div>
                   </>
@@ -1083,113 +1103,133 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         </div>
                       )}
                     </div>
-                    <div className='sub-alamat flex flex-row w-full gap-3'>
+                    <div
+                      className={` sub-alamat flex ${
+                        isKonfirmasi ? 'flex-col' : 'flex-row'
+                      } w-full gap-3`}
+                    >
                       <div
-                        className='w-3/5'
-                        ref={stateInvoiceRef}
-                        aria-label='stateInvoice'
+                        className={`flex  ${
+                          isKonfirmasi
+                            ? ' flex-row gap-3 w-full'
+                            : 'flex-row gap-3 w-2/5'
+                        }`}
                       >
-                        <Controller
-                          name='stateInvoice'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={states}
-                              disabled={sameAddress}
-                              placeholder='Provinsi'
-                            />
+                        <div
+                          className='w-full'
+                          ref={stateInvoiceRef}
+                          aria-label='stateInvoice'
+                        >
+                          <Controller
+                            name='stateInvoice'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={states}
+                                disabled={sameAddress}
+                                placeholder='Provinsi'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errorsPengiriman.stateInvoice}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errorsPengiriman.stateInvoice}
-                          </div>
-                        )}
+                        </div>
+                        <div
+                          className='w-full'
+                          ref={cityInvoiceRef}
+                          aria-label='cityInvoice'
+                        >
+                          <Controller
+                            name='cityInvoice'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={citiesInvoice}
+                                disabled={!watchStateInvoice || sameAddress}
+                                placeholder='Kota'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errorsPengiriman.cityInvoice}
+                            </div>
+                          )}
+                        </div>
                       </div>
                       <div
-                        className='w-2/5'
-                        ref={cityInvoiceRef}
-                        aria-label='cityInvoice'
+                        className={`flex-row flex gap-2 justify-between  ${
+                          isKonfirmasi ? 'w-full' : 'w-3/5'
+                        }`}
                       >
-                        <Controller
-                          name='cityInvoice'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={citiesInvoice}
-                              disabled={!watchStateInvoice || sameAddress}
-                              placeholder='Kota'
-                            />
-                          )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errorsPengiriman.cityInvoice}
-                          </div>
-                        )}
-                      </div>
-                      <div className='w-1/3' ref={districtInvoiceRef}>
-                        <Controller
-                          name='districtInvoice'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={districtsInvoice}
-                              disabled={
-                                !watchStateInvoice ||
-                                !watchCityInvoice ||
-                                sameAddress
-                              }
-                              placeholder='Kecamatan'
-                            />
+                        <div className='w-full' ref={districtInvoiceRef}>
+                          <Controller
+                            name='districtInvoice'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={districtsInvoice}
+                                disabled={
+                                  !watchStateInvoice ||
+                                  !watchCityInvoice ||
+                                  sameAddress
+                                }
+                                placeholder='Kecamatan'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errors.districtInvoice}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errors.districtInvoice}
-                          </div>
-                        )}
-                      </div>
-                      <div className='w-1/3' ref={subDistrictInvoiceRef}>
-                        <Controller
-                          name='subDistrictInvoice'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={subDistrictsInvoice}
-                              disabled={!watchDistrictInvoice || sameAddress}
-                              placeholder='Kelurahan'
-                            />
+                        </div>
+                        <div className='w-full' ref={subDistrictInvoiceRef}>
+                          <Controller
+                            name='subDistrictInvoice'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={subDistrictsInvoice}
+                                disabled={!watchDistrictInvoice || sameAddress}
+                                placeholder='Kelurahan'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errors.subDistrictsInvoice}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errors.subDistrictsInvoice}
-                          </div>
-                        )}
-                      </div>
-                      <div className='w-1/3' ref={zipInvoiceRef}>
-                        <Controller
-                          name='zipInvoice'
-                          control={control}
-                          render={(props) => (
-                            <HookFormSelect
-                              {...props}
-                              options={zipsInvoice}
-                              disabled={!watchsubDistrictInvoice || sameAddress}
-                              placeholder='Zip'
-                            />
+                        </div>
+                        <div className='w-full' ref={zipInvoiceRef}>
+                          <Controller
+                            name='zipInvoice'
+                            control={control}
+                            render={(props) => (
+                              <HookFormSelect
+                                {...props}
+                                options={zipsInvoice}
+                                disabled={
+                                  !watchsubDistrictInvoice || sameAddress
+                                }
+                                placeholder='Zip'
+                              />
+                            )}
+                          />
+                          {chekValid && (
+                            <div className='text-caption-2 text-danger-500 mt-1'>
+                              {errors.zipInvoice}
+                            </div>
                           )}
-                        />
-                        {chekValid && (
-                          <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errors.zipInvoice}
-                          </div>
-                        )}
+                        </div>
                       </div>
                     </div>
                   </>