diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/core/utils/address.js | 31 | ||||
| -rw-r--r-- | src/lib/address/api/addressesApi.js | 10 | ||||
| -rw-r--r-- | src/lib/address/components/Addresses.jsx | 68 | ||||
| -rw-r--r-- | src/lib/address/hooks/useAddresses.js | 13 | ||||
| -rw-r--r-- | src/lib/invoice/components/Invoice.jsx | 2 | ||||
| -rw-r--r-- | src/lib/transaction/components/Transaction.jsx | 2 | ||||
| -rw-r--r-- | src/lib/wishlist/components/Wishlists.jsx | 12 | ||||
| -rw-r--r-- | src/pages/my/address/index.jsx | 10 | ||||
| -rw-r--r-- | src/pages/my/menu.jsx | 2 |
9 files changed, 144 insertions, 6 deletions
diff --git a/src/core/utils/address.js b/src/core/utils/address.js new file mode 100644 index 00000000..b89dd924 --- /dev/null +++ b/src/core/utils/address.js @@ -0,0 +1,31 @@ +const getAddress = () => { + if (typeof window !== 'undefined') { + const address = localStorage.getItem('address') + if (address) return JSON.parse(address) + } + return {} +} + +const setAddress = (address) => { + if (typeof window !== 'undefined') { + localStorage.setItem('address', JSON.stringify(address)) + } + return +} + +const getItemAddress = (key) => { + let address = getAddress() + return address[key] +} + +const updateItemAddress = (key, value) => { + let address = getAddress() + address[key] = value + setAddress(address) + return +} + +export { + getItemAddress, + updateItemAddress +}
\ No newline at end of file diff --git a/src/lib/address/api/addressesApi.js b/src/lib/address/api/addressesApi.js new file mode 100644 index 00000000..1edfc077 --- /dev/null +++ b/src/lib/address/api/addressesApi.js @@ -0,0 +1,10 @@ +import odooApi from "@/core/api/odooApi" +import { getAuth } from "@/core/utils/auth" + +const addressesApi = async () => { + const auth = getAuth() + const dataAddresses = await odooApi('GET', `/api/v1/user/${auth.id}/address`) + return dataAddresses +} + +export default addressesApi
\ No newline at end of file diff --git a/src/lib/address/components/Addresses.jsx b/src/lib/address/components/Addresses.jsx new file mode 100644 index 00000000..7a82c0da --- /dev/null +++ b/src/lib/address/components/Addresses.jsx @@ -0,0 +1,68 @@ +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" + +const Addresses = () => { + const router = useRouter() + const { + select = null + } = router.query + const auth = useAuth() + const { addresses } = useAddresses() + const selectedAdress = getItemAddress(select || '') + const changeSelectedAddress = (id) => { + if (!select) return + updateItemAddress(select, id) + router.back() + } + + 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 ( + <div className="p-4"> + <div className="text-right"> + <Link href="/my/address/create">Tambah Alamat</Link> + </div> + + <div className="grid gap-y-4 mt-4"> + { addresses.data?.map((address, index) => { + let type = address.type.charAt(0).toUpperCase() + address.type.slice(1) + ' Address'; + return ( + <div + key={index} + className={"p-4 rounded-md border " + (selectedAdress && selectedAdress == address.id ? "border-gray_r-7 bg-gray_r-2" : "border-gray_r-7") } + > + <div onClick={() => changeSelectedAddress(address.id)}> + <div className="flex gap-x-2" > + <div className="badge-red">{ type }</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> + ) } + <p className={`mt-1 leading-6 ${selectedAdress && selectedAdress == address.id ? "text-gray_r-12" : "text-gray_r-11"}`}> + { address.street } + </p> + </div> + <Link href={`/my/address/${address.id}/edit`} className="btn-light bg-white mt-3 w-full !text-gray_r-11">Ubah Alamat</Link> + </div> + ); + }) } + </div> + </div> + ) +} + +export default Addresses
\ No newline at end of file diff --git a/src/lib/address/hooks/useAddresses.js b/src/lib/address/hooks/useAddresses.js new file mode 100644 index 00000000..9968d790 --- /dev/null +++ b/src/lib/address/hooks/useAddresses.js @@ -0,0 +1,13 @@ +import { useQuery } from "react-query" +import addressesApi from "../api/addressesApi" + +const useAddresses = () => { + const fetchAddresses = async () => await addressesApi() + const { data, isLoading } = useQuery('addresses', fetchAddresses) + + return { + addresses: { data, isLoading } + } +} + +export default useAddresses
\ No newline at end of file diff --git a/src/lib/invoice/components/Invoice.jsx b/src/lib/invoice/components/Invoice.jsx index 3e0baaee..aee4a498 100644 --- a/src/lib/invoice/components/Invoice.jsx +++ b/src/lib/invoice/components/Invoice.jsx @@ -10,7 +10,7 @@ const Invoice = ({ id }) => { if (invoice.isLoading) { return ( - <div className="flex justify-center my-4"> + <div className="flex justify-center my-6"> <Spinner className="w-6 text-gray_r-12/50 fill-gray_r-12" /> </div> ) diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx index 0759dbf8..0017afba 100644 --- a/src/lib/transaction/components/Transaction.jsx +++ b/src/lib/transaction/components/Transaction.jsx @@ -70,7 +70,7 @@ const Transaction = ({ id }) => { if (transaction.isLoading) { return ( - <div className="flex justify-center my-4"> + <div className="flex justify-center my-6"> <Spinner className="w-6 text-gray_r-12/50 fill-gray_r-12" /> </div> ) diff --git a/src/lib/wishlist/components/Wishlists.jsx b/src/lib/wishlist/components/Wishlists.jsx index 8a456a8d..4bb63933 100644 --- a/src/lib/wishlist/components/Wishlists.jsx +++ b/src/lib/wishlist/components/Wishlists.jsx @@ -15,16 +15,22 @@ const Wishlists = () => { const pageCount = Math.ceil(wishlists.data?.productTotal / limit) + if (wishlists.isLoading) { + return ( + <div className="flex justify-center my-6"> + <Spinner className="w-6 text-gray_r-12/50 fill-gray_r-12" /> + </div> + ) + } + return ( <div className="px-4 py-6"> - { wishlists.isLoading && ( - <Spinner className="w-6 h-6 text-gray-600 fill-gray-900 mx-auto" /> - ) } { wishlists.data?.products?.length == 0 && ( <Alert type='info' className='text-center'> Wishlist anda masih kosong </Alert> ) } + <div className="grid grid-cols-2 gap-3"> {wishlists.data?.products.map((product) => ( <ProductCard key={product.id} data={product} /> diff --git a/src/pages/my/address/index.jsx b/src/pages/my/address/index.jsx new file mode 100644 index 00000000..29e21c30 --- /dev/null +++ b/src/pages/my/address/index.jsx @@ -0,0 +1,10 @@ +import AppLayout from "@/core/components/layouts/AppLayout" +import AddressesComponent from "@/lib/address/components/Addresses" + +export default function Addresses() { + return ( + <AppLayout title="Daftar Alamat"> + <AddressesComponent /> + </AppLayout> + ) +}
\ No newline at end of file diff --git a/src/pages/my/menu.jsx b/src/pages/my/menu.jsx index 0bd6137e..2ae00722 100644 --- a/src/pages/my/menu.jsx +++ b/src/pages/my/menu.jsx @@ -77,7 +77,7 @@ export default function Menu() { </MenuHeader> <div className="divide-y divide-gray_r-6 border-y border-gray_r-6 mt-4"> - <LinkItem href="/"> + <LinkItem href="/my/address"> Daftar Alamat </LinkItem> <LinkItem href="/"> |