<iman> update form bisnis to switch account

1 files changed, 115 insertions, 11 deletions

diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx
index d4fdbbbd..ad92948e 100644
--- a/src-migrate/modules/register/components/FormBisnis.tsx
+++ b/src-migrate/modules/register/components/FormBisnis.tsx
@@ -24,10 +24,15 @@ import { Controller, useForm } from 'react-hook-form';
 import HookFormSelect from '@/core/components/elements/Select/HookFormSelect';
 import odooApi from '~/libs/odooApi';
 import { toast } from 'react-hot-toast';
-import { EyeIcon } from '@heroicons/react/24/outline';
+import {
+  EyeIcon,
+  CheckCircleIcon,
+  XCircleIcon,
+} from '@heroicons/react/24/outline';
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
 import Image from 'next/image';
 import useDevice from '@/core/hooks/useDevice';
+import useAuth from '@/core/hooks/useAuth';
 interface FormProps {
   type: string;
   required: boolean;
@@ -101,14 +106,16 @@ const form: React.FC<FormProps> = ({
   useEffect(() => {
     if (form.company_type_id) {
       setValue('companyType', parseInt(form.company_type_id));
+      updateForm('sppkp_document', 'fileBase64.jpg');
     }
-  }, []);
+  }, [form.company_type_id]);
   useEffect(() => {
     if (form.industry_id) {
       setValue('industry_id', parseInt(form.industry_id));
     }
-  }, []);
+  }, [form.industry_id]);
 
+  console.log('form', form);
   useEffect(() => {
     const loadIndustries = async () => {
       const dataIndustries = await odooApi('GET', '/api/v1/partner/industry');
@@ -230,7 +237,7 @@ const form: React.FC<FormProps> = ({
         toast({
           ...toastProps,
           title:
-            'Format file yang diijinkan adalah .pdf, .doc, .docx, .png, .jpg, atau .jpeg',
+            'Format file yang diijinkan adalah .pdf, .png, .jpg, atau .jpeg',
           status: 'error',
         });
         event.target.value = '';
@@ -238,10 +245,10 @@ const form: React.FC<FormProps> = ({
       }
 
       // Check for file size
-      if (file.size > 5000000) {
+      if (file.size > 2000000) {
         toast({
           ...toastProps,
-          title: 'Maksimal ukuran file adalah 5MB',
+          title: 'Maksimal ukuran file adalah 2MB',
           status: 'error',
         });
         event.target.value = '';
@@ -320,7 +327,6 @@ const form: React.FC<FormProps> = ({
       validate();
     }
   };
-  useEffect(() => {}, [watch('industry_id'), industries]);
 
   const handleIndustriIdChange = (event: MouseEvent<HTMLDivElement>) => {
     const selectedIndustriIdValue = watch('industry_id');
@@ -334,13 +340,65 @@ const form: React.FC<FormProps> = ({
     }
   };
 
+  const [fileUrl, setFileUrl] = useState('');
+  const [popUpNPWP, setPopUpNpwp] = useState(false);
+  const [popSppkp, setPopUpSppkp] = useState(false);
+  const [hasNPWP, sethasNpwp] = useState(false);
+  const [hasSPPKP, sethasSPPKP] = useState(false);
+  const [fileUrlSppkp, setFileUrlSppkp] = useState('');
+
+  useEffect(() => {
+    const url = `${process.env.NEXT_PUBLIC_ODOO_API_HOST}/api/v1/user/download/npwp/109119`;
+    if (url) {
+      setFileUrl(url);
+      sethasNpwp(true);
+    }
+    const urlSppkp = `${process.env.NEXT_PUBLIC_ODOO_API_HOST}/api/v1/user/download/sppkp/109119`;
+    if (urlSppkp) {
+      setFileUrlSppkp(urlSppkp);
+      sethasSPPKP(true);
+    }
+  }, []);
+
   return (
     <>
       <BottomPopup
+        className='h-full object-contain object-center w-full'
+        title='Dokumen NPWP'
+        active={popUpNPWP}
+        close={() => setPopUpNpwp(false)}
+      >
+        <div className='flex p-2'>
+          <iframe
+            src={fileUrl}
+            width='800px'
+            height='600px'
+            title='NPWP File'
+            frameBorder='0'
+          ></iframe>
+        </div>
+      </BottomPopup>
+      <BottomPopup
+        className='h-full object-contain object-center w-full'
+        title='Dokumen SPPKP'
+        active={popSppkp}
+        close={() => setPopUpSppkp(false)}
+      >
+        <div className='flex p-2'>
+          <iframe
+            src={fileUrlSppkp}
+            width='800px'
+            height='600px'
+            title='NPWP File'
+            frameBorder='0'
+          ></iframe>
+        </div>
+      </BottomPopup>
+      <BottomPopup
         className=''
         title='Contoh SPPKP'
         active={isExample}
-        close={() => setIsExample(false)}
+        close={() => setPopUpNpwp(false)}
       >
         <div className='flex p-2'>
           <Image
@@ -704,14 +762,36 @@ const form: React.FC<FormProps> = ({
             ref={docsNpwpRef}
             readOnly={required}
             onChange={handleFileChange}
-            accept='.pdf,.doc,.docx,.png,.jpg,.jpeg' // Filter file types
+            accept='.pdf,.png,.jpg,.jpeg' // Filter file types
           />
 
           {chekValid && isPKP && !required && !!errors.npwp_document && (
             <span className='form-msg-danger'>{errors.npwp_document}</span>
           )}
+          <span className='form-msg-danger ml-4 text-xs mb-2'>
+            Format: .pdf, .png, .jpg, atau .jpeg, Maks 2MB
+          </span>
+          {hasNPWP && (
+            <div className='px-3'>
+              <div className='inline-flex flex-row items-center justify-between w-full rounded-md h-12 bg-green-50 px-2 py-1 text-sm font-medium text-green-700 ring-1 ring-inset ring-green-600/20'>
+                <div className='w-4/5  flex flex-row items-center justify-start '>
+                  <CheckCircleIcon className='w-6 mr-2' />
+                  Dokumen sudah diupload
+                </div>
+                <div className='w-1/5  flex flex-row  justify-end'>
+                  <EyeIcon
+                    onClick={() => setPopUpNpwp(true)}
+                    className={`w-6 mr-2 hover:scale-110 transition-transform duration-200}`}
+                  />
+                  <XCircleIcon
+                    onClick={() => sethasNpwp(false)}
+                    className='w-6 hover:scale-110 transition-transform duration-200'
+                  />
+                </div>
+              </div>
+            </div>
+          )}
         </div>
-
         <div>
           <label htmlFor='sppkp_document' className='font-bold'>
             Dokumen SPPKP{' '}
@@ -732,8 +812,32 @@ const form: React.FC<FormProps> = ({
             ref={docsSppkpRef}
             readOnly={required}
             onChange={handleFileChange}
-            accept='.pdf,.doc,.docx,.png,.jpg,.jpeg' // Filter file types
+            accept='.pdf,.png,.jpg,.jpeg'
+            content='lagu.jpg'
           />
+          <span className='form-msg-danger ml-4 text-xs mb-2'>
+            Format: .pdf, .png, .jpg, atau .jpeg, Maks 2MB
+          </span>
+          {hasSPPKP && (
+            <div className='px-3'>
+              <div className='inline-flex flex-row items-center justify-between w-full rounded-md h-12 bg-green-50 px-2 py-1 text-sm font-medium text-green-700 ring-1 ring-inset ring-green-600/20'>
+                <div className='w-4/5  flex flex-row items-center justify-start '>
+                  <CheckCircleIcon className='w-6 mr-2' />
+                  Dokumen sudah di upload
+                </div>
+                <div className='w-1/5  flex flex-row  justify-end'>
+                  <EyeIcon
+                    onClick={() => setPopUpSppkp(true)}
+                    className={`w-6 mr-2 hover:scale-110 transition-transform duration-200}`}
+                  />
+                  <XCircleIcon
+                    onClick={() => sethasSPPKP(false)}
+                    className='w-6 hover:scale-110 transition-transform duration-200'
+                  />
+                </div>
+              </div>
+            </div>
+          )}
 
           {chekValid && isPKP && !required && !!errors.sppkp_document && (
             <span className='form-msg-danger'>{errors.sppkp_document}</span>