diff options
| author | Rafi Zadanly <rafizadanly@gmail.com> | 2022-12-29 11:34:04 +0700 |
|---|---|---|
| committer | Rafi Zadanly <rafizadanly@gmail.com> | 2022-12-29 11:34:04 +0700 |
| commit | ec9e0f90c3d8111d77cc4bfc3c5f56f473428786 (patch) | |
| tree | 4e3a77083c6cf0701c4355d7291dfb7afe00e1cb /src/pages/shop/checkout.js | |
| parent | ec3d2d806cc7e5dceb2be1d73b9351526ad75768 (diff) | |
no message
Diffstat (limited to 'src/pages/shop/checkout.js')
| -rw-r--r-- | src/pages/shop/checkout.js | 85 |
1 files changed, 84 insertions, 1 deletions
diff --git a/src/pages/shop/checkout.js b/src/pages/shop/checkout.js index 48cbc10e..b1704cbc 100644 --- a/src/pages/shop/checkout.js +++ b/src/pages/shop/checkout.js @@ -1,9 +1,57 @@ +import { ExclamationCircleIcon } from "@heroicons/react/24/solid"; +import { useEffect, useState } from "react"; +import Alert from "../../components/Alert"; import AppBar from "../../components/AppBar"; import Layout from "../../components/Layout"; +import LineDivider from "../../components/LineDivider"; +import Link from "../../components/Link"; import ProgressBar from "../../components/ProgressBar"; +import apiOdoo from "../../helpers/apiOdoo"; +import { useAuth } from "../../helpers/auth"; +import { getCart } from "../../helpers/cart"; export default function Checkout() { + const [auth, setAuth] = useAuth(); + const [address, setAddress] = useState(null); + const [selectedAddress, setSelectedAddress] = useState(null); + const [products, setProducts] = useState(null); + + useEffect(() => { + const getAddress = async () => { + if (auth?.id) { + const dataAddress = await apiOdoo('GET', `/api/v1/user/${auth.id}/address`); + setAddress(dataAddress); + } + }; + getAddress(); + }, [auth]); + + useEffect(() => { + const getProducts = async () => { + let cart = getCart(); + let productIds = Object + .values(cart) + .filter((itemCart) => itemCart.to_process == true) + .map((itemCart) => itemCart.product_id); + if (productIds.length > 0) { + productIds = productIds.join(','); + let dataProducts = await apiOdoo('GET', `/api/v1/product_variant/${productIds}`); + dataProducts = dataProducts.map((product) => ({ + ...product, + quantity: cart[product.id].quantity, + to_process: cart[product.id].to_process, + })); + setProducts(dataProducts); + } + }; + getProducts(); + }, []); + + useEffect(() => { + if (address) setSelectedAddress(address[0]); + }, [address]); + return ( <Layout> <AppBar title="Checkout" /> @@ -12,6 +60,41 @@ export default function Checkout() { current={2} labels={['Keranjang', 'Pembayaran', 'Selesai']} /> + + <LineDivider/> + + <Alert type="info" className="text-caption-2 flex gap-x-3 items-center my-2"> + <div> + <ExclamationCircleIcon className="w-6 text-blue-700"/> + </div> + <span>Jika mengalami kesulitan dalam melakukan pembelian di website Indoteknik. Hubungi kami disini</span> + </Alert> + + <LineDivider/> + + <div className="p-4"> + <div className="flex justify-between items-center"> + <h2>Alamat Pengiriman</h2> + <Link className="text-caption-1" href="/">Ubah Alamat</Link> + </div> + + { selectedAddress && ( + <div className="mt-4 text-caption-1"> + <p className="font-medium">{ selectedAddress.name }</p> + <p className="mt-2 text-gray_r-11">{ selectedAddress.mobile }</p> + <p className="mt-1 text-gray_r-11">{ selectedAddress.street } { selectedAddress.street2 }</p> + </div> + ) } + </div> + + <LineDivider/> </Layout> ) -}
\ No newline at end of file +} +// odoo = 1677721600 +// from = 3026531840 +// to = 3355443200 + +// odoo = 629145600 +// from = 2355443200 +// to = 1258291200
\ No newline at end of file |
