<iman> update tampilan desktop switcj account

2 files changed, 55 insertions, 32 deletions

diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx
index 2080ae75..70b6df1f 100644
--- a/src-migrate/modules/register/components/FormBisnis.tsx
+++ b/src-migrate/modules/register/components/FormBisnis.tsx
@@ -292,7 +292,12 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
           />
         </div>
       </BottomPopup>
-      <form className='mt-6 grid grid-cols-1 gap-y-4' onSubmit={handleSubmit}>
+      <form
+        className={`mt-6 grid ${
+          type === 'bisnis' ? 'grid-rows-10' : 'grid-rows-5'
+        } grid-flow-col gap-x-4 gap-y-2`}
+        onSubmit={handleSubmit}
+      >
         <div>
           <label htmlFor='email' className='font-bold'>
             Email Bisnis{' '}
@@ -307,7 +312,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
             name='email_partner'
             placeholder='example@email.com'
             value={!required ? form.email_partner : ''}
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input max-h-11 mt-3 ${
+              required ? 'cursor-no-drop' : ''
+            }`}
             disabled={required}
             contentEditable={required}
             readOnly={required}
@@ -323,12 +330,12 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
           )}
         </div>
 
-        <div className=''>
+        <div>
           <label className='font-bold' htmlFor='company'>
             Nama Bisnis
           </label>
-          <div className='flex justify-between items-start gap-2 max-h-12 min-h-12 text-sm'>
-            <div className='w-4/5 pr-1'>
+          <div className='flex justify-between items-start gap-2 max-h-12 min-h-12 text-sm mt-3'>
+            <div className='w-4/5 pr-1 max-h-11'>
               <Controller
                 name='companyType'
                 control={control}
@@ -347,12 +354,12 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
                 </span>
               )}
             </div>
-            <div className='w-[120%]'>
+            <div className='w-[120%] '>
               <input
                 type='text'
                 name='business_name'
                 id='business_name'
-                className='form-input h-12 '
+                className='form-input max-h-11'
                 placeholder='Nama Perusahaan'
                 autoCapitalize='true'
                 value={form.business_name}
@@ -367,27 +374,29 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
           </div>
         </div>
 
-        <div className='mt-8 sm:mt-8'>
+        <div className='mt-8 md:mt-0'>
           <label className='font-bold' htmlFor='business_name'>
             Klasifikasi Jenis Usaha
           </label>
-          <Controller
-            name='industry_id'
-            control={control}
-            render={(props) => (
-              <HookFormSelect
-                {...props}
-                options={industries}
-                disabled={required}
-                placeholder={'Select industry'}
-              />
+          <div className='mt-5 max-h-10'>
+            <Controller
+              name='industry_id'
+              control={control}
+              render={(props) => (
+                <HookFormSelect
+                  {...props}
+                  options={industries}
+                  disabled={required}
+                  placeholder={'Select industry'}
+                />
+              )}
+            />
+            {selectedCategory && (
+              <span className='text-gray_r-11 text-xs'>
+                Kategori : {selectedCategory}
+              </span>
             )}
-          />
-          {selectedCategory && (
-            <span className='text-gray_r-11 text-xs'>
-              Kategori : {selectedCategory}
-            </span>
-          )}
+          </div>
           {chekValid && !required && !!errors.industry_id && (
             <span className='form-msg-danger'>{errors.industry_id}</span>
           )}
@@ -404,7 +413,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
             name='alamat_bisnis'
             placeholder='Masukan alamat bisnis anda'
             value={!required ? form.alamat_bisnis : ''}
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input mt-3 max-h-11 ${
+              required ? 'cursor-no-drop' : ''
+            }`}
             disabled={required}
             contentEditable={required}
             readOnly={required}
@@ -431,7 +442,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
             name='nama_wajib_pajak'
             placeholder='Masukan nama lengkap anda'
             value={!required ? form.nama_wajib_pajak : ''}
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input mt-3 max-h-11 ${
+              required ? 'cursor-no-drop' : ''
+            }`}
             disabled={required}
             contentEditable={required}
             readOnly={required}
@@ -483,7 +496,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
                   : form.alamat_wajib_pajak
                 : ''
             }
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input max-h-11 mt-3 ${
+              required ? 'cursor-no-drop' : ''
+            }`}
             disabled={isChekBox || required}
             contentEditable={required}
             readOnly={required}
@@ -510,7 +525,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
             type='tel'
             id='npwp'
             name='npwp'
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input max-h-11 mt-3 ${
+              required ? 'cursor-no-drop' : ''
+            }`}
             disabled={required}
             contentEditable={required}
             readOnly={required}
@@ -567,7 +584,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
             type='tel'
             id='sppkp'
             name='sppkp'
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input max-h-11 mt-3 ${
+              required ? 'cursor-no-drop' : ''
+            }`}
             disabled={required}
             contentEditable={required}
             readOnly={required}
@@ -594,7 +613,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
             type='file'
             id='npwp_document'
             name='npwp_document'
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input ${
+              type === 'bisnis' ? '' : 'border-none'
+            } mt-3 ${required ? 'cursor-no-drop' : ''}`}
             disabled={required}
             contentEditable={required}
             readOnly={required}
@@ -619,7 +640,9 @@ const form: React.FC<FormProps> = ({ type, required, isPKP, chekValid }) => {
             type='file'
             id='sppkp_document'
             name='sppkp_document'
-            className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`}
+            className={`form-input ${
+              type === 'bisnis' ? '' : 'border-none'
+            } mt-3 ${required ? 'cursor-no-drop' : ''}`}
             disabled={required}
             contentEditable={required}
             readOnly={required}
diff --git a/src/lib/auth/components/SwitchAccount.jsx b/src/lib/auth/components/SwitchAccount.jsx
index e1249779..da0ff068 100644
--- a/src/lib/auth/components/SwitchAccount.jsx
+++ b/src/lib/auth/components/SwitchAccount.jsx
@@ -134,7 +134,7 @@ const SwitchAccount = () => {
               </Stack>
             </RadioGroup>
           </div>
-          <FormBisnis type='bisnis' required={isTerdaftar} isPKP={isPKP} />
+          <FormBisnis type='profil' required={isTerdaftar} isPKP={isPKP} />
         </div>
       )}
     </>