diff options
Diffstat (limited to 'src-migrate')
| -rw-r--r-- | src-migrate/modules/register/components/FormBisnis.tsx | 85 |
1 files changed, 54 insertions, 31 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} |