summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorRafi Zadanly <rafizadanly@gmail.com>2022-12-29 11:34:04 +0700
committerRafi Zadanly <rafizadanly@gmail.com>2022-12-29 11:34:04 +0700
commitec9e0f90c3d8111d77cc4bfc3c5f56f473428786 (patch)
tree4e3a77083c6cf0701c4355d7291dfb7afe00e1cb
parentec3d2d806cc7e5dceb2be1d73b9351526ad75768 (diff)
no message
-rw-r--r--src/pages/shop/cart.js35
-rw-r--r--src/pages/shop/checkout.js85
2 files changed, 102 insertions, 18 deletions
diff --git a/src/pages/shop/cart.js b/src/pages/shop/cart.js
index 9fd44410..6fe079b3 100644
--- a/src/pages/shop/cart.js
+++ b/src/pages/shop/cart.js
@@ -4,6 +4,7 @@ import {
TrashIcon,
PlusIcon,
MinusIcon,
+ ExclamationCircleIcon,
} from "@heroicons/react/24/solid";
import { ExclamationTriangleIcon } from "@heroicons/react/24/outline";
import { useRouter } from "next/router";
@@ -41,23 +42,23 @@ export default function Cart() {
show: false
});
- const getProducts = async () => {
- let cart = getCart();
- let productIds = Object.keys(cart);
- 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);
- }
- setIsLoadingProducts(false);
- }
-
+
useEffect(() => {
+ const getProducts = async () => {
+ let cart = getCart();
+ let productIds = Object.keys(cart);
+ 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);
+ }
+ setIsLoadingProducts(false);
+ }
getProducts();
}, []);
@@ -188,7 +189,7 @@ export default function Cart() {
{/* --- Start Alert */}
<Alert type="warning" className="text-caption-2 flex gap-x-3 items-center my-2">
<div>
- <ExclamationTriangleIcon className="w-8"/>
+ <ExclamationCircleIcon className="w-8 text-yellow_r-11"/>
</div>
<span>Mohon dicek kembali & pastikan pesanan kamu sudah sesuai dengan yang kamu butuhkan. Atau bisa hubungi kami.</span>
</Alert>
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