From 637c22f1886cecf7307ced88dc951134d466a3fa Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Mon, 19 Jun 2023 15:46:03 +0700 Subject: checkout --- .../components/elements/Navbar/NavbarDesktop.jsx | 8 +- src/core/utils/cart.js | 27 +- src/lib/cart/components/Cart.jsx | 66 +- src/lib/checkout/api/checkoutApi.js | 9 +- src/lib/checkout/components/Checkout.jsx | 90 +-- src/lib/checkout/components/CheckoutOld.jsx | 811 +++++++++++++++++++++ src/lib/invoice/components/Invoices.jsx | 2 - .../product/components/Product/ProductDesktop.jsx | 47 +- .../product/components/Product/ProductMobile.jsx | 7 +- src/lib/promotinProgram/components/HomePage.jsx | 7 +- src/styles/globals.css | 6 +- 11 files changed, 946 insertions(+), 134 deletions(-) create mode 100644 src/lib/checkout/components/CheckoutOld.jsx (limited to 'src') diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx index 26edd5a4..733f5422 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -13,7 +13,7 @@ import Category from '@/lib/category/components/Category' import { useEffect, useState } from 'react' import useAuth from '@/core/hooks/useAuth' import NavbarUserDropdown from './NavbarUserDropdown' -import { getCart } from '@/core/utils/cart' +import { getCountCart } from '@/core/utils/cart' import TopBanner from './TopBanner' import whatsappUrl from '@/core/utils/whatsappUrl' @@ -27,7 +27,11 @@ const NavbarDesktop = () => { useEffect(() => { const handleCartChange = () => { - setCartCount(Object.keys(getCart()).length) + const cart = async () => { + const listCart = await getCountCart() + setCartCount(listCart) + } + cart() } handleCartChange() diff --git a/src/core/utils/cart.js b/src/core/utils/cart.js index ad7894b5..6575f6d0 100644 --- a/src/core/utils/cart.js +++ b/src/core/utils/cart.js @@ -14,13 +14,6 @@ const getCart = () => { return {} } -const getCartnew = async () => { - const id = getAuth()?.id - const cart = await odooApi('GET', `/api/v1/user/${id}/cart`) - - return cart -} - /** * Saves cart data to localStorage, if available. * @@ -51,6 +44,22 @@ const addCart = async (product_id, qty, selected) => { ) } +const getCartApi = async () => { + const id = getAuth()?.id + const cart = await odooApi('GET', `/api/v1/user/${id}/cart`) + + return cart +} + +const getCountCart = async () => { + const id = getAuth()?.id + if(id){ + const cart = await odooApi('GET', `/api/v1/user/${id}/cart/count`) + return cart + } + return +} + const deleteCart = async (product_id) => { const id = getAuth()?.id const cartDelete = await odooApi( @@ -85,7 +94,7 @@ const updateItemCart = ({ productId, quantity, selected = false }) => { quantity = parseInt(quantity) cart[productId] = { productId, quantity, selected } setCart(cart) - addCart(productId, quantity) + addCart(productId, quantity, selected) return true } @@ -104,4 +113,4 @@ const deleteItemCart = ({ productId }) => { return true } -export { getCart, getItemCart, updateItemCart, deleteItemCart, getCartnew } +export { getCart, getItemCart, updateItemCart, deleteItemCart, addCart, getCartApi, getCountCart} diff --git a/src/lib/cart/components/Cart.jsx b/src/lib/cart/components/Cart.jsx index 561a0064..31aa034d 100644 --- a/src/lib/cart/components/Cart.jsx +++ b/src/lib/cart/components/Cart.jsx @@ -4,7 +4,7 @@ import Image from '@/core/components/elements/Image/Image' import NextImage from 'next/image' import currencyFormat from '@/core/utils/currencyFormat' import { useEffect, useState } from 'react' -import { deleteItemCart, getCart, getCartnew, getItemCart, updateItemCart } from '@/core/utils/cart' +import { addCart, deleteItemCart, getCart, getCartApi, getCartnew, getItemCart, updateItemCart } from '@/core/utils/cart' import { CheckIcon, TrashIcon } from '@heroicons/react/24/outline' import { createSlug } from '@/core/utils/slug' import { useRouter } from 'next/router' @@ -19,28 +19,34 @@ import productSearchApi from '@/lib/product/api/productSearchApi' import whatsappUrl from '@/core/utils/whatsappUrl' import useAuth from '@/core/hooks/useAuth' - -const { useQuery } = require('react-query') -const { getCartApi } = require('../api/CartApi') - const Cart = () => { const router = useRouter() const [products, setProducts] = useState(null) + const [isLoading, setIsLoading] = useState(true) const auth = useAuth() - const { data: listCart } = useQuery('listCart', getCartApi) + + + const [cart, setCart] = useState(null) useEffect(() => { if (!auth) return }, [auth]) useEffect(() => { - if(listCart){ - setProducts(listCart.products) + const cart = async () => { + const listCart = await getCartApi() + setCart(listCart) } - }, [listCart]) + cart() + }) + + useEffect(() => { + if(cart){ + setProducts(cart.products) + setIsLoading(false) + } + }, [cart]) - console.log('product', products) - const { cart } = useCart({ enabled: !products }) const [totalPriceBeforeTax, setTotalPriceBeforeTax] = useState(0) const [totalTaxAmount, setTotalTaxAmount] = useState(0) @@ -50,20 +56,6 @@ const Cart = () => { const [productRecomendation, setProductRecomendation] = useState(null) - useEffect(() => { - if (cart.data && !products) { - const productsWithQuantity = cart.data.map((product) => { - const productInCart = getItemCart({ productId: product.id }) - if (!productInCart) return - return { - ...product, - quantity: productInCart.quantity, - selected: productInCart.selected - } - }) - setProducts(productsWithQuantity) - } - }, [cart, products]) useEffect(() => { if (!products) return @@ -73,11 +65,6 @@ const Cart = () => { let calculateTotalDiscountAmount = 0 for (const product of products) { if (product.quantity == '') continue - updateItemCart({ - productId: product.id, - quantity: product.quantity, - selected: product.selected - }) if (!product.selected) continue let priceBeforeTax = product.price.price / 1.11 @@ -127,8 +114,11 @@ const Cart = () => { quantity = value != '' && value < 1 ? 1 : value break } - productsToUpdate[productIndex].quantity = quantity + let qty = quantity + productsToUpdate[productIndex].quantity = qty + setProducts([...productsToUpdate]) + addCart(productId, qty, productsToUpdate[productIndex].selected) } const toggleSelected = (productId) => { @@ -136,8 +126,12 @@ const Cart = () => { if (productIndex < 0) return let productsToUpdate = products - productsToUpdate[productIndex].selected = !productsToUpdate[productIndex].selected + let isSelected = !productsToUpdate[productIndex].selected + productsToUpdate[productIndex].selected = isSelected + + setProducts([...productsToUpdate]) + addCart(productId, productsToUpdate[productIndex].quantity, isSelected) } const selectedProduct = () => { @@ -190,13 +184,13 @@ const Cart = () => {
- {cart.isLoading && ( + {isLoading && (
)} - {!cart.isLoading && (!products || products?.length == 0) && ( + {!isLoading && (!products || products?.length == 0) && (
Keranjang belanja anda masih kosong @@ -335,7 +329,7 @@ const Cart = () => { - {cart.isLoading && ( + {isLoading && (
@@ -344,7 +338,7 @@ const Cart = () => { )} - {!cart.isLoading && (!products || products?.length == 0) && ( + {!isLoading && (!products || products?.length == 0) && ( Keranjang belanja anda masih kosong diff --git a/src/lib/checkout/api/checkoutApi.js b/src/lib/checkout/api/checkoutApi.js index b76c9b7f..94de8721 100644 --- a/src/lib/checkout/api/checkoutApi.js +++ b/src/lib/checkout/api/checkoutApi.js @@ -1,7 +1,7 @@ import odooApi from '@/core/api/odooApi' import { getAuth } from '@/core/utils/auth' -const checkoutApi = async ({ data }) => { +export const checkoutApi = async ({ data }) => { const auth = getAuth() const dataCheckout = await odooApi( 'POST', @@ -11,4 +11,9 @@ const checkoutApi = async ({ data }) => { return dataCheckout } -export default checkoutApi +export const getProductsCheckout = async () => { + const id = getAuth()?.id + const products = await odooApi('GET',`/api/v1/user/${id}/sale_order/checkout`) + + return products +} diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index 088b641b..09fdbd86 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -4,15 +4,14 @@ import Link from '@/core/components/elements/Link/Link' import useAuth from '@/core/hooks/useAuth' import { getItemAddress } from '@/core/utils/address' import addressesApi from '@/lib/address/api/addressesApi' -import CartApi from '@/lib/cart/api/CartApi' import { ExclamationCircleIcon } from '@heroicons/react/24/outline' import React, { useEffect, useRef, useState } from 'react' import _ from 'lodash' -import { deleteItemCart, getCart, getItemCart } from '@/core/utils/cart' +import { deleteItemCart, getCartApi } from '@/core/utils/cart' import currencyFormat from '@/core/utils/currencyFormat' import { toast } from 'react-hot-toast' import getFileBase64 from '@/core/utils/getFileBase64' -import checkoutApi from '../api/checkoutApi' +// import checkoutApi from '../api/checkoutApi' import { useRouter } from 'next/router' import VariantGroupCard from '@/lib/variant/components/VariantGroupCard' import axios from 'axios' @@ -24,12 +23,18 @@ import whatsappUrl from '@/core/utils/whatsappUrl' import { createSlug } from '@/core/utils/slug' import { Button, Modal } from 'flowbite-react' import BottomPopup from '@/core/components/elements/Popup/BottomPopup' +import { useQuery } from 'react-query' const SELF_PICKUP_ID = 32 +const { checkoutApi } = require('../api/checkoutApi') +const { getProductsCheckout } = require('../api/checkoutApi') + const Checkout = () => { const router = useRouter() const auth = useAuth() + const { data: cartCheckout } = useQuery('cartCheckout', getProductsCheckout) + const [selectedAddress, setSelectedAddress] = useState({ shipping: null, invoicing: null @@ -66,8 +71,6 @@ const Checkout = () => { }, [addresses]) const [products, setProducts] = useState(null) - const [totalAmount, setTotalAmount] = useState(0) - const [totalDiscountAmount, setTotalDiscountAmount] = useState(0) const [totalWeight, setTotalWeight] = useState(0) const [priceCheck, setPriceCheck] = useState(false) const [listExpedisi, setExpedisi] = useState([]) @@ -96,52 +99,10 @@ const Checkout = () => { }, []) useEffect(() => { - const loadProducts = async () => { - let variantIds = '' - let { query } = router - if (query?.productId) { - variantIds = query.productId - } else { - const cart = getCart() - variantIds = _.filter(cart, (o) => o.selected == true) - .map((o) => o.productId) - .join(',') - } - - const dataProducts = await CartApi({ variantIds }) - const productsWithQuantity = dataProducts?.map((product) => { - if (product.price.priceDiscount == 0) setPriceCheck(true) - return { - ...product, - quantity: query.quantity - ? query.quantity - : getItemCart({ productId: product.id }).quantity - } - }) - setProducts(productsWithQuantity) - } - loadProducts() - }, [router]) - - useEffect(() => { - if (products) { - let calculateTotalAmount = 0 - let calculateTotalDiscountAmount = 0 - let calcuateTotalWeight = 0 - products.forEach((product) => { - calculateTotalAmount += product.price.price * product.quantity - calculateTotalDiscountAmount += - (product.price.price - product.price.priceDiscount) * product.quantity - calcuateTotalWeight += product.weight * product.quantity - if (product.weight == 0) { - setCheckWeight(true) - } - }) - setTotalAmount(calculateTotalAmount) - setTotalDiscountAmount(calculateTotalDiscountAmount) - setTotalWeight(calcuateTotalWeight * 1000) - } - }, [products]) + setProducts(cartCheckout?.products) + setCheckWeight(cartCheckout?.hasProductWithoutWeight) + setTotalWeight(cartCheckout?.totalWeight.g) + }, [cartCheckout]) useEffect(() => { const loadServiceRajaOngkir = async () => { @@ -240,7 +201,6 @@ const Checkout = () => { setIsLoading(false) window.location.href = payment.data.redirectUrl } - const taxTotal = (totalAmount - totalDiscountAmount) * 0.11 return ( <> @@ -304,19 +264,19 @@ const Checkout = () => {
Total Belanja
-
{currencyFormat(totalAmount)}
+
{currencyFormat(cartCheckout?.totalPurchase)}
Total Diskon
-
- {currencyFormat(totalDiscountAmount)}
+
- {currencyFormat(cartCheckout?.totalDiscount)}
Subtotal
-
{currencyFormat(totalAmount - totalDiscountAmount)}
+
{currencyFormat(cartCheckout?.subtotal)}
PPN 11%
-
{currencyFormat(taxTotal)}
+
{currencyFormat(cartCheckout?.tax)}
@@ -329,10 +289,7 @@ const Checkout = () => {
Grand Total
- {currencyFormat( - totalAmount - - totalDiscountAmount + - taxTotal + + {currencyFormat(cartCheckout?.grandTotal + Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000 )}
@@ -526,19 +483,19 @@ const Checkout = () => {
Total Belanja
-
{currencyFormat(totalAmount)}
+
{currencyFormat(cartCheckout?.totalPurchase)}
Total Diskon
-
- {currencyFormat(totalDiscountAmount)}
+
- {currencyFormat(cartCheckout?.totalDiscount)}
Subtotal
-
{currencyFormat(totalAmount - totalDiscountAmount)}
+
{currencyFormat(cartCheckout?.subtotal)}
PPN 11%
-
{currencyFormat(taxTotal)}
+
{currencyFormat(cartCheckout?.tax)}
@@ -554,10 +511,7 @@ const Checkout = () => {
Grand Total
- {currencyFormat( - totalAmount - - totalDiscountAmount + - taxTotal + + {currencyFormat(cartCheckout?.grandTotal + Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000 )}
diff --git a/src/lib/checkout/components/CheckoutOld.jsx b/src/lib/checkout/components/CheckoutOld.jsx new file mode 100644 index 00000000..088b641b --- /dev/null +++ b/src/lib/checkout/components/CheckoutOld.jsx @@ -0,0 +1,811 @@ +import Alert from '@/core/components/elements/Alert/Alert' +import Divider from '@/core/components/elements/Divider/Divider' +import Link from '@/core/components/elements/Link/Link' +import useAuth from '@/core/hooks/useAuth' +import { getItemAddress } from '@/core/utils/address' +import addressesApi from '@/lib/address/api/addressesApi' +import CartApi from '@/lib/cart/api/CartApi' +import { ExclamationCircleIcon } from '@heroicons/react/24/outline' +import React, { useEffect, useRef, useState } from 'react' +import _ from 'lodash' +import { deleteItemCart, getCart, getItemCart } from '@/core/utils/cart' +import currencyFormat from '@/core/utils/currencyFormat' +import { toast } from 'react-hot-toast' +import getFileBase64 from '@/core/utils/getFileBase64' +import checkoutApi from '../api/checkoutApi' +import { useRouter } from 'next/router' +import VariantGroupCard from '@/lib/variant/components/VariantGroupCard' +import axios from 'axios' +import Image from '@/core/components/elements/Image/Image' +import MobileView from '@/core/components/views/MobileView' +import DesktopView from '@/core/components/views/DesktopView' +import ExpedisiList from '../api/ExpedisiList' +import whatsappUrl from '@/core/utils/whatsappUrl' +import { createSlug } from '@/core/utils/slug' +import { Button, Modal } from 'flowbite-react' +import BottomPopup from '@/core/components/elements/Popup/BottomPopup' + +const SELF_PICKUP_ID = 32 + +const Checkout = () => { + const router = useRouter() + const auth = useAuth() + const [selectedAddress, setSelectedAddress] = useState({ + shipping: null, + invoicing: null + }) + const [addresses, setAddresses] = useState(null) + + useEffect(() => { + if (!auth) return + + const getAddresses = async () => { + const dataAddresses = await addressesApi() + setAddresses(dataAddresses) + } + + getAddresses() + }, [auth]) + + useEffect(() => { + if (!addresses) return + + const matchAddress = (key) => { + const addressToMatch = getItemAddress(key) + const foundAddress = addresses.filter((address) => address.id == addressToMatch) + if (foundAddress.length > 0) { + return foundAddress[0] + } + return addresses[0] + } + + setSelectedAddress({ + shipping: matchAddress('shipping'), + invoicing: matchAddress('invoicing') + }) + }, [addresses]) + + const [products, setProducts] = useState(null) + const [totalAmount, setTotalAmount] = useState(0) + const [totalDiscountAmount, setTotalDiscountAmount] = useState(0) + const [totalWeight, setTotalWeight] = useState(0) + const [priceCheck, setPriceCheck] = useState(false) + const [listExpedisi, setExpedisi] = useState([]) + const [listserviceExpedisi, setListServiceExpedisi] = useState([]) + const [selectedExpedisi, setSelectedExpedisi] = useState(0) + const [selectedCarrierId, setselectedCarrierId] = useState(0) + const [selectedCarrier, setselectedCarrier] = useState(0) + const [biayaKirim, setBiayaKirim] = useState(0) + const [checkWeigth, setCheckWeight] = useState(false) + const [selectedServiceType, setSelectedServiceType] = useState(null) + const [selectedExpedisiService, setselectedExpedisiService] = useState(null) + const [etd, setEtd] = useState(null) + const [etdFix, setEtdFix] = useState(null) + + useEffect(() => { + const loadExpedisi = async () => { + let dataExpedisi = await ExpedisiList() + dataExpedisi = dataExpedisi.map((expedisi) => ({ + value: expedisi.id, + label: expedisi.name, + carrierId: expedisi.deliveryCarrierId + })) + setExpedisi(dataExpedisi) + } + loadExpedisi() + }, []) + + useEffect(() => { + const loadProducts = async () => { + let variantIds = '' + let { query } = router + if (query?.productId) { + variantIds = query.productId + } else { + const cart = getCart() + variantIds = _.filter(cart, (o) => o.selected == true) + .map((o) => o.productId) + .join(',') + } + + const dataProducts = await CartApi({ variantIds }) + const productsWithQuantity = dataProducts?.map((product) => { + if (product.price.priceDiscount == 0) setPriceCheck(true) + return { + ...product, + quantity: query.quantity + ? query.quantity + : getItemCart({ productId: product.id }).quantity + } + }) + setProducts(productsWithQuantity) + } + loadProducts() + }, [router]) + + useEffect(() => { + if (products) { + let calculateTotalAmount = 0 + let calculateTotalDiscountAmount = 0 + let calcuateTotalWeight = 0 + products.forEach((product) => { + calculateTotalAmount += product.price.price * product.quantity + calculateTotalDiscountAmount += + (product.price.price - product.price.priceDiscount) * product.quantity + calcuateTotalWeight += product.weight * product.quantity + if (product.weight == 0) { + setCheckWeight(true) + } + }) + setTotalAmount(calculateTotalAmount) + setTotalDiscountAmount(calculateTotalDiscountAmount) + setTotalWeight(calcuateTotalWeight * 1000) + } + }, [products]) + + useEffect(() => { + const loadServiceRajaOngkir = async () => { + const body = { + origin: 2127, + destination: selectedAddress.shipping.rajaongkirCityId, + weight: totalWeight, + courier: selectedCarrier, + originType: 'subdistrict', + destinationType: 'subdistrict' + } + setBiayaKirim(0) + const dataService = await axios('/api/rajaongkir-service?body=' + JSON.stringify(body)) + setListServiceExpedisi(dataService.data[0].costs) + if (dataService.data[0].costs[0]) { + setBiayaKirim(dataService.data[0].costs[0]?.cost[0].value) + setselectedExpedisiService( + dataService.data[0].costs[0]?.description + '-' + dataService.data[0].costs[0]?.service + ) + setEtd(dataService.data[0].costs[0]?.cost[0].etd) + toast.success('Harap pilih tipe layanan pengiriman') + } else { + toast.error('Maaf, layanan tidak tersedia. Mohon pilih expedisi lain.') + } + } + if (selectedCarrier != 0 && selectedCarrier != 1 && totalWeight > 0) { + loadServiceRajaOngkir() + } else { + setListServiceExpedisi() + setBiayaKirim(0) + setselectedExpedisiService() + setEtd() + } + }, [selectedCarrier, selectedAddress, totalWeight]) + + useEffect(() => { + if (selectedServiceType) { + let serviceType = selectedServiceType.split(',') + setBiayaKirim(serviceType[0]) + setselectedExpedisiService(serviceType[1]) + setEtd(serviceType[2]) + } + }, [selectedServiceType]) + + useEffect(() => { + if (etd) setEtdFix(calculateEstimatedArrival(etd)) + }, [etd]) + + useEffect(() => { + if (selectedExpedisi) { + let serviceType = selectedExpedisi.split(',') + setselectedCarrier(serviceType[0]) + setselectedCarrierId(serviceType[1]) + setListServiceExpedisi([]) + } + }, [selectedExpedisi]) + + const poNumber = useRef(null) + const poFile = useRef(null) + + const [isLoading, setIsLoading] = useState(false) + + const checkout = async () => { + const file = poFile.current.files[0] + if (typeof file !== 'undefined' && file.size > 5000000) { + toast.error('Maksimal ukuran file adalah 5MB', { position: 'bottom-center' }) + return + } + setIsLoading(true) + const productOrder = products.map((product) => ({ + product_id: product.id, + quantity: product.quantity + })) + let data = { + partner_shipping_id: auth.partnerId, + partner_invoice_id: auth.partnerId, + order_line: JSON.stringify(productOrder), + delivery_amount: biayaKirim, + carrier_id: selectedCarrierId, + delivery_service_type: selectedExpedisiService, + type: 'sale_order' + } + if (poNumber.current.value) data.po_number = poNumber.current.value + if (typeof file !== 'undefined') data.po_file = await getFileBase64(file) + + const isCheckouted = await checkoutApi({ data }) + if (!isCheckouted?.id) { + toast.error('Gagal melakukan transaksi, terjadi kesalahan internal') + return + } + + for (const product of products) deleteItemCart({ productId: product.id }) + const payment = await axios.post( + `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/midtrans-payment?transactionId=${isCheckouted.id}` + ) + setIsLoading(false) + window.location.href = payment.data.redirectUrl + } + const taxTotal = (totalAmount - totalDiscountAmount) * 0.11 + + return ( + <> + +
+ +
+ +
+ + Jika mengalami kesulitan dalam melakukan pembelian di website Indoteknik. Hubungi kami + disini + + +
+ + + + {selectedCarrierId == SELF_PICKUP_ID && } + {selectedCarrierId != SELF_PICKUP_ID && ( + <> + + + + + )} + + + + + + +
+ {products && } +
+ + + +
+
+
Ringkasan Pesanan
+
{products?.length} Barang
+
+
+
+
+
Total Belanja
+
{currencyFormat(totalAmount)}
+
+
+
Total Diskon
+
- {currencyFormat(totalDiscountAmount)}
+
+
+
Subtotal
+
{currencyFormat(totalAmount - totalDiscountAmount)}
+
+
+
PPN 11%
+
{currencyFormat(taxTotal)}
+
+
+
+ Biaya Kirim

{etdFix}

+
+
{currencyFormat(Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000)}
+
+
+
+
+
Grand Total
+
+ {currencyFormat( + totalAmount - + totalDiscountAmount + + taxTotal + + Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000 + )} +
+
+ {/*

*) Belum termasuk biaya pengiriman

*/} +

+ Dengan melakukan pembelian melalui website Indoteknik, saya menyetujui{' '} + + Syarat & Ketentuan + {' '} + yang berlaku +

+
+ + + +
+
Purchase Order
+ +
+
+ + +
+
+ + +
+
+

Ukuran dokumen PO Maksimal 5MB

+
+ + + +
+ +
+ {priceCheck && ( +
+ + *) Terdapat produk yang belum memiliki harga,{' '} + + Hubungi Kami untuk meminta harga. + + +
+ )} + + + +
+
+ {selectedCarrierId == SELF_PICKUP_ID && } + {selectedCarrierId != SELF_PICKUP_ID && ( + <> + + + + + )} + + + + + + +
+
Detail Pesanan
+ + + + + + + + + + + {products?.map((product) => ( + + + + + + + ))} + +
Nama ProdukJumlahHargaSubtotal
+
+ {product?.name} +
+
+
+ {product?.parent?.name} +
+
+ {product?.code}{' '} + {product?.attributes.length > 0 + ? `| ${product?.attributes.join(', ')}` + : ''} +
+
+ Berat item : {product?.weight} Kg +
+
+ 		+ + + {product?.price?.discountPercentage > 0 && ( +
+
+ {currencyFormat(product?.price?.price)} +
+
+ {product?.price?.discountPercentage}% +
+
+ )} +
+ {product.price.priceDiscount > 0 + ? currencyFormat(product?.price?.priceDiscount) + : 'Call For Price'} +
+ 		+
+ {product.price.priceDiscount > 0 ? ( + currencyFormat(product?.price?.priceDiscount * product?.quantity) + ) : ( + + Call For Price{' '} + + )} +
+
+
+
+ +
+
+
+
Ringkasan Pesanan
+
{products?.length} Barang
+
+ +
+ +
+
+
Total Belanja
+
{currencyFormat(totalAmount)}
+
+
+
Total Diskon
+
- {currencyFormat(totalDiscountAmount)}
+
+
+
Subtotal
+
{currencyFormat(totalAmount - totalDiscountAmount)}
+
+
+
PPN 11%
+
{currencyFormat(taxTotal)}
+
+
+
+ Biaya Kirim +

{etdFix}

+
+
{currencyFormat(Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000)}
+
+
+ +
+ +
+
Grand Total
+
+ {currencyFormat( + totalAmount - + totalDiscountAmount + + taxTotal + + Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000 + )} +
+
+

+ Dengan melakukan pembelian melalui website Indoteknik, saya menyetujui{' '} + + Syarat & Ketentuan + {' '} + yang berlaku +

+ +
+ +
+ Purchase Order (Opsional) +
+ +
+
+ + +
+
+ + +
+
+

Ukuran dokumen PO Maksimal 5MB

+ +
+ + + {priceCheck && ( +
+ + *) Terdapat produk yang belum memiliki harga,{' '} + + Hubungi Kami untuk meminta harga. + + +
+ )} +
+
+
+ + + ) +} + +const SectionAddress = ({ address, label, url }) => ( +
+
+
{label}
+ + Pilih Alamat Lain + +
+ + {address && ( +
+
+ {address.type.charAt(0).toUpperCase() + address.type.slice(1) + ' Address'} +
+

{address.name}

+

{address.mobile}

+

+ {address.street}, {address?.city?.name} +

+
+ )} +
+) + +const SectionValidation = ({ address }) => + address?.rajaongkirCityId == 0 && ( + +
+ Mohon untuk memperbarui alamat Anda dengan mengklik tombol di bawah ini.{' '} +
+
+ + Update Alamat + +
+ + ) + +const SectionExpedisi = ({ address, listExpedisi, setSelectedExpedisi, checkWeigth }) => + address?.rajaongkirCityId > 0 && ( +
+
+
Pilih Expedisi :
+
+ +
+
+ {checkWeigth == true && ( +

+ Mohon maaf, pengiriman hanya tersedia untuk self pickup karena terdapat barang yang belum + diatur beratnya. Mohon atur berat barang dengan menghubungi admin melalui{' '} + + tautan ini + +

+ )} +
+ ) + +const SectionListService = ({ listserviceExpedisi, setSelectedServiceType }) => + listserviceExpedisi?.length > 0 && ( + <> +
+
+
Service Type Expedisi :
+
+ +
+
+
+ + + ) + +function addDays(date, days) { + const result = new Date(date) + result.setDate(result.getDate() + days) + return result +} + +function formatDate(date) { + const day = date.getDate() + const month = date.toLocaleString('default', { month: 'short' }) + return `${day} ${month}` +} + +function calculateEstimatedArrival(duration) { + if (duration) { + let estimationDate = duration.split('-') + estimationDate[0] = parseInt(estimationDate[0]) + estimationDate[1] = parseInt(estimationDate[1]) + const from = addDays(new Date(), estimationDate[0] + 3) + const to = addDays(new Date(), estimationDate[1] + 3) + + let etdText = `*Estimasi tiba ${formatDate(from)}` + + if (estimationDate[1] > estimationDate[0]) { + etdText += ` - ${formatDate(to)}` + } + + return etdText + } + + return '' +} + +const extractDuration = (text) => { + const matches = text.match(/\d+(?:-\d+)?/g) + + if (matches && matches.length === 1) { + const parts = matches[0].split('-') + const min = parseInt(parts[0]) + const max = parseInt(parts[1]) + + if (min === max) { + return min.toString() + } + + return matches[0] + } + + return '' +} + +const PickupAddress = ({ label }) => ( +
+
+
{label}
+
+
+

Indoteknik

+

+ Jl. Bandengan Utara Raya No.85, RT.3/RW.16, Penjaringan, Kec. Penjaringan, Kota Jkt Utara, + Daerah Khusus Ibukota Jakarta, Indonesia Kodepos : 14440 +

+

Telp : 021-2933 8828/29

+

Mobile : 0813 9000 7430

+
+
+) + +export default Checkout diff --git a/src/lib/invoice/components/Invoices.jsx b/src/lib/invoice/components/Invoices.jsx index b74af8c0..5edcfdbf 100644 --- a/src/lib/invoice/components/Invoices.jsx +++ b/src/lib/invoice/components/Invoices.jsx @@ -33,8 +33,6 @@ const Invoices = () => { } const { invoices } = useInvoices({ query }) - console.log('bangke', invoices) - const [inputQuery, setInputQuery] = useState(q) const [toOthers, setToOthers] = useState(null) diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx index f1a001a6..d9c95327 100644 --- a/src/lib/product/components/Product/ProductDesktop.jsx +++ b/src/lib/product/components/Product/ProductDesktop.jsx @@ -1,4 +1,5 @@ import Image from '@/core/components/elements/Image/Image' +import ImageNext from 'next/image' import Link from '@/core/components/elements/Link/Link' import DesktopView from '@/core/components/views/DesktopView' import currencyFormat from '@/core/utils/currencyFormat' @@ -58,7 +59,7 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { } const handleAddToCart = (variantId) => { - if(!auth) { + if (!auth) { router.push(`/login?next=/shop/product/${slug}`) return } @@ -165,11 +166,13 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { )}
-
-
- + {product.variants.length <= 1 && ( +
+
+ +
-
+ )}
@@ -328,7 +331,7 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { - {product.variants.map((variant) => ( + {product.variants.map((variant, index) => ( {variant.code} {variant.attributes.join(', ') || '-'} @@ -367,6 +370,27 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { /> + {index == 0 ? ( + setPromotionType(true)} + className='cursor-pointer' + > + ) : ( +
+ setPromotionType(true)} + className='cursor-pointer' + > +
+ )}
- + setPromotionType(false)} + > +
+ +
+ {
-
- -
+
+ +
+
Jumlah
diff --git a/src/lib/promotinProgram/components/HomePage.jsx b/src/lib/promotinProgram/components/HomePage.jsx index 8d159899..c0968161 100644 --- a/src/lib/promotinProgram/components/HomePage.jsx +++ b/src/lib/promotinProgram/components/HomePage.jsx @@ -27,7 +27,6 @@ const HomePage = () => { } ) - useEffect(() => { if (titlePromotion && titlePromotion.length > 0) { setActiveTab(titlePromotion[0].name) @@ -36,11 +35,11 @@ const HomePage = () => { setActiveBanner(titlePromotion[0].banner) productPromotionRefetch() } - }, [titlePromotion]) + }, [titlePromotion, productPromotionRefetch]) useEffect(() => { if (productPromotion) { - setparentPromotions(() => { + setparentPromotions((parentPromotions) => { return parentPromotions.map((title) => { if (title.id === activeId && title.products === undefined) { return { @@ -52,7 +51,7 @@ const HomePage = () => { }) }) } - }, [productPromotion, parentPromotions, activeId]) + }, [productPromotion, activeId]) const { isMobile, isDesktop } = useDevice() const handleTabClick = (id, label, banner) => { diff --git a/src/styles/globals.css b/src/styles/globals.css index aa707913..7d571e3f 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -396,11 +396,15 @@ button { } .table-specification > table { - @apply table-fixed + @apply table-auto border-collapse w-full; } +.table-specification > table > thead > tr > th:last-child{ + @apply w-3/12; +} + .table-specification > table > thead { @apply sticky top-0 border-b; } -- cgit v1.2.3