summaryrefslogtreecommitdiff
path: root/src/lib/address/components/CreateAddress.jsx
diff options
context:
space:
mode:
authorRafi Zadanly <zadanlyr@gmail.com>2023-03-27 10:17:49 +0700
committerRafi Zadanly <zadanlyr@gmail.com>2023-03-27 10:17:49 +0700
commitbc04e721d51e149709ab3cfaf5e77ef034511860 (patch)
tree8da5c05bd90165c4b31664044bb771c4d47626ff /src/lib/address/components/CreateAddress.jsx
parent3f8a37b15c3fd1168b01390241cda7fa2ba980c7 (diff)
invoice, invoice detail, address, create address, edit address, wishlist
Diffstat (limited to 'src/lib/address/components/CreateAddress.jsx')
-rw-r--r--src/lib/address/components/CreateAddress.jsx237
1 files changed, 112 insertions, 125 deletions
diff --git a/src/lib/address/components/CreateAddress.jsx b/src/lib/address/components/CreateAddress.jsx
index 849b4c01..475d8548 100644
--- a/src/lib/address/components/CreateAddress.jsx
+++ b/src/lib/address/components/CreateAddress.jsx
@@ -10,6 +10,7 @@ import { useEffect, useState } from 'react'
import createAddressApi from '../api/createAddressApi'
import { toast } from 'react-hot-toast'
import { yupResolver } from '@hookform/resolvers/yup'
+import Menu from '@/lib/auth/components/Menu'
const CreateAddress = () => {
const auth = useAuth()
@@ -88,133 +89,119 @@ const CreateAddress = () => {
}
return (
- <form
- className='p-4 flex flex-col gap-y-4'
- onSubmit={handleSubmit(onSubmitHandler)}
- >
- <div>
- <label className='form-label mb-2'>Label Alamat</label>
- <Controller
- name='type'
- control={control}
- render={(props) => (
- <HookFormSelect
- {...props}
- isSearchable={false}
- options={types}
- />
- )}
- />
- <div className='text-caption-2 text-red_r-11 mt-1'>{errors.type?.message}</div>
+ <div className='max-w-none md:container mx-auto flex p-0 md:py-10'>
+ <div className='hidden md:block w-3/12 pr-4'>
+ <Menu />
</div>
-
- <div>
- <label className='form-label mb-2'>Nama</label>
- <input
- {...register('name')}
- placeholder='John Doe'
- type='text'
- className='form-input'
- />
- <div className='text-caption-2 text-red_r-11 mt-1'>{errors.name?.message}</div>
- </div>
-
- <div>
- <label className='form-label mb-2'>Email</label>
- <input
- {...register('email')}
- placeholder='contoh@email.com'
- type='email'
- className='form-input'
- />
- <div className='text-caption-2 text-red_r-11 mt-1'>{errors.email?.message}</div>
- </div>
-
- <div>
- <label className='form-label mb-2'>Mobile</label>
- <input
- {...register('mobile')}
- placeholder='08xxxxxxxx'
- type='tel'
- className='form-input'
- />
- <div className='text-caption-2 text-red_r-11 mt-1'>{errors.mobile?.message}</div>
- </div>
-
- <div>
- <label className='form-label mb-2'>Alamat</label>
- <input
- {...register('street')}
- placeholder='Jl. Bandengan Utara 85A'
- type='text'
- className='form-input'
- />
- <div className='text-caption-2 text-red_r-11 mt-1'>{errors.street?.message}</div>
- </div>
-
- <div>
- <label className='form-label mb-2'>Kode Pos</label>
- <input
- {...register('zip')}
- placeholder='10100'
- type='number'
- className='form-input'
- />
- <div className='text-caption-2 text-red_r-11 mt-1'>{errors.zip?.message}</div>
- </div>
-
- <div>
- <label className='form-label mb-2'>Kota</label>
- <Controller
- name='city'
- control={control}
- render={(props) => (
- <HookFormSelect
- {...props}
- options={cities}
- />
- )}
- />
- <div className='text-caption-2 text-red_r-11 mt-1'>{errors.city?.message}</div>
- </div>
-
- <div>
- <label className='form-label mb-2'>Kecamatan</label>
- <Controller
- name='district'
- control={control}
- render={(props) => (
- <HookFormSelect
- {...props}
- options={districts}
- disabled={!watchCity}
- />
- )}
- />
- </div>
-
- <div>
- <label className='form-label mb-2'>Kelurahan</label>
- <Controller
- name='subDistrict'
- control={control}
- render={(props) => (
- <HookFormSelect
- {...props}
- options={subDistricts}
- disabled={!watchDistrict}
- />
- )}
- />
+ <div className='w-full md:w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
+ <form onSubmit={handleSubmit(onSubmitHandler)}>
+ <div className='grid grid-cols-1 md:grid-cols-2 gap-4'>
+ <div>
+ <label className='form-label mb-2'>Label Alamat</label>
+ <Controller
+ name='type'
+ control={control}
+ render={(props) => (
+ <HookFormSelect {...props} isSearchable={false} options={types} />
+ )}
+ />
+ <div className='text-caption-2 text-red_r-11 mt-1'>{errors.type?.message}</div>
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Nama</label>
+ <input
+ {...register('name')}
+ placeholder='John Doe'
+ type='text'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-red_r-11 mt-1'>{errors.name?.message}</div>
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Email</label>
+ <input
+ {...register('email')}
+ placeholder='contoh@email.com'
+ type='email'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-red_r-11 mt-1'>{errors.email?.message}</div>
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Mobile</label>
+ <input
+ {...register('mobile')}
+ placeholder='08xxxxxxxx'
+ type='tel'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-red_r-11 mt-1'>{errors.mobile?.message}</div>
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Alamat</label>
+ <input
+ {...register('street')}
+ placeholder='Jl. Bandengan Utara 85A'
+ type='text'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-red_r-11 mt-1'>{errors.street?.message}</div>
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Kode Pos</label>
+ <input
+ {...register('zip')}
+ placeholder='10100'
+ type='number'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-red_r-11 mt-1'>{errors.zip?.message}</div>
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Kota</label>
+ <Controller
+ name='city'
+ control={control}
+ render={(props) => <HookFormSelect {...props} options={cities} />}
+ />
+ <div className='text-caption-2 text-red_r-11 mt-1'>{errors.city?.message}</div>
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Kecamatan</label>
+ <Controller
+ name='district'
+ control={control}
+ render={(props) => (
+ <HookFormSelect {...props} options={districts} disabled={!watchCity} />
+ )}
+ />
+ </div>
+
+ <div>
+ <label className='form-label mb-2'>Kelurahan</label>
+ <Controller
+ name='subDistrict'
+ control={control}
+ render={(props) => (
+ <HookFormSelect {...props} options={subDistricts} disabled={!watchDistrict} />
+ )}
+ />
+ </div>
+ </div>
+
+ <button type='submit' className='btn-yellow w-full md:w-fit mt-6 ml-0 md:ml-auto'>
+ Simpan
+ </button>
+ </form>
</div>
-
- <button
- type='submit'
- className='btn-yellow mt-2 w-full'
- >
- Simpan
- </button>
- </form>
+ </div>
)
}