diff options
| author | IT Fixcomart <it@fixcomart.co.id> | 2023-03-01 09:18:52 +0000 |
|---|---|---|
| committer | IT Fixcomart <it@fixcomart.co.id> | 2023-03-01 09:18:52 +0000 |
| commit | a7abbf4ddc70068620e9f44b74dc162ce2e16ee2 (patch) | |
| tree | 74f66253717515d364ce74bd8275015c1f829cbc /src2/pages/shop/quotation/index.js | |
| parent | 90e1edab9b6a8ccc09a49fed3addbec2cbc4e4c3 (diff) | |
| parent | a1b9b647a6c4bda1f5db63879639d44543f9557e (diff) | |
Merged in refactor (pull request #1)
Refactor
Diffstat (limited to 'src2/pages/shop/quotation/index.js')
| -rw-r--r-- | src2/pages/shop/quotation/index.js | 140 |
1 files changed, 140 insertions, 0 deletions
diff --git a/src2/pages/shop/quotation/index.js b/src2/pages/shop/quotation/index.js new file mode 100644 index 00000000..e1c196db --- /dev/null +++ b/src2/pages/shop/quotation/index.js @@ -0,0 +1,140 @@ +import WithAuth from "@/components/auth/WithAuth"; +import LineDivider from "@/components/elements/LineDivider"; +import Link from "@/components/elements/Link"; +import AppBar from "@/components/layouts/AppBar"; +import Layout from "@/components/layouts/Layout"; +import VariantCard from "@/components/variants/VariantCard"; +import apiOdoo from "@/core/utils/apiOdoo"; +import { useAuth } from "@/core/utils/auth"; +import { deleteItemCart, getCart } from "@/core/utils/cart"; +import currencyFormat from "@/core/utils/currencyFormat"; +import { useRouter } from "next/router"; +import { useEffect, useState } from "react"; +import { toast } from "react-hot-toast"; + +export default function Quotation() { + const router = useRouter(); + const [ auth ] = useAuth(); + const [ products, setProducts ] = useState([]); + const [ totalAmount, setTotalAmount ] = useState(0); + const [ totalDiscountAmount, setTotalDiscountAmount ] = useState(0); + + useEffect(() => { + const getProducts = async () => { + let cart = getCart(); + let productIds = Object + .values(cart) + .filter((itemCart) => itemCart.selected == 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, + selected: cart[product.id].selected, + })); + setProducts(dataProducts); + } + }; + getProducts(); + }, [ router, auth ]); + + useEffect(() => { + if (products) { + let calculateTotalAmount = 0; + let calculateTotalDiscountAmount = 0; + products.forEach(product => { + calculateTotalAmount += product.price.price * product.quantity; + calculateTotalDiscountAmount += (product.price.price - product.price.price_discount) * product.quantity; + }); + setTotalAmount(calculateTotalAmount); + setTotalDiscountAmount(calculateTotalDiscountAmount); + } + }, [products]); + + const submitQuotation = async () => { + let productOrder = products.map((product) => ({ 'product_id': product.id, 'quantity': product.quantity })); + let data = { + 'partner_shipping_id': auth.partner_id, + 'partner_invoice_id': auth.partner_id, + 'order_line': JSON.stringify(productOrder) + }; + const quotation = await apiOdoo('POST', `/api/v1/partner/${auth.partner_id}/sale_order/checkout`, data); + for (const product of products) { + deleteItemCart(product.id); + } + if (quotation?.id) { + router.push(`/shop/quotation/finish?id=${quotation.id}`); + return; + }; + toast.error('Terdapat kesalahan internal, hubungi kami'); + } + return ( + <WithAuth> + <Layout> + <AppBar title="Penawaran Harga" /> + + <div className="p-4 flex flex-col gap-y-4"> + <p className="h2">Produk</p> + {products.map((product, index) => ( + <VariantCard + data={product} + openOnClick={false} + key={index} + /> + ))} + </div> + + <LineDivider /> + + <div className="p-4"> + <div className="flex justify-between items-center"> + <p className="h2">Ringkasan Penawaran</p> + <p className="text-gray_r-11 text-caption-1">{products.length} Barang</p> + </div> + <hr className="my-4 border-gray_r-6"/> + <div className="flex flex-col gap-y-4"> + <div className="flex gap-x-2 justify-between"> + <p>Total Belanja</p> + <p className="font-medium">{currencyFormat(totalAmount)}</p> + </div> + <div className="flex gap-x-2 justify-between"> + <p>Total Diskon</p> + <p className="font-medium text-red_r-11">{'- ' + currencyFormat(totalDiscountAmount)}</p> + </div> + <div className="flex gap-x-2 justify-between"> + <p>Subtotal</p> + <p className="font-medium">{currencyFormat(totalAmount - totalDiscountAmount)}</p> + </div> + <div className="flex gap-x-2 justify-between"> + <p>PPN 11% (Incl.)</p> + <p className="font-medium">{currencyFormat((totalAmount - totalDiscountAmount) * 0.11)}</p> + </div> + </div> + <hr className="my-4 border-gray_r-6"/> + <div className="flex gap-x-2 justify-between mb-4"> + <p>Grand Total</p> + <p className="font-medium text-yellow_r-11">{currencyFormat(totalAmount - totalDiscountAmount)}</p> + </div> + <p className="text-caption-2 text-gray_r-10 mb-2">*) Belum termasuk biaya pengiriman</p> + <p className="text-caption-2 text-gray_r-10 leading-5"> + Dengan melakukan pembelian melalui website Indoteknik, saya menyetujui <Link href="/">Syarat & Ketentuan</Link> yang berlaku + </p> + </div> + + <LineDivider /> + + <div className="p-4"> + <button + type="button" + className="btn-yellow w-full" + onClick={submitQuotation} + > + Kirim Penawaran + </button> + </div> + </Layout> + </WithAuth> + ) +}
\ No newline at end of file |
