summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/lib/address/components/Addresses.jsx135
-rw-r--r--src/lib/address/components/EditAddress.jsx311
-rw-r--r--src/lib/auth/components/CompanyProfile.jsx2
3 files changed, 275 insertions, 173 deletions
diff --git a/src/lib/address/components/Addresses.jsx b/src/lib/address/components/Addresses.jsx
index a610d371..a8879607 100644
--- a/src/lib/address/components/Addresses.jsx
+++ b/src/lib/address/components/Addresses.jsx
@@ -1,34 +1,72 @@
-import Link from '@/core/components/elements/Link/Link'
-import Spinner from '@/core/components/elements/Spinner/Spinner'
-import useAuth from '@/core/hooks/useAuth'
-import { getItemAddress, updateItemAddress } from '@/core/utils/address'
-import { useRouter } from 'next/router'
-import useAddresses from '../hooks/useAddresses'
-import MobileView from '@/core/components/views/MobileView'
-import DesktopView from '@/core/components/views/DesktopView'
-import Menu from '@/lib/auth/components/Menu'
+import { useState } from 'react';
+import Link from '@/core/components/elements/Link/Link';
+import Spinner from '@/core/components/elements/Spinner/Spinner';
+import useAuth from '@/core/hooks/useAuth';
+import { getItemAddress, updateItemAddress } from '@/core/utils/address';
+import { useRouter } from 'next/router';
+import useAddresses from '../hooks/useAddresses';
+import MobileView from '@/core/components/views/MobileView';
+import DesktopView from '@/core/components/views/DesktopView';
+import Menu from '@/lib/auth/components/Menu';
+import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
const Addresses = () => {
- const router = useRouter()
- const { select = null } = router.query
- const { addresses } = useAddresses()
- const selectedAddress = getItemAddress(select || '')
+ const router = useRouter();
+ const { select = null } = router.query;
+ const { addresses } = useAddresses();
+ const selectedAddress = getItemAddress(select || '');
+ const [changeConfirmation, setChangeConfirmation] = useState(false);
+ const [selectedForChange, setSelectedForChange] = useState(null); // State baru untuk simpan alamat yang akan diubah
+
const changeSelectedAddress = (id) => {
- if (!select) return
- updateItemAddress(select, id)
- router.back()
- }
+ if (!select) return;
+ updateItemAddress(select, id);
+ router.back();
+ };
+
+ const handleConfirmSubmit = () => {
+ setChangeConfirmation(false);
+ if (selectedForChange) {
+ router.push(`/my/address/${selectedForChange}/edit`);
+ }
+ };
if (addresses.isLoading) {
return (
<div className='flex justify-center my-6'>
<Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
</div>
- )
+ );
}
return (
<>
+ <BottomPopup
+ active={changeConfirmation}
+ close={() => setChangeConfirmation(false)} // Menutup popup
+ title='Ubah alamat Bisnis'
+ >
+ <div className='leading-7 text-gray_r-12/80'>
+ Anda akan mengubah alamat utama bisnis?
+ </div>
+ <div className='flex mt-6 gap-x-4 md:justify-end'>
+ <button
+ className='btn-solid-red flex-1 md:flex-none'
+ type='button'
+ onClick={handleConfirmSubmit}
+ >
+ Yakin
+ </button>
+ <button
+ className='btn-light flex-1 md:flex-none'
+ type='button'
+ onClick={() => setChangeConfirmation(false)}
+ >
+ Batal
+ </button>
+ </div>
+ </BottomPopup>
+
<MobileView>
<div className='p-4'>
<div className='text-right'>
@@ -37,7 +75,10 @@ const Addresses = () => {
<div className='grid gap-y-4 mt-4'>
{addresses.data?.map((address, index) => {
- const type = address.type.charAt(0).toUpperCase() + address.type.slice(1) + ' Address'
+ const type =
+ address.type.charAt(0).toUpperCase() +
+ address.type.slice(1) +
+ ' Address';
return (
<AddressCard
key={index}
@@ -45,9 +86,11 @@ const Addresses = () => {
type={type}
changeSelectedAddress={changeSelectedAddress}
selectedAddress={selectedAddress}
+ setChangeConfirmation={setChangeConfirmation} // Memanggil popup
+ setSelectedForChange={setSelectedForChange} // Simpan id address yang akan diubah
select={select}
/>
- )
+ );
})}
</div>
</div>
@@ -72,7 +115,9 @@ const Addresses = () => {
<div className='grid grid-cols-2 gap-4'>
{addresses.data?.map((address, index) => {
const type =
- address.type.charAt(0).toUpperCase() + address.type.slice(1) + ' Address'
+ address.type.charAt(0).toUpperCase() +
+ address.type.slice(1) +
+ ' Address';
return (
<AddressCard
key={index}
@@ -80,20 +125,30 @@ const Addresses = () => {
type={type}
changeSelectedAddress={changeSelectedAddress}
selectedAddress={selectedAddress}
+ setChangeConfirmation={setChangeConfirmation}
+ setSelectedForChange={setSelectedForChange}
select={select}
/>
- )
+ );
})}
</div>
</div>
</div>
</DesktopView>
</>
- )
-}
+ );
+};
-const AddressCard = ({ address, selectedAddress, changeSelectedAddress, type, select }) => {
- const auth = useAuth()
+const AddressCard = ({
+ address,
+ selectedAddress,
+ changeSelectedAddress,
+ type,
+ select,
+ setChangeConfirmation,
+ setSelectedForChange,
+}) => {
+ const auth = useAuth();
return (
<div
@@ -106,23 +161,33 @@ const AddressCard = ({ address, selectedAddress, changeSelectedAddress, type, se
(select && 'cursor-pointer hover:bg-gray_r-4 transition')
}`}
>
- <div onClick={() => changeSelectedAddress(address.id)} className={select && 'cursor-pointer'}>
+ <div
+ onClick={() => changeSelectedAddress(address.id)}
+ className={select && 'cursor-pointer'}
+ >
<div className='flex gap-x-2'>
<div className='badge-red'>{type}</div>
- {auth?.partnerId == address.id && <div className='badge-green'>Utama</div>}
+ {auth?.partnerId == address.id && (
+ <div className='badge-green'>Utama</div>
+ )}
</div>
<p className='font-medium mt-2'>{address.name}</p>
- {address.mobile && <p className='mt-2 text-gray_r-11'>{address.mobile}</p>}
+ {address.mobile && (
+ <p className='mt-2 text-gray_r-11'>{address.mobile}</p>
+ )}
<p className='mt-1 leading-6 text-gray_r-11'>{address.street}</p>
</div>
- <Link
- href={`/my/address/${address.id}/edit`}
+ <button
+ onClick={() => {
+ setSelectedForChange(address.id); // Set alamat yang dipilih
+ setChangeConfirmation(true); // Tampilkan popup konfirmasi
+ }}
className='btn-light bg-white mt-3 w-full !text-gray_r-11'
>
Ubah Alamat
- </Link>
+ </button>
</div>
- )
-}
+ );
+};
-export default Addresses
+export default Addresses;
diff --git a/src/lib/address/components/EditAddress.jsx b/src/lib/address/components/EditAddress.jsx
index 7a30a3d8..626709db 100644
--- a/src/lib/address/components/EditAddress.jsx
+++ b/src/lib/address/components/EditAddress.jsx
@@ -6,13 +6,16 @@ import cityApi from '../api/cityApi';
import { Controller, useForm } from 'react-hook-form';
import districtApi from '../api/districtApi';
import subDistrictApi from '../api/subDistrictApi';
+import addressApi from '@/lib/address/api/addressApi';
import editAddressApi from '../api/editAddressApi';
import HookFormSelect from '@/core/components/elements/Select/HookFormSelect';
import { toast } from 'react-hot-toast';
import Menu from '@/lib/auth/components/Menu';
+import useAuth from '@/core/hooks/useAuth';
+import odooApi from '@/core/api/odooApi';
const EditAddress = ({ id, defaultValues }) => {
- console.log('defaultValues', defaultValues);
+ const auth = useAuth();
const router = useRouter();
const {
register,
@@ -32,6 +35,20 @@ const EditAddress = ({ id, defaultValues }) => {
const [subDistricts, setSubDistricts] = useState([]);
useEffect(() => {
+ const loadProfile = async () => {
+ const dataProfile = await addressApi({ id: auth.parentId });
+ setValue('name', dataProfile.name);
+ setValue('industry', dataProfile.industryId);
+ setValue('companyType', dataProfile.companyTypeId);
+ setValue('taxName', dataProfile.taxName);
+ setValue('npwp', dataProfile.npwp);
+ setValue('alamat_wajib_pajak', dataProfile.alamatWajibPajak);
+ setValue('alamat_bisnis', dataProfile.alamatBisnis);
+ };
+ if (auth) loadProfile();
+ }, [auth, setValue]);
+
+ useEffect(() => {
const loadCities = async () => {
let dataCities = await cityApi();
dataCities = dataCities.map((city) => ({
@@ -92,170 +109,192 @@ const EditAddress = ({ id, defaultValues }) => {
const data = {
...values,
phone: values.mobile,
- street: values.street,
city_id: values.city,
district_id: values.district,
sub_district_id: values.subDistrict,
};
- console.log('data', data);
+ const dataAlamat = {
+ ...values,
+ id_user: auth.partnerId,
+ company_type_id: values.companyType,
+ industry_id: values.industry,
+ tax_name: values.taxName,
+ alamat_lengkap_text: values.alamat_wajib_pajak,
+ street: values.street,
+ };
+
+ // const address = await editAddressApi({ id, data });
+ const isUpdated = await odooApi(
+ 'PUT',
+ `/api/v1/partner/${auth.parentId}`,
+ dataAlamat
+ );
- const address = await editAddressApi({ id, data });
- if (address?.id) {
+ if (isUpdated?.id) {
+ // if (address?.id && isUpdated?.id) {
toast.success('Berhasil mengubah alamat');
router.back();
+ } else {
+ toast.error('Terjadi kesalahan internal');
+ router.back();
}
};
return (
- <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 className='w-full md:w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
- <h1 className='text-title-sm font-semibold mb-6 hidden md:block'>
- Ubah Alamat
- </h1>
- <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-danger-500 mt-1'>
- {errors.type?.message}
+ <>
+ <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 className='w-full md:w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
+ <div className='flex justify-start items-center mb-6'>
+ <h1 className='text-title-sm font-semibold hidden md:block mr-2'>
+ Ubah Alamat
+ </h1>
+ {auth?.partnerId == id && <div className='badge-green'>Utama</div>}
+ </div>
+ <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-danger-500 mt-1'>
+ {errors.type?.message}
+ </div>
</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-danger-500 mt-1'>
- {errors.name?.message}
+ <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-danger-500 mt-1'>
+ {errors.name?.message}
+ </div>
</div>
- </div>
- <div>
- <label className='form-label mb-2'>Email</label>
- <input
- {...register('email')}
- placeholder='johndoe@example.com'
- type='email'
- className='form-input'
- />
- <div className='text-caption-2 text-danger-500 mt-1'>
- {errors.email?.message}
+ <div>
+ <label className='form-label mb-2'>Email</label>
+ <input
+ {...register('email')}
+ placeholder='johndoe@example.com'
+ type='email'
+ className='form-input'
+ />
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.email?.message}
+ </div>
</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-danger-500 mt-1'>
- {errors.mobile?.message}
+ <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-danger-500 mt-1'>
+ {errors.mobile?.message}
+ </div>
</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-danger-500 mt-1'>
- {errors.street?.message}
+ <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-danger-500 mt-1'>
+ {errors.street?.message}
+ </div>
</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-danger-500 mt-1'>
- {errors.zip?.message}
+ <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-danger-500 mt-1'>
+ {errors.zip?.message}
+ </div>
</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-danger-500 mt-1'>
- {errors.city?.message}
+ <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-danger-500 mt-1'>
+ {errors.city?.message}
+ </div>
</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 className='text-caption-2 text-danger-500 mt-1'>
- {errors.district?.message}
+ <div>
+ <label className='form-label mb-2'>Kecamatan</label>
+ <Controller
+ name='district'
+ control={control}
+ render={(props) => (
+ <HookFormSelect
+ {...props}
+ options={districts}
+ disabled={!watchCity}
+ />
+ )}
+ />
+ <div className='text-caption-2 text-danger-500 mt-1'>
+ {errors.district?.message}
+ </div>
</div>
- </div>
- <div>
- <label className='form-label mb-2'>Kelurahan</label>
- <Controller
- name='subDistrict'
- control={control}
- render={(props) => (
- <HookFormSelect
- {...props}
- options={subDistricts}
- disabled={!watchDistrict}
- />
- )}
- />
+ <div>
+ <label className='form-label mb-2'>Kelurahan</label>
+ <Controller
+ name='subDistrict'
+ control={control}
+ render={(props) => (
+ <HookFormSelect
+ {...props}
+ options={subDistricts}
+ disabled={!watchDistrict}
+ />
+ )}
+ />
+ </div>
</div>
- </div>
- <button
- type='submit'
- className='btn-yellow w-full md:w-fit mt-6 ml-0 md:ml-auto'
- >
- Simpan
- </button>
- </form>
+ <button
+ type='submit'
+ className='btn-yellow w-full md:w-fit mt-6 ml-0 md:ml-auto'
+ >
+ Simpan
+ </button>
+ </form>
+ </div>
</div>
- </div>
+ </>
);
};
diff --git a/src/lib/auth/components/CompanyProfile.jsx b/src/lib/auth/components/CompanyProfile.jsx
index f1577ca1..d4cf8657 100644
--- a/src/lib/auth/components/CompanyProfile.jsx
+++ b/src/lib/auth/components/CompanyProfile.jsx
@@ -24,7 +24,6 @@ const CompanyProfile = () => {
alamat_bisnis: '',
},
});
- console.log('auth', auth);
const [industries, setIndustries] = useState([]);
useEffect(() => {
const loadIndustries = async () => {
@@ -75,7 +74,6 @@ const CompanyProfile = () => {
alamat_lengkap_text: values.alamat_wajib_pajak,
street: values.alamat_bisnis,
};
- console.log('data', data);
const isUpdated = await odooApi(
'PUT',
`/api/v1/partner/${auth.parentId}`,
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-18 00:32:38 +0000