diff options
| -rw-r--r-- | src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx | 127 |
1 files changed, 115 insertions, 12 deletions
diff --git a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx index aca88439..c3625217 100644 --- a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx +++ b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx @@ -89,8 +89,8 @@ const informasiPerusahaan = ({}) => { onSubmit={handleSubmit(onSubmitHandler)} className='flex mt-4 flex-col w-full ' > - <div className='w-full grid grid-row-2 gap-4'> - <div className='flex flex-row justify-between items-center'> + <div className='w-full grid grid-row-2 gap-5'> + <div className='flex flex-row justify-between items-start'> <div> <label className='form-label w-2/5 text-nowrap'> Nama Perusahaan @@ -105,7 +105,7 @@ const informasiPerusahaan = ({}) => { placeholder='Masukkan nama perusahaan' type='text' className='form-input' - aria-invalid={errors.id?.message} + aria-invalid={errors.name?.message} /> <span className='text-xs opacity-60'> Format: PT. INDOTEKNIK DOTCOM GEMILANG @@ -115,7 +115,7 @@ const informasiPerusahaan = ({}) => { </div> </div> </div> - <div className='flex flex-row justify-between items-center'> + <div className='flex flex-row justify-between items-start'> <div> <label className='form-label w-2/5 text-nowrap'>Industri</label> <span className='text-xs opacity-60'> @@ -135,7 +135,7 @@ const informasiPerusahaan = ({}) => { )} /> {selectedCategory && ( - <span className='text-gray_r-11 text-xs'> + <span className='text-gray_r-11 text-xs opacity-60'> Kategori : {selectedCategory} </span> )} @@ -145,7 +145,7 @@ const informasiPerusahaan = ({}) => { </div> </div> - <div className='flex flex-row justify-between items-center'> + <div className='flex flex-row justify-between items-start'> <div> <label className='form-label w-2/5 text-nowrap'> Alamat Perusahaan @@ -155,12 +155,17 @@ const informasiPerusahaan = ({}) => { </span> </div> <div className='w-3/5 flex gap-3 flex-col'> - <input - {...register('street')} - placeholder='Masukkan alamat lengkap perusahaan' - type='text' - className='form-input' - /> + <div> + <input + {...register('street')} + placeholder='Masukkan alamat lengkap perusahaan' + type='text' + className='form-input' + /> + <div className='text-caption-2 text-danger-500 mt-1'> + {errors.street?.message} + </div> + </div> <div className='sub-alamat flex flex-row w-full gap-3'> <div className='w-2/5'> <Controller @@ -209,6 +214,96 @@ const informasiPerusahaan = ({}) => { </div> </div> </div> + <div className='flex flex-row justify-between items-start'> + <div> + <label className='form-label w-2/5 text-nowrap'> + No. Telfon Perusahaan + </label> + <span className='text-xs opacity-60'> + isi no telfon perusahaan yang sesuai + </span> + </div> + <div className='w-3/5'> + <input + {...register('mobile')} + placeholder='Masukkan nomor telfon perusahaan' + type='text' + className='form-input' + aria-invalid={errors.mobile?.message} + /> + <div className='text-caption-2 text-danger-500 mt-1'> + {errors.mobile?.message} + </div> + </div> + </div> + + <div className='flex flex-row justify-between items-start'> + <div> + <label className='form-label w-2/5 text-nowrap'>Data Bank</label> + <span className='text-xs opacity-60'> + Isi detail data bank perusahaan anda + </span> + </div> + <div className='w-3/5 flex gap-3 flex-row'> + <div> + <input + {...register('bankName')} + placeholder='Nama bank' + type='text' + className='form-input' + /> + <span className='text-xs opacity-60'> + Format: BCA, Mandiri, CIMB, BNI dll + </span> + <div className='text-caption-2 text-danger-500 mt-1'> + {errors.bankName?.message} + </div> + </div> + <div> + <input + {...register('accountName')} + placeholder='Nama Rekening' + type='text' + className='form-input' + /> + <span className='text-xs opacity-60'>Format: John Doe</span> + <div className='text-caption-2 text-danger-500 mt-1'> + {errors.accountName?.message} + </div> + </div> + <div> + <input + {...register('accountNumber')} + placeholder='Nomor Rekening Bank' + type='text' + className='form-input' + /> + <span className='text-xs opacity-60'>Format: 01234567896</span> + <div className='text-caption-2 text-danger-500 mt-1'> + {errors.accountNumber?.message} + </div> + </div> + </div> + </div> + + <div className='flex flex-row justify-between items-start'> + <div> + <label className='form-label w-2/5 text-nowrap'> + Website <span className=' opacity-60'>(Opsional)</span> + </label> + <span className='text-xs opacity-60'> + isi no telfon perusahaan yang sesuai + </span> + </div> + <div className='w-3/5'> + <input + {...register('website')} + placeholder='www.indoteknik.com' + type='text' + className='form-input' + /> + </div> + </div> </div> <button type='submit' @@ -231,6 +326,10 @@ const validationSchema = Yup.object().shape({ zip: Yup.string().required('Harus di-isi'), state: Yup.string().required('Harus di-pilih'), city: Yup.string().required('Harus di-pilih'), + mobile: Yup.string().required('Harus di-isi'), + bankName: Yup.string().required('Harus di-isi'), + accountName: Yup.string().required('Harus di-isi'), + accountNumber: Yup.string().required('Harus di-isi'), }); const defaultValues = { @@ -241,6 +340,10 @@ const defaultValues = { state: '', city: '', zip: '', + mobile: '', + bankName: '', + accountName: '', + accountNumber: '', }; export default informasiPerusahaan; |